search

studiopress / genesis-sample

This is the sample theme created for the Genesis Framework.
https://demo.studiopress.com/genesis-sample/
534 stars 280 forks source link

flexbox instead of floats #169

Open sewid opened 5 years ago

sewid commented 5 years ago

Is there a reason, why the sample theme still uses floats instead of flexbox (e.g. for site-header, content / sidebar, footer-widgets, etc.)? Are there any plans to switch to flexbox in near future?

ghost commented 5 years ago

CSS Grid should be given top priority over flexbox.

nathanrice commented 5 years ago

CSS Grid should be given top priority over flexbox.

Relevant

The current Genesis HTML structure isn't particularly compatible with doing site layout with CSS Grid. My hope is that as we evolve the markup API, restructuring the default markup output will become a bit easier in child themes, and applying more modern CSS layout techniques will be a more plausible choice.

ghost commented 5 years ago

have you considered Foundation 6 framework or html5-boilerplate?

devbapidey commented 5 years ago

I have also had this problem. Consider foundation and Genesis compatibility.

On Fri, Jan 25, 2019, 11:42 AM brodie <notifications@github.com wrote:

have you considered Foundation 6 framework or html5-boilerplate?

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub https://github.com/studiopress/genesis-sample/issues/169#issuecomment-457467325, or mute the thread https://github.com/notifications/unsubscribe-auth/AgItSU6OFyUspt-SMX4EKLAP1U7inQBAks5vGqBHgaJpZM4Zf-yJ .

codegrau commented 5 years ago

@nathanrice +1 for "modern CSS layout techniques" - but I don't see that happen anytime soon with Genesis

jb510 commented 5 years ago

have you considered Foundation 6 framework or html5-boilerplate?

Please no... One of the nice things about Genesis is that it's extremely lightweight and not opinionated about such things.

FWIW, we've long used Bourbon/Neat for child themes and while we liked it, have left it behind. Back to writing what we need from scratch. I am however looking at TailwindCSS, but even that I wouldn't want to see baked into Genesis. There are far too many options, and cleaning up / overriding them is a pain.

jb510 commented 5 years ago

CSS Grid should be given top priority over flexbox.

Relevant

The current Genesis HTML structure isn't particularly compatible with doing site layout with CSS Grid. My hope is that as we evolve the markup API, restructuring the default markup output will become a bit easier in child themes, and applying more modern CSS layout techniques will be a more plausible choice.

I've been wondering about this. We use CSS Grid (and flexbox) a fair bit. However CSS Grid doesn't add much for modern "full width" or even "content-sidebar" layouts.

Where it excels would be home/landing pages... and block build layouts of rows and columns. That seems like content/block territory and child theme territory.

Not opposed to CSS Grid/Flexbox in Genesis, just not sure why/how it would benefit.

nathanrice commented 5 years ago

Not opposed to CSS Grid/Flexbox in Genesis, just not sure why/how it would benefit.

It wouldn't. This is definitely a child theme discussion. What we do in Sample usually makes its way into future themes and theme updates. What we can do in Genesis is make the markup structure a bit flatter so child themes can actually use Grid without resorting to markup hacks.

jb510 commented 5 years ago

Sorry. I totally conflated Genesis with Genesis Sample there.

ghost commented 5 years ago

FYI, CSS Grid and Flexbox are the future of Web layouts!

CSS Grid and or Flexbox should be implemented in Genesis framework itself.

https://blog.bitsrc.io/13-css-ui-grid-systems-and-libraries-for-2018-5918104cb591

seothemes commented 5 years ago

I've been using Flexbox instead of floats in child themes for the last 2 years. No issues there. Sample could probably use it to reduce the amount of CSS.

CSS Grid and or Flexbox should be implemented in Genesis framework itself.

Genesis doesn't contain any CSS. Child themes can already use CSS Grid if they want to, although you might need to remove some of the Genesis markup to make it worthwhile.

OksanaRomaniv commented 5 years ago

have you considered Foundation 6 framework or html5-boilerplate?

Please no... One of the nice things about Genesis is that it's extremely lightweight and not opinionated about such things.

FWIW, we've long used Bourbon/Neat for child themes and while we liked it, have left it behind. Back to writing what we need from scratch. I am however looking at TailwindCSS, but even that I wouldn't want to see baked into Genesis. There are far too many options, and cleaning up / overriding them is a pain.

With the release of Tailwind 1.0, the configuration process became much easier: you can extend or overwrite options with a simple module export. Though the framework if extremely useful, the generated utilities CSS can be still too large (~ 250kb without gzip).