Search the Community
Showing results for tags 'styling'.
Styling on the web is really messy, and takes a lot of effort to get it right. As a matter of personal interest, I'm collecting as many 'design rules' underpinning good styling as I can. Like : In the typography area, I came across this site. It uses machine learning to identify font-families which work well together. It uses Google fonts as its domain, and outputs a header, sub-header and text font (similar to h1, h2 and p) I really like its recommendations (usually using the 'similar' setting)
Styling of visual elements. There are some 280 separate css properties which can be used to style each and every visual dom element. The following statement produces such a list var styles := browserapi.window.getComputedStyle(Panel.handle); (280 entries) If we disregard the properties which have a vendor prefix (-webkit, -moz etc) we still end up with some 230 properties for each visual element. And although many of these have default property values, the complexity is just too great to do styling on this level. Each and every css framework (including Smart) tries
For myself I've adopted the following recipe for component styling 1) Compose new components using any of the standard components, like w3Panel, w3Label, w3Button etc. The uptake is that this way new components auto-style according to the project theme and switching themes changes component styling automatically. Overriding properties where necessary of course. 2) Avoid themes outside the ones provided in SMS. I find external css files hard to read and comprehend, and I tend to steer away from them. The uptake is no external dependencies and also styling can be done in BEM format,