Milligram: Die Kursgrößen müssen angepasst werden.

Erstellt am 23. Nov. 2016  ·  18Kommentare  ·  Quelle: milligram/milligram

Ich habe angefangen, Milligram 1.2.0 hauptsächlich für ein schönes Stylesheet zum Generieren von Dokumentation zu verwenden. Im Vergleich zu vielen CSS-Frameworks sieht es auf dem Papier großartig aus.

Aber die Überschriften! Ehrlich gesagt kann ich den Unterschied zwischen <h2> und <h3> . Chrome sagt mir, dass <h2> 4.2rem und <h3> 3.6rem bekommt, aber man kann es nicht erkennen, wenn man es sich ansieht.

Könnte Milligram zu Überschriftengrößen wechseln, die tatsächlich allmählich kleiner aussehen? Oder vielleicht können Sie mich auf ein CSS-Framework verweisen, das bereits ein gutes, auf Dokumente ausgerichtetes Styling bietet. Vielen Dank

improvement question

Hilfreichster Kommentar

@nateberkopec Verstanden macht es Sinn. Ich werde dafür eine PR geben. Mal sehen, wie sie aussehen

Alle 18 Kommentare

Ich muss sagen, ich stimme zu. Begeisterter Benutzer des Frameworks, aber die Header lassen zu wünschen übrig.

Hallo @garretwilson @nateberkopec

Gutes Problem, Leute! Ich werde einige Tests durchführen, um zu sehen, wie wir dies verbessern können. Haben Sie dazu Vorschläge?

Übrigens möchte ich Ihnen eine neue Funktion vorstellen, die kürzlich hinzugefügt wurde, um die Qualität des Frameworks sicherzustellen. Es analysiert und meldet alle Änderungen, die am Framework vorgenommen werden. Wenn ein Detail unbemerkt bleibt, wird es nach dem Vergleich mit der alten Version identifiziert. Dies ist der visuelle Regressionstest und sollte bei den visuellen Verbesserungen der nächsten Versionen helfen.

@cjpatoilo Die traditionelle typografische Skala wird hier und hier behandelt

Ich denke, das Hauptproblem hier ist, dass die Skala für h1 und h2 nicht eingehalten wird - sie müssen größer sein.

Basierend auf diesen Ressourcen ist hier ein Vorschlag:

h1
    font-size: 6.0rem

h2
    font-size: 4.8rem

h3
    font-size: 3.6rem

h4
    font-size: 2.4rem

h5
    font-size: 2.1rem

h6
    font-size: 1.8rem

Ich bin unentschlossen, ob ich so große Dinge mag. Trotzdem kann ich den Unterschied zwischen h2 und h3 immer noch nicht sehr gut erkennen. Ich denke, sie müssen schneller kleiner werden.

Vielleicht suchen Sie hier nach Ideen:

Wenn Sie eine große Körpergröße wünschen (wie es Milligramm bei 16px tut), wird h1 wahrscheinlich ziemlich groß sein. So funktioniert Typografie. Sie können keine kleinen Überschriften und keinen großen Text haben. Wenn Sie versuchen, 5 verschiedene Überschriftengrößen in einem zu kleinen Bereich zu stopfen, können Sie die Überschriften nicht voneinander unterscheiden (wie jetzt). Milligramm muss entweder den Textkörper verkleinern (ich bin nicht dafür) oder die Überschriften vergrößern.

Hier ist ein weiteres Tool zum Durchspielen typografischer Skalen .

Wenn Sie damit einverstanden sind, dass H6 dieselbe Größe wie die Textkopie hat, finden Sie hier eine Alternative:

h1
    font-size: 4.8rem

h2
    font-size: 3.6rem

h3
    font-size: 2.4rem

h4
    font-size: 2.1rem

h5
    font-size: 1.8rem

h6
    font-size: 1.6rem

Wenn Sie damit einverstanden sind, dass H6 die gleiche Größe wie die Körperkopie hat…

Ich habe gerade die ersten drei ausprobiert und ich mag diese viel besser !! Und ich bin damit einverstanden, dass H6 genauso groß ist wie der Körper. Ich empfehle Ihnen, H6 standardmäßig fett oder so zu machen. Aber selbst wenn Sie es nicht tun, werde ich persönlich sowieso selten zu H6 gehen.

Die mobilen Schriftgrößen müssen ebenfalls korrigiert werden - sie sind viel zu ähnlich, um verwendet werden zu können. Ich würde empfehlen, nur die gleiche Waage für Handys zu verwenden.

Ist also geplant, dass dies bald in eine neue Version aufgenommen wird?

Ich sehe also, dass dies nicht in Version 1.2.2 angekommen ist. Irgendein Grund warum? Muss ich eine Pull-Anfrage stellen?

Hi @garretwilson @nateberkopec Gute Arbeit. Das bedeutet mir sehr ♥

Die Diskussion ist offen! Dieses Framework ist ein Open Source-Projekt und jeder kann dazu beitragen. Ich hoffe, dass mehr Menschen das gleiche Interesse haben und dazu beitragen wie Sie. Ich werde alles durchgehen, worüber hier gesprochen wurde, und ich werde so schnell wie möglich daran arbeiten.

Hey @garretwilson npm install ..und chill!

Hey @garretwilson npm installieren

Können Sie klarstellen, was Sie damit meinen? Ich habe v1.2.2 von der Site heruntergeladen und dies schien nicht enthalten zu sein. Wollen Sie damit sagen, dass "npm install" mir etwas Neueres gibt, das noch nicht veröffentlicht wurde? Ist es Version v1.2.3? Ich bin wie ein Computer, leicht verwirrt, wenn Sie es mir nicht erklären.

..und chill!

Ich habe nur den Status überprüft, weil mir nicht klar war, ob dies geplant oder veröffentlicht wurde oder was. Ich habe auch versucht klar zu machen, dass ich Hilfe anbieten wollte, aber ich war mir nicht sicher, ob dies bereits jemand getan hatte. Lassen Sie mich wissen, wie ich helfen kann.

@nateberkopec ist das vorhandene h1 nicht bei 5.0rem (50px)? Schlagen Sie vor, dass wir es verringern? bis 4.8rem?

@sudheerDev Ich bin kein Typograf, ich weiß nur, was ich im Internet lese. Wenn Sie die obigen Links zu typografischen Maßstäben lesen, werden Sie sehen, warum es 4,8 statt 5 ist (im Grunde genommen folgt der Abstand zwischen den Kopfzeilengrößen einem Muster).

@nateberkopec Verstanden macht es Sinn. Ich werde dafür eine PR geben. Mal sehen, wie sie aussehen

@nateberkopec danke für die PR

@garretwilson @nateberkopec @sudheerDev Endlich konnte ich mit diesen Beiträgen die neue Version starten. Ich habe die Überschriftengrößen anhand der wichtigsten Rahmenbedingungen durchsucht und bin schließlich zu einer angemesseneren Situation gekommen, als es gewünscht wurde. Ich hoffe du magst es!

Die Überschriftengrößen sind jetzt viel sinnvoller, danke.

War diese Seite hilfreich?
0 / 5 - 0 Bewertungen

Verwandte Themen

equinusocio picture equinusocio  ·  14Kommentare

mikeriley131 picture mikeriley131  ·  8Kommentare

davedele picture davedele  ·  5Kommentare

mterron picture mterron  ·  6Kommentare

kresogalic8 picture kresogalic8  ·  5Kommentare