converter: cache files, understand in-file mixin definitinos
This commit is contained in:
Gleb Mazovetskiy
Родитель
07f9d01b55
Коммит
089174049c
|
|
@ -10,3 +10,4 @@ Gemfile.lock
|
|||
/.bundle
|
||||
/vendor/cache
|
||||
/vendor/bundle
|
||||
tmp/
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
module Bootstrap
|
||||
VERSION = '3.0.0.0'
|
||||
BOOTSTRAP_SHA = 'fee3f1e733e80bd128736e1b9b403f49b701a6a9'
|
||||
BOOTSTRAP_SHA = '518488cb4069b4181435873380d0738e8b63bc81'
|
||||
end
|
||||
|
|
|
|||
|
|
@ -46,11 +46,24 @@ class Converter
|
|||
store_version
|
||||
end
|
||||
|
||||
NESTED_MIXINS = {'#gradient' => 'gradient'}
|
||||
VARARG_MIXINS = %w(transition transition-transform box-shadow)
|
||||
def process_stylesheet_assets
|
||||
log_status "Processing stylesheets..."
|
||||
files = read_files('less', bootstrap_less_files)
|
||||
@mixins = get_mixin_names files['mixins.less']
|
||||
|
||||
# read common mixin definitions from mixins.less
|
||||
mixins_file = files['mixins.less']
|
||||
@mixins = get_mixin_names(mixins_file)
|
||||
NESTED_MIXINS.each do |selector, prefix|
|
||||
replace_rules(mixins_file, selector) { |rule|
|
||||
@mixins += get_mixin_names(unwrap_rule_block rule).map { |name| "#{prefix}-#{name}" }
|
||||
rule
|
||||
}
|
||||
end
|
||||
puts "*** MIXINS #{@mixins}"
|
||||
|
||||
# convert each file
|
||||
files.each do |name, file|
|
||||
log_processing name
|
||||
case name
|
||||
|
|
@ -61,7 +74,9 @@ class Converter
|
|||
file = replace_escaping(file)
|
||||
file = replace_mixin_definitions(file)
|
||||
file = replace_mixins(file)
|
||||
file = flatten_mixins(file, '#gradient', 'gradient')
|
||||
NESTED_MIXINS.each do |selector, prefix|
|
||||
file = flatten_mixins(file, selector, prefix)
|
||||
end
|
||||
file = varargify_mixin_definitions(file, *VARARG_MIXINS)
|
||||
file = deinterpolate_vararg_mixins(file)
|
||||
file = parameterize_mixin_parent_selector file, 'responsive-(in)?visibility'
|
||||
|
|
@ -214,7 +229,7 @@ class Converter
|
|||
|
||||
def get_mixin_names(file)
|
||||
mixins = []
|
||||
file.scan(/\.([\w-]+)\(.*\)\s?{?/) do |mixin|
|
||||
get_css_selectors(file).join("\n" * 2).scan(/\.([\w-]+)\(.*\)\s?\{?/) do |mixin|
|
||||
mixins << mixin.first
|
||||
end
|
||||
mixins
|
||||
|
|
@ -246,7 +261,9 @@ class Converter
|
|||
|
||||
def replace_all(file, regex, replacement = nil, &block)
|
||||
log_transform regex, replacement
|
||||
file.gsub(regex, replacement, &block)
|
||||
new_file = file.gsub(regex, replacement, &block)
|
||||
raise "replace_all #{regex}, #{replacement} NO MATCH" if file == new_file
|
||||
new_file
|
||||
end
|
||||
|
||||
# @mixin a() { tr& { color:white } }
|
||||
|
|
@ -318,8 +335,9 @@ class Converter
|
|||
# Replaces the following:
|
||||
# .mixin() -> @include mixin()
|
||||
# #scope > .mixin() -> @include scope-mixin()
|
||||
def replace_mixins(less)
|
||||
def replace_mixins(less, mixins = @mixins + get_mixin_names(less))
|
||||
mixin_pattern = /(\s+)(([#|\.][\w-]+\s*>\s*)*)\.([\w-]+\(.*\))/
|
||||
|
||||
less.gsub(mixin_pattern) do |match|
|
||||
matches = match.scan(mixin_pattern).flatten
|
||||
scope = matches[1] || ''
|
||||
|
|
@ -327,8 +345,7 @@ class Converter
|
|||
scope = scope.scan(/[\w-]+/).join('-') + '-'
|
||||
end
|
||||
mixin_name = match.scan(/\.([\w-]+)\(.*\)\s?\{?/).first
|
||||
|
||||
if mixin_name && @mixins.include?(mixin_name.first)
|
||||
if mixin_name && mixins.include?("#{scope}#{mixin_name.first}")
|
||||
"#{matches.first}@include #{scope}#{matches.last}".gsub(/; \$/, ", $")
|
||||
else
|
||||
"#{matches.first}@extend .#{scope}#{matches.last.gsub(/\(\)/, '')}"
|
||||
|
|
@ -473,12 +490,27 @@ class Converter
|
|||
end
|
||||
|
||||
while (rule_start = scan_next(s, rule_start_re))
|
||||
rule_pos = (s.pos - rule_start.length..close_brace_pos(less, s.pos - 1))
|
||||
pos = byte_to_str_pos less, s.pos
|
||||
rule_pos = (pos - rule_start.length..close_brace_pos(less, pos - 1))
|
||||
less[rule_pos] = yield(less[rule_pos], rule_pos)
|
||||
end
|
||||
less
|
||||
end
|
||||
|
||||
# Get a list of all top-level selectors with bodies {}
|
||||
def get_css_selectors(css)
|
||||
s = StringScanner.new(css)
|
||||
selectors = []
|
||||
while (brace = scan_next(s, RULE_OPEN_BRACE_RE))
|
||||
pos = byte_to_str_pos(css, s.pos)
|
||||
def_pos = css_def_pos(css, pos, -1)
|
||||
sel = css[def_pos.begin..pos - 1]
|
||||
selectors << sel.dup.strip
|
||||
s.pos = str_to_byte_pos(css, close_brace_pos(css, pos - 1) + 1)
|
||||
end
|
||||
selectors
|
||||
end
|
||||
|
||||
# replace in the top-level selector
|
||||
# replace_in_selector('a {a: {a: a} } a {}', /a/, 'b') => 'b {a: {a: a} } b {}'
|
||||
def replace_in_selector(css, pattern, sub)
|
||||
|
|
@ -486,10 +518,11 @@ class Converter
|
|||
s = StringScanner.new(css)
|
||||
prev_pos = 0
|
||||
sel_pos = []
|
||||
while (brace = scan_next(s, /#{RULE_OPEN_BRACE_RE}/))
|
||||
sel_pos << (prev_pos .. s.pos - 1)
|
||||
s.pos = close_brace_pos(css, s.pos - 1) + 1
|
||||
prev_pos = s.pos
|
||||
while (brace = scan_next(s, RULE_OPEN_BRACE_RE))
|
||||
pos = byte_to_str_pos css, s.pos
|
||||
sel_pos << (prev_pos .. pos - 1)
|
||||
s.pos = str_to_byte_pos(s.string, close_brace_pos(css, s.pos - 1) + 1)
|
||||
prev_pos = pos
|
||||
end
|
||||
replace_substrings_at(css, sel_pos) { |s| s.gsub(pattern, sub) }
|
||||
end
|
||||
|
|
@ -498,10 +531,10 @@ class Converter
|
|||
sel_chars = '\[\]$\w\-{}#,.:&>@'
|
||||
SELECTOR_RE = /[#{sel_chars}]+[#{sel_chars}\s]*/
|
||||
COMMENT_RE = %r((?:^[ \t]*//[^\n]*\n))
|
||||
RULE_OPEN_BRACE_RE = /(?<!#)\{/
|
||||
RULE_OPEN_BRACE_RE_REVERSE = /\{(?!#)/
|
||||
RULE_CLOSE_BRACE_RE = /(?<!\w)\}/
|
||||
RULE_CLOSE_BRACE_RE_REVERSE = /\}(?!\w)/
|
||||
RULE_OPEN_BRACE_RE = /(?<![@#\$])\{/
|
||||
RULE_OPEN_BRACE_RE_REVERSE = /\{(?![@#\$])/
|
||||
RULE_CLOSE_BRACE_RE = /(?<!\w)\}(?![.'"])/
|
||||
RULE_CLOSE_BRACE_RE_REVERSE = /(?<![.'"])\}(?!\w)/
|
||||
BRACE_RE = /#{RULE_OPEN_BRACE_RE}|#{RULE_CLOSE_BRACE_RE}/m
|
||||
BRACE_RE_REVERSE = /#{RULE_OPEN_BRACE_RE_REVERSE}|#{RULE_CLOSE_BRACE_RE_REVERSE}/m
|
||||
SCSS_MIXIN_DEF_ARGS_RE = /[\w\-,\s$:]*/
|
||||
|
|
@ -515,12 +548,13 @@ class Converter
|
|||
depth = 0
|
||||
pos = []
|
||||
while (b = scan_next(s, /#{SELECTOR_RE}#{RULE_OPEN_BRACE_RE}|#{RULE_CLOSE_BRACE_RE}/m))
|
||||
s_pos = byte_to_str_pos(s.string, s.pos)
|
||||
depth += (b == '}' ? -1 : +1)
|
||||
if depth == 1
|
||||
if b == '}'
|
||||
prev_pos = s.pos
|
||||
prev_pos = s_pos
|
||||
else
|
||||
pos << (prev_pos .. s.pos - b.length - 1)
|
||||
pos << (prev_pos .. s_pos - b.length - 1)
|
||||
end
|
||||
end
|
||||
end
|
||||
|
|
@ -530,7 +564,7 @@ class Converter
|
|||
|
||||
# immediate selector of css at pos
|
||||
def selector_for_pos(css, pos, depth = -1)
|
||||
css[css_def_pos(css, pos, depth)].strip
|
||||
css[css_def_pos(css, pos, depth)].dup.strip
|
||||
end
|
||||
|
||||
# get the pos of css def at pos (search backwards)
|
||||
|
|
@ -549,7 +583,7 @@ class Converter
|
|||
break if depth.zero?
|
||||
end
|
||||
raise "match not found for {" unless depth.zero?
|
||||
from + s.pos - 1
|
||||
from + byte_to_str_pos(s.string, s.pos) - 1
|
||||
end
|
||||
|
||||
# opening brace position from +from+ (search backwards)
|
||||
|
|
@ -560,14 +594,21 @@ class Converter
|
|||
break if depth.zero?
|
||||
end
|
||||
raise "matching { brace not found" unless depth.zero?
|
||||
from - s.pos + 1
|
||||
from - byte_to_str_pos(s.string, s.pos) + 1
|
||||
end
|
||||
|
||||
# advance scanner to pos after the next match of pattern and return the match
|
||||
def scan_next(scanner, pattern)
|
||||
return unless scanner.skip_until(pattern)
|
||||
scanner.pos -= scanner.matched_size
|
||||
scanner.scan pattern
|
||||
return unless scanner.scan_until(pattern)
|
||||
scanner.matched
|
||||
end
|
||||
|
||||
def byte_to_str_pos(str, pos)
|
||||
str.byteslice(0, pos).length
|
||||
end
|
||||
|
||||
def str_to_byte_pos(str, pos)
|
||||
str.slice(0, pos).bytesize
|
||||
end
|
||||
|
||||
# insert substitutions into text at positions (Range or Fixnum)
|
||||
|
|
@ -620,7 +661,12 @@ class Converter
|
|||
end
|
||||
|
||||
def log_downloading(files, from, cached = false)
|
||||
puts dark cyan " #{' CACHED ' if cached}GET #{files.length} files from #{from} #{files * ' '}..."
|
||||
s = " #{' CACHED ' if cached}GET #{files.length} files from #{from} #{files * ' '}..."
|
||||
if cached
|
||||
puts dark green s
|
||||
else
|
||||
puts dark cyan s
|
||||
end
|
||||
end
|
||||
|
||||
def log_processing(name)
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ require 'test_helper'
|
|||
class CompilationTest < Test::Unit::TestCase
|
||||
def test_compilation
|
||||
path = 'vendor/assets/stylesheets'
|
||||
%w(bootstrap).each do |file|
|
||||
%w(bootstrap bootstrap/_theme).each do |file|
|
||||
engine = Sass::Engine.for_file("#{path}/#{file}.scss", syntax: :scss, load_paths: [path])
|
||||
assert_nothing_raised do
|
||||
engine.render
|
||||
|
|
|
|||
|
|
@ -40,7 +40,7 @@
|
|||
clearMenus()
|
||||
|
||||
if (!isActive) {
|
||||
if ('ontouchstart' in document.documentElement) {
|
||||
if ('ontouchstart' in document.documentElement && !$parent.closest('.navbar-nav').length) {
|
||||
// if mobile we we use a backdrop because click events don't delegate
|
||||
$('<div class="dropdown-backdrop"/>').insertAfter($(this)).on('click', clearMenus)
|
||||
}
|
||||
|
|
@ -52,9 +52,9 @@
|
|||
$parent
|
||||
.toggleClass('open')
|
||||
.trigger('shown.bs.dropdown')
|
||||
}
|
||||
|
||||
$this.focus()
|
||||
$this.focus()
|
||||
}
|
||||
|
||||
return false
|
||||
}
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@
|
|||
|
||||
var Modal = function (element, options) {
|
||||
this.options = options
|
||||
this.$element = $(element).on('click.dismiss.modal', '[data-dismiss="modal"]', $.proxy(this.hide, this))
|
||||
this.$element = $(element)
|
||||
this.$backdrop =
|
||||
this.isShown = null
|
||||
|
||||
|
|
@ -54,6 +54,8 @@
|
|||
|
||||
this.escape()
|
||||
|
||||
this.$element.on('click.dismiss.modal', '[data-dismiss="modal"]', $.proxy(this.hide, this))
|
||||
|
||||
this.backdrop(function () {
|
||||
var transition = $.support.transition && that.$element.hasClass('fade')
|
||||
|
||||
|
|
@ -76,7 +78,7 @@
|
|||
var e = $.Event('shown.bs.modal', { relatedTarget: _relatedTarget })
|
||||
|
||||
transition ?
|
||||
that.$element
|
||||
that.$element.find('.modal-dialog') // wait for modal to slide in
|
||||
.one($.support.transition.end, function () {
|
||||
that.$element.focus().trigger(e)
|
||||
})
|
||||
|
|
@ -238,7 +240,7 @@
|
|||
})
|
||||
|
||||
$(document)
|
||||
.on('shown.bs.modal', '.modal', function () { $(document.body).addClass('modal-open') })
|
||||
.on('show.bs.modal', '.modal', function () { $(document.body).addClass('modal-open') })
|
||||
.on('hidden.bs.modal', '.modal', function () { $(document.body).removeClass('modal-open') })
|
||||
|
||||
}(window.jQuery);
|
||||
|
|
|
|||
|
|
@ -108,10 +108,11 @@
|
|||
|
||||
clearTimeout(self.timeout)
|
||||
|
||||
self.hoverState = 'in'
|
||||
|
||||
if (!self.options.delay || !self.options.delay.show) return self.show()
|
||||
|
||||
self.hoverState = 'in'
|
||||
self.timeout = setTimeout(function () {
|
||||
self.timeout = setTimeout(function () {
|
||||
if (self.hoverState == 'in') self.show()
|
||||
}, self.options.delay.show)
|
||||
}
|
||||
|
|
@ -122,10 +123,11 @@
|
|||
|
||||
clearTimeout(self.timeout)
|
||||
|
||||
self.hoverState = 'out'
|
||||
|
||||
if (!self.options.delay || !self.options.delay.hide) return self.hide()
|
||||
|
||||
self.hoverState = 'out'
|
||||
self.timeout = setTimeout(function () {
|
||||
self.timeout = setTimeout(function () {
|
||||
if (self.hoverState == 'out') self.hide()
|
||||
}, self.options.delay.hide)
|
||||
}
|
||||
|
|
@ -258,7 +260,9 @@
|
|||
var $tip = this.tip()
|
||||
var e = $.Event('hide.bs.' + this.type)
|
||||
|
||||
function complete() { $tip.detach() }
|
||||
function complete() {
|
||||
if (that.hoverState != 'in') $tip.detach()
|
||||
}
|
||||
|
||||
this.$element.trigger(e)
|
||||
|
||||
|
|
|
|||
|
|
@ -42,7 +42,7 @@
|
|||
|
||||
// http://blog.alexmaccaw.com/css-transitions
|
||||
$.fn.emulateTransitionEnd = function (duration) {
|
||||
var called = false, $el = this
|
||||
var called = false, $el = this
|
||||
$(this).one($.support.transition.end, function () { called = true })
|
||||
var callback = function () { if (!called) $($el).trigger($.support.transition.end) }
|
||||
setTimeout(callback, duration)
|
||||
|
|
|
|||
|
|
@ -18,16 +18,18 @@
|
|||
border-top-color: #fff;
|
||||
}
|
||||
}
|
||||
.dropup .caret {
|
||||
.btn-default & {
|
||||
.dropup {
|
||||
& .btn-default .caret {
|
||||
border-bottom-color: $btn-default-color;
|
||||
}
|
||||
.btn-primary &,
|
||||
.btn-success &,
|
||||
.btn-warning &,
|
||||
.btn-danger &,
|
||||
.btn-info & {
|
||||
border-bottom-color: #fff;
|
||||
& .btn-primary,
|
||||
& .btn-success,
|
||||
& .btn-warning,
|
||||
& .btn-danger,
|
||||
& .btn-info {
|
||||
.caret {
|
||||
border-bottom-color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -157,11 +159,12 @@
|
|||
}
|
||||
// Carets in other button sizes
|
||||
.btn-lg .caret {
|
||||
border-width: $caret-width-large;
|
||||
border-width: $caret-width-large $caret-width-large 0;
|
||||
border-bottom-width: 0;
|
||||
}
|
||||
// Upside down carets for .dropup
|
||||
.dropup .btn-lg .caret {
|
||||
border-bottom-width: $caret-width-large;
|
||||
border-width: 0 $caret-width-large $caret-width-large;
|
||||
}
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -35,6 +35,7 @@
|
|||
&:active,
|
||||
&.active {
|
||||
outline: 0;
|
||||
background-image: none;
|
||||
@include box-shadow(inset 0 3px 5px rgba(0,0,0,.125));
|
||||
}
|
||||
|
||||
|
|
@ -130,7 +131,7 @@
|
|||
@include button-size($padding-small-vertical, $padding-small-horizontal, $font-size-small, $line-height-small, $border-radius-small);
|
||||
}
|
||||
.btn-xs {
|
||||
padding: 3px 5px;
|
||||
padding: 1px 5px;
|
||||
}
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -13,6 +13,9 @@
|
|||
border-top: $caret-width-base solid $dropdown-caret-color;
|
||||
border-right: $caret-width-base solid transparent;
|
||||
border-left: $caret-width-base solid transparent;
|
||||
// Firefox fix for https://github.com/twbs/bootstrap/issues/9538. Once fixed,
|
||||
// we can just straight up remove this.
|
||||
border-bottom: 0 dotted;
|
||||
content: "";
|
||||
}
|
||||
|
||||
|
|
@ -161,7 +164,9 @@
|
|||
.navbar-fixed-bottom .dropdown {
|
||||
// Reverse the caret
|
||||
.caret {
|
||||
border-top: 0;
|
||||
// Firefox fix for https://github.com/twbs/bootstrap/issues/9538. Once this
|
||||
// gets fixed, restore `border-top: 0;`.
|
||||
border-top: 0 dotted;
|
||||
border-bottom: 4px solid $dropdown-caret-color;
|
||||
content: "";
|
||||
}
|
||||
|
|
|
|||
|
|
@ -133,9 +133,9 @@ input[type="number"] {
|
|||
@include form-control-focus();
|
||||
|
||||
// Disabled and read-only inputs
|
||||
// Note: HTML5 says that controls under a fieldset > legend:first-child won't be
|
||||
// disabled if the fieldset is disabled. Due to implementation difficulty,
|
||||
// we don't honor that edge case; we style them as disabled anyway.
|
||||
// Note: HTML5 says that controls under a fieldset > legend:first-child won't
|
||||
// be disabled if the fieldset is disabled. Due to implementation difficulty,
|
||||
// we don't honor that edge case; we style them as disabled anyway.
|
||||
&[disabled],
|
||||
&[readonly],
|
||||
fieldset[disabled] & {
|
||||
|
|
@ -210,10 +210,10 @@ textarea.form-control {
|
|||
}
|
||||
|
||||
// Apply same disabled cursor tweak as for inputs
|
||||
// Note: HTML5 says that controls under a fieldset > legend:first-child won't be
|
||||
// disabled if the fieldset is disabled. Due to implementation difficulty,
|
||||
// we don't honor that edge case; we style them as disabled anyway.
|
||||
//
|
||||
// Note: Neither radios nor checkboxes can be readonly.
|
||||
input[type="radio"],
|
||||
input[type="checkbox"],
|
||||
.radio,
|
||||
.radio-inline,
|
||||
.checkbox,
|
||||
|
|
|
|||
|
|
@ -0,0 +1,233 @@
|
|||
//
|
||||
// Glyphicons for Bootstrap
|
||||
//
|
||||
// Since icons are fonts, they can be placed anywhere text is placed and are
|
||||
// thus automatically sized to match the surrounding child. To use, create an
|
||||
// inline element with the appropriate classes, like so:
|
||||
//
|
||||
// <a href="#"><span class="glyphicon glyphicon-star"></span> Star</a>
|
||||
|
||||
// Import the fonts
|
||||
@font-face {
|
||||
font-family: 'Glyphicons Halflings';
|
||||
src: url('$icon-font-path$icon-font-name.eot');
|
||||
src: url('$icon-font-path$icon-font-name.eot?#iefix') format('embedded-opentype'),
|
||||
url('$icon-font-path$icon-font-name.woff') format('woff'),
|
||||
url('$icon-font-path$icon-font-name.ttf') format('truetype'),
|
||||
url('$icon-font-path$icon-font-name.svg#glyphicons-halflingsregular') format('svg');
|
||||
}
|
||||
|
||||
// Catchall baseclass
|
||||
.glyphicon {
|
||||
position: relative;
|
||||
top: 2px;
|
||||
display: inline-block;
|
||||
font-family: 'Glyphicons Halflings';
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
line-height: 1;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
|
||||
// Individual icons
|
||||
.glyphicon-glass { &:before { content: "\e001"; } }
|
||||
.glyphicon-music { &:before { content: "\e002"; } }
|
||||
.glyphicon-search { &:before { content: "\e003"; } }
|
||||
.glyphicon-envelope { &:before { content: "\2709"; } }
|
||||
.glyphicon-heart { &:before { content: "\e005"; } }
|
||||
.glyphicon-star { &:before { content: "\e006"; } }
|
||||
.glyphicon-star-empty { &:before { content: "\e007"; } }
|
||||
.glyphicon-user { &:before { content: "\e008"; } }
|
||||
.glyphicon-film { &:before { content: "\e009"; } }
|
||||
.glyphicon-th-large { &:before { content: "\e010"; } }
|
||||
.glyphicon-th { &:before { content: "\e011"; } }
|
||||
.glyphicon-th-list { &:before { content: "\e012"; } }
|
||||
.glyphicon-ok { &:before { content: "\e013"; } }
|
||||
.glyphicon-remove { &:before { content: "\e014"; } }
|
||||
.glyphicon-zoom-in { &:before { content: "\e015"; } }
|
||||
.glyphicon-zoom-out { &:before { content: "\e016"; } }
|
||||
.glyphicon-off { &:before { content: "\e017"; } }
|
||||
.glyphicon-signal { &:before { content: "\e018"; } }
|
||||
.glyphicon-cog { &:before { content: "\e019"; } }
|
||||
.glyphicon-trash { &:before { content: "\e020"; } }
|
||||
.glyphicon-home { &:before { content: "\e021"; } }
|
||||
.glyphicon-file { &:before { content: "\e022"; } }
|
||||
.glyphicon-time { &:before { content: "\e023"; } }
|
||||
.glyphicon-road { &:before { content: "\e024"; } }
|
||||
.glyphicon-download-alt { &:before { content: "\e025"; } }
|
||||
.glyphicon-download { &:before { content: "\e026"; } }
|
||||
.glyphicon-upload { &:before { content: "\e027"; } }
|
||||
.glyphicon-inbox { &:before { content: "\e028"; } }
|
||||
.glyphicon-play-circle { &:before { content: "\e029"; } }
|
||||
.glyphicon-repeat { &:before { content: "\e030"; } }
|
||||
.glyphicon-refresh { &:before { content: "\e031"; } }
|
||||
.glyphicon-list-alt { &:before { content: "\e032"; } }
|
||||
.glyphicon-lock { &:before { content: "\e033"; } }
|
||||
.glyphicon-flag { &:before { content: "\e034"; } }
|
||||
.glyphicon-headphones { &:before { content: "\e035"; } }
|
||||
.glyphicon-volume-off { &:before { content: "\e036"; } }
|
||||
.glyphicon-volume-down { &:before { content: "\e037"; } }
|
||||
.glyphicon-volume-up { &:before { content: "\e038"; } }
|
||||
.glyphicon-qrcode { &:before { content: "\e039"; } }
|
||||
.glyphicon-barcode { &:before { content: "\e040"; } }
|
||||
.glyphicon-tag { &:before { content: "\e041"; } }
|
||||
.glyphicon-tags { &:before { content: "\e042"; } }
|
||||
.glyphicon-book { &:before { content: "\e043"; } }
|
||||
.glyphicon-bookmark { &:before { content: "\e044"; } }
|
||||
.glyphicon-print { &:before { content: "\e045"; } }
|
||||
.glyphicon-camera { &:before { content: "\e046"; } }
|
||||
.glyphicon-font { &:before { content: "\e047"; } }
|
||||
.glyphicon-bold { &:before { content: "\e048"; } }
|
||||
.glyphicon-italic { &:before { content: "\e049"; } }
|
||||
.glyphicon-text-height { &:before { content: "\e050"; } }
|
||||
.glyphicon-text-width { &:before { content: "\e051"; } }
|
||||
.glyphicon-align-left { &:before { content: "\e052"; } }
|
||||
.glyphicon-align-center { &:before { content: "\e053"; } }
|
||||
.glyphicon-align-right { &:before { content: "\e054"; } }
|
||||
.glyphicon-align-justify { &:before { content: "\e055"; } }
|
||||
.glyphicon-list { &:before { content: "\e056"; } }
|
||||
.glyphicon-indent-left { &:before { content: "\e057"; } }
|
||||
.glyphicon-indent-right { &:before { content: "\e058"; } }
|
||||
.glyphicon-facetime-video { &:before { content: "\e059"; } }
|
||||
.glyphicon-picture { &:before { content: "\e060"; } }
|
||||
.glyphicon-pencil { &:before { content: "\270f"; } }
|
||||
.glyphicon-map-marker { &:before { content: "\e062"; } }
|
||||
.glyphicon-adjust { &:before { content: "\e063"; } }
|
||||
.glyphicon-tint { &:before { content: "\e064"; } }
|
||||
.glyphicon-edit { &:before { content: "\e065"; } }
|
||||
.glyphicon-share { &:before { content: "\e066"; } }
|
||||
.glyphicon-check { &:before { content: "\e067"; } }
|
||||
.glyphicon-move { &:before { content: "\e068"; } }
|
||||
.glyphicon-step-backward { &:before { content: "\e069"; } }
|
||||
.glyphicon-fast-backward { &:before { content: "\e070"; } }
|
||||
.glyphicon-backward { &:before { content: "\e071"; } }
|
||||
.glyphicon-play { &:before { content: "\e072"; } }
|
||||
.glyphicon-pause { &:before { content: "\e073"; } }
|
||||
.glyphicon-stop { &:before { content: "\e074"; } }
|
||||
.glyphicon-forward { &:before { content: "\e075"; } }
|
||||
.glyphicon-fast-forward { &:before { content: "\e076"; } }
|
||||
.glyphicon-step-forward { &:before { content: "\e077"; } }
|
||||
.glyphicon-eject { &:before { content: "\e078"; } }
|
||||
.glyphicon-chevron-left { &:before { content: "\e079"; } }
|
||||
.glyphicon-chevron-right { &:before { content: "\e080"; } }
|
||||
.glyphicon-plus-sign { &:before { content: "\e081"; } }
|
||||
.glyphicon-minus-sign { &:before { content: "\e082"; } }
|
||||
.glyphicon-remove-sign { &:before { content: "\e083"; } }
|
||||
.glyphicon-ok-sign { &:before { content: "\e084"; } }
|
||||
.glyphicon-question-sign { &:before { content: "\e085"; } }
|
||||
.glyphicon-info-sign { &:before { content: "\e086"; } }
|
||||
.glyphicon-screenshot { &:before { content: "\e087"; } }
|
||||
.glyphicon-remove-circle { &:before { content: "\e088"; } }
|
||||
.glyphicon-ok-circle { &:before { content: "\e089"; } }
|
||||
.glyphicon-ban-circle { &:before { content: "\e090"; } }
|
||||
.glyphicon-arrow-left { &:before { content: "\e091"; } }
|
||||
.glyphicon-arrow-right { &:before { content: "\e092"; } }
|
||||
.glyphicon-arrow-up { &:before { content: "\e093"; } }
|
||||
.glyphicon-arrow-down { &:before { content: "\e094"; } }
|
||||
.glyphicon-share-alt { &:before { content: "\e095"; } }
|
||||
.glyphicon-resize-full { &:before { content: "\e096"; } }
|
||||
.glyphicon-resize-small { &:before { content: "\e097"; } }
|
||||
.glyphicon-plus { &:before { content: "\002b"; } }
|
||||
.glyphicon-minus { &:before { content: "\2212"; } }
|
||||
.glyphicon-asterisk { &:before { content: "\002a"; } }
|
||||
.glyphicon-exclamation-sign { &:before { content: "\e101"; } }
|
||||
.glyphicon-gift { &:before { content: "\e102"; } }
|
||||
.glyphicon-leaf { &:before { content: "\e103"; } }
|
||||
.glyphicon-fire { &:before { content: "\e104"; } }
|
||||
.glyphicon-eye-open { &:before { content: "\e105"; } }
|
||||
.glyphicon-eye-close { &:before { content: "\e106"; } }
|
||||
.glyphicon-warning-sign { &:before { content: "\e107"; } }
|
||||
.glyphicon-plane { &:before { content: "\e108"; } }
|
||||
.glyphicon-calendar { &:before { content: "\e109"; } }
|
||||
.glyphicon-random { &:before { content: "\e110"; } }
|
||||
.glyphicon-comment { &:before { content: "\e111"; } }
|
||||
.glyphicon-magnet { &:before { content: "\e112"; } }
|
||||
.glyphicon-chevron-up { &:before { content: "\e113"; } }
|
||||
.glyphicon-chevron-down { &:before { content: "\e114"; } }
|
||||
.glyphicon-retweet { &:before { content: "\e115"; } }
|
||||
.glyphicon-shopping-cart { &:before { content: "\e116"; } }
|
||||
.glyphicon-folder-close { &:before { content: "\e117"; } }
|
||||
.glyphicon-folder-open { &:before { content: "\e118"; } }
|
||||
.glyphicon-resize-vertical { &:before { content: "\e119"; } }
|
||||
.glyphicon-resize-horizontal { &:before { content: "\e120"; } }
|
||||
.glyphicon-hdd { &:before { content: "\e121"; } }
|
||||
.glyphicon-bullhorn { &:before { content: "\e122"; } }
|
||||
.glyphicon-bell { &:before { content: "\e123"; } }
|
||||
.glyphicon-certificate { &:before { content: "\e124"; } }
|
||||
.glyphicon-thumbs-up { &:before { content: "\e125"; } }
|
||||
.glyphicon-thumbs-down { &:before { content: "\e126"; } }
|
||||
.glyphicon-hand-right { &:before { content: "\e127"; } }
|
||||
.glyphicon-hand-left { &:before { content: "\e128"; } }
|
||||
.glyphicon-hand-up { &:before { content: "\e129"; } }
|
||||
.glyphicon-hand-down { &:before { content: "\e130"; } }
|
||||
.glyphicon-circle-arrow-right { &:before { content: "\e131"; } }
|
||||
.glyphicon-circle-arrow-left { &:before { content: "\e132"; } }
|
||||
.glyphicon-circle-arrow-up { &:before { content: "\e133"; } }
|
||||
.glyphicon-circle-arrow-down { &:before { content: "\e134"; } }
|
||||
.glyphicon-globe { &:before { content: "\e135"; } }
|
||||
.glyphicon-wrench { &:before { content: "\e136"; } }
|
||||
.glyphicon-tasks { &:before { content: "\e137"; } }
|
||||
.glyphicon-filter { &:before { content: "\e138"; } }
|
||||
.glyphicon-briefcase { &:before { content: "\e139"; } }
|
||||
.glyphicon-fullscreen { &:before { content: "\e140"; } }
|
||||
.glyphicon-dashboard { &:before { content: "\e141"; } }
|
||||
.glyphicon-paperclip { &:before { content: "\e142"; } }
|
||||
.glyphicon-heart-empty { &:before { content: "\e143"; } }
|
||||
.glyphicon-link { &:before { content: "\e144"; } }
|
||||
.glyphicon-phone { &:before { content: "\e145"; } }
|
||||
.glyphicon-pushpin { &:before { content: "\e146"; } }
|
||||
.glyphicon-euro { &:before { content: "\20ac"; } }
|
||||
.glyphicon-usd { &:before { content: "\e148"; } }
|
||||
.glyphicon-gbp { &:before { content: "\e149"; } }
|
||||
.glyphicon-sort { &:before { content: "\e150"; } }
|
||||
.glyphicon-sort-by-alphabet { &:before { content: "\e151"; } }
|
||||
.glyphicon-sort-by-alphabet-alt { &:before { content: "\e152"; } }
|
||||
.glyphicon-sort-by-order { &:before { content: "\e153"; } }
|
||||
.glyphicon-sort-by-order-alt { &:before { content: "\e154"; } }
|
||||
.glyphicon-sort-by-attributes { &:before { content: "\e155"; } }
|
||||
.glyphicon-sort-by-attributes-alt { &:before { content: "\e156"; } }
|
||||
.glyphicon-unchecked { &:before { content: "\e157"; } }
|
||||
.glyphicon-expand { &:before { content: "\e158"; } }
|
||||
.glyphicon-collapse { &:before { content: "\e159"; } }
|
||||
.glyphicon-collapse-top { &:before { content: "\e160"; } }
|
||||
|
||||
.glyphicon-log-in { &:before{ content: "\e161"; } }
|
||||
.glyphicon-flash { &:before{ content: "\e162"; } }
|
||||
.glyphicon-log-out { &:before{ content: "\e163"; } }
|
||||
.glyphicon-new-window { &:before{ content: "\e164"; } }
|
||||
.glyphicon-record { &:before{ content: "\e165"; } }
|
||||
.glyphicon-save { &:before{ content: "\e166"; } }
|
||||
.glyphicon-open { &:before{ content: "\e167"; } }
|
||||
.glyphicon-saved { &:before{ content: "\e168"; } }
|
||||
.glyphicon-import { &:before{ content: "\e169"; } }
|
||||
.glyphicon-export { &:before{ content: "\e170"; } }
|
||||
.glyphicon-send { &:before{ content: "\e171"; } }
|
||||
.glyphicon-floppy-disk { &:before{ content: "\e172"; } }
|
||||
.glyphicon-floppy-saved { &:before{ content: "\e173"; } }
|
||||
.glyphicon-floppy-remove { &:before{ content: "\e174"; } }
|
||||
.glyphicon-floppy-save { &:before{ content: "\e175"; } }
|
||||
.glyphicon-floppy-open { &:before{ content: "\e176"; } }
|
||||
.glyphicon-credit-card { &:before{ content: "\e177"; } }
|
||||
.glyphicon-transfer { &:before{ content: "\e178"; } }
|
||||
.glyphicon-cutlery { &:before{ content: "\e179"; } }
|
||||
.glyphicon-header { &:before{ content: "\e180"; } }
|
||||
.glyphicon-compressed { &:before{ content: "\e181"; } }
|
||||
.glyphicon-earphone { &:before{ content: "\e182"; } }
|
||||
.glyphicon-phone-alt { &:before{ content: "\e183"; } }
|
||||
.glyphicon-tower { &:before{ content: "\e184"; } }
|
||||
.glyphicon-stats { &:before{ content: "\e185"; } }
|
||||
.glyphicon-sd-video { &:before{ content: "\e186"; } }
|
||||
.glyphicon-hd-video { &:before{ content: "\e187"; } }
|
||||
.glyphicon-subtitles { &:before{ content: "\e188"; } }
|
||||
.glyphicon-sound-stereo { &:before{ content: "\e189"; } }
|
||||
.glyphicon-sound-dolby { &:before{ content: "\e190"; } }
|
||||
.glyphicon-sound-5-1 { &:before{ content: "\e191"; } }
|
||||
.glyphicon-sound-6-1 { &:before{ content: "\e192"; } }
|
||||
.glyphicon-sound-7-1 { &:before{ content: "\e193"; } }
|
||||
.glyphicon-copyright-mark { &:before{ content: "\e194"; } }
|
||||
.glyphicon-registration-mark { &:before{ content: "\e195"; } }
|
||||
.glyphicon-cloud { &:before{ content: "\2601"; } }
|
||||
.glyphicon-cloud-download { &:before{ content: "\e197"; } }
|
||||
.glyphicon-cloud-upload { &:before{ content: "\e198"; } }
|
||||
.glyphicon-tree-conifer { &:before{ content: "\e199"; } }
|
||||
.glyphicon-tree-deciduous { &:before{ content: "\e200"; } }
|
||||
|
|
@ -223,6 +223,7 @@
|
|||
.col-md-12 { width: 100%; }
|
||||
|
||||
// Push and pull columns for source order changes
|
||||
.col-md-push-0 { left: auto; }
|
||||
.col-md-push-1 { left: percentage((1 / $grid-columns)); }
|
||||
.col-md-push-2 { left: percentage((2 / $grid-columns)); }
|
||||
.col-md-push-3 { left: percentage((3 / $grid-columns)); }
|
||||
|
|
@ -235,6 +236,7 @@
|
|||
.col-md-push-10 { left: percentage((10/ $grid-columns)); }
|
||||
.col-md-push-11 { left: percentage((11/ $grid-columns)); }
|
||||
|
||||
.col-md-pull-0 { right: auto; }
|
||||
.col-md-pull-1 { right: percentage((1 / $grid-columns)); }
|
||||
.col-md-pull-2 { right: percentage((2 / $grid-columns)); }
|
||||
.col-md-pull-3 { right: percentage((3 / $grid-columns)); }
|
||||
|
|
@ -248,6 +250,7 @@
|
|||
.col-md-pull-11 { right: percentage((11/ $grid-columns)); }
|
||||
|
||||
// Offsets
|
||||
.col-md-offset-0 { margin-left: 0; }
|
||||
.col-md-offset-1 { margin-left: percentage((1 / $grid-columns)); }
|
||||
.col-md-offset-2 { margin-left: percentage((2 / $grid-columns)); }
|
||||
.col-md-offset-3 { margin-left: percentage((3 / $grid-columns)); }
|
||||
|
|
@ -269,9 +272,9 @@
|
|||
// Note that `.col-lg-12` doesn't get floated on purpose—there's no need since
|
||||
// it's full-width.
|
||||
|
||||
@media (min-width: $screen-large-desktop) {
|
||||
@media (min-width: $screen-lg-desktop) {
|
||||
.container {
|
||||
max-width: $container-large-desktop;
|
||||
max-width: $container-lg-desktop;
|
||||
}
|
||||
|
||||
.col-lg-1,
|
||||
|
|
@ -301,6 +304,7 @@
|
|||
.col-lg-12 { width: 100%; }
|
||||
|
||||
// Push and pull columns for source order changes
|
||||
.col-lg-push-0 { left: auto; }
|
||||
.col-lg-push-1 { left: percentage((1 / $grid-columns)); }
|
||||
.col-lg-push-2 { left: percentage((2 / $grid-columns)); }
|
||||
.col-lg-push-3 { left: percentage((3 / $grid-columns)); }
|
||||
|
|
@ -313,6 +317,7 @@
|
|||
.col-lg-push-10 { left: percentage((10/ $grid-columns)); }
|
||||
.col-lg-push-11 { left: percentage((11/ $grid-columns)); }
|
||||
|
||||
.col-lg-pull-0 { right: auto; }
|
||||
.col-lg-pull-1 { right: percentage((1 / $grid-columns)); }
|
||||
.col-lg-pull-2 { right: percentage((2 / $grid-columns)); }
|
||||
.col-lg-pull-3 { right: percentage((3 / $grid-columns)); }
|
||||
|
|
@ -326,6 +331,7 @@
|
|||
.col-lg-pull-11 { right: percentage((11/ $grid-columns)); }
|
||||
|
||||
// Offsets
|
||||
.col-lg-offset-0 { margin-left: 0; }
|
||||
.col-lg-offset-1 { margin-left: percentage((1 / $grid-columns)); }
|
||||
.col-lg-offset-2 { margin-left: percentage((2 / $grid-columns)); }
|
||||
.col-lg-offset-3 { margin-left: percentage((3 / $grid-columns)); }
|
||||
|
|
|
|||
|
|
@ -11,6 +11,7 @@
|
|||
line-height: ($line-height-base * 1.5);
|
||||
color: $jumbotron-lead-color;
|
||||
background-color: $jumbotron-bg;
|
||||
|
||||
h1 {
|
||||
line-height: 1;
|
||||
color: $jumbotron-heading-color;
|
||||
|
|
@ -19,9 +20,19 @@
|
|||
line-height: 1.4;
|
||||
}
|
||||
|
||||
.container & {
|
||||
border-radius: $border-radius-large; // Only round corners at higher resolutions if contained in a container
|
||||
}
|
||||
|
||||
@media screen and (min-width: $screen-tablet) {
|
||||
padding: 50px 60px;
|
||||
border-radius: $border-radius-large; // Only round corners at higher resolutions
|
||||
padding-top: 50px;
|
||||
padding-bottom: 50px;
|
||||
|
||||
.container & {
|
||||
padding-left: 60px;
|
||||
padding-right: 60px;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: ($font-size-base * 4.5);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -37,18 +37,22 @@
|
|||
@include label-variant($label-default-bg);
|
||||
}
|
||||
|
||||
.label-danger {
|
||||
@include label-variant($label-danger-bg);
|
||||
.label-primary {
|
||||
@include label-variant($label-primary-bg);
|
||||
}
|
||||
|
||||
.label-success {
|
||||
@include label-variant($label-success-bg);
|
||||
}
|
||||
|
||||
.label-info {
|
||||
@include label-variant($label-info-bg);
|
||||
}
|
||||
|
||||
.label-warning {
|
||||
@include label-variant($label-warning-bg);
|
||||
}
|
||||
|
||||
.label-info {
|
||||
@include label-variant($label-info-bg);
|
||||
.label-danger {
|
||||
@include label-variant($label-danger-bg);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -286,7 +286,7 @@
|
|||
|
||||
// Reset filters for IE
|
||||
//
|
||||
// When you need to remove a gradient background, don't forget to use this to reset
|
||||
// When you need to remove a gradient background, do not forget to use this to reset
|
||||
// the IE filter for IE9 and below.
|
||||
@mixin reset-filter() {
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
|
||||
|
|
@ -412,12 +412,17 @@
|
|||
&:hover,
|
||||
&:focus,
|
||||
&:active,
|
||||
&.active {
|
||||
&.active,
|
||||
.open .dropdown-toggle& {
|
||||
color: $color;
|
||||
background-color: darken($background, 8%);
|
||||
border-color: darken($border, 12%);
|
||||
}
|
||||
|
||||
&:active,
|
||||
&.active,
|
||||
.open .dropdown-toggle& {
|
||||
background-image: none;
|
||||
}
|
||||
&.disabled,
|
||||
&[disabled],
|
||||
fieldset[disabled] & {
|
||||
|
|
@ -521,43 +526,28 @@
|
|||
@mixin container-fixed() {
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
padding-left: ($grid-gutter-width / 2);
|
||||
padding-right: ($grid-gutter-width / 2);
|
||||
@include clearfix();
|
||||
}
|
||||
|
||||
// Creates a wrapper for a series of columns
|
||||
@mixin make-row($gutter: $grid-gutter-width) {
|
||||
// Then clear the floated columns
|
||||
margin-left: ($gutter / -2);
|
||||
margin-right: ($gutter / -2);
|
||||
@include clearfix();
|
||||
|
||||
.container & {
|
||||
@media (min-width: $screen-small) {
|
||||
margin-left: ($gutter / -2);
|
||||
margin-right: ($gutter / -2);
|
||||
}
|
||||
}
|
||||
|
||||
// Negative margin nested rows out to align the content of columns
|
||||
.row {
|
||||
margin-left: ($gutter / -2);
|
||||
margin-right: ($gutter / -2);
|
||||
}
|
||||
}
|
||||
|
||||
// Generate the extra small columns
|
||||
@mixin make-xs-column($columns, $gutter: $grid-gutter-width) {
|
||||
position: relative;
|
||||
float: left;
|
||||
width: percentage(($columns / $grid-columns));
|
||||
// Prevent columns from collapsing when empty
|
||||
min-height: 1px;
|
||||
// Inner gutter via padding
|
||||
padding-left: ($gutter / 2);
|
||||
padding-right: ($gutter / 2);
|
||||
$max-width: ($screen-small - 1);
|
||||
|
||||
// Calculate width based on number of columns available
|
||||
@media (max-width: $max-width) {
|
||||
width: percentage(($columns / $grid-columns));
|
||||
}
|
||||
}
|
||||
|
||||
// Generate the small columns
|
||||
|
|
@ -570,7 +560,7 @@
|
|||
padding-right: ($gutter / 2);
|
||||
|
||||
// Calculate width based on number of columns available
|
||||
@media (min-width: $screen-small) {
|
||||
@media (min-width: $screen-sm) {
|
||||
float: left;
|
||||
width: percentage(($columns / $grid-columns));
|
||||
}
|
||||
|
|
@ -578,17 +568,17 @@
|
|||
|
||||
// Generate the small column offsets
|
||||
@mixin make-sm-column-offset($columns) {
|
||||
@media (min-width: $screen-small) {
|
||||
@media (min-width: $screen-sm) {
|
||||
margin-left: percentage(($columns / $grid-columns));
|
||||
}
|
||||
}
|
||||
@mixin make-sm-column-push($columns) {
|
||||
@media (min-width: $screen-small) {
|
||||
@media (min-width: $screen-sm) {
|
||||
left: percentage(($columns / $grid-columns));
|
||||
}
|
||||
}
|
||||
@mixin make-sm-column-pull($columns) {
|
||||
@media (min-width: $screen-small) {
|
||||
@media (min-width: $screen-sm) {
|
||||
right: percentage(($columns / $grid-columns));
|
||||
}
|
||||
}
|
||||
|
|
@ -603,7 +593,7 @@
|
|||
padding-right: ($gutter / 2);
|
||||
|
||||
// Calculate width based on number of columns available
|
||||
@media (min-width: $screen-medium) {
|
||||
@media (min-width: $screen-md) {
|
||||
float: left;
|
||||
width: percentage(($columns / $grid-columns));
|
||||
}
|
||||
|
|
@ -611,17 +601,17 @@
|
|||
|
||||
// Generate the large column offsets
|
||||
@mixin make-md-column-offset($columns) {
|
||||
@media (min-width: $screen-medium) {
|
||||
@media (min-width: $screen-md) {
|
||||
margin-left: percentage(($columns / $grid-columns));
|
||||
}
|
||||
}
|
||||
@mixin make-md-column-push($columns) {
|
||||
@media (min-width: $screen-medium) {
|
||||
@media (min-width: $screen-md) {
|
||||
left: percentage(($columns / $grid-columns));
|
||||
}
|
||||
}
|
||||
@mixin make-md-column-pull($columns) {
|
||||
@media (min-width: $screen-medium) {
|
||||
@media (min-width: $screen-md) {
|
||||
right: percentage(($columns / $grid-columns));
|
||||
}
|
||||
}
|
||||
|
|
@ -636,7 +626,7 @@
|
|||
padding-right: ($gutter / 2);
|
||||
|
||||
// Calculate width based on number of columns available
|
||||
@media (min-width: $screen-large) {
|
||||
@media (min-width: $screen-lg) {
|
||||
float: left;
|
||||
width: percentage(($columns / $grid-columns));
|
||||
}
|
||||
|
|
@ -644,17 +634,17 @@
|
|||
|
||||
// Generate the large column offsets
|
||||
@mixin make-lg-column-offset($columns) {
|
||||
@media (min-width: $screen-large) {
|
||||
@media (min-width: $screen-lg) {
|
||||
margin-left: percentage(($columns / $grid-columns));
|
||||
}
|
||||
}
|
||||
@mixin make-lg-column-push($columns) {
|
||||
@media (min-width: $screen-large) {
|
||||
@media (min-width: $screen-lg) {
|
||||
left: percentage(($columns / $grid-columns));
|
||||
}
|
||||
}
|
||||
@mixin make-lg-column-pull($columns) {
|
||||
@media (min-width: $screen-large) {
|
||||
@media (min-width: $screen-lg) {
|
||||
right: percentage(($columns / $grid-columns));
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -30,8 +30,6 @@
|
|||
// styling of responsive aspects.
|
||||
|
||||
.navbar-header {
|
||||
padding-left: $navbar-padding-horizontal;
|
||||
padding-right: $navbar-padding-horizontal;
|
||||
@include clearfix();
|
||||
|
||||
@media (min-width: $grid-float-breakpoint) {
|
||||
|
|
@ -51,24 +49,21 @@
|
|||
// content for the user's viewport.
|
||||
|
||||
.navbar-collapse {
|
||||
max-height: 340px;
|
||||
overflow-x: visible;
|
||||
padding-right: $navbar-padding-horizontal;
|
||||
padding-left: $navbar-padding-horizontal;
|
||||
border-top: 1px solid darken($navbar-bg, 7%);
|
||||
box-shadow: inset 0 1px 0 rgba(255,255,255,.1);
|
||||
// Clear floated elements and prevent collapsing of padding
|
||||
@include clearfix();
|
||||
|
||||
// This is not automatically added to the `.navbar-fixed-top` because it causes
|
||||
// z-index bugs in iOS7 (possibly earlier).
|
||||
max-height: 340px;
|
||||
overflow-x: visible;
|
||||
overflow-y: auto;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
|
||||
&.in {
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
@media (min-width: $grid-float-breakpoint) {
|
||||
width: auto;
|
||||
padding-right: 0;
|
||||
padding-left: 0;
|
||||
border-top: 0;
|
||||
box-shadow: none;
|
||||
|
||||
|
|
@ -78,6 +73,30 @@
|
|||
padding-bottom: 0; // Override default setting
|
||||
overflow: visible !important;
|
||||
}
|
||||
|
||||
&.in {
|
||||
overflow-y: visible;
|
||||
}
|
||||
|
||||
.navbar-nav.navbar-right:last-child {
|
||||
margin-right: -$navbar-padding-horizontal;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Both navbar header and collapse
|
||||
//
|
||||
// When a container is present, change the behavior of the header and collapse.
|
||||
|
||||
.container > .navbar-header,
|
||||
.container > .navbar-collapse {
|
||||
margin-right: -$navbar-padding-horizontal;
|
||||
margin-left: -$navbar-padding-horizontal;
|
||||
|
||||
@media (min-width: $grid-float-breakpoint) {
|
||||
margin-right: 0;
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -90,8 +109,8 @@
|
|||
|
||||
// Static top (unfixed, but 100% wide) navbar
|
||||
.navbar-static-top {
|
||||
border-width: 0 0 1px;
|
||||
@media (min-width: $grid-float-breakpoint) {
|
||||
border-width: 0 0 1px;
|
||||
border-radius: 0;
|
||||
}
|
||||
}
|
||||
|
|
@ -123,8 +142,7 @@
|
|||
|
||||
.navbar-brand {
|
||||
float: left;
|
||||
padding-top: $navbar-padding-vertical;
|
||||
padding-bottom: $navbar-padding-vertical;
|
||||
padding: $navbar-padding-vertical $navbar-padding-horizontal;
|
||||
font-size: $font-size-large;
|
||||
line-height: $line-height-computed;
|
||||
color: $navbar-brand-color;
|
||||
|
|
@ -134,6 +152,12 @@
|
|||
text-decoration: none;
|
||||
background-color: $navbar-brand-hover-bg;
|
||||
}
|
||||
|
||||
@media (min-width: $grid-float-breakpoint) {
|
||||
.navbar > .container & {
|
||||
margin-left: -$navbar-padding-horizontal;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -145,6 +169,7 @@
|
|||
.navbar-toggle {
|
||||
position: relative;
|
||||
float: right;
|
||||
margin-right: $navbar-padding-horizontal;
|
||||
padding: 9px 10px;
|
||||
@include navbar-vertical-align(34px);
|
||||
background-color: transparent;
|
||||
|
|
@ -169,9 +194,6 @@
|
|||
}
|
||||
|
||||
@media (min-width: $grid-float-breakpoint) {
|
||||
position: relative;
|
||||
top: auto;
|
||||
left: auto;
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
|
@ -183,10 +205,7 @@
|
|||
// the nav the full height of the horizontal nav (above 768px).
|
||||
|
||||
.navbar-nav {
|
||||
padding-top: ($navbar-padding-vertical / 2);
|
||||
padding-bottom: ($navbar-padding-vertical / 2);
|
||||
margin-left: -$navbar-padding-horizontal;
|
||||
margin-right: -$navbar-padding-horizontal;
|
||||
margin: ($navbar-padding-vertical / 2) -$navbar-padding-horizontal;
|
||||
|
||||
> li > a {
|
||||
padding-top: 10px;
|
||||
|
|
@ -216,7 +235,7 @@
|
|||
}
|
||||
}
|
||||
|
||||
@media (max-width: $screen-phone-max) {
|
||||
@media (max-width: $screen-xs-max) {
|
||||
// Dropdowns get custom display when collapsed
|
||||
.open .dropdown-menu {
|
||||
position: static;
|
||||
|
|
@ -263,8 +282,6 @@
|
|||
@media (min-width: $grid-float-breakpoint) {
|
||||
float: left;
|
||||
margin: 0;
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
|
||||
> li {
|
||||
float: left;
|
||||
|
|
@ -309,12 +326,14 @@
|
|||
padding: 10px $navbar-padding-horizontal;
|
||||
border-top: 1px solid darken($navbar-bg, 7%);
|
||||
border-bottom: 1px solid darken($navbar-bg, 7%);
|
||||
$shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.1);
|
||||
@include box-shadow($shadow);
|
||||
|
||||
// Mixin behavior for optimum display
|
||||
@extend .form-inline;
|
||||
|
||||
.form-group {
|
||||
@media (max-width: $screen-phone-max) {
|
||||
@media (max-width: $screen-xs-max) {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
}
|
||||
|
|
@ -330,6 +349,7 @@
|
|||
margin-right: 0;
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
@include box-shadow(none);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -399,6 +419,11 @@
|
|||
float: left;
|
||||
color: $navbar-color;
|
||||
@include navbar-vertical-align($line-height-computed);
|
||||
|
||||
@media (min-width: $grid-float-breakpoint) {
|
||||
margin-left: $navbar-padding-horizontal;
|
||||
margin-right: $navbar-padding-horizontal;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -475,8 +500,9 @@
|
|||
}
|
||||
}
|
||||
|
||||
.navbar-collapse {
|
||||
border-top-color: darken($navbar-inverse-bg, 7%);
|
||||
.navbar-collapse,
|
||||
.navbar-form {
|
||||
border-color: darken($navbar-inverse-bg, 7%);
|
||||
}
|
||||
|
||||
// Dropdowns
|
||||
|
|
@ -508,7 +534,7 @@
|
|||
}
|
||||
}
|
||||
|
||||
@media (max-width: $screen-phone-max) {
|
||||
@media (max-width: $screen-xs-max) {
|
||||
// Dropdowns get custom display
|
||||
.open .dropdown-menu {
|
||||
> .dropdown-header {
|
||||
|
|
|
|||
|
|
@ -19,7 +19,7 @@
|
|||
> a {
|
||||
position: relative;
|
||||
display: block;
|
||||
padding: 10px 15px;
|
||||
padding: $nav-link-padding;
|
||||
&:hover,
|
||||
&:focus {
|
||||
text-decoration: none;
|
||||
|
|
@ -42,17 +42,12 @@
|
|||
}
|
||||
|
||||
// Open dropdowns
|
||||
&.open > a {
|
||||
.open > a {
|
||||
&,
|
||||
&:hover,
|
||||
&:focus {
|
||||
color: $nav-open-link-hover-color;
|
||||
background-color: $link-color;
|
||||
background-color: $nav-link-hover-bg;
|
||||
border-color: $link-color;
|
||||
.caret {
|
||||
border-top-color: $nav-open-caret-border-color;
|
||||
border-bottom-color: $nav-open-caret-border-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -87,7 +82,7 @@
|
|||
border: 1px solid transparent;
|
||||
border-radius: $border-radius-base $border-radius-base 0 0;
|
||||
&:hover {
|
||||
border-color: $nav-tabs-link-hover-border-color;
|
||||
border-color: $nav-tabs-link-hover-border-color $nav-tabs-link-hover-border-color $nav-tabs-border-color;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -159,14 +154,20 @@
|
|||
|
||||
.nav-justified {
|
||||
width: 100%;
|
||||
|
||||
> li {
|
||||
float: none;
|
||||
display: table-cell;
|
||||
width: 1%;
|
||||
> a {
|
||||
> a {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: $screen-sm) {
|
||||
> li {
|
||||
display: table-cell;
|
||||
width: 1%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Move borders to anchors instead of bottom of list
|
||||
|
|
|
|||
|
|
@ -23,7 +23,7 @@
|
|||
> a:hover,
|
||||
> a:focus {
|
||||
text-decoration: none;
|
||||
background-color: $pagination-active-bg;
|
||||
background-color: $pagination-hover-bg;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -11,18 +11,19 @@
|
|||
display: inline; // Remove list-style and block-level defaults
|
||||
> a,
|
||||
> span {
|
||||
position: relative;
|
||||
float: left; // Collapse white-space
|
||||
padding: $padding-base-vertical $padding-base-horizontal;
|
||||
line-height: $line-height-base;
|
||||
text-decoration: none;
|
||||
background-color: $pagination-bg;
|
||||
border: 1px solid $pagination-border;
|
||||
border-left-width: 0;
|
||||
margin-left: -1px;
|
||||
}
|
||||
&:first-child {
|
||||
> a,
|
||||
> span {
|
||||
border-left-width: 1px;
|
||||
margin-left: 0;
|
||||
@include border-left-radius($border-radius-base);
|
||||
}
|
||||
}
|
||||
|
|
@ -34,16 +35,25 @@
|
|||
}
|
||||
}
|
||||
|
||||
> li > a:hover,
|
||||
> li > a:focus,
|
||||
> .active > a,
|
||||
> .active > span {
|
||||
background-color: $pagination-active-bg;
|
||||
> li > a,
|
||||
> li > span {
|
||||
&:hover,
|
||||
&:focus {
|
||||
background-color: $pagination-hover-bg;
|
||||
}
|
||||
}
|
||||
|
||||
> .active > a,
|
||||
> .active > span {
|
||||
color: $pagination-active-color;
|
||||
cursor: default;
|
||||
&,
|
||||
&:hover,
|
||||
&:focus {
|
||||
z-index: 2;
|
||||
color: $pagination-active-color;
|
||||
background-color: $pagination-active-bg;
|
||||
border-color: $pagination-active-bg;
|
||||
cursor: default;
|
||||
}
|
||||
}
|
||||
|
||||
> .disabled {
|
||||
|
|
@ -53,6 +63,7 @@
|
|||
> a:focus {
|
||||
color: $pagination-disabled-color;
|
||||
background-color: $pagination-bg;
|
||||
border-color: $pagination-border;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -15,15 +15,20 @@
|
|||
// Panel contents
|
||||
.panel-body {
|
||||
padding: 15px;
|
||||
@include clearfix();
|
||||
}
|
||||
|
||||
|
||||
// List groups in panels
|
||||
//
|
||||
// By default, space out list group content from panel headings to account for
|
||||
// any kind of custom content between the two.
|
||||
|
||||
.panel {
|
||||
.list-group {
|
||||
> .table {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
> .list-group {
|
||||
margin-bottom: 0;
|
||||
|
||||
.list-group-item {
|
||||
|
|
@ -47,6 +52,22 @@
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
// Tables in panels
|
||||
//
|
||||
// Place a non-bordered `.table` within a panel (not within a `.panel-body`) and
|
||||
// watch it go full width.
|
||||
|
||||
.panel {
|
||||
> .table {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
> .panel-body + .table {
|
||||
border-top: 1px solid $table-border-color;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Optional heading
|
||||
.panel-heading {
|
||||
padding: 10px 15px;
|
||||
|
|
@ -59,7 +80,7 @@
|
|||
.panel-title {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
font-size: ($font-size-base * 1.25);
|
||||
font-size: ceil(($font-size-base * 1.125));
|
||||
> a {
|
||||
color: inherit;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -78,22 +78,18 @@
|
|||
// Variations
|
||||
// -------------------------
|
||||
|
||||
// Danger (red)
|
||||
.progress-bar-danger {
|
||||
@include progress-bar-variant($progress-bar-danger-bg);
|
||||
}
|
||||
|
||||
// Success (green)
|
||||
.progress-bar-success {
|
||||
@include progress-bar-variant($progress-bar-success-bg);
|
||||
}
|
||||
|
||||
// Warning (orange)
|
||||
.progress-bar-info {
|
||||
@include progress-bar-variant($progress-bar-info-bg);
|
||||
}
|
||||
|
||||
.progress-bar-warning {
|
||||
@include progress-bar-variant($progress-bar-warning-bg);
|
||||
}
|
||||
|
||||
// Info (teal)
|
||||
.progress-bar-info {
|
||||
@include progress-bar-variant($progress-bar-info-bg);
|
||||
.progress-bar-danger {
|
||||
@include progress-bar-variant($progress-bar-danger-bg);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -36,90 +36,89 @@
|
|||
// Visibility utilities
|
||||
|
||||
@include responsive-visibility('.visible-xs');
|
||||
@media (min-width: $screen-tablet) and (max-width: $screen-tablet-max) {
|
||||
@media (min-width: $screen-sm) and (max-width: $screen-sm-max) {
|
||||
@include responsive-invisibility('.visible-xs');
|
||||
}
|
||||
@media (min-width: $screen-desktop) and (max-width: $screen-desktop-max) {
|
||||
@media (min-width: $screen-md) and (max-width: $screen-md-max) {
|
||||
@include responsive-invisibility('.visible-xs');
|
||||
}
|
||||
@media (min-width: $screen-large-desktop) {
|
||||
@media (min-width: $screen-lg) {
|
||||
@include responsive-invisibility('.visible-xs');
|
||||
}
|
||||
@include responsive-invisibility('.visible-sm');
|
||||
@media (min-width: $screen-tablet) and (max-width: $screen-tablet-max) {
|
||||
@media (min-width: $screen-sm) and (max-width: $screen-sm-max) {
|
||||
@include responsive-visibility('.visible-sm');
|
||||
}
|
||||
@media (min-width: $screen-desktop) and (max-width: $screen-desktop-max) {
|
||||
@media (min-width: $screen-md) and (max-width: $screen-md-max) {
|
||||
@include responsive-invisibility('.visible-sm');
|
||||
}
|
||||
@media (min-width: $screen-large-desktop) {
|
||||
@media (min-width: $screen-lg) {
|
||||
@include responsive-invisibility('.visible-sm');
|
||||
}
|
||||
@include responsive-invisibility('.visible-md');
|
||||
@media (min-width: $screen-tablet) and (max-width: $screen-tablet-max) {
|
||||
@media (min-width: $screen-sm) and (max-width: $screen-sm-max) {
|
||||
@include responsive-invisibility('.visible-md');
|
||||
}
|
||||
@media (min-width: $screen-desktop) and (max-width: $screen-desktop-max) {
|
||||
@media (min-width: $screen-md) and (max-width: $screen-md-max) {
|
||||
@include responsive-visibility('.visible-md');
|
||||
}
|
||||
@media (min-width: $screen-large-desktop) {
|
||||
@media (min-width: $screen-lg) {
|
||||
@include responsive-invisibility('.visible-md');
|
||||
}
|
||||
@include responsive-invisibility('.visible-lg');
|
||||
@media (min-width: $screen-tablet) and (max-width: $screen-tablet-max) {
|
||||
@media (min-width: $screen-sm) and (max-width: $screen-sm-max) {
|
||||
@include responsive-invisibility('.visible-lg');
|
||||
}
|
||||
@media (min-width: $screen-desktop) and (max-width: $screen-desktop-max) {
|
||||
@media (min-width: $screen-md) and (max-width: $screen-md-max) {
|
||||
@include responsive-invisibility('.visible-lg');
|
||||
}
|
||||
@media (min-width: $screen-large-desktop) {
|
||||
@media (min-width: $screen-lg) {
|
||||
@include responsive-visibility('.visible-lg');
|
||||
}
|
||||
|
||||
@include responsive-invisibility('.hidden-xs');
|
||||
@media (min-width: $screen-tablet) and (max-width: $screen-tablet-max) {
|
||||
@media (min-width: $screen-sm) and (max-width: $screen-sm-max) {
|
||||
@include responsive-visibility('.hidden-xs');
|
||||
}
|
||||
@media (min-width: $screen-desktop) and (max-width: $screen-desktop-max) {
|
||||
@media (min-width: $screen-md) and (max-width: $screen-md-max) {
|
||||
@include responsive-visibility('.hidden-xs');
|
||||
}
|
||||
@media (min-width: $screen-large-desktop) {
|
||||
@media (min-width: $screen-lg) {
|
||||
@include responsive-visibility('.hidden-xs');
|
||||
}
|
||||
@include responsive-visibility('.hidden-sm');
|
||||
@media (min-width: $screen-tablet) and (max-width: $screen-tablet-max) {
|
||||
@media (min-width: $screen-sm) and (max-width: $screen-sm-max) {
|
||||
@include responsive-invisibility('.hidden-sm');
|
||||
}
|
||||
@media (min-width: $screen-desktop) and (max-width: $screen-desktop-max) {
|
||||
@media (min-width: $screen-md) and (max-width: $screen-md-max) {
|
||||
@include responsive-visibility('.hidden-sm');
|
||||
}
|
||||
@media (min-width: $screen-large-desktop) {
|
||||
@media (min-width: $screen-lg) {
|
||||
@include responsive-visibility('.hidden-sm');
|
||||
}
|
||||
@include responsive-visibility('.hidden-md');
|
||||
@media (min-width: $screen-tablet) and (max-width: $screen-tablet-max) {
|
||||
@media (min-width: $screen-sm) and (max-width: $screen-sm-max) {
|
||||
@include responsive-visibility('.hidden-md');
|
||||
}
|
||||
@media (min-width: $screen-desktop) and (max-width: $screen-desktop-max) {
|
||||
@media (min-width: $screen-md) and (max-width: $screen-md-max) {
|
||||
@include responsive-invisibility('.hidden-md');
|
||||
}
|
||||
@media (min-width: $screen-large-desktop) {
|
||||
@media (min-width: $screen-lg) {
|
||||
@include responsive-visibility('.hidden-md');
|
||||
}
|
||||
@include responsive-visibility('.hidden-lg');
|
||||
@media (min-width: $screen-tablet) and (max-width: $screen-tablet-max) {
|
||||
@media (min-width: $screen-sm) and (max-width: $screen-sm-max) {
|
||||
@include responsive-visibility('.hidden-lg');
|
||||
}
|
||||
@media (min-width: $screen-desktop) and (max-width: $screen-desktop-max) {
|
||||
@media (min-width: $screen-md) and (max-width: $screen-md-max) {
|
||||
@include responsive-visibility('.hidden-lg');
|
||||
}
|
||||
@media (min-width: $screen-large-desktop) {
|
||||
@media (min-width: $screen-lg) {
|
||||
@include responsive-invisibility('.hidden-lg');
|
||||
}
|
||||
|
||||
// Print utilities
|
||||
@include responsive-invisibility('.visible-print');
|
||||
.hidden-print { }
|
||||
|
||||
@media print {
|
||||
@include responsive-visibility('.visible-print');
|
||||
|
|
|
|||
|
|
@ -35,6 +35,7 @@ th {
|
|||
// Bottom align for column headings
|
||||
thead > tr > th {
|
||||
vertical-align: bottom;
|
||||
border-bottom: 2px solid $table-border-color;
|
||||
}
|
||||
// Remove top border from thead by default
|
||||
caption + thead,
|
||||
|
|
@ -92,6 +93,14 @@ th {
|
|||
}
|
||||
}
|
||||
}
|
||||
> thead {
|
||||
> tr {
|
||||
> th,
|
||||
> td {
|
||||
border-bottom-width: 2px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,232 @@
|
|||
|
||||
//
|
||||
// Load core variables and mixins
|
||||
// --------------------------------------------------
|
||||
|
||||
@import "bootstrap/variables";
|
||||
@import "bootstrap/mixins";
|
||||
|
||||
|
||||
|
||||
//
|
||||
// Buttons
|
||||
// --------------------------------------------------
|
||||
|
||||
// Common styles
|
||||
.btn-default,
|
||||
.btn-primary,
|
||||
.btn-success,
|
||||
.btn-info,
|
||||
.btn-warning,
|
||||
.btn-danger {
|
||||
text-shadow: 0 -1px 0 rgba(0,0,0,.2);
|
||||
$shadow: inset 0 1px 0 rgba(255,255,255,.15), 0 1px 1px rgba(0,0,0,.075);
|
||||
@include box-shadow($shadow);
|
||||
|
||||
// Reset the shadow
|
||||
&:active,
|
||||
&.active {
|
||||
@include box-shadow(inset 0 3px 5px rgba(0,0,0,.125));
|
||||
}
|
||||
}
|
||||
|
||||
// Mixin for generating new styles
|
||||
@include btn-styles($btn-color: #555;) {
|
||||
@include gradient-vertical($start-color: $btn-color, $end-color: darken($btn-color, 10%));
|
||||
border-color: darken($btn-color, 12%);
|
||||
|
||||
&:active,
|
||||
&.active {
|
||||
background-color: darken($btn-color, 10%);
|
||||
border-color: darken($btn-color, 12%);
|
||||
}
|
||||
}
|
||||
|
||||
// Common styles
|
||||
.btn {
|
||||
// Remove the gradient for the pressed/active state
|
||||
&:active,
|
||||
&.active {
|
||||
background-image: none;
|
||||
}
|
||||
}
|
||||
|
||||
// Apply the mixin to the buttons
|
||||
.btn-default { @include btn-styles($btn-default-bg;); text-shadow: 0 1px 0 #fff; border-color: #ccc; }
|
||||
.btn-primary { @include btn-styles($btn-primary-bg); }
|
||||
.btn-success { @include btn-styles($btn-success-bg); }
|
||||
.btn-warning { @include btn-styles($btn-warning-bg); }
|
||||
.btn-danger { @include btn-styles($btn-danger-bg); }
|
||||
.btn-info { @include btn-styles($btn-info-bg); }
|
||||
|
||||
|
||||
|
||||
//
|
||||
// Images
|
||||
// --------------------------------------------------
|
||||
|
||||
.thumbnail,
|
||||
.img-thumbnail {
|
||||
@include box-shadow(0 1px 2px rgba(0,0,0,.075));
|
||||
}
|
||||
|
||||
|
||||
|
||||
//
|
||||
// Dropdowns
|
||||
// --------------------------------------------------
|
||||
|
||||
.dropdown-menu > li > a:hover,
|
||||
.dropdown-menu > li > a:focus,
|
||||
.dropdown-menu > .active > a,
|
||||
.dropdown-menu > .active > a:hover,
|
||||
.dropdown-menu > .active > a:focus {
|
||||
@include gradient-vertical($start-color: $dropdown-link-hover-bg, $end-color: darken($dropdown-link-hover-bg, 5%));
|
||||
background-color: darken($dropdown-link-hover-bg, 5%);
|
||||
}
|
||||
|
||||
|
||||
|
||||
//
|
||||
// Navbar
|
||||
// --------------------------------------------------
|
||||
|
||||
// Basic navbar
|
||||
.navbar {
|
||||
@include gradient-vertical($start-color: lighten($navbar-bg, 10%), $end-color: $navbar-bg;);
|
||||
border-radius: $navbar-border-radius;
|
||||
$shadow: inset 0 1px 0 rgba(255,255,255,.15), 0 1px 5px rgba(0,0,0,.075);
|
||||
@include box-shadow($shadow);
|
||||
|
||||
.navbar-nav > .active > a {
|
||||
background-color: $navbar-bg;
|
||||
}
|
||||
}
|
||||
.navbar-brand,
|
||||
.navbar-nav > li > a {
|
||||
text-shadow: 0 1px 0 rgba(255,255,255,.25);
|
||||
}
|
||||
|
||||
// Inverted navbar
|
||||
.navbar-inverse {
|
||||
@include gradient-vertical($start-color: lighten($navbar-inverse-bg, 10%), $end-color: $navbar-inverse-bg;);
|
||||
|
||||
.navbar-nav > .active > a {
|
||||
background-color: $navbar-inverse-bg;
|
||||
}
|
||||
|
||||
.navbar-brand,
|
||||
.navbar-nav > li > a {
|
||||
text-shadow: 0 -1px 0 rgba(0,0,0,.25);
|
||||
}
|
||||
}
|
||||
|
||||
// Undo rounded corners in static and fixed navbars
|
||||
.navbar-static-top,
|
||||
.navbar-fixed-top,
|
||||
.navbar-fixed-bottom {
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
|
||||
|
||||
//
|
||||
// Alerts
|
||||
// --------------------------------------------------
|
||||
|
||||
// Common styles
|
||||
.alert {
|
||||
text-shadow: 0 1px 0 rgba(255,255,255,.2);
|
||||
$shadow: inset 0 1px 0 rgba(255,255,255,.25), 0 1px 2px rgba(0,0,0,.05);
|
||||
@include box-shadow($shadow);
|
||||
}
|
||||
|
||||
// Mixin for generating new styles
|
||||
@include alert-styles($color) {
|
||||
@include gradient-vertical($start-color: $color, $end-color: darken($color, 7.5%));
|
||||
border-color: darken($color, 15%);
|
||||
}
|
||||
|
||||
// Apply the mixin to the alerts
|
||||
.alert { @include alert-styles($alert-bg); }
|
||||
.alert-success { @include alert-styles($alert-success-bg); }
|
||||
.alert-info { @include alert-styles($alert-info-bg); }
|
||||
.alert-danger { @include alert-styles($alert-danger-bg); }
|
||||
|
||||
|
||||
|
||||
//
|
||||
// Progress bars
|
||||
// --------------------------------------------------
|
||||
|
||||
// Give the progress background some depth
|
||||
.progress {
|
||||
@include gradient-vertical($start-color: darken($progress-bg, 4%), $end-color: $progress-bg;)
|
||||
}
|
||||
|
||||
// Mixin for generating new styles
|
||||
@include progress-bar-styles($color) {
|
||||
@include gradient-vertical($start-color: $color, $end-color: darken($color, 10%));
|
||||
}
|
||||
|
||||
// Apply the mixin to the progress bars
|
||||
.progress-bar { @include progress-bar-styles($progress-bar-bg); }
|
||||
.progress-bar-success { @include progress-bar-styles($progress-bar-success-bg); }
|
||||
.progress-bar-info { @include progress-bar-styles($progress-bar-info-bg); }
|
||||
.progress-bar-warning { @include progress-bar-styles($progress-bar-warning-bg); }
|
||||
.progress-bar-danger { @include progress-bar-styles($progress-bar-danger-bg); }
|
||||
|
||||
|
||||
|
||||
//
|
||||
// List groups
|
||||
// --------------------------------------------------
|
||||
|
||||
.list-group {
|
||||
border-radius: $border-radius-base;
|
||||
@include box-shadow(0 1px 2px rgba(0,0,0,.075));
|
||||
}
|
||||
.list-group-item.active,
|
||||
.list-group-item.active:hover,
|
||||
.list-group-item.active:focus {
|
||||
text-shadow: 0 -1px 0 darken($list-group-active-bg, 10%);
|
||||
@include gradient-vertical($start-color: $list-group-active-bg, $end-color: darken($list-group-active-bg, 7.5%));
|
||||
border-color: darken($list-group-active-border, 7.5%);
|
||||
}
|
||||
|
||||
|
||||
|
||||
//
|
||||
// Panels
|
||||
// --------------------------------------------------
|
||||
|
||||
// Common styles
|
||||
.panel {
|
||||
@include box-shadow(0 1px 2px rgba(0,0,0,.05));
|
||||
}
|
||||
|
||||
// Mixin for generating new styles
|
||||
@include panel-heading-styles($color) {
|
||||
@include gradient-vertical($start-color: $color, $end-color: darken($color, 5%));
|
||||
}
|
||||
|
||||
// Apply the mixin to the panel headings only
|
||||
.panel-heading { @include panel-heading-styles($panel-heading-bg); }
|
||||
.panel-primary > .panel-heading { @include panel-heading-styles($panel-primary-heading-bg); }
|
||||
.panel-success > .panel-heading { @include panel-heading-styles($panel-success-heading-bg); }
|
||||
.panel-info > .panel-heading { @include panel-heading-styles($panel-info-heading-bg); }
|
||||
.panel-warning > .panel-heading { @include panel-heading-styles($panel-warning-heading-bg); }
|
||||
.panel-danger > .panel-heading { @include panel-heading-styles($panel-danger-heading-bg); }
|
||||
|
||||
|
||||
|
||||
//
|
||||
// Wells
|
||||
// --------------------------------------------------
|
||||
|
||||
.well {
|
||||
@include gradient-vertical($start-color: darken($well-bg, 5%), $end-color: $well-bg;);
|
||||
border-color: darken($well-bg, 10%);
|
||||
$shadow: inset 0 1px 3px rgba(0,0,0,.05), 0 1px 0 rgba(255,255,255,.1);
|
||||
@include box-shadow($shadow);
|
||||
}
|
||||
|
|
@ -20,10 +20,12 @@
|
|||
.thumbnail {
|
||||
display: block;
|
||||
}
|
||||
.thumbnail > img,
|
||||
.img-thumbnail {
|
||||
.thumbnail > img {
|
||||
@include img-responsive();
|
||||
}
|
||||
.img-thumbnail {
|
||||
@include img-responsive(inline-block);
|
||||
}
|
||||
|
||||
// Add a hover state for linked versions only
|
||||
a.thumbnail:hover,
|
||||
|
|
|
|||
|
|
@ -55,6 +55,12 @@ $headings-font-family: $font-family-base !default;
|
|||
$headings-font-weight: 500 !default;
|
||||
$headings-line-height: 1.1 !default;
|
||||
|
||||
// Iconography
|
||||
// -------------------------
|
||||
|
||||
$icon-font-path: "../fonts/" !default;
|
||||
$icon-font-name: "glyphicons-halflings-regular" !default;
|
||||
|
||||
|
||||
// Components
|
||||
// -------------------------
|
||||
|
|
@ -98,7 +104,7 @@ $table-border-color: #ddd !default; // table and cell border
|
|||
// Buttons
|
||||
// -------------------------
|
||||
|
||||
$btn-font-weight: bold !default;
|
||||
$btn-font-weight: normal !default;
|
||||
|
||||
$btn-default-color: #333 !default;
|
||||
$btn-default-bg: #fff !default;
|
||||
|
|
@ -193,26 +199,25 @@ $zindex-modal: 1050 !default;
|
|||
// --------------------------------------------------
|
||||
|
||||
// Extra small screen / phone
|
||||
$screen-xsmall: 480px !default;
|
||||
$screen-phone: $screen-xsmall !default;
|
||||
$screen-xs: 480px !default;
|
||||
$screen-phone: $screen-xs !default;
|
||||
|
||||
// Small screen / tablet
|
||||
$screen-small: 768px !default;
|
||||
$screen-tablet: $screen-small !default;
|
||||
$screen-sm: 768px !default;
|
||||
$screen-tablet: $screen-sm !default;
|
||||
|
||||
// Medium screen / desktop
|
||||
$screen-medium: 992px !default;
|
||||
$screen-desktop: $screen-medium !default;
|
||||
$screen-md: 992px !default;
|
||||
$screen-desktop: $screen-md !default;
|
||||
|
||||
// Large screen / wide desktop
|
||||
$screen-large: 1200px !default;
|
||||
$screen-large-desktop: $screen-large !default;
|
||||
$screen-lg: 1200px !default;
|
||||
$screen-lg-desktop: $screen-lg !default;
|
||||
|
||||
// So media queries don't overlap when required, provide a maximum
|
||||
$screen-phone-max: ($screen-small - 1) !default;
|
||||
$screen-small-max: ($screen-medium - 1) !default;
|
||||
$screen-tablet-max: ($screen-desktop - 1) !default;
|
||||
$screen-desktop-max: ($screen-large-desktop - 1) !default;
|
||||
$screen-xs-max: ($screen-sm - 1) !default;
|
||||
$screen-sm-max: ($screen-md - 1) !default;
|
||||
$screen-md-max: ($screen-lg - 1) !default;
|
||||
|
||||
|
||||
// Grid system
|
||||
|
|
@ -296,6 +301,7 @@ $navbar-inverse-toggle-border-color: #333 !default;
|
|||
// Navs
|
||||
// -------------------------
|
||||
|
||||
$nav-link-padding: 10px 15px !default;
|
||||
$nav-link-hover-bg: $gray-lighter !default;
|
||||
|
||||
$nav-disabled-link-color: $gray-light !default;
|
||||
|
|
@ -326,10 +332,15 @@ $nav-pills-active-link-hover-color: #fff !default;
|
|||
|
||||
$pagination-bg: #fff !default;
|
||||
$pagination-border: #ddd !default;
|
||||
$pagination-active-bg: #f5f5f5 !default;
|
||||
$pagination-active-color: $gray-light !default;
|
||||
|
||||
$pagination-hover-bg: $gray-lighter !default;
|
||||
|
||||
$pagination-active-bg: $brand-primary !default;
|
||||
$pagination-active-color: #fff !default;
|
||||
|
||||
$pagination-disabled-color: $gray-light !default;
|
||||
|
||||
|
||||
// Pager
|
||||
// -------------------------
|
||||
|
||||
|
|
@ -396,6 +407,7 @@ $popover-arrow-outer-fallback-color: #999 !default;
|
|||
// -------------------------
|
||||
|
||||
$label-default-bg: $gray-light !default;
|
||||
$label-primary-bg: $brand-primary !default;
|
||||
$label-success-bg: $brand-success !default;
|
||||
$label-info-bg: $brand-info !default;
|
||||
$label-warning-bg: $brand-warning !default;
|
||||
|
|
@ -593,10 +605,10 @@ $component-offset-horizontal: 180px !default;
|
|||
// --------------------------------------------------
|
||||
|
||||
// Small screen / tablet
|
||||
$container-tablet: 720px !default;
|
||||
$container-tablet: ((720px + $grid-gutter-width)) !default;
|
||||
|
||||
// Medium screen / desktop
|
||||
$container-desktop: 940px !default;
|
||||
$container-desktop: ((940px + $grid-gutter-width)) !default;
|
||||
|
||||
// Large screen / wide desktop
|
||||
$container-large-desktop: 1140px !default;
|
||||
$container-lg-desktop: ((1140px + $grid-gutter-width)) !default;
|
||||
|
|
|
|||
|
|
@ -21,43 +21,39 @@
|
|||
@import "bootstrap/type";
|
||||
@import "bootstrap/code";
|
||||
@import "bootstrap/grid";
|
||||
|
||||
@import "bootstrap/tables";
|
||||
@import "bootstrap/forms";
|
||||
@import "bootstrap/buttons";
|
||||
|
||||
// Components: common
|
||||
// Components
|
||||
@import "bootstrap/component-animations";
|
||||
@import "bootstrap/input-groups";
|
||||
@import "bootstrap/glyphicons";
|
||||
@import "bootstrap/dropdowns";
|
||||
@import "bootstrap/button-groups";
|
||||
@import "bootstrap/input-groups";
|
||||
@import "bootstrap/navs";
|
||||
@import "bootstrap/navbar";
|
||||
@import "bootstrap/breadcrumbs";
|
||||
@import "bootstrap/pagination";
|
||||
@import "bootstrap/pager";
|
||||
@import "bootstrap/labels";
|
||||
@import "bootstrap/badges";
|
||||
@import "bootstrap/jumbotron";
|
||||
@import "bootstrap/thumbnails";
|
||||
@import "bootstrap/alerts";
|
||||
@import "bootstrap/progress-bars";
|
||||
@import "bootstrap/media";
|
||||
@import "bootstrap/list-group";
|
||||
@import "bootstrap/panels";
|
||||
@import "bootstrap/wells";
|
||||
@import "bootstrap/close";
|
||||
|
||||
// Components: Nav
|
||||
@import "bootstrap/navs";
|
||||
@import "bootstrap/navbar";
|
||||
@import "bootstrap/button-groups";
|
||||
@import "bootstrap/breadcrumbs";
|
||||
@import "bootstrap/pagination";
|
||||
@import "bootstrap/pager";
|
||||
|
||||
// Components: Popovers
|
||||
// Components w/ JavaScript
|
||||
@import "bootstrap/modals";
|
||||
@import "bootstrap/tooltip";
|
||||
@import "bootstrap/popovers";
|
||||
|
||||
// Components: Misc
|
||||
@import "bootstrap/alerts";
|
||||
@import "bootstrap/thumbnails";
|
||||
@import "bootstrap/media";
|
||||
@import "bootstrap/labels";
|
||||
@import "bootstrap/badges";
|
||||
@import "bootstrap/progress-bars";
|
||||
@import "bootstrap/carousel";
|
||||
@import "bootstrap/jumbotron";
|
||||
|
||||
// Utility classes
|
||||
@import "bootstrap/utilities"; // Has to be last to override when necessary
|
||||
@import "bootstrap/utilities";
|
||||
@import "bootstrap/responsive-utilities";
|
||||
|
|
|
|||
Загрузка…
Ссылка в новой задаче