Web designer at the Wikimedia Foundation
Fri, Mar 27
Wed, Mar 25
Tue, Mar 24
Noting that this thankfully isn't an issue on Android/Chrome
Just did a quick QA on the beta cluster. The change looks good:
Mon, Mar 23
Wed, Mar 18
I tried to work out the CSS and have proposed some additional mobile styles here: https://en.wikipedia.org/wiki/Template_talk:2019%E2%80%9320_coronavirus_pandemic_data/styles.css#Cleaning_up_the_table_for_mobile_web
Tue, Mar 17
|1920px browser width (sidebar closed)||1920px browser width (sidebar open)|
Mon, Mar 16
@Jdrewniak nice. There are still a few minor issues with the prototype, though I'm not sure if it makes sense to continue refining it, or just wait until we start building the thing for real? Would additional work here further benefit the production effort?
Wed, Mar 11
I've updated the guidelines to reflect our decision that the icon area will always be 50x50px
Tue, Mar 10
@Volker_E do you have thoughts on this? What is the current thinking around why we don't apply custom styling for blue links, as we do for OOUI elements?
@Jdlrobson moving this out of Designing/discussing as we're not currently working on this. It seems, given this task, T235193, T226125, and T225535, that we may want to make a mini-epic around notifications on mobile, though probably not something we'd work on anytime soon.
At this point it seems like this should be considered as part of the Desktop Improvements project. @spatton could you add the data you collected around the value of the Donate button, as well as the current hypothesis about why this button is important (i.e. some people see the banner but prefer to click on the link), to this task? Also, what's your current thinking about logged-in users, is the Donate button important in that case as well?
Based on T226125#5604323 I'm moving this to blocked.
@Volker_E as we've discussed a more comprehensive review of font-sizes in mobile front end is needed, however this issue seems worth addressing in the meantime.
Mon, Mar 9
@ovasileva @Jdrewniak @Jdlrobson I wanted to call our attention to how the article bar will look with a fixed content width. Below is German Wikipedia with the max-width at 960px. Thankfully there seems to be decent responsive support here, so even if folks have gadgets that result in extra tabs we should be fine. Eventually this situation will be resolved by us moving the search bar out of the toolbar. For now I think we should be mindful of this and keep an eye on it.
Fri, Mar 6
@Jdrewniak I've added details to the description here. Your prototype — https://wikipedia-vue-protoype.netlify.com/p3.html#/en/wiki/Hawaiian_Islands — is getting pretty close. A few things to point out that need to be updated (please reference the task description for details):
@Demian my apologies for forgetting to address your comments about the TOC — I meant to respond to that.
@Volker_E regarding animation, @Jdrewniak has come up with a great solution as you can see in the prototype — above 1360px screen width there is an animation, and below 1360px screen width there is no animation. This avoids the weird content reflowing issue associated with animation.
Thu, Mar 5
@Volker_E @ovasileva @Demian apologies for the phab spam and potential confusion. I have renamed and rescoped this task to specifically be about whether or not the sidebar should be sticky/fixed. The epic is now T247032.
Wed, Mar 4
Tue, Mar 3
@ovasileva just wanted to clarify if this represents the implementation, or the generating of the actual svgs/assets that will be used? If it's the former then I think it could be reassigned to Volker or Jon. If it's the latter we're all set.
Sorry for the late feedback.
per a discussion I had with @Jdlrobson I'm unassigning this from myself.
Mon, Mar 2
Met with @Jdlrobson and @Volker_E today to review further. I've put together some examples of how we could render the logos for Wikipedia and other projects using 2-3 separate images (depending on the project), and not much CSS (thanks flexbox): https://di-logo-sandbox.firebaseapp.com/
- (optional) tagline
2cents: for these discussions I think it's helpful to show the icons in context
Fri, Feb 28
Alright, a bit more information after a broader investigation today.
Feb 27 2020
@ovasileva what do you think about a more minimal styling for the button? Even without the underline it seems relatively noticeable if you're looking at the sidebar.
@Andreg-p would it be possible for you to show me a few other examples of equation previews? I would like to make some layout suggestions and having other examples would be helpful.
Feb 25 2020
I think we should anchor on the use case where the search returns results because that's more common. I think it looks better with the proposed icon rather than no icon.
Spoke with @Volker_E — I think it's fine to swap the current contents icon for the bullet list one, e.g.
Feb 24 2020
I've been in communication with @Erdinc_Ciftci_WMDE — the proposed design for mobile looks good. Removing this from our board.
Bringing what's shown in the mobile preview closer to the wikitext sounds like a good idea to me in general. I'm fine with displaying the broken-ish icons, assuming that it will lead to things getting fixed so they work better on mobile eventually.
Feb 19 2020
@thiemowmde how we handle links seems to be a bit inconsistent (or difficult to define), see T190549 for context. Perhaps the best way to handle this is to follow what would happen if a link within the reference itself (not the reference preview) were clicked? In this case that would mean it would open in the same tab.
Feb 13 2020
From a certain perspective this is a bug, because any click outside of the filter menu is intended to close the menu (that's part of the mechanics of how our menus work). However as @Etonkovidova pointed out (T231053#5874095), in this case the bug is somewhat convenient.
Feb 12 2020
Hey @Peteole this is a super cool exploration. I'm curious about your thinking — specifically what challenges you are aiming to solve with this? I can make some guesses but always best to hear directly.
Feb 11 2020
@olga small things that came up during estimation:
- is the styling of the button intentional? Sort've...it should stand out from the other links in the list but doesn't have to be a full on button (e.g. we could just add some spacing around it and make it bold)
- can we make the button text shorter / less negative? Possibly, let's try to come up with alternatives