Skip to content

A starter project for making Bootstrap 4 themes with Gulp and Sass

License

Notifications You must be signed in to change notification settings

4braincells/theme-kit

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

34 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Bootstrap Theme Kit: Make your own Bootstrap Themes

This is simple starter project to help you get started quickly when making a custom Bootstrap theme.

There is a full tutorial available at hackerthemes.com: How to build your own Bootstrap themes.

This readme is the short version of that.

What this project does

This repository includes a project structure with a build script that builds a custom CSS version of Bootstrap 4, using Gulp. You can clone this repository, run the Gulp task and go right into modifying variables and adding styles. There's also an HTML file that contains a neatly organized collection of Bootstrap components that fit a 1920x1080 display, so you can instantly see the outcome.

Video Demonstration

There is a short demonstration of this project on YouTube: https://www.youtube.com/watch?v=Gi5ffoE3mPc

Prerequisites

  • This works on Windows, macOS and Linux.
  • Node Package Manager and Gulp are required. Make sure you can run gulp -v and npm -v.
  • You can get Node at nodejs.org, then install gulp using npm install gulp-cli -g

Getting started

  1. Clone this repo
  2. Run npm install
  3. Run gulp watch
  4. Look at index.html (ideally with a local development webserver)
  5. Add any Bootstrap Sass variables into scss/_custom-variables.scss
  6. Add any custom styles into scss/_custom-styles.scss. You can use Bootstrap's mixins here.
  7. Repeat steps 4 to 6 until you like what you see :-)

Creators

Alexander Rechsteiner

Bootstrap

Copyright and license

Code and documentation copyright 2017 HackerThemes Code released under the MIT License.

About

A starter project for making Bootstrap 4 themes with Gulp and Sass

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • CSS 97.3%
  • HTML 2.6%
  • Other 0.1%