All Projects → maxim → Bootswatch Rails

maxim / Bootswatch Rails

Licence: mit
Bootswatches converted to SCSS ready to use in Rails asset pipeline.

Programming Languages

ruby
36898 projects - #4 most used programming language

Labels

Projects that are alternatives of or similar to Bootswatch Rails

BootBlox
Ready-to-use Bootstrap CSS blocks
Stars: ✭ 19 (-96.16%)
Mutual labels:  templates
Grips
Simple-logic templates
Stars: ✭ 289 (-41.62%)
Mutual labels:  templates
Recyclerviewtemplate
One Template which solves all frequently used RecyclerViews Code Snippets
Stars: ✭ 404 (-18.38%)
Mutual labels:  templates
Cookie
A Template-based File Generator. Like cookiecutter but works with file templates instead of project templates.
Stars: ✭ 261 (-47.27%)
Mutual labels:  templates
Fimbo
free to use portfolio templates
Stars: ✭ 265 (-46.46%)
Mutual labels:  templates
Yo
CLI tool for running Yeoman generators
Stars: ✭ 3,421 (+591.11%)
Mutual labels:  templates
html css templates
Simple templates for small projects
Stars: ✭ 22 (-95.56%)
Mutual labels:  templates
The Documentation Compendium
📢 Various README templates & tips on writing high-quality documentation that people want to read.
Stars: ✭ 4,306 (+769.9%)
Mutual labels:  templates
Awesome Bulma Templates
🚀 Free real-world templates built with Bulma
Stars: ✭ 283 (-42.83%)
Mutual labels:  templates
Ant Design Landing
🚵 Landing Pages of Ant Design System
Stars: ✭ 4,425 (+793.94%)
Mutual labels:  templates
Happy Spiders
🔧 🔩 🔨 收集整理了爬虫相关的工具、模拟登陆技术、代理IP、scrapy模板代码等内容。
Stars: ✭ 261 (-47.27%)
Mutual labels:  templates
Metal
Love template metaprogramming
Stars: ✭ 265 (-46.46%)
Mutual labels:  templates
Mikado
Mikado is the webs fastest template library for building user interfaces.
Stars: ✭ 323 (-34.75%)
Mutual labels:  templates
Jinja2cpp
Jinja2 C++ (and for C++) almost full-conformance template engine implementation
Stars: ✭ 257 (-48.08%)
Mutual labels:  templates
Assemble
Community
Stars: ✭ 3,995 (+707.07%)
Mutual labels:  templates
Next-JS-Landing-Page-Starter-Template
🚀 Free NextJS Landing Page Template written in Tailwind CSS 3 and TypeScript ⚡️ Made with developer experience first: Next.js 12 + TypeScript + ESLint + Prettier + Husky + Lint-Staged + VSCode + Netlify + PostCSS + Tailwind CSS
Stars: ✭ 521 (+5.25%)
Mutual labels:  templates
Email Templates
📫 Create, preview, and send custom email templates for Node.js. Highly configurable and supports automatic inline CSS, stylesheets, embedded images and fonts, and much more!
Stars: ✭ 3,291 (+564.85%)
Mutual labels:  templates
Smarthome
@skalavala 👍 Nothing But Smarthome Stuff! - By Mahasri Kalavala
Stars: ✭ 437 (-11.72%)
Mutual labels:  templates
Tails
Tails is a (no-config) copy'n paste library of templates and components crafted using TailwindCSS
Stars: ✭ 416 (-15.96%)
Mutual labels:  templates
Vim Template
Simple templates plugin for Vim
Stars: ✭ 328 (-33.74%)
Mutual labels:  templates

Looking for contributors

If you'd like to try your hand at maintaining this project, I'm happy to give you commit access.

bootswatch-rails

Gem Version

This gem is meant to be used with bootstrap-sass. It gives you complete scss versions of bootswatches for use in your Rails asset pipeline, just like bootstrap-sass gives you scss version of bootstrap itself.

Installation

Add this line to your application's Gemfile, in assets group:

gem 'bootswatch-rails'

And then execute:

$ bundle

Usage

When using bootstrap-sass, it's recommended to avoid sprockets in your stylesheets. In order to do that you simply rename your application.css file to application.css.scss, remove all sprockets comments, and instead use sass @import commands. These commands are smart enough to fully support asset pipeline load paths, thanks to sass-rails gem.

Here's approximately how your application.css.scss file should look like, considering that you're using bootstrap-sass.

// Example using 'Cerulean' bootswatch

//Import bootstrap-sprockets
@import "bootstrap-sprockets";

// Import cerulean variables
@import "bootswatch/cerulean/variables";

// Then bootstrap itself
@import "bootstrap";

// Bootstrap body padding for fixed navbar
body { padding-top: 60px; }

// And finally bootswatch style itself
@import "bootswatch/cerulean/bootswatch";

// Whatever application styles you have go last
@import "base";

Overriding bootswatch variables

Since version 3.1 it's possible to override variables.

// First set or import your overrides
$textColor: #000;

// Then load variables
@import "bootswatch/journal/variables";

// Then the rest as shown above...

Bootswatches

Included bootswatches

Contributing

  1. Fork it
  2. Create your feature branch (git checkout -b my-new-feature)
  3. Commit your changes (git commit -am 'Added some feature')
  4. Push to the branch (git push origin my-new-feature)
  5. Create new Pull Request

Please see CONTRIBUTING for more detail. (Dont change the scss files by hand, use the converter and rearranger first, and make your changes in those if possible)

Note about converter

I am trying to automate this project as much as possible, so I wrote a script that does most of the work converting less to scss. If you want to contribute a fix that's easily automatable and you know ruby, please add a processor to the converter.

Credits

Big thanks to these guys.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].