Giter Site home page Giter Site logo

drupal-bootstrap-sass's Introduction

#Drupal Boostrap Sub-Theme (SASS) This is a sub-theme for the Drupal Bootstrap theme. Instead of using less / css, this uses SASS. It's also been setup to use local CSS / JS files by default, this is because the entire Bootstrap CSS is generated by SASS.

##Pre-requisists

  1. Install compass:

     gem install compass
    
  2. Install bootstrap-sass

     gem install bootstrap-sass
    

##Using the theme Either use drush to download the boostrap theme:

drush dl bootstrap

Or manually download and add to sites/all/themes (or your current site themes folder).

Download this basetheme and add to your themes folder.

Rename the folder to you-theme-name

Rename drupal-bootstrap-base.info.starterkit to your-theme-name.info

In config.rb change the http_path to path to your theme. This is the URL visitors use to access your theme. e.g. a standard URL would be /sites/default/themes/my-theme/

Ok, compass should now be able to compile your theme:

cd path-to-your-theme

compass compile

Or you can watch for chanages with

compass watch

You can now enable the theme in Drupal.

##Customising the theme Your first port of call should be the _variables.scss partial. These are all the variables used by bootstrap. To change something, just uncomment the variable and change to your value.

Your own styles should go in the _custom.scss partial. You can use all the bootstrap variables and mixins, along with all the compass functions / mixins.

If you need to tweak some templates - copy them over from the bootstrap parent theme. Place them into the templates folder.

##Contributing PR are welcome and appriciated - if you are unsure or have any questions get in touch or let us know on Twitter.

Built by Arrow

drupal-bootstrap-sass's People

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.