anlek/application.css.scss

## application.css.scss
//MAKE SURE YOU RENAME THE FILE TO application.css.scss (adding .scss)

/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
 * or any plugin's vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any styles
 * defined in the other CSS/SCSS files in this directory. It is generally better to create a new
 * file per style scope.
 *
 *= require_tree .
 *= require_self
 */

@import "bootstrap";


## application.html.erb
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
    <title>Bootstrap 101 Template</title>
    <%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track' => true %>
    <%= csrf_meta_tags %>

    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
  </head>
  <body>
    <%= yield %>
    <%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
  </body>
</html>

## application.js
// This is a manifest file that'll be compiled into application.js, which will include all the files
// listed below.
//
// Any JavaScript/Coffee file within this directory, lib/assets/javascripts, vendor/assets/javascripts,
// or any plugin's vendor/assets/javascripts directory can be referenced here using a relative path.
//
// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the
// compiled file.
//
// Read Sprockets README (https://github.com/rails/sprockets#sprockets-directives) for details
// about supported directives.
//
//= require jquery
//= require jquery_ujs
//= require turbolinks
//= require bootstrap
//= require_tree .

## gistfile1.md

      
    Raw
  

              gistfile1.md
            
          
    Add gem 'bootstrap-sass' to your Gemfile

  
## gistfile2.md

      
    Raw
  

              gistfile2.md
            
          
    Adding Bootswatch themes (https://bootswatch.com/)

In your Gemfile add:

gem 'bootswatch-rails'
In application.css.scss replace @impory 'bootstrap'; with the following:

@import 'bootswatch/paper/variables';
@import 'bootstrap';
@import 'bootswatch/paper/bootswatch';
	//MAKE SURE YOU RENAME THE FILE TO application.css.scss (adding .scss)

	/*
	* This is a manifest file that'll be compiled into application.css, which will include all the files
	* listed below.
	*
	* Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
	* or any plugin's vendor/assets/stylesheets directory can be referenced here using a relative path.
	*
	* You're free to add application-wide styles to this file and they'll appear at the bottom of the
	* compiled file so the styles you add here take precedence over styles defined in any styles
	* defined in the other CSS/SCSS files in this directory. It is generally better to create a new
	* file per style scope.
	*
	*= require_tree .
	*= require_self
	*/

	@import "bootstrap";
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<!-- The above 3 meta tags must come first in the head; any other head content must come after these tags -->
	<title>Bootstrap 101 Template</title>
	<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %>
	<%= csrf_meta_tags %>

	<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
	<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
	<!--[if lt IE 9]>
	<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
	<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
	<![endif]-->
	</head>
	<body>
	<%= yield %>
	<%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
	</body>
	</html>
	// This is a manifest file that'll be compiled into application.js, which will include all the files
	// listed below.
	//
	// Any JavaScript/Coffee file within this directory, lib/assets/javascripts, vendor/assets/javascripts,
	// or any plugin's vendor/assets/javascripts directory can be referenced here using a relative path.
	//
	// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the
	// compiled file.
	//
	// Read Sprockets README (https://github.com/rails/sprockets#sprockets-directives) for details
	// about supported directives.
	//
	//= require jquery
	//= require jquery_ujs
	//= require turbolinks
	//= require bootstrap
	//= require_tree .