Sass Blog

Seite 5 von 9

Vorherige Seite

• Request For Comments: Schrägstrich als Trennzeichen

  Veröffentlicht am 7. Mai 2019 von Natalie Weizenbaum

  Früh in der Geschichte von Sass wurde die Entscheidung getroffen, / als Divisionsoperator zu verwenden, da dies die mit Abstand häufigste Darstellung in Programmiersprachen war (und ist). Das /-Zeichen wurde in sehr wenigen einfachen CSS-Eigenschaften verwendet, und für diese war es eine optionale Kurzschreibweise. Daher definierte Sass einen Satz von Heuristiken, die definierten, wann / als wörtlicher Schrägstrich gerendert und wann es als Operator behandelt werden würde.

  Lange Zeit funktionierten diese Heuristiken ziemlich gut. In den letzten Jahren haben jedoch neue Ergänzungen zu CSS wie CSS Grid und CSS Color Level 4 den Schrägstrich immer häufiger als Trennzeichen verwendet. Die Verwendung desselben Zeichens sowohl für die Division als auch für die Schrägstrich-Trennung wird für Benutzer immer störender und wird wahrscheinlich schließlich unhaltbar werden.

  Daher planen wir, / neu zu definieren, um *nur* ein Trennzeichen zu sein. Anstatt eine nicht in Anführungszeichen gesetzte Zeichenkette zu erstellen (wie es derzeit geschieht, wenn mindestens ein Operand keine Zahl ist), wird eine Liste mit einem neuen Schrägstrich- Trennzeichen erstellt....

• Brandneue Sass Doku

  Veröffentlicht am 23. April 2019 von Natalie Weizenbaum

  Ich freue mich, Ihnen den Start einer vollständigen Neufassung und Neugestaltung der Sass-Dokumentation ankündigen zu können, die heute nach acht Monaten Arbeit von Jina Anne und mir live geht! Jina, die Leiterin des Sass Design Teams, ist verantwortlich für das Layout und das visuelle Design der neuen Dokumentation. Sie hat alles wunderschön und leserlich gestaltet. Ich habe den gesamten Text geschrieben, also wenn Sie einen Tippfehler sehen, bin ich derjenige, der Schuld hat.

  

  Zusätzlich zur Umorganisation und Neufassung der gesamten Dokumentation haben wir ein spezielles Beispiel-Widget hinzugefügt, das es einfach macht zu sehen, wie Sass-Stylesheets in CSS übersetzt werden. Es verfügt über Registerkarten für SCSS und die eingerückte Syntax, sodass Sie wählen können, welche Sie bevorzugen, oder zwischen ihnen wechseln können, um den Unterschied zu sehen.

  

  Die Sass-Funktionsdokumentation ist in die Neufassung integriert. Funktionen sind jetzt in leicht verständliche Abschnitte gegliedert, und Jina hat ein sehr leserliches Layout für sie entworfen.

  

  Das Beste daran ist, dass die neue Dokumentation eine Volltextsuche dank unserer Freunde bei Algolia bietet. Sie können nach Features, Funktionen...

• Ruby Sass hat das End-of-Life erreicht

  Veröffentlicht am 4. April 2019 von Natalie Weizenbaum

  Ein Jahr ist vergangen, seit wir die Einstellung von Ruby Sass angekündigt haben, und es hat nun offiziell sein End-of-Life erreicht. Wir werden eine letzte Version des Ruby Sass Gems veröffentlichen, die eine Warnung ausgibt, dass sie keine Updates mehr erhält, und dann das GitHub- Repository archivieren.

  

  Wir werden dann das Repo sass/language in das Repo sass/sass zusammenführen. Das bedeutet, dass *alle, die Ruby Sass weiterhin von github.com/sass/sass verwenden, Probleme haben werden*. Zukünftig wird das sass/sass Repo der Ort sein, an dem an den Sprachspezifikationen gearbeitet wird, und es wird keinen Code enthalten. Das sass/language Repo wird lediglich Links enthalten, die auf sass/sass verweisen.

  UmstellungUmstellung Permalink

  Wenn Sie noch nicht von Ruby Sass umgestiegen sind, ist jetzt der richtige Zeitpunkt. Der beste Weg, dies zu tun, hängt davon ab, wie Sie Ruby Sass heute verwenden.

  Wenn Sie Ruby Sass als Kommandozeilentool verwenden, ist der einfachste Weg, Dart Sass als Kommandozeilentool zu installieren. Es unterstützt eine ähnliche Schnittstelle wie Ruby Sass, und...

• Request For Comments: Modul- System

  Veröffentlicht am 27. November 2018 von Natalie Weizenbaum

  Viele der am häufigsten angeforderten Features für Sass haben mit seinen Imports zu tun. Das Importsystem, das wir seit den allerersten Versionen von Sass haben, ist, um es einfach auszudrücken, nicht gut. Es tut wenig mehr, als eine Sass-Datei textuell in eine andere einzufügen, was es schwierig macht, den Überblick zu behalten, wo Mixins, Funktionen und Variablen definiert wurden, und es schwierig macht, sicher zu sein, dass neue Ergänzungen nicht zufällig mit etwas anderem im Projekt kollidieren. Erschwerend kommt hinzu, dass es sich mit der integrierten @import-Regel von CSS überschneidet, was uns zwingt, einen Haufen Heuristiken zu haben, um zu entscheiden, was was ist.

  Aufgrund dieser und anderer Probleme möchten wir seit langem die Art und Weise, wie Sass-Dateien miteinander in Beziehung stehen, vollständig überarbeiten. In den letzten Jahren habe ich mit dem Sass-Kernteam und den Maintainern von Sass-Frameworks an einem Vorschlag für ein Modulsystem gearbeitet, das @import ersetzen kann. Dieser Vorschlag ist nun so weit ,

• Feature Watch: Content-Argumente und Farb- Funktionen

  Veröffentlicht am 14. November 2018 von Natalie Weizenbaum

  Dart Sass 1.15, das heute veröffentlicht wurde und auf npm und allen anderen Distributionskanälen erhältlich ist, bringt eine Reihe von mit Spannung erwarteten neuen Sass-Features mit sich. Dies ist auch die erste Veröffentlichung von Dart Sass mit wichtigen neuen Sprachfeatures, die *nicht* nur der CSS-Kompatibilität dienen. Das ist eine große Leistung, und wir beabsichtigen, dieses Muster auch in Zukunft fortzusetzen!

  @content Argumente@content Argumente Permalink

  Mixins, die @content Blöcke annehmen, können nun Argumente an diese Blöcke übergeben. Dies wird als @content(<Argumente...>) geschrieben. Wenn ein Mixin Argumente an seinen Content-Block übergibt, müssen Benutzer dieses Mixins diese Argumente annehmen, indem sie @include <Name> using (<Argumente...>) schreiben. Die Argumentenliste für einen Content-Block funktioniert genau wie die Argumentenliste eines Mixins, und die Argumente, die ihm von @content übergeben werden, funktionieren genauso wie das Übergeben von Argumenten an einen Mixin.

  // style.scss
  @mixin media($types...) {
    @each $type in $types {
      @media #{$type} {
        @content($type);
      }
    }
  }
  
  @include media(screen, print) using ($type)...

Nächste Seite