User talk:Purple Wrench/sandbox

From Homestar Runner Wiki

Jump to: navigation, search

Video Thumbnails

It has been suggested before that there should be thumbnails for the videos. But how should we do that here? If we put them in the Thumbnail section, they could get mixed up with the actual posted images. Should we have some way to seperate posted images and video thumbnails? Thoughts? Gfdgsgxgzgdrc 23:47, 28 July 2017 (UTC)

Ahem! I have an idea of what we could try. What happens if you add CSS borders to the images, and use that to distinguish the type of content? It could be something as simple as a border with an icon on the bottom corner (indicating picture or video for example)... or something more complex, like giving all video thumbnails a filmstrip border. -- ■■   PURPLE  WRENCH   ■■ 04:30, 29 July 2017 (UTC)
I like that. Sounds interesting. Although I'd like to see an example or something first. Gfdgsgxgzgdrc 05:53, 29 July 2017 (UTC)
Here you go. For Type 1 I had to use some generic icons from Wikipedia, so I can't put any alt-text such as "This tweet includes an image." or "a video." I did actually try some images from this wiki, but none of them really scaled down very well.
Type 2 might look really good or really awful depending on your computer/device, resolution, browser and magnification settings, but for a rough idea of what is possible it should suffice. (If we go with this, we might need a template with a huge CSS gradient that includes a needless number of copies of the same line over and over again... but it'll be more consistent across devices.) -- ■■   PURPLE  WRENCH   ■■ 20:58, 29 July 2017 (UTC)

Type 1

Our hopes and dreams.
20px-Image-x-generic-2.svg.png
A horrifying close-up of Strong Bad's ungodly puppet mug.
20px-Movie_stub_film.svg.png

Type 2

Our hopes and dreams.
A horrifying close-up of Strong Bad's ungodly puppet mug.
I think Type 2 would work best— it's easy to identify without having to look at a tiny icon in the corner. Also, I think it looks pretty good and consistent across devices and magnification. (On my phone, it shows squares instead of circles, but that's fine.) It might require a bit of editing before we use it, but probably not. Gfdgsgxgzgdrc 01:55, 10 August 2017 (UTC)
If it doesn't require editing I'll be surprised. (Also, I meant it to be squares, but circles also work.) -- ■■   PURPLE  WRENCH   ■■ 00:04, 11 August 2017 (UTC)
Yeah, squares work a lot better, I think. Not sure how to do that, though. Gfdgsgxgzgdrc 20:27, 12 August 2017 (UTC)
Oh, dag! I updated Chrome and the squares became circles! I thought you had made that change! Anyway, some browsers show circles and some show squares. Dashed lines would work but the spacing is waaaay off. So this'll have to do unless the policy on using CSS image borders changes, since they don't seem to work. -- ■■   PURPLE  WRENCH   ■■ 00:13, 13 August 2017 (UTC)
'Kay. I guess this will do for now, but hopefully it can be fixed soon. Gfdgsgxgzgdrc 02:25, 13 August 2017 (UTC)
Personal tools