soflyy / oxygen-bugs-and-features

Bug Reports & Feature Requests for Oxygen
https://oxygenbuilder.com/
315 stars 29 forks source link

Mobile first approach for screen sizes #1280

Open mmb12345 opened 4 years ago

mmb12345 commented 4 years ago

Describe the feature you'd like to see included in Oxygen. A clear, detailed description of the feature you're requesting. Currently, the screen size responsive menu works on a "less than" basis. I would like it to work the opposite way, or at least have an option to opt in that direction.

What are the use cases for this feature? e.g. Accessibility, e-commerce store that sells bicycles, etc. I think it's a more modern approach, that leads to people writing less code and further pushing Oxygen in the right direction.

Examples of this feature or functionality. If another product has done it well, provide examples here. Bootstrap switched to this approach for their screen breakpoints somewhere around version 4.

See also #126

Contributolo commented 4 years ago

Would be great to have both options. Because I have elements to show "above" and "less than"...

f3bruary commented 3 years ago

Perhaps something to add to the Global Settings.

Mobile First: True/False

F1yingBears commented 3 years ago

+1

It's 2021 and mobile-first is the new standard.

websitesbyjeremy commented 3 years ago

+1 this should really be a priority

braeu71 commented 3 years ago

+1

lufemas commented 3 years ago

+1

Right now I have to create the page for all devices then start changing stuff the way down to less than 480.

bwp-codes commented 2 years ago

+1 "Mobile first" should be adapted as the new standard way of organising stylesheets and CSS rules, or at least this should be an option when setting-up the project ("Which design approach do you prefer?")

Why? The current setup forces you to build your website "desktop first", creating a (usually) more complex design as for mobile. You then have to write more code for smaller breakpoints, adding more and more complexity to "reset" the desktop design for mobile (Total website size on mobile > Total website size on desktop).

Benefits: When approaching the design mobile first, you would only add more complexity where it is needed. This would reduce overall code complexity and save bandwidth on mobile (Total website size on mobile < Total website size on desktop).

Best Regards!

lucianahanan commented 1 year ago

+10000

I had a site where I wrote the whole css by hand before going to oxygen, and what was my despair when I saw that oxygen is desktop-first, and I had to invert all media-queries ! It would be so much better, if mobile-first, it's 2022, come on, it's time, buddy!

theoyasumi commented 1 year ago

+1