elemental_styleguide
1.0.0
Einfacher Stilhandbuch für Rails 5.1+, so konzipiert, dass es mit elemental_components gut passt. Die beiden zusammen sind von den Werken von Brad Frost und von den Gedanken hinter Lonely Planet's Style Guide Rizzo inspiriert.
Fügen Sie diese Zeile der GemFile Ihrer Anwendung hinzu:
gem "elemental_styleguide"Und dann ausführen:
$ bundleFühren Sie den Installationsgenerator aus:
$ bin/rails g elemental_styleguide:installDadurch werden die folgenden Dateien und Verzeichnisse erstellt:
app/
views/
layouts/
styleguide/
example.html.erb
styleguide/
01_home.md
Der Style Guide kann in Ihrer Routendatei montiert werden mit:
mount ElementalStyleguide :: Engine => "/styleguide" Sie können jetzt auf den Style Guide unter http://localhost:3000/styleguide zugreifen.
Sie können Style Guide -Seiten einfach erstellen, indem Sie dem app/views/styleguide -Verzeichnis Markdown -Dateien hinzufügen. Diese können strukturiert werden, indem sie in Unterverzeichnisse einfügen und durch Präfix der Dateinamen mit einer Ziffer sortiert werden.
In den Brad Frost's Style Guide Guide für Style Guide Inspiration.
Eine spezielle Markdown -Syntax, die vom Katalog inspiriert ist, kann verwendet werden, um Beispiele für jeden erb -Code auf der Style Guide -Seite im Kontext Ihrer eigenen Anwendung zu machen:
# Example
``` example
<%= "Hello world" %>
```Es ist möglich, Optionen an das Beispiel weiterzugeben, um die Breite und Höhe des Verpackungselements zu steuern:
``` example
width: 500
height: 200
---
<%= "Hello world" %>
``` Beispiele müssen die CSS und JS Ihrer Anwendung benötigen, um ordnungsgemäß zu funktionieren. Es gibt eine app/views/layouts/styleguide/example.html.erb . Diese Datei kann geändert werden, um dem Header zusätzliche Tags hinzuzufügen, z javascript_pack_tag
Diese Bibliothek wurde zusammen mit Elemental_Components von den Schriften von Brad Frost zu Atomic Design- und Living Style Guides und Rizzo, dem Lonely Planet Style Guide, inspiriert. Andere Inspirationen waren:
Eine Liste von Leitfäden im realen Weltstil finden Sie unter http://styleguides.io.
