spin jquery bs3

SPIN HTML/CSS – jetzt kostenlos!

Einführung

Mit dem SPIN Admin/Dashboard Theme mit minimalistischem Design und innovativer Dark UI können Sie eine erstaunliche und leistungsstarke Anwendung mit toller UI erstellen. Perfekt konzipiert für Großanwendungen, mit detaillierter Schritt-für-Schritt-Dokumentation. Es basiert auf den neuesten Standards und Empfehlungen. Es basiert auf dem Bootstrap-Framework 3.x, einem der derzeit beliebtesten Frameworks der Welt.

Installation

1. Stellen Sie sicher, dass Sie Ruby (auch Ruby DevKit unter Windows), Jekyll Gem, Bundler Gem ( gem install bundler ), Node, Bower und Gulp installiert haben
2. Klonen Sie dieses Repository git clone https://github.com/0wczar/spin.jekyll.git
3. Navigieren Sie im Terminal zum geklonten Repository-Verzeichnis
4. Führen Sie npm install um NPM-Pakete zu installieren
5. Führen Sie bower install aus, um Bower-Pakete zu installieren
6. Führen Sie gulp bower aus, um Bower-Pakete an Jekyll anzuhängen
7. Führen Sie bundler aus, um die erforderlichen Gems zu installieren
8. (Optional) Führen Sie gulp aus, um Jekyll mit dem HTML/JS/Styles-Watcher zu starten. Um NUR HTML-Dateien anzusehen, führen Sie gulp jekyll aus

Hinzufügen von Bower-Komponenten

1. Navigieren Sie im Terminal zum Projektverzeichnis
2. Führen Sie zum Beispiel bower install <package-name> --save aus: bower install jquery --save . Die Liste der Bower-Pakete finden Sie hier – http://bower.io/search/
3. Wenn die Installation abgeschlossen ist, führen Sie gulp bower aus, um die neue Bibliothek anzuhängen.

Hinzufügen von Plugins Less/Sass

1. Die Sass-Dateien der Plugins sollten in /src/assets/scss/<plugin-name> abgelegt werden
2. Das kompilierte CSS sollte in /src/assets/stylesheets/<plugin-name>.css abgelegt werden
3. Dieser generierte benutzerdefinierte Stil sollte in /src/_includes/head.html verlinkt werden, zum Beispiel <link rel="stylesheet" href="assets/stylesheets/select2-bootstrap.css">

Neue Seiten erstellen

1. Neue HTML-Seiten sollten zum Ordner /src hinzugefügt werden, zum Beispiel /src/new-page.html
2. Die neue Seite sollte oben über die erforderlichen Variablen verfügen layout: default . Weitere verwendbare Variablen sind: bodyClasses , das dem Body-Tag entsprechende Klassen hinzufügt, defaultContainer , das der Navigationsleiste und der Fußzeile einen bestimmten Container hinzufügt, und title , der in den Kopf eingefügt wird und über {{ page.title }} im Inhalt verwendet werden kann. Beispiel:
3. Die hinzugefügte Seite sollte in der Seitenleiste wie folgt verlinkt sein: Beispiellink: <li class="{% if page.url == "/default.html" %}active{% endif %}"><a href="/default.html"><span class="nav-label">Default</span></a></li>
4. Um auf diese Seite zuzugreifen, können Sie diese URL verwenden: localhost:3000/new-page/

Vanilla Source (Vollständige App Light)

1. Geben Sie im Hauptordner im Terminal gulp build:vanilla
2. Gehen Sie zum Ordner cd /site
3. Dann npm install
4. Nächste bower install
5. Nächster gulp build
6. Bereite Quelle im Ordner /dist verfügbar

Seed-Quelle (Starter Dev) (_inludes/starter...)

1. Geben Sie im Hauptordner im Terminal gulp build:seed
2. Bereite Quelle im Ordner /starter verfügbar

GIT-Reset

1. Gehen Sie zum Ordner mit der Projekt cd /your_catalog
2. Geben Sie git reset --hard origin/master
3. Ziehen Sie über Github Dekstop

Faker Neue Optionen

1. Beispiel: 25.07.2016 – 12:03 (12h) <span data-faker="{{date.day}} {{date.monthDigit}} {{date.year}} {{date.time}}"></span>
2. Beispiel: Monate: Januar, Februar, März usw. data-faker="[[date.monthShort]]"
3. Beispiele: Tage: Mo, Di, Mi usw... data-faker="[[date.weekdayShort]]"
4. Beispiel: 1 % – 100 %: <span data-faker="[[random.percentage]]"><span>
5. Beispiel: 0 % – 100,0 %: <span data-faker="[[random.percentagePoint]]"><span>