Lumos Grid System | Webflow Framework
HTML-код
- Опубликовано: 5 июл 2024
- Get the Lumos Cloneable (affiliate link)
webflow.grsm.io/tricks?path=l...
Lumos Docs
lumos.timothyricks.com/
Join my Webflow Wizards Community
/ timothyricks
00:00 - problems with the native Webflow grid
02:33 - setting up Lumos grids
03:31 - u-grid-column-2, u-grid-column-3, u-grid-column-4
05:04 - u-grid-autofit
07:19 - u-grid-custom
07:46 - u-grid-custom with column spans
09:05 - u-grid-desktop, u-grid-tablet, u-grid-landscape
10:55 - u-grid-subgrid
13:05 - u-grid-breakout - Хобби
what I love about Tim, not only does he know by heart the tools and the framework things he built, but he makes these flawless tutorials that he practiced a couple of times, and when you're watching the video, you know the guy is not going to waist your time and will give you the most valuable things that you'll need. Kudos and congratulations! you never failed to deliver the best of the best
I’ve been completely overlooking the subgrid and desktop/tablet/mobile utilities. Sooo helpful! Thanks for this 🙏
Oh, awesome! So glad this helps! The breakpoint grid utilities are newer additions.
Okay Tim, please let me catch up haha.
This is probably the most flexible way to build a layout, and yet still maintaining a consistency.
Thank you, Tim!
Haha, thanks so much!! Glad to hear that
@@timothyricks It should've been us who thank youu for making this neat system!
Btw, I notice, now you have 2 way of managing responsiveness, 1st is the adaptive, and 2nd is the Fluid. Which one of these 2 that you're often use? and why?
Sorry for asking too much lol!
Thanks again sir Tim!
@@bamoj I love the questions! I use fluid now because it makes the sizes between breakpoints look better. Like right before the tablet breakpoint, things don’t look as cramped with fluid enabled. Fluid is also a better experience for people who use zoom because the font size consistently gets larger with each zoom. With adaptive sizes, zooming in can actually make the font size smaller when the zoom crosses between a breakpoint, and then the user has to keep zooming to bring it back up.
@@timothyricks Ah that make perfect sense, I feel like Fluid is better too. Thank you so much for such detailed answer!
Okay this is a lot, lemme watch this about 7 times again. But I already know it's a great system! Thanks Tim
The grid system is probably the most in depth part of Lumos. 😄 Thank you for the kind words!
this looks really great! are you planning on doing a video on something like building a navigation, menu or simple, fast components - all with lumos best practices in mind? thank you very much for your hard work, you push the boundaries of what one can do with webflow ❤
Thank you! I’ve built a lot of components with it in this video. More to come! ruclips.net/video/Q76GPu9_DnI/видео.htmlsi=d-oB9T6f4Q5DqFxn
spectacular as always
new T.RICKS video, I mean hell yeah!
I am really impressed. Thank you so much for the valuable content
Thank you! I’m so glad this helps!
Thanks! Great as always 👍
Thanks so much!
Great resource, Tim! What happened then with the “old” classes: gd1, ct2… etc?
I’ve been using Lumos for my new projects and those are the ones Ive seen in the project. Are those outdated?
Thank you! Those classes were part of Lumos V1 before Webflow released custom css properties making this all possible natively. The Lumos V2 cloneable uses all native classes and native Webflow variables.
Lumos V2 Cloneable (affiliate link)
webflow.grsm.io/tricks?path=lumos-v2-beta
@@timothyricks great! Thanks for the clarification, Tim. I'll have to now get used to the v2 haha
First!🌝