Here's my favorite part of the presentation:
View Raw
(Sorry about that, but we can’t show files that are this big right now.)
Universal.css
71–80 of 118 posts
Re: Universal.css
#72The real joke is how screwed up client side programming is. Here's a library that's an insider/hipster joke but it's only obviously a joke to hipster/insiders.
Blah blah blah doesn't like JavaScript
Re: Universal.css
#73People who don't understand the concept of atomic CSS usually joke about it, but has no idea about the benefits. The new Twitter mobile site is fast as hell and use this concept. Semantic class names makes no sense when you think about it.
Re: Universal.css
#74I pretty much completely disagree with the implicit critique here. The codebase I work on now has largely transitioned from "semantic" CSS (classnames based on feature) to CSS with classnames that describe what they do, visually, and the latter has made writing frontend code dramatically more straightforward - it's gone from something I dread and try to pass off to a specialist to something I can do easily. A night-and-day improvement.
I mean, nobody actually advocates translating every single possible style attribute into its own CSS class. But what's wrong with padding and margin utility classes that use a consistent set of widths? Is doing calculations on "1x" and "2x" when you want elements to line up really worse than doing calculations on pixel or em values in your CSS just because it's "unsemantic"?
Let's take the examples from the "maintainable CSS" book that's linked:
Here's the backend equivalent:
# "bad"
def cheapest_products_with_min_rating(rating)
products.
select { |p| p.rating >= rating }.
sort_by { |p| p.price }.
first(10)
end
# "good"
def products_for_category_landing_page(rating)
allowed = []
for p in products
if p.rating >= rating
allowed = 10
result The second example - so nice and "semantic". If we want to change what products show up on the category landing page, it will be easy!
...
In real life, nobody writes backend code like that. Why should we tolerate it in the frontend?
Re: Universal.css
#75People who don't understand the concept of atomic CSS usually joke about it, but has no idea about the benefits. The new Twitter mobile site is fast as hell and use this concept. Semantic class names makes no sense when you think about it.
I'm not familiar with this concept. What are the benefits?
Re: Universal.css
#76Poes law meets css: "Poe's law is an Internet adage which states that, without a clear indicator of the author's intent, parodies of extreme views will be mistaken by some readers or viewers for sincere expressions of the parodied views.[1][2][3] " https://en.wikipedia.org/wiki/Poe%27s_law
[deleted]
Re: Universal.css
#77This is awesome. I no longer need to type the dreaded ":" , which requires the most awkward finger combination . My ulnar nerve will be so happy.
You know you're supposed to press the shift key with the other hand right?
Re: Universal.css
#78Earlier quoted context omitted.
The sticking point for enterprise-y things remains IE, since it only supports flexbox (buggily) as of IE11. Though there's polyfills like flexibility out there, of course.
According to this[0], IE10. 0. http://caniuse.com/#feat=flexbox
Sort of? I mean, note that table skips IE10 entirely.
As I understand it, IE10 implements a different, somewhat incompatible version of the flexbox spec. You can see all the changes they made for 11 here: https://msdn.microsoft.com/library/dn265027(v=vs.85).aspx
Re: Universal.css
#79This is amazing. I quit a job at a company that did many stupid things, one of which was insist that their home rolled CSS framework did not suck. Said framework was, in all seriousness, exactly this but with shortened, cryptic names. Nightmare.
Ideally, in SMACSS, you could classify all components into their composable parts: a grid width, a title style, a button with a primary style, a button with a secondary style, standard body text, emphasized body text, etc.
But most of the time, designers don't know how to stick with a standardized padding and margin, so I find that without exception, an org requires me to develop "cryptic" representations of margin and padding, such as mr1 (margin right to 1 degree, or 5 px) or pl2 (padding left to 2 degrees, or 10px).
I've also rolled entirely new features without writing a single line of CSS. This is a way to mitigate CSS bloat. I take it you've never actually tried to deal with the problem of CSS bloat, or you'd find either 1) you'd have to hold a gun to designers' heads or 2) do exactly what I just showed you.
Re: Universal.css
#80They're making fun of Bootstrap, but having classes that allow you to define margins and padding quickly by adding a class is actually really helpful. Of course that shouldn't be expanded to every possible property.
You can use Foundation + sass processor and not need any of that garbage. My website just has nav, main, sidebar, etc. I define what I want into foundation to be mapped to them and the preprocessor creates my minified CSS.
http://penguindreams.org/blog/jekyll-3-and-foundation-6/
Adding "row-xx" or whatever to your HTML elements is basically going back to the garbage that was in table based html layouts.