SPIN Admin/Dashboard Theme with a minimalist design and innovative Dark UI will let you build an amazing and powerful application with great UI. Perfectly designed for large scale applications, with detailed step by step documentation. It is built based on the latest standards and recommendations. It is powered by Bootstrap framework 3.x, which is currently one of the most popular framework in the world.
- Make sure you have Ruby installed (Ruby DevKit on Windows also), Jekyll gem, Bundler gem (
gem install bundler
), Node, Bower and Gulp - Clone this repository
git clone https://github.com/0wczar/spin.jekyll.git
- In the terminal navigate to the cloned repository directory
- Run
npm install
to install NPM packages - Run
bower install
to install Bower packages - Run
gulp bower
to attach Bower packages to Jekyll - Run
bundler
to install required Gems - (Option) Run
gulp
to start Jekyll with HTML/JS/Styles watcher. To start watching ONLY HTML files rungulp jekyll
- In the terminal navigate to project directory
- Run
bower install <package-name> --save
for examplebower install jquery --save
. The Bower packages list can be found here - http://bower.io/search/ - When the install is complete run
gulp bower
to attach the new library.
- The plugins Sass files should be placed in
/src/assets/scss/<plugin-name>
- The compiled css should be placed in
/src/assets/stylesheets/<plugin-name>.css
- This generated custom style should be linked in the
/src/_includes/head.html
for example<link rel="stylesheet" href="assets/stylesheets/select2-bootstrap.css">
- New HTML pages should be added to
/src
folder for example/src/new-page.html
- The new page should have the variables on the top required is
layout: default
. Other usable variables are:bodyClasses
which adds appropriate classes to the body tag,defaultContainer
which adds specific container to navbar and footer andtitle
which is injected into head and can be used in the content via{{ page.title }}
. Example: - The added page should be linked in the sidebar like this:
Example Link:
<li class="{% if page.url == "/default.html" %}active{% endif %}"><a href="/default.html"><span class="nav-label">Default</span></a></li>
- To acces this page you can use this url:
localhost:3000/new-page/
- In main folder enter in terminal
gulp build:vanilla
- Go to folder
cd /site
- Then
npm install
- Next
bower install
- Next
gulp build
- Ready source available in folder
/dist
- In main folder enter in terminal
gulp build:seed
- Ready source available in folder
/starter
- Go to folder with project
cd /your_catalog
- Enter
git reset --hard origin/master
- Pull via Github Dekstop
- Example: 25 - 07 - 2016 - 12:03 (12h)
<span data-faker="{{date.day}} {{date.monthDigit}} {{date.year}} {{date.time}}"></span>
- Example: Months: Jan, Feb, Mar, etc...
data-faker="[[date.monthShort]]"
- Examples: Days: Mon, Tue, Wed, etc...
data-faker="[[date.weekdayShort]]"
- Example: 1% - 100%:
<span data-faker="[[random.percentage]]"><span>
- Example: 0% - 100.0%:
<span data-faker="[[random.percentagePoint]]"><span>