pure scss asset helpers, new paths
This commit is contained in:
Родитель
380194abaf
Коммит
0cbe7255b5
2
Gemfile
2
Gemfile
|
@ -3,5 +3,5 @@ source 'https://rubygems.org'
|
|||
gemspec
|
||||
|
||||
group :development do
|
||||
gem 'byebug', platform: :mri_20, require: false
|
||||
gem 'byebug', platform: :mri_21, require: false
|
||||
end
|
||||
|
|
18
README.md
18
README.md
|
@ -94,7 +94,7 @@ bower install bootstrap-sass-official
|
|||
|
||||
`bootstrap-sass` is taken so make sure you use the command above.
|
||||
|
||||
Sass, JS, and all other assets are located at [vendor/assets](/vendor/assets).
|
||||
Sass, JS, and all other assets are located at [assets](/assets).
|
||||
|
||||
By default, `bower.json` main field list only the main `bootstrap.scss` and all the static assets (fonts and JS).
|
||||
This is compatible by default with asset managers such as [wiredep](https://github.com/taptapship/wiredep).
|
||||
|
@ -135,13 +135,13 @@ Otherwise the fonts are referenced as:
|
|||
|
||||
`$icon-font-path` defaults to `bootstrap/`.
|
||||
|
||||
When not using an asset pipeline, you can copy fonts and JS from bootstrap-sass, they are located at [vendor/assets](/vendor/assets):
|
||||
When not using an asset pipeline, you can copy fonts and JS from bootstrap-sass, they are located at [assets](/assets):
|
||||
|
||||
```bash
|
||||
mkdir public/fonts
|
||||
cp -r $(bundle show bootstrap-sass)/vendor/assets/fonts/ public/fonts/
|
||||
cp -r $(bundle show bootstrap-sass)/assets/fonts/ public/fonts/
|
||||
mkdir public/javascripts
|
||||
cp -r $(bundle show bootstrap-sass)/vendor/assets/javascripts/ public/javascripts/
|
||||
cp -r $(bundle show bootstrap-sass)/assets/javascripts/ public/javascripts/
|
||||
```
|
||||
|
||||
## Usage
|
||||
|
@ -174,7 +174,7 @@ $navbar-default-color: $light-orange;
|
|||
You can also import components explicitly. To start with a full list of modules copy this file from the gem:
|
||||
|
||||
```bash
|
||||
cp $(bundle show bootstrap-sass)/vendor/assets/stylesheets/bootstrap.scss \
|
||||
cp $(bundle show bootstrap-sass)/assets/stylesheets/bootstrap.scss \
|
||||
app/assets/stylesheets/bootstrap-custom.scss
|
||||
```
|
||||
Comment out components you do not want from `bootstrap-custom`.
|
||||
|
@ -188,7 +188,7 @@ In `application.sass`, replace `@import 'bootstrap'` with:
|
|||
### Javascript
|
||||
|
||||
We have a helper that includes all Bootstrap javascripts. If you use Rails (or Sprockets separately),
|
||||
put this in your Javascript manifest (usually in `application.js`) to load the files in the [correct order](/vendor/assets/javascripts/bootstrap.js):
|
||||
put this in your Javascript manifest (usually in `application.js`) to load the files in the [correct order](/assets/javascripts/bootstrap.js):
|
||||
|
||||
```js
|
||||
// Loads all Bootstrap javascripts
|
||||
|
@ -229,9 +229,9 @@ To convert a specific branch or version, pass the branch name or the commit hash
|
|||
The latest converter script is located [here][converter] and does the following:
|
||||
|
||||
* Converts upstream bootstrap LESS files to its matching SCSS file.
|
||||
* Copies all upstream JavaScript into `vendor/assets/javascripts/bootstrap`
|
||||
* Generates a javascript manifest at `vendor/assets/javascripts/bootstrap.js`
|
||||
* Copies all upstream font files into `vendor/assets/fonts/bootstrap`
|
||||
* Copies all upstream JavaScript into `assets/javascripts/bootstrap`
|
||||
* Generates a javascript manifest at `assets/javascripts/bootstrap.js`
|
||||
* Copies all upstream font files into `assets/fonts/bootstrap`
|
||||
* Sets `Bootstrap::BOOTSTRAP_SHA` in [version.rb][version] to the branch sha.
|
||||
|
||||
This converter fully converts original LESS to SCSS. Conversion is automatic but requires instructions for certain transformations (see converter output).
|
||||
|
|
4
Rakefile
4
Rakefile
|
@ -13,7 +13,6 @@ end
|
|||
desc 'Dumps output to a CSS file for testing'
|
||||
task :debug do
|
||||
require 'sass'
|
||||
require './lib/bootstrap-sass/sass_functions'
|
||||
path = Bootstrap.stylesheets_path
|
||||
%w(bootstrap).each do |file|
|
||||
engine = Sass::Engine.for_file("#{path}/#{file}.scss", syntax: :scss, load_paths: [path])
|
||||
|
@ -36,10 +35,9 @@ end
|
|||
desc 'Compile bootstrap-sass to tmp/ (or first arg)'
|
||||
task :compile, :css_path do |t, args|
|
||||
require 'sass'
|
||||
require 'bootstrap-sass/sass_functions'
|
||||
require 'term/ansicolor'
|
||||
|
||||
path = 'vendor/assets/stylesheets'
|
||||
path = 'assets/stylesheets'
|
||||
css_path = args.with_defaults(css_path: 'tmp')[:css_path]
|
||||
puts Term::ANSIColor.bold "Compiling SCSS in #{path}"
|
||||
Dir.mkdir(css_path) unless File.directory?(css_path)
|
||||
|
|
34
bower.json
34
bower.json
|
@ -10,23 +10,23 @@
|
|||
],
|
||||
"description": "bootstrap-sass is a Sass-powered version of Bootstrap, ready to drop right into your Sass powered applications.",
|
||||
"main": [
|
||||
"vendor/assets/stylesheets/bootstrap.scss",
|
||||
"vendor/assets/fonts/bootstrap/glyphicons-halflings-regular.eot",
|
||||
"vendor/assets/fonts/bootstrap/glyphicons-halflings-regular.svg",
|
||||
"vendor/assets/fonts/bootstrap/glyphicons-halflings-regular.ttf",
|
||||
"vendor/assets/fonts/bootstrap/glyphicons-halflings-regular.woff",
|
||||
"vendor/assets/javascripts/bootstrap/affix.js",
|
||||
"vendor/assets/javascripts/bootstrap/alert.js",
|
||||
"vendor/assets/javascripts/bootstrap/button.js",
|
||||
"vendor/assets/javascripts/bootstrap/carousel.js",
|
||||
"vendor/assets/javascripts/bootstrap/collapse.js",
|
||||
"vendor/assets/javascripts/bootstrap/dropdown.js",
|
||||
"vendor/assets/javascripts/bootstrap/tab.js",
|
||||
"vendor/assets/javascripts/bootstrap/transition.js",
|
||||
"vendor/assets/javascripts/bootstrap/scrollspy.js",
|
||||
"vendor/assets/javascripts/bootstrap/modal.js",
|
||||
"vendor/assets/javascripts/bootstrap/tooltip.js",
|
||||
"vendor/assets/javascripts/bootstrap/popover.js"
|
||||
"assets/stylesheets/bootstrap.scss",
|
||||
"assets/fonts/bootstrap/glyphicons-halflings-regular.eot",
|
||||
"assets/fonts/bootstrap/glyphicons-halflings-regular.svg",
|
||||
"assets/fonts/bootstrap/glyphicons-halflings-regular.ttf",
|
||||
"assets/fonts/bootstrap/glyphicons-halflings-regular.woff",
|
||||
"assets/javascripts/bootstrap/affix.js",
|
||||
"assets/javascripts/bootstrap/alert.js",
|
||||
"assets/javascripts/bootstrap/button.js",
|
||||
"assets/javascripts/bootstrap/carousel.js",
|
||||
"assets/javascripts/bootstrap/collapse.js",
|
||||
"assets/javascripts/bootstrap/dropdown.js",
|
||||
"assets/javascripts/bootstrap/tab.js",
|
||||
"assets/javascripts/bootstrap/transition.js",
|
||||
"assets/javascripts/bootstrap/scrollspy.js",
|
||||
"assets/javascripts/bootstrap/modal.js",
|
||||
"assets/javascripts/bootstrap/tooltip.js",
|
||||
"assets/javascripts/bootstrap/popover.js"
|
||||
],
|
||||
"keywords": [
|
||||
"twbs",
|
||||
|
|
|
@ -2,7 +2,6 @@ module Bootstrap
|
|||
class << self
|
||||
# Inspired by Kaminari
|
||||
def load!
|
||||
require 'bootstrap-sass/sass_functions'
|
||||
register_compass_extension if compass?
|
||||
|
||||
if rails?
|
||||
|
@ -30,7 +29,7 @@ module Bootstrap
|
|||
end
|
||||
|
||||
def assets_path
|
||||
@assets_path ||= File.join gem_path, 'vendor', 'assets'
|
||||
@assets_path ||= File.join gem_path, 'assets'
|
||||
end
|
||||
|
||||
# Environment detection helpers
|
||||
|
@ -49,6 +48,8 @@ module Bootstrap
|
|||
private
|
||||
|
||||
def configure_sass
|
||||
require 'sass' unless defined?(::Sass)
|
||||
|
||||
::Sass.load_paths << stylesheets_path
|
||||
|
||||
# bootstrap requires minimum precision of 10, see https://github.com/twbs/bootstrap-sass/issues/409
|
||||
|
|
|
@ -1,7 +1,10 @@
|
|||
module Bootstrap
|
||||
module Rails
|
||||
class Engine < ::Rails::Engine
|
||||
initializer "bootstrap-sass.assets.precompile" do |app|
|
||||
initializer 'bootstrap-sass.assets.precompile' do |app|
|
||||
%w(stylesheets javascripts fonts images).each do |sub|
|
||||
app.config.assets.paths << root.join('assets', sub)
|
||||
end
|
||||
app.config.assets.precompile << %r(bootstrap/glyphicons-halflings-regular\.(?:eot|svg|ttf|woff)$)
|
||||
end
|
||||
end
|
||||
|
|
|
@ -1,53 +0,0 @@
|
|||
require 'sass'
|
||||
require 'bootstrap-sass'
|
||||
|
||||
module Sass::Script::Functions
|
||||
def twbs_font_path(source)
|
||||
twbs_asset_path source, :font
|
||||
end
|
||||
declare :twbs_font_path, [:source]
|
||||
|
||||
def twbs_image_path(source)
|
||||
twbs_asset_path source, :image
|
||||
end
|
||||
declare :twbs_image_path, [:source]
|
||||
|
||||
def twbs_asset_path(source, type)
|
||||
return Sass::Script::String.new('', :string) if source.to_s.empty?
|
||||
url = if Bootstrap.asset_pipeline? && (context = sprockets_context)
|
||||
context.send(:"#{type}_path", source.value)
|
||||
elsif Bootstrap.compass?
|
||||
send(:"#{type}_url", source, Sass::Script::Bool.new(true)).value.sub /url\((.*)\)$/, '\1'
|
||||
end
|
||||
|
||||
# sass-only
|
||||
url ||= source.value.gsub('"', '')
|
||||
Sass::Script::String.new(url, :string)
|
||||
end
|
||||
declare :twbs_asset_path, [:source, :type]
|
||||
|
||||
unless Sass::Script::Functions.instance_methods.include?(:ie_hex_str)
|
||||
# polyfill sass < 3.2.6 (taken from sass 3.2.12):
|
||||
def ie_hex_str(color)
|
||||
assert_type color, :Color, :color
|
||||
alpha = (color.alpha * 255).round.to_s(16).rjust(2, '0')
|
||||
Sass::Script::String.new("##{alpha}#{color.send(:hex_str)[1..-1]}".upcase)
|
||||
end
|
||||
declare :ie_hex_str, [:color]
|
||||
end
|
||||
|
||||
protected
|
||||
|
||||
def sprockets_context
|
||||
# Modern Rails way to get context:
|
||||
if options.key?(:sprockets)
|
||||
options[:sprockets][:context]
|
||||
# Sprockets-sass context:
|
||||
elsif options.key?(:custom)
|
||||
options[:custom][:sprockets_context]
|
||||
# Compatibility with sprockets pre 2.10.0:
|
||||
elsif (importer = options[:importer]) && importer.respond_to?(:context)
|
||||
importer.context
|
||||
end
|
||||
end
|
||||
end
|
|
@ -16,7 +16,7 @@ namespace :bower do
|
|||
Dir.chdir Bootstrap.gem_path do
|
||||
spec = JSON.parse(File.read 'bower.json')
|
||||
js_paths = File.read(File.join Bootstrap.javascripts_path, 'bootstrap.js').lines.map do |line|
|
||||
line.strip if line.sub!(%r(//\s*=\s*require\s*(.*)\s*), 'vendor/assets/javascripts/\1.js')
|
||||
line.strip if line.sub!(%r(//\s*=\s*require\s*(.*)\s*), 'assets/javascripts/\1.js')
|
||||
end.compact
|
||||
|
||||
spec['main'] =
|
||||
|
|
|
@ -42,9 +42,9 @@ class Converter
|
|||
@cache_path = cache_path
|
||||
@repo_url = "https://github.com/#@repo"
|
||||
@save_to = {
|
||||
js: 'vendor/assets/javascripts/bootstrap',
|
||||
scss: 'vendor/assets/stylesheets/bootstrap',
|
||||
fonts: 'vendor/assets/fonts/bootstrap'}.merge(save_to)
|
||||
js: 'assets/javascripts/bootstrap',
|
||||
scss: 'assets/stylesheets/bootstrap',
|
||||
fonts: 'assets/fonts/bootstrap'}.merge(save_to)
|
||||
end
|
||||
|
||||
def_delegators :@logger, :log, :log_status, :log_processing, :log_transform, :log_file_info, :log_processed, :log_http_get_file, :log_http_get_files, :silence_log
|
||||
|
|
|
@ -14,7 +14,7 @@ class Converter
|
|||
name = name.gsub(/\.js$/, '')
|
||||
content << "//= require ./bootstrap/#{name}\n"
|
||||
end
|
||||
path = 'vendor/assets/javascripts/bootstrap.js'
|
||||
path = 'assets/javascripts/bootstrap.js'
|
||||
save_file(path, content)
|
||||
log_processed path
|
||||
end
|
||||
|
|
|
@ -5,7 +5,7 @@ stylesheet 'styles.sass'
|
|||
|
||||
# SCSS:
|
||||
|
||||
assets = '../../vendor/assets'
|
||||
assets = '../../assets'
|
||||
|
||||
bs_stylesheets = "#{assets}/stylesheets/bootstrap"
|
||||
stylesheet '_bootstrap-variables.sass.erb', :to => '_bootstrap-variables.sass', :erb => true,
|
||||
|
|
|
@ -3,7 +3,7 @@ require 'fileutils'
|
|||
|
||||
class CompilationTest < Test::Unit::TestCase
|
||||
def test_compilation
|
||||
path = 'vendor/assets/stylesheets'
|
||||
path = 'assets/stylesheets'
|
||||
%w(bootstrap bootstrap/_theme).each do |file|
|
||||
engine = Sass::Engine.for_file("#{path}/#{file}.scss", syntax: :scss, load_paths: [path])
|
||||
assert_nothing_raised do
|
||||
|
|
|
@ -39,10 +39,10 @@ var environment = new Mincer.Environment(process.cwd());
|
|||
|
||||
// Include bootstrap scss load path
|
||||
var bootstrapPath = '../../';
|
||||
environment.appendPath(bootstrapPath + 'vendor/assets/stylesheets');
|
||||
environment.appendPath(bootstrapPath + 'assets/stylesheets');
|
||||
|
||||
// Include fonts load path
|
||||
environment.appendPath(bootstrapPath + 'vendor/assets/fonts');
|
||||
environment.appendPath(bootstrapPath + 'assets/fonts');
|
||||
|
||||
// Include dir with assets, root just for test
|
||||
environment.appendPath('./');
|
||||
|
|
|
@ -1 +1,2 @@
|
|||
@import "bootstrap"
|
||||
@import 'bootstrap-sprockets'
|
||||
@import 'bootstrap'
|
||||
|
|
|
@ -3,7 +3,7 @@ require 'fileutils'
|
|||
|
||||
class NodeSassTest < Test::Unit::TestCase
|
||||
def test_node_sass_compilation
|
||||
path = 'vendor/assets/stylesheets'
|
||||
path = 'assets/stylesheets'
|
||||
%w(bootstrap bootstrap/_theme).each do |file|
|
||||
FileUtils.mkdir_p "tmp/node-sass"
|
||||
command = "node-sass #{path}/#{file} -o tmp/node-sass/#{File.basename file}.css"
|
||||
|
|
|
@ -6,7 +6,6 @@ require File.expand_path('dummy_rails/config/environment', File.dirname(__FILE__
|
|||
require 'test/unit'
|
||||
|
||||
require 'sass'
|
||||
require 'lib/bootstrap-sass/sass_functions'
|
||||
|
||||
require 'rails/test_help'
|
||||
|
||||
|
|
Загрузка…
Ссылка в новой задаче