Wikipedia talk:Contents/Portals/(new)

Incomplete

Nice idea, but there are topics that are not covered. The one that comes to mind first for me is underwater diving, which is not just a sport, though it does tend to be put there by people who only think of recreational scuba. There is a lot more to it, but it is also not always an occupation either. Human activity covers it, but also a lot of the other categories. Reality is not obliged to fit into categories. Cheers, · · · Peter (Southwood) ^(talk): 12:13, 23 May 2018 (UTC)[reply]

@Pbsouthwood and Peter (Southwood): Yes I agree with you on this. So far I have just copied the categories from the existing Portal:Contents/Portals page, but I would like to split some of them on the grounds that the titles are too long, and I can easily add any other topics you can think of. The only requirement really is to find an svg image for each box, but that can't be too hard. JLJ001 (talk) 12:34, 23 May 2018 (UTC)[reply]

{{Portal button 2|Human activity|Portal:Human|Pictograms-nps-scuba diving.svg}}

Underwater diving is only a tiny part of human activities, but I get the idea. Problem with human activity as a category is that so many of the other categories are subsets of human activity.

I think "Occupations" would be a useful additional category, as they are a bit more specific than activities.

I notice that the boxes around the buttons are mot all the same height. Is this just my screen?

Every time I see that particular scuba icon, my back hurts in sympathy ;-)· · · Peter (Southwood) ^(talk): 19:46, 23 May 2018 (UTC)[reply]

"the buttons are not all the same height" - This is a problem caused by the fact the images are different sizes and I especially tweaked to boxes to work ( for my browser only :D ), but there is a plan to use a different template if this is approved, and the boxes will then all be the same size for everyone.

I personally find the problem of trying to categorise everything into neat little boxes quite tricky, but I do think that there is room for more categories once we/the community has come up with the best options. JLJ001 (talk) 19:59, 23 May 2018 (UTC)[reply]

Layout on Different Viewport Sizes

Not that anything in Wikipedia looks particularly great in all viewport sizes, but we should probably start taking this into account with a redesign of the whole Portal:Contents set.

The first thing that could use work is the new buttons. On large viewports, the button layout looks a bit unbalanced (fullscreen 1080p). Maybe they could be centered? Also maybe limit the max number per row to 6 or so to balance the rows?.
Also, maybe we should use some CSS to limit the max button size on small viewports as well. This is especially useful on mobile, where the buttons take several screens worth of space (the grey box is an iPhone 6 Plus in landscape mode).

Those are just the first two things I immediately noticed could use improvement. — AfroThundr ^(t•c) 17:36, 25 May 2018 (UTC)[reply]

@AfroThundr3007730: I completely agree, but there is very little I can do CSS wise until templatestyles is enabled. The design looks absolutely fine on my screen but ideally the boxes will scale and float according to viewport. JLJ001 (talk) 17:55, 25 May 2018 (UTC)[reply]
- @JLJ001: Yes, on mid-sized screens it looks fine. I do think we should limit how wide the button group can get though. For instance, by wrapping them in a div. This is what I added to the page:

<div style="max-width:92em; margin:0 auto">...

This ensures that no more than 6 buttons can appear on a row, no matter how wide the viewport. I chose 92 em because that's about how wide 6 of them are right now. This can change, obviously. Now if I could get the buttons to center themselves in the div... The slightly off alignment bugs me. Let me know what you think. — AfroThundr ^(t•c) 20:58, 25 May 2018 (UTC)[reply]

I think that's ingenious, the best I had come up with was to wait for templatestyles and use a responsive grid. The grid would fix the centering issue more elegantly, but some <center></center> tags should work as a temporary workaround. JLJ001 (talk) 21:01, 25 May 2018 (UTC)[reply]

Perfect! :D Yeah, we can always fall back to regular HTML/CSS to get things done. I imagine that's similar to what the template would've done in the rendered HTML anyway. — AfroThundr ^(t•c) 21:07, 25 May 2018 (UTC)[reply]

As far as auto-shrinking the buttons on smaller devices, that would be a bit more involved and require CSS media queries, which would require <style> tags or modifying the site CSS. — AfroThundr ^(t•c) 21:15, 25 May 2018 (UTC)[reply]