Forum:Fluid layout preparation thread

Archived discussion

This page is an archive. Please do not edit the contents of this page, other than for maintenance. If you wish to revisit this topic, please bring it up again in a new thread.

Forums: Index → Community discussions → Fluid layout preparation thread | Post

As I'm sure you've noticed by way of the notification window, Fluid layout is being rolled-out to all wikis in about 2 weeks. The purpose of this discussion is to highlight possible problems we could experience once we transition to Fluid Layout, as well as possible ways to avoid problems. This section will also serve as a location to discuss problems once the layout has been implemented.

I've chosen to start this thread rather than create a section on the development portal talk page, so that users can be more comfortable bringing up their issues here. When the time comes and Fluid Layout is implemented, we can direct all "problem reports" and issues to one centralized location - this thread.

In the meantime, there are a few things to consider with regards to Fluid Layout.

First, because the width of the content space will vary depending on the size of each reader's display, that means the width of items set by percentage will also vary. However, widths set by number of pixels (e.g. 250px) will not change no matter how large or small a display is. This may have a negative effect on several notable templates. For sake of reference, I've started a section listing which templates use pixel width instead of percentage width; please add any additional templates to that list. Because of the nature of fluid layout, these templates will likely need to be edited to make their widths dynamic as well. This will have to be settled on a more individual basis, most likely.

The template width issue is the only major one that comes to mind at the moment, but I'm sure there are other problems that need to be addressed. Please help me identify those issues. -- LostInRiverview ^{talk ~ blog} 04:31, November 19, 2013 (UTC)

Pre-implementation discussion

Alright, in addition to this central thread, I've started a couple other discussions related to specific problems. Please see here and here to help figure this out. -- LostInRiverview ^{talk ~ blog} 05:00, November 19, 2013 (UTC)

I should've paid attention to these technical changes earlier, and I think this one change is really bad this time... I haven't joined the wiki when it still used MonoBook style, but I still remembered how it looked, and I think it required a lot of work to change it to Oasis. And now comes Fluid layout.

I'm pretty sure that most infobox templates will be affected by this. Do you think it's not a good idea to keep these infoboxes with fixed widths? Personally, I think these infoboxes should be kept that way, because that's how they were designed (consistent widths for Sim's headshots (250px), for example). This isn't the same case as Pagecover though. I'm not really sure with that one. Nikel _{Talk – Vote!} 16:02, December 2, 2013 (UTC)

Templates known to use pixel widths instead of percentage widths

• {{Pagecover}}
• {{Sim}}
• {{FamilyInfobox}}
• {{Game}}
• {{NeighborhoodInfobox}}

Post-implementation discussion

Now that the Fluid layout has been forcibly implemented, I think we can gather some bugs in this forum at the moment. I'm not sure how to fix these bugs, gathering them for now seems to be the important point.

1. Needless to say, the wiki background is messed up. I've checked it in both Chrome and Firefox. The bottom half of the background shows the background of ITF theme, while the top half shows the default green plumbbob background.
2. The search bar gets stacked on top of the search button. It might need to be resized?
3. The font used in this wiki has been changed... for no reason...? I think they changed it to the default font used in community wikia. I'm not fond of this font change.
4. There's nothing wrong on the main page as far as I can tell (perhaps LiR has taken action in advance?), except that the header above the slider is slightly not aligned. The header sticks to the left of the page, while the slider is aligned on the center of the page. It's more apparent if you zoom out the page.
5. The infoboxes, listed above, look fine to me at the moment. The pagecover template needs a little tweaking, however. It won't follow the page width when it's zoomed out.

Nikel _{Talk – Vote!} 11:51, December 4, 2013 (UTC)

I can confirm all of the above issues. I know we can force the old font via CSS or something. I'm also not fond of the new flowery headers Wikia have implemented. Perhaps we can CSS it out and use our own background image? Lost Labyrinth • (c) • (b) 19:11, December 4, 2013 (UTC)

