Open ahmetb opened 7 years ago
Closely related - the heading sizes are surprisingly large. Only all the way down at h6 (!!) is there a heading of a suitable size to label sections of UI or content inside something like a <div class=card>
.
Could the typography make typical semantic headings show up with reasonable style when used inside various materialize constructs?
Last time I checked MaterialIzeCSS implemtation just follows google guides
Here is the reference implementation
I brought them up at the same zoom level, and compared side by side, see below. This is just a quick look (I didn't even check the CSS for font sizes...). It does not appear to match.
At least they are not surprisingly large. That's the specification
@kmmbvnr Indeed, that is true!
The actual problem I experienced: that there doesn't appear to be a class/style/element in Materialize which corresponds to the "Title" typography from the spec.
I don't believe that materialize is following the specification, Display 4,3,2,1 are not titles, those should be classes instead of something important in the SEO like the headers.
Sadly, I also think that change this is a huge breaking change and couldn't be added in the v0.+.+
I am showing headings in my design and some of them can be 6-7 words long. However they look absolutely terrible because the h1, h2, h3 etc. have exactly the same size on small/medium displays as the large displays.
h1 on large display should not be the same as large display on mobile. You can look at blog.google for a reference on how to implement this.
This is a
h1
on Google Blog:This is a
h2
on my design yet is' way bigger:and this is the
h1
:I think we need more fluid font sizes for headings.