Istifadeci Muzakiresi Tacsipacsi - Wikipedia - Ureyim.az

Hi, Tacsipacsi, I'm the Rt788 on Phabricator.

Besides turning off $wgMFSpecialCaseMainPage, what can we do about the homepage? I have designed a homepage based on russian version. But it looks odd in desktop version when browsed on a mobile device. The rest is ok. However, it would be great to install the exact homepage on itwiki. Cheers! — Toghrul Rahimli • M/F 10:10, 21 sentyabr 2019 (UTC)Cavabla

@Toghrul Rahimli: Your test main page looks good, except that its mobile styles follow the look of the Russian main page, which is quite different from the Azerbaijani one. I’ll take a look at how to fix it.

Italian Wikipedia’s main page uses an outdated and much worse technique: it doesn’t work on desktop with narrow browser window, or on mobile devices with responsive skins (take a look at https://it.wikipedia.org/?useskin=timeless on mobile, for example). This main page was designed when TemplateStyles hasn’t existed, so there was practically no other solution, but now there is. —Tacsipacsi (müzakirə) 10:38, 21 sentyabr 2019 (UTC)Cavabla

@Tacsipacsi,, thanks for the reply. I did make it different from the desktop version because the illustrations (stars, blue lines ect) didn't look right on mobile version (az.m.wikipedia.org). My main complaint is that, the desktop version looks like the mobile version on mobile. Because it's limited by screen resolution. If it's possible to make the desktop version for devices with less then 1000px of resolution when desktop version is requested, it would be great. — Toghrul Rahimli • M/F 10:45, 21 sentyabr 2019 (UTC)Cavabla

@Toghrul Rahimli: I think it should look the same on mobile and desktop—consistent user experience is important, so either use an old-school look both on mobile and desktop (like Hungarian Wikipedia), or use a modern one on both (like ruwiki), don’t make the main page look completely different on different devices.

You set the rule for viewports (not screens!) narrower than 1000px because the larger layout would look wrong on such screens. If it’s not the case, don’t set these rules. (Viewport size is not the same as screen size. Mobile devices use virtual viewports on non-mobile-optimized sites like Wikipedia’s desktop version, which are wider than the actual screen width; see also MDN article about <meta name="viewport">. My phone, for example uses the smallest (<720px) layout on mobile Wikipedia and a larger one (720–999px) on desktop Wikipedia. I usually don’t use the 1000px breakpoint in Wikipedia/Wikimedia templates, only the 720px one, so—at least for me—the desktop layout is used with desktop Wikipedia, even on mobile.) —Tacsipacsi (müzakirə) 11:51, 21 sentyabr 2019 (UTC)Cavabla

@Tacsipacsi, Yes, Hungarian Wikipedia is a great example for what i want to do with the whole interface without doing something that can affect other users' activity. Some of admins use their phones (in desktop mode) and it can challenge them to tweak the home page.

Since i'm not a programmer by trade, it makes the coding process way harder. I have heavily edited the subpages of ruwiki homepage without touching codes too much (including copy-paste viewport settings which are disastrous to control). I think i'll try to port huwiki in order to test those and i'll change the design completely, since the boxes are alright, i think. — Toghrul Rahimli • M/F 14:49, 21 sentyabr 2019 (UTC)Cavabla

Hello Tacsipacsi. I have installed a new version which i think is a good choice: [1].
My only concern is the titles: "Həftənin seçilmiş məqaləsi", "Həftənin yaxşı məqaləsi" and others don't look symmetric on mobile version(s). Is this possible to create a function at [Şablon:Homepage/styles.css 46th string] which makes "top: 3.5px;" for desktop version and "top: 1px;" for mobile? It is my only nitpicking which i think will definately help to improve. Any help is appreciated. Cheers! — Toghrul Rahimli • M/F 14:10, 23 sentyabr 2019 (UTC)Cavabla

@Toghrul Rahimli: You can add

body.skin-minerva .frontPageBlockTitle {
	top: 1px;
}

to apply that only to the Minerva Neue skin (the default skin on mobile). But if the layout breaks on Minerva, it’s highly likely to do so on other non-standard skins, as is the case for Monobook and Modern, so I recommend you to think this design over again, and probably use another div (with position:absolute), which only gets a gradient background (no text content), but the height/width of which is given in ems, not in pixels, so it scales right on all skins, and even for people who manually set smaller or larger font size (e.g. people with visual difficulties). —Tacsipacsi (müzakirə) 19:40, 23 sentyabr 2019 (UTC)Cavabla