Also, as expected, {{Pagecover}} needs a width adjustment. I'd do it myself but last time I touched the template, it exploded. FWIW, this is how it looks for me. Lost Labyrinth • (c) • (b) 19:21, December 4, 2013 (UTC)

As for the broken background, I've restored the original wiki theme in order to assist fixing any issues. Lost Labyrinth • (c) • (b) 21:50, December 4, 2013 (UTC)

Umm... I don't like this fluid layout. Everything looks zoomed out at a different stage. I also agree with Lab, that flowery header looks awful. And why is the screen way more spread out? It looks bad on many pages like this. Joey.eyeball (talk) 03:52, December 5, 2013 (UTC)

Ok... addressing Nikel's points above:

1. Lab has temporarily restored the "standard" wiki background while we figure out where to go from here. The background is split, with a visible gray space in between for users with larger displays. So, I went ahead and disabled transparency in the content space for now, so that the split isn't visible.
2. I tried re-sizing the search bar in wikia.css, but it doesn't seem to help. We might want to consider disabling that piece of custom css until we can figure out why it's acting that way.
3. The default size of text on Wikia wikis was increased along with Fluid Layout. I'm sure custom .css could adjust it down, but we'd have to figure out how to do that first. This seems like a relatively minor thing to me. As for font type... I haven't noticed any change. It seems the same as it was before, just slightly bigger.
4. The main page appears different depending on the resolution of the monitor you view it with. Users with smaller monitors wouldn't have noticed many problems, while larger-monitored readers (such as myself) gazed in terror at this nuclear meltdown. Because of some quick fixes, the main page now looks adequate... not awesome, just adequate. The slider sticks out like a sore thumb, and I'm inclined to suggest that we take it off the page until we come up with a solution. I was toying around earlier with including static images on the page but there's a problem involved with scaling between resolutions that I haven't worked out the solution for yet.
5. Infoboxes appear to be fine. I tweaked pagecover a bit, but ultimately I can't do much. MediaWiki won't accept percentage widths for images, sounfortunately there's no way to get away from using a fixed-width pagecover. Since the content space for even the most limited resolutions has been bumped up to 700px, I increased the width of pagecover to 690 (this can still be overridden through the width parameter). I also have the template auto-center on the page... smaller-monitored readers won't notice a significant change, but larger-monitored folks will notice that the template now centers, leaving two giant empty spaces on either side that unfortunately cannot be helped. In the long term it might be worth discussing retiring the template, unless there's a way to get images to display as percentage widths that I'm not yet aware of. Maybe a special:contact is in order? I'd hate to have to scrap the template, considering how much work I've put into it.

On the subject of Pagecover... I made the above-mentioned changes but I'm not 100% sure I didn't break something because Pagecover is complex and tends to be temperamental (just as Lab mentioned above). If you see any catastrophic problems, please let me know and I'll try and fix it. -- LostInRiverview ^{talk ~ blog} 05:02, December 5, 2013 (UTC)

Joey is right. Everything looks spread out in the infoboxes. I think it's because of the font. The font got larger, and the spacing between lines got wider. They make the infoboxes look ugly. Only when I zoom it out to 67% will make the infobox look normal. And heck, I thought the top header was snowflake because it's almost holiday. Flowers?

Another issue: the Popular Blog Posts header on blog pages gets "broken", but I can say the culprit is the font size being too big. See Lab's image above. Maybe the problem here isn't the font type, but the size.

IIRC, the Pagecover was borrowed from another wiki. What did they do to get around the issue? Nikel _{Talk – Vote!} 13:34, December 5, 2013 (UTC)

Regarding Pagecover... The source wiki did essentially what I did here. I'm not sure if they widened it at all, but they centered it on their pages. -- LostInRiverview ^{talk ~ blog} 07:58, December 7, 2013 (UTC)

Conclusion

It has been nearly a month since the last post here and it seems as though most major pressing issues have been resolved. Additional relevant discussions should be started in new threads or on the appropriate talk pages. -- LostInRiverview ^{talk ~ blog} 17:00, December 31, 2013 (UTC)