Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

A modern responsive front-end framework based on Material Design

materializecss.com

Post reply on HN
Print view View original

31–40 of 96 posts

Re: A modern responsive front-end framework based on Material Design

#31

Post by vbezhenar »

dovel wrote: post #10
bbx wrote: post #6

Earlier quoted context omitted.

Tell your lead front dev this approach isn't best practice at all. You want one collection li's to not have the style? Use an alternative class on the ul: "collection collection-alt". You want nested li's to not inherit the styles? Use ".collection > li" in your CSS. In any case, assigning a class on each li goes exactly against CSS best practices, because it prevents taking advantage of the inheritance of property v…

I dont do this repeating class business but CSS Tricks 'css guidelines' web page says that when you do : '.collection li', it first searches through the page for all 'li's then wittles it down to the ones within the correct parent. Essentially that css selectors work from right to left. So I guess the idea is that classing up the li elements within a parent may be marginally quicker? I have never bothered though. Doe…

Modern browsers do their best to optimize typical use-cases for CSS selectors and .collection li for sure will be handled optimally. You shouldn't worry about CSS selector performance unless you have to provide good performance for very old browsers or hit specific performance problem. Optimize for humans, not for computers.

Re: A modern responsive front-end framework based on Material Design

#32

Post by patsplat »

bbx wrote: post #6
weego wrote: post #3

Earlier quoted context omitted.

It's so you don't clobber the underlying styles, otherwise you end up having to reset on top of the frameworks resets and styles on the odd occasion you want one of the collection li's to not have the styles. I tend to agree with you, but I was heavily chastised by lead the front end dev at my last gig for ever directly applying design styles to tag entities as doing it as above is considered best practice at the mom…

Tell your lead front dev this approach isn't best practice at all. You want one collection li's to not have the style? Use an alternative class on the ul: "collection collection-alt". You want nested li's to not inherit the styles? Use ".collection > li" in your CSS. In any case, assigning a class on each li goes exactly against CSS best practices, because it prevents taking advantage of the inheritance of property v…

Your example would corrupt the following case:

Bulleted label Bulleted label 2

This case must be considered when setting coding standards for a framework.

Re: A modern responsive front-end framework based on Material Design

#33

Post by V-2 »

Nice.

I'm not a Google fanboy, but I believe Material is the best visual language for UI. Okay, there are different contexts, but it's best thought-through, and most modern.

For instance, the use of animation is finally mature and at the same rich and amplifying user experience (rather than being an eye-candy).

And I think it's very compatible with web apps.

A Material-ish popular chess site: http://en.lichess.org/ (I'm in no way associated, but a happy user)

Re: A modern responsive front-end framework based on Material Design

#34

Post by dsego »

rimantas wrote: post #30
drinchev wrote: post #19

Earlier quoted context omitted.

References : [1] http://www.smashingmagazine.com/2011/12/12/an-introduction-t... [2] http://bramsmulders.com/how-i-improved-my-workflow-with-smac... [3] https://github.com/davidtheclark/scalable-css-reading-list I don't usually reply in this way, but this way of writing CSS has been proven to me in many hard to predict situations and is something that I would fight for in every possible way, everywhere I can. :D I've…

OOCSS, BEM and staff like that is just abuse of CSS. It is however widely used, because people are too lazy.

Nope, those techniques are attempts to squeeze at least something out of a really piss-poor tool that is CSS. Cascading is not a feature.

Re: A modern responsive front-end framework based on Material Design

#35

Post by chucksmash »

hbhakhra wrote: post #29

"Generally it is wise to import javascript files at the end of the body to reduce page load time." Does this really make a difference? Even if it did, wouldn't it lead to seeing a jump in the content after the CSS loads?

CSS files must be in the head element. JS files can be in either the head or the body.

Re: A modern responsive front-end framework based on Material Design

#36

Post by chucksmash »

chucksmash wrote: post #35
hbhakhra wrote: post #29

"Generally it is wise to import javascript files at the end of the body to reduce page load time." Does this really make a difference? Even if it did, wouldn't it lead to seeing a jump in the content after the CSS loads?

CSS files must be in the head element. JS files can be in either the head or the body.

(Though IIRC all linked resources in the head are retrieved and processed prior to rendering so unless your JS is crucial to correct display of the page your preference should be to load JS as late as possible.)

Re: A modern responsive front-end framework based on Material Design

#37

Post by Kiro »

bbx wrote: post #6
weego wrote: post #3

Earlier quoted context omitted.

It's so you don't clobber the underlying styles, otherwise you end up having to reset on top of the frameworks resets and styles on the odd occasion you want one of the collection li's to not have the styles. I tend to agree with you, but I was heavily chastised by lead the front end dev at my last gig for ever directly applying design styles to tag entities as doing it as above is considered best practice at the mom…

Tell your lead front dev this approach isn't best practice at all. You want one collection li's to not have the style? Use an alternative class on the ul: "collection collection-alt". You want nested li's to not inherit the styles? Use ".collection > li" in your CSS. In any case, assigning a class on each li goes exactly against CSS best practices, because it prevents taking advantage of the inheritance of property v…

No, you are completely wrong. Assigning a class on each li is indeed best practice. You should never select an element on tag.

Re: A modern responsive front-end framework based on Material Design

#38

Post by brlewis »

patsplat wrote: post #32
bbx wrote: post #6

Earlier quoted context omitted.

Tell your lead front dev this approach isn't best practice at all. You want one collection li's to not have the style? Use an alternative class on the ul: "collection collection-alt". You want nested li's to not inherit the styles? Use ".collection > li" in your CSS. In any case, assigning a class on each li goes exactly against CSS best practices, because it prevents taking advantage of the inheritance of property v…

Your example would corrupt the following case: Bulleted label Bulleted label 2 This case must be considered when setting coding standards for a framework.

Was this sentence not there when you first replied?

You want nested li's to not inherit the styles? Use ".collection > li" in your CSS.

Re: A modern responsive front-end framework based on Material Design

#39

Post by Karunamon »

V-2 wrote: post #33

Nice. I'm not a Google fanboy, but I believe Material is the best visual language for UI. Okay, there are different contexts, but it's best thought-through, and most modern. For instance, the use of animation is finally mature and at the same rich and amplifying user experience (rather than being an eye-candy). And I think it's very compatible with web apps. A Material-ish popular chess site: http://en.lichess.org/ (…

What? Why? I personally find Material to be hideous because of its color abuse. It makes your UI look like an over-saturated Fischer-Price toy because of all the bright primary colors everywhere, and that's before we get into the lack of shadow and shading that seems to have infected "modern" design.
Post reply on HN