Wir könnten eigene Sass @mixins für CSS3-Elemente (wie Gradienten) schreiben, aber es gibt ein existierendes Sass-Framework namens Compass, das diese Dinge bereits bereitstellt. Es erfordert ein gewisses Vertrauen, die Kontrolle über solche Dinge abzugeben (ich schätze nicht mehr als bei der Verwendung eines Präprozessors), aber es lohnt sich.
Warum ist die Verwendung von Compass eine gute Idee?
- Die @mixins sind sehr gut geschrieben. Sie entsprechen, wo möglich, dem Standard und sind sehr konsistent.
- Compass wird aktualisiert, sodass Sie automatisch auf dem neuesten Stand der Best Practices bleiben. Dies wird wahrscheinlich umfassender erledigt, als Sie es alleine könnten.
- Es gibt eine Menge anderer mächtiger Dinge, die Sie nutzen können, wie z. B. Spriting (auf das wir uns in diesem Projekt nicht konzentrieren werden, das aber großartig ist).
CodeKit funktioniert hervorragend mit Compass (es wird sogar damit geliefert). Wir verlieren zwar etwas Kontrolle, die wir in CodeKit hatten (wie die direkte Kontrolle der Kompilierungs-Pfade von Dateien), aber das ist keine große Sache. Wir können die meisten Dinge jetzt über die Datei config.rb in unserem Projekt steuern.
Letztendlich verwenden wir Compass, um Übergänge für die Navigationslinks einzubinden, was ihnen ein sanfteres Gefühl verleiht.
Warum laden die Videos so langsam? Ich meine, ich versuche es in verschiedenen Browsern (Safari, Chrome, Firefox), alle in der neuesten Version, sowohl auf PCs als auch auf Macs und mit 2 verschiedenen Internetanbietern?
Die Dateigrößen der Videos (besonders in Desktop-Browsern) sind ziemlich groß. Manchmal Hunderte von Megabytes. Sie werden auf Amazon S3 gehostet, was ziemlich schnell sein sollte, aber natürlich hängt all dies von der Geschwindigkeit Ihrer Internetverbindung ab.
Wenn es verrückt langsam erscheint, kontaktieren Sie mich unter [email protected] mit weiteren Details, und wir werden versuchen, etwas herauszufinden.
Ich werde diesen Kommentar vergraben, um die Kommentar-Threads beim Inhalt zu belassen und nicht bei spezifischen technischen Problemen.
Großartige Arbeit, Chris.
Ich benutze Codekit schon seit einiger Zeit, seit deinem ursprünglichen Video dazu, aber Compass habe ich bisher nicht genutzt und eigene Mixins erstellt. Ich wusste nicht, dass es so einfach ist! Ich beginne heute mit einem neuen Projekt und werde Compass von Anfang an verwenden!
Ich habe vor einiger Zeit über die Verwendung von Compass mit Codekit geschrieben, falls jemand dieses Video mit weiteren zusätzlichen Informationen zur Verwendung von Compass und seinen verfügbaren Plugins ergänzen möchte. Ich gehe durch die gesamte Einrichtung von Anfang bis Ende mit Screenshots von jedem Schritt. Ich habe auch einen Link zum Compass-Plugin-Repository bereitgestellt.
http://blog.grayghostvisuals.com/css/installing-compass
Tolles Video, Mann, ich muss sagen, seit du die Verwendung von Compass empfohlen hast, hat es meine Entwicklungszeit drastisch verkürzt. Das Beste ist, weil ich auf einem PC arbeite (weil die Firma, für die ich arbeite, sie erfunden hat), gibt es eine PC-Version... Juhu!! Ich empfehle dringend, die 10 Dollar dafür zu bezahlen, es ist brillant.
Ich hatte ein Problem mit CodeKit und Compass, und dieses Video hat mir geholfen, es zu lösen. Großartig.
Sie können auf "Neue Konfigurationsdatei" klicken statt auf "Compass installieren", und es werden nicht alle unnötigen Dateien erstellt, die Ihre vorhandenen Dateien überschreiben könnten, wenn Sie eine Datei mit demselben Namen haben.
Wenn Sie bereits ein Projekt haben, das für Compass eingerichtet ist, ist es sicherer, den anderen Weg zu wählen.
Ich benutze Windows und es wurde keine config.rb-Datei erstellt, also musste ich die aus Ihrer Projektdatei kopieren und es funktioniert.
Chris, ich weiß, dass du CodeKit auf CSS-Tricks besprochen hast und es offensichtlich viel benutzt. Es ist mir wirklich aufgefallen, wie viele Probleme du damit hast, wenn ich diese Screencasts sehe. Hast du das dem Entwickler erwähnt? Ich stelle mir vor, dass das Sehen deiner Screencasts und der dargestellten Probleme ein starker Anreiz sein könnte, diese Fehler zu beheben.
Einer der Gründe, warum ich mich für The Lodge angemeldet habe, war zu erfahren, wie CodeKit in deinen Workflow passt und ob ich es LiveReload vorziehen sollte. Danke!
Ich habe mehrmals Kontakt mit dem Entwickler aufgenommen und ihm jedes Problem, das ich hatte, mitgeteilt. (https://twitter.com/bdkjones)
Es kommt sogar eine v2 mit vielen tollen Funktionen, einschließlich viel schnellerer Projektaktualisierungen (das kam in diesen Videos ein paar Mal auf). Außerdem ist eine häufige Ursache dafür, dass CSS-Injection nicht funktioniert, dass Browser-Erweiterungen stören. Insbesondere Adobe Edge Inspect kann ein Problem darstellen.
Okay, das ist toll zu hören! Danke!
Eine weitere Möglichkeit, Übergänge und Änderungen spürbarer zu gestalten, ist die Verwendung einer Ease-Out-Funktion. Ease-Out verlangsamt sich gegen Ende des Übergangs.
Sie könnten auch die cubic-bezier-Funktion für ultimative Kontrolle über Ihren Übergang verwenden.
Chris, ist Compass im Jahr 2019 noch relevant?
Nicht wirklich, würde ich sagen. Autoprefixer hat das Rennen für diese Funktionalität gewonnen. Ich habe vergessen, welche anderen hilfreichen Funktionen Compass hat, aber ich sehe es nicht mehr sehr oft verwendet, ganz zu schweigen davon, dass ich nicht glaube, dass Compass noch gepflegt wird. Es ist nur Ruby und Sass hat sich von Ruby entfernt.