Removed boot flat library
Added bower.json to the project Added grunt task to compile bower libraries
This commit is contained in:
Felipe Martin
parent
0752cd5ff4
commit
0b273feef9
|
|
@ -15,3 +15,7 @@ db.sqlite3
|
|||
# Bootflat
|
||||
shelfzilla/themes/bootflat/static/css/*.css
|
||||
shelfzilla/themes/bootflat/static/js/*.js
|
||||
|
||||
# Bower
|
||||
bower_components
|
||||
static_components
|
||||
|
|
|
|||
|
|
@ -0,0 +1,20 @@
|
|||
{
|
||||
"name": "shelfzilla",
|
||||
"version": "0.0.0",
|
||||
"authors": [
|
||||
"Felipe Martin <fmartingr@me.com>"
|
||||
],
|
||||
"license": "Commercial",
|
||||
"private": true,
|
||||
"ignore": [
|
||||
"**/.*",
|
||||
"node_modules",
|
||||
"bower_components",
|
||||
"test",
|
||||
"tests"
|
||||
],
|
||||
"dependencies": {
|
||||
"bootflatv2": "470fde6d400cdcca9fdc8c0a699a6d006e5f46d3",
|
||||
"jquery": "~2.1.0"
|
||||
}
|
||||
}
|
||||
|
|
@ -209,7 +209,7 @@ def rungrunt():
|
|||
"""
|
||||
Executes grunt
|
||||
"""
|
||||
run('grunt watch')
|
||||
run('grunt --force')
|
||||
|
||||
|
||||
#
|
||||
|
|
|
|||
|
|
@ -3,13 +3,28 @@ module.exports = (grunt) ->
|
|||
grunt.initConfig
|
||||
pkg: grunt.file.readJSON 'package.json'
|
||||
|
||||
bower:
|
||||
dev:
|
||||
dest: "static_components/"
|
||||
js_dest: 'static_components/js',
|
||||
css_dest: 'static_components/css'
|
||||
options:
|
||||
packageSpecific:
|
||||
bootflatv2:
|
||||
files: [
|
||||
'css/bootstrap.min.css',
|
||||
'bootflat/css/bootflat.min.css',
|
||||
'bootflat/img/check_flat/default.png',
|
||||
'bootflat/js/icheck.min.js'
|
||||
]
|
||||
|
||||
less:
|
||||
options:
|
||||
ieCompat: true
|
||||
compress: true
|
||||
development:
|
||||
files:
|
||||
"shelfzilla/themes/bootflat/static/css/style.css": "shelfzilla/themes/bootflat/static/less/style.less"
|
||||
"shelfzilla/themes/bootflat/static/css/app.css": "shelfzilla/themes/bootflat/static/less/app.less"
|
||||
|
||||
coffee:
|
||||
development:
|
||||
|
|
@ -20,12 +35,20 @@ module.exports = (grunt) ->
|
|||
concat:
|
||||
options:
|
||||
separator: ';'
|
||||
base:
|
||||
js:
|
||||
src: [
|
||||
"shelfzilla/themes/bootflat/static/libs/bootflat/js/icheck.min.js",
|
||||
"static_components/js/jquery.js",
|
||||
"static_components/js/icheck.min.js",
|
||||
"shelfzilla/themes/bootflat/static/js/main.full.js",
|
||||
]
|
||||
dest: "shelfzilla/themes/bootflat/static/js/site.js"
|
||||
css:
|
||||
src: [
|
||||
"static_components/css/bootstrap.min.css",
|
||||
"static_components/css/bootflat.min.css",
|
||||
"shelfzilla/themes/bootflat/static/css/app.css",
|
||||
]
|
||||
dest: "shelfzilla/themes/bootflat/static/css/style.css"
|
||||
|
||||
uglify:
|
||||
development:
|
||||
|
|
@ -68,9 +91,12 @@ module.exports = (grunt) ->
|
|||
grunt.loadNpmTasks 'grunt-contrib-watch'
|
||||
grunt.loadNpmTasks 'grunt-contrib-concat'
|
||||
grunt.loadNpmTasks 'grunt-contrib-clean'
|
||||
grunt.loadNpmTasks 'grunt-contrib-clean'
|
||||
grunt.loadNpmTasks 'grunt-bower'
|
||||
|
||||
# Tasks
|
||||
grunt.registerTask 'default', [
|
||||
"bower",
|
||||
"less", "coffee", "concat", "clean:development",
|
||||
"watch"
|
||||
]
|
||||
|
|
|
|||
|
|
@ -8,6 +8,7 @@
|
|||
"grunt-contrib-uglify": ">=0.2.2",
|
||||
"grunt-contrib-watch": ">=0.4.0",
|
||||
"grunt-contrib-concat": "~0.3.0",
|
||||
"grunt-contrib-clean": "~0.5.0"
|
||||
"grunt-contrib-clean": "~0.5.0",
|
||||
"grunt-bower": "^0.9.1",
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1 +0,0 @@
|
|||
@import "../libs/bootflat/css/bootflat.css";
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Binary file not shown.
|
Before Width: | Height: | Size: 3.0 KiB |
Binary file not shown.
|
|
@ -1,11 +0,0 @@
|
|||
/*! iCheck v1.0.1 by Damir Sultanov, http://git.io/arlzeA, MIT Licensed */
|
||||
(function(f){function A(a,b,d){var c=a[0],g=/er/.test(d)?_indeterminate:/bl/.test(d)?n:k,e=d==_update?{checked:c[k],disabled:c[n],indeterminate:"true"==a.attr(_indeterminate)||"false"==a.attr(_determinate)}:c[g];if(/^(ch|di|in)/.test(d)&&!e)x(a,g);else if(/^(un|en|de)/.test(d)&&e)q(a,g);else if(d==_update)for(var f in e)e[f]?x(a,f,!0):q(a,f,!0);else if(!b||"toggle"==d){if(!b)a[_callback]("ifClicked");e?c[_type]!==r&&q(a,g):x(a,g)}}function x(a,b,d){var c=a[0],g=a.parent(),e=b==k,u=b==_indeterminate,
|
||||
v=b==n,s=u?_determinate:e?y:"enabled",F=l(a,s+t(c[_type])),B=l(a,b+t(c[_type]));if(!0!==c[b]){if(!d&&b==k&&c[_type]==r&&c.name){var w=a.closest("form"),p='input[name="'+c.name+'"]',p=w.length?w.find(p):f(p);p.each(function(){this!==c&&f(this).data(m)&&q(f(this),b)})}u?(c[b]=!0,c[k]&&q(a,k,"force")):(d||(c[b]=!0),e&&c[_indeterminate]&&q(a,_indeterminate,!1));D(a,e,b,d)}c[n]&&l(a,_cursor,!0)&&g.find("."+C).css(_cursor,"default");g[_add](B||l(a,b)||"");g.attr("role")&&!u&&g.attr("aria-"+(v?n:k),"true");
|
||||
g[_remove](F||l(a,s)||"")}function q(a,b,d){var c=a[0],g=a.parent(),e=b==k,f=b==_indeterminate,m=b==n,s=f?_determinate:e?y:"enabled",q=l(a,s+t(c[_type])),r=l(a,b+t(c[_type]));if(!1!==c[b]){if(f||!d||"force"==d)c[b]=!1;D(a,e,s,d)}!c[n]&&l(a,_cursor,!0)&&g.find("."+C).css(_cursor,"pointer");g[_remove](r||l(a,b)||"");g.attr("role")&&!f&&g.attr("aria-"+(m?n:k),"false");g[_add](q||l(a,s)||"")}function E(a,b){if(a.data(m)){a.parent().html(a.attr("style",a.data(m).s||""));if(b)a[_callback](b);a.off(".i").unwrap();
|
||||
f(_label+'[for="'+a[0].id+'"]').add(a.closest(_label)).off(".i")}}function l(a,b,f){if(a.data(m))return a.data(m).o[b+(f?"":"Class")]}function t(a){return a.charAt(0).toUpperCase()+a.slice(1)}function D(a,b,f,c){if(!c){if(b)a[_callback]("ifToggled");a[_callback]("ifChanged")[_callback]("if"+t(f))}}var m="iCheck",C=m+"-helper",r="radio",k="checked",y="un"+k,n="disabled";_determinate="determinate";_indeterminate="in"+_determinate;_update="update";_type="type";_click="click";_touch="touchbegin.i touchend.i";
|
||||
_add="addClass";_remove="removeClass";_callback="trigger";_label="label";_cursor="cursor";_mobile=/ipad|iphone|ipod|android|blackberry|windows phone|opera mini|silk/i.test(navigator.userAgent);f.fn[m]=function(a,b){var d='input[type="checkbox"], input[type="'+r+'"]',c=f(),g=function(a){a.each(function(){var a=f(this);c=a.is(d)?c.add(a):c.add(a.find(d))})};if(/^(check|uncheck|toggle|indeterminate|determinate|disable|enable|update|destroy)$/i.test(a))return a=a.toLowerCase(),g(this),c.each(function(){var c=
|
||||
f(this);"destroy"==a?E(c,"ifDestroyed"):A(c,!0,a);f.isFunction(b)&&b()});if("object"!=typeof a&&a)return this;var e=f.extend({checkedClass:k,disabledClass:n,indeterminateClass:_indeterminate,labelHover:!0},a),l=e.handle,v=e.hoverClass||"hover",s=e.focusClass||"focus",t=e.activeClass||"active",B=!!e.labelHover,w=e.labelHoverClass||"hover",p=(""+e.increaseArea).replace("%","")|0;if("checkbox"==l||l==r)d='input[type="'+l+'"]';-50>p&&(p=-50);g(this);return c.each(function(){var a=f(this);E(a);var c=this,
|
||||
b=c.id,g=-p+"%",d=100+2*p+"%",d={position:"absolute",top:g,left:g,display:"block",width:d,height:d,margin:0,padding:0,background:"#fff",border:0,opacity:0},g=_mobile?{position:"absolute",visibility:"hidden"}:p?d:{position:"absolute",opacity:0},l="checkbox"==c[_type]?e.checkboxClass||"icheckbox":e.radioClass||"i"+r,z=f(_label+'[for="'+b+'"]').add(a.closest(_label)),u=!!e.aria,y=m+"-"+Math.random().toString(36).substr(2,6),h='<div class="'+l+'" '+(u?'role="'+c[_type]+'" ':"");u&&z.each(function(){h+=
|
||||
'aria-labelledby="';this.id?h+=this.id:(this.id=y,h+=y);h+='"'});h=a.wrap(h+"/>")[_callback]("ifCreated").parent().append(e.insert);d=f('<ins class="'+C+'"/>').css(d).appendTo(h);a.data(m,{o:e,s:a.attr("style")}).css(g);e.inheritClass&&h[_add](c.className||"");e.inheritID&&b&&h.attr("id",m+"-"+b);"static"==h.css("position")&&h.css("position","relative");A(a,!0,_update);if(z.length)z.on(_click+".i mouseover.i mouseout.i "+_touch,function(b){var d=b[_type],e=f(this);if(!c[n]){if(d==_click){if(f(b.target).is("a"))return;
|
||||
A(a,!1,!0)}else B&&(/ut|nd/.test(d)?(h[_remove](v),e[_remove](w)):(h[_add](v),e[_add](w)));if(_mobile)b.stopPropagation();else return!1}});a.on(_click+".i focus.i blur.i keyup.i keydown.i keypress.i",function(b){var d=b[_type];b=b.keyCode;if(d==_click)return!1;if("keydown"==d&&32==b)return c[_type]==r&&c[k]||(c[k]?q(a,k):x(a,k)),!1;if("keyup"==d&&c[_type]==r)!c[k]&&x(a,k);else if(/us|ur/.test(d))h["blur"==d?_remove:_add](s)});d.on(_click+" mousedown mouseup mouseover mouseout "+_touch,function(b){var d=
|
||||
b[_type],e=/wn|up/.test(d)?t:v;if(!c[n]){if(d==_click)A(a,!1,!0);else{if(/wn|er|in/.test(d))h[_add](e);else h[_remove](e+" "+t);if(z.length&&B&&e==v)z[/ut|nd/.test(d)?_remove:_add](w)}if(_mobile)b.stopPropagation();else return!1}})})}})(window.jQuery||window.Zepto);
|
||||
|
|
@ -1,47 +0,0 @@
|
|||
@charset "UTF-8";
|
||||
|
||||
/*
|
||||
* Copyright 2013 FLATHEMES.
|
||||
*
|
||||
* Bootflat, v2.0.0
|
||||
* A open source Flat UI KIT based on Twitter Bootstrap 3.1.0 css framework.
|
||||
* http://http://bootflat.github.io/
|
||||
*
|
||||
* By @flathemes
|
||||
*
|
||||
* Licensed under the MIT license. Please see LICENSE for more information.
|
||||
*
|
||||
*/
|
||||
|
||||
@import
|
||||
|
||||
// Variables, Extends, Mixins
|
||||
"bootflat/global",
|
||||
|
||||
// Base
|
||||
"bootflat/typography",
|
||||
"bootflat/button",
|
||||
"bootflat/button_group",
|
||||
"bootflat/label_badge",
|
||||
"bootflat/tooltip",
|
||||
"bootflat/popover",
|
||||
"bootflat/progress",
|
||||
"bootflat/breadcrumb",
|
||||
"bootflat/pagination",
|
||||
"bootflat/pager",
|
||||
"bootflat/form",
|
||||
"bootflat/checkbox_radio",
|
||||
"bootflat/alert",
|
||||
"bootflat/tab",
|
||||
"bootflat/pill",
|
||||
"bootflat/navbar",
|
||||
"bootflat/list",
|
||||
"bootflat/media_list",
|
||||
"bootflat/modal",
|
||||
"bootflat/well",
|
||||
"bootflat/thumbnail",
|
||||
"bootflat/jumbotron",
|
||||
"bootflat/panel",
|
||||
"bootflat/accordion",
|
||||
"bootflat/footer",
|
||||
"bootflat/dropdown";
|
||||
|
|
@ -1,76 +0,0 @@
|
|||
// Variables
|
||||
//------------------------------------------------------
|
||||
$accordion-border-color: $lightgray-dark !default;
|
||||
|
||||
$accordion-panel-font-color: $darkgray-dark !default;
|
||||
$accordion-panel-font-color-hover: $mediumgray-dark !default;
|
||||
$accordion-panel-radius: 4px !default;
|
||||
|
||||
$accordion-panel-shadow: 0 1px 2px rgba(0, 0, 0, .2) !default;
|
||||
|
||||
$accordion-panel-background-color: $white !default;
|
||||
|
||||
|
||||
|
||||
// Exports
|
||||
//------------------------------------------------------
|
||||
|
||||
@include exports("accordion") {
|
||||
|
||||
/**
|
||||
* accordion
|
||||
* --------------------------------------------------
|
||||
*/
|
||||
.panel-group {
|
||||
& .panel {
|
||||
@include radius($type: border-radius, $value: 0);
|
||||
background-color: transparent;
|
||||
@include box-shadow($value: none);
|
||||
}
|
||||
& .panel+.panel {
|
||||
margin-top: 0;
|
||||
}
|
||||
& .panel-heading {
|
||||
padding: 0;
|
||||
border-bottom-color: transparent;
|
||||
}
|
||||
& .panel-heading+.panel-collapse .panel-body {
|
||||
padding: 15px 0;
|
||||
border-top-color: transparent;
|
||||
}
|
||||
& .panel-title a {
|
||||
padding: 10px 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
.panel-group-lists {
|
||||
& .panel {
|
||||
border-bottom: 1px solid $accordion-border-color;
|
||||
background-color: $accordion-panel-background-color;
|
||||
@include box-shadow($value: $accordion-panel-shadow);
|
||||
}
|
||||
& .panel:first-child {
|
||||
@include radius($type: border-radius, $value: $accordion-panel-radius $accordion-panel-radius 0 0);
|
||||
}
|
||||
& .panel:last-child {
|
||||
@include radius($type: border-radius, $value: 0 0 $accordion-panel-radius $accordion-panel-radius);
|
||||
border-bottom: none;
|
||||
}
|
||||
& .panel-heading+.panel-collapse .panel-body {
|
||||
padding: 15px;
|
||||
border-top-color: $accordion-border-color;
|
||||
}
|
||||
& .panel-title a {
|
||||
padding: 10px 15px;
|
||||
color: $accordion-panel-font-color;
|
||||
}
|
||||
& .panel-title a:hover,
|
||||
& .panel-title a:focus,
|
||||
& .panel-title a:active {
|
||||
color: $accordion-panel-font-color-hover;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -1,75 +0,0 @@
|
|||
// Variables
|
||||
//------------------------------------------------------
|
||||
$alert-primary: $aqua-light !default;
|
||||
$alert-success: $grass-light !default;
|
||||
$alert-danger: $grapefruit-light !default;
|
||||
$alert-warning: $sunflower-light !default;
|
||||
|
||||
$alert-close-color: $black !default;
|
||||
|
||||
$alert-link-color: $mediumgray-light !default;
|
||||
|
||||
|
||||
// Exports
|
||||
//------------------------------------------------------
|
||||
|
||||
@include exports("alert") {
|
||||
|
||||
/**
|
||||
* alert
|
||||
* --------------------------------------------------
|
||||
*/
|
||||
.alert {
|
||||
|
||||
& h4 {
|
||||
margin-bottom: 10px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
&-dismissable .close {
|
||||
color: $alert-close-color;
|
||||
}
|
||||
|
||||
@at-root &-info {
|
||||
background-color: lighten($alert-primary, 10%);
|
||||
border: $alert-primary;
|
||||
}
|
||||
@at-root &-warning {
|
||||
background-color: lighten($alert-warning, 10%);
|
||||
border: $alert-warning;
|
||||
}
|
||||
@at-root &-danger {
|
||||
background-color: lighten($alert-danger, 10%);
|
||||
border: $alert-danger;
|
||||
}
|
||||
@at-root &-success {
|
||||
background-color: lighten($alert-success, 10%);
|
||||
border: $alert-success;
|
||||
}
|
||||
|
||||
@at-root & &-link {
|
||||
cursor: pointer;
|
||||
text-decoration: underline;
|
||||
@include opacity($opacity: 65, $filter: true);
|
||||
&:hover,
|
||||
&:focus {
|
||||
@include opacity($opacity: 45, $filter: true);
|
||||
}
|
||||
}
|
||||
|
||||
@at-root & .btn-link,
|
||||
& .btn-link:hover,
|
||||
& .btn-link:focus {
|
||||
color: $alert-close-color;
|
||||
@include opacity($opacity: 65, $filter: true);
|
||||
}
|
||||
@at-root & .btn-link:focus,
|
||||
& .btn-link:hover {
|
||||
text-decoration: none;
|
||||
@include opacity($opacity: 40, $filter: true);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -1,121 +0,0 @@
|
|||
// Variables
|
||||
//------------------------------------------------------
|
||||
$breadcrumb-font-color: $darkgray-dark !default;
|
||||
$breadcrumb-link-color: $aqua-dark !default;
|
||||
$breadcrumb-background-color: $lightgray-dark !default;
|
||||
|
||||
$breadcrumb-arrow-radius: 4px !default;
|
||||
$breadcrumb-arrow-font-color: $white !default;
|
||||
$breadcrumb-arrow-background-color: $aqua-dark !default;
|
||||
$breadcrumb-arrow-background-color-hover: $aqua-light !default;
|
||||
|
||||
// Exports
|
||||
//------------------------------------------------------
|
||||
@include exports("breadcrumb") {
|
||||
|
||||
/**
|
||||
* breadcrumb
|
||||
* --------------------------------------------------
|
||||
*/
|
||||
.breadcrumb {
|
||||
color: $breadcrumb-font-color;
|
||||
background-color: $breadcrumb-background-color;
|
||||
& > .active {
|
||||
color: $breadcrumb-font-color;
|
||||
}
|
||||
& a {
|
||||
color: $breadcrumb-link-color;
|
||||
}
|
||||
}
|
||||
|
||||
.breadcrumb-arrow {
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
background-color: $breadcrumb-background-color;
|
||||
height: 36px;
|
||||
line-height: 36px;
|
||||
|
||||
& li:first-child a {
|
||||
@include radius($type: border-radius, $value: $breadcrumb-arrow-radius 0 0 $breadcrumb-arrow-radius);
|
||||
}
|
||||
& li,
|
||||
& li a,
|
||||
& li span{
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
}
|
||||
& li:not(:first-child) {
|
||||
margin-left: -5px;
|
||||
}
|
||||
& li + li:before {
|
||||
padding: 0;
|
||||
content: "";
|
||||
}
|
||||
& li span {
|
||||
padding: 0 10px;
|
||||
}
|
||||
& li a,
|
||||
& li:not(:first-child) span {
|
||||
padding: 0 10px 0 25px;
|
||||
height: 35px;
|
||||
line-height: 35px;
|
||||
}
|
||||
& li:first-child a {
|
||||
padding: 0 10px;
|
||||
}
|
||||
& li a {
|
||||
position: relative;
|
||||
border: 1px solid $breadcrumb-arrow-background-color;
|
||||
color: $breadcrumb-arrow-font-color;
|
||||
background-color: $breadcrumb-arrow-background-color;
|
||||
text-decoration: none;
|
||||
}
|
||||
& li:first-child a {
|
||||
padding-left: 10px;
|
||||
}
|
||||
& li a:before,
|
||||
& li a:after {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
content: '';
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-top: 17px solid transparent;
|
||||
border-bottom: 17px solid transparent;
|
||||
}
|
||||
& li a:before {
|
||||
right: -10px;
|
||||
border-left-width: 10px;
|
||||
border-left-style: solid;
|
||||
border-left-color: $breadcrumb-arrow-background-color;
|
||||
z-index: 3;
|
||||
}
|
||||
& li a:after{
|
||||
right: -11px;
|
||||
border-left: 10px solid darken($breadcrumb-arrow-background-color, 10%);
|
||||
z-index: 2;
|
||||
}
|
||||
& li a:hover,
|
||||
& li a:focus {
|
||||
background-color: $breadcrumb-arrow-background-color-hover;
|
||||
border: 1px solid $breadcrumb-arrow-background-color-hover;
|
||||
}
|
||||
& li a:hover:before,
|
||||
& li a:focus:before {
|
||||
border-left-color: $breadcrumb-arrow-background-color-hover;
|
||||
}
|
||||
& li a:active {
|
||||
background-color: darken($breadcrumb-arrow-background-color, 10%);
|
||||
border: 1px solid darken($breadcrumb-arrow-background-color, 10%);
|
||||
}
|
||||
& li a:active:before,
|
||||
& li a:active:after {
|
||||
border-left-color: darken($breadcrumb-arrow-background-color, 10%);
|
||||
}
|
||||
& li span {
|
||||
color: $breadcrumb-font-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -1,205 +0,0 @@
|
|||
// Variables
|
||||
//------------------------------------------------------
|
||||
$button-normal: $mediumgray-dark !default;
|
||||
$button-default: $white !default;
|
||||
$button-primary: $aqua-dark !default;
|
||||
$button-success: $grass-dark !default;
|
||||
$button-danger: $grapefruit-dark !default;
|
||||
$button-warning: $sunflower-dark !default;
|
||||
$button-info: $mint-dark !default;
|
||||
|
||||
$button-normal-hover: $mediumgray-light !default;
|
||||
$button-default-hover: $button-default !default;
|
||||
$button-primary-hover: $aqua-light !default;
|
||||
$button-success-hover: $grass-light !default;
|
||||
$button-danger-hover: $grapefruit-light !default;
|
||||
$button-warning-hover: $sunflower-light !default;
|
||||
$button-info-hover: $mint-light !default;
|
||||
|
||||
$button-font-color-dark: $darkgray-dark !default;
|
||||
$button-font-color-light: $white !default;
|
||||
|
||||
$button-opacity: 45 !default;
|
||||
$button-shaodw: inset 0 1px 2px rgba(0, 0, 0, .125) !default;
|
||||
|
||||
// Exports
|
||||
//------------------------------------------------------
|
||||
|
||||
@include exports("button") {
|
||||
|
||||
/**
|
||||
* button
|
||||
* --------------------------------------------------
|
||||
*/
|
||||
.btn {
|
||||
color: $button-font-color-light;
|
||||
|
||||
&,
|
||||
&.disabled,
|
||||
&[disabled] {
|
||||
border-color: $button-normal;
|
||||
background-color: $button-normal;
|
||||
}
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active,
|
||||
&.active {
|
||||
color: $button-font-color-light;
|
||||
border-color: $button-normal-hover;
|
||||
background-color: $button-normal-hover;
|
||||
outline: none !important;
|
||||
}
|
||||
&:active,
|
||||
&.active {
|
||||
@include box-shadow($value: $button-shaodw);
|
||||
}
|
||||
&.disabled,
|
||||
&[disabled] {
|
||||
@include opacity($opacity: $button-opacity, $filter: true);
|
||||
}
|
||||
|
||||
@at-root &-link {
|
||||
&,
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active,
|
||||
&.active,
|
||||
&.disabled,
|
||||
&[disabled] {
|
||||
border-color: transparent;
|
||||
background-color: transparent;
|
||||
color: $button-primary;
|
||||
@include box-shadow($value: none);
|
||||
}
|
||||
&:hover,
|
||||
&:focus {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
@at-root &-default {
|
||||
color: $button-font-color-dark;
|
||||
border-color: $button-normal !important;
|
||||
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active,
|
||||
&.active {
|
||||
border-color: $button-normal-hover;
|
||||
background-color: $button-normal-hover;
|
||||
}
|
||||
&,
|
||||
&.disabled,
|
||||
&[disabled] {
|
||||
background-color: $button-default;
|
||||
}
|
||||
}
|
||||
@at-root .open .dropdown-toggle.btn-default {
|
||||
border-color: $button-normal-hover;
|
||||
background-color: $button-normal-hover;
|
||||
}
|
||||
|
||||
@at-root &-primary {
|
||||
&,
|
||||
&:active,
|
||||
&.active,
|
||||
&.disabled,
|
||||
&[disabled] {
|
||||
border-color: $button-primary;
|
||||
background-color: $button-primary;
|
||||
}
|
||||
&:hover,
|
||||
&:focus {
|
||||
border-color: $button-primary-hover;
|
||||
background-color: $button-primary-hover;
|
||||
}
|
||||
}
|
||||
@at-root .open .dropdown-toggle.btn-primary {
|
||||
border-color: $button-primary-hover;
|
||||
background-color: $button-primary-hover;
|
||||
}
|
||||
|
||||
@at-root &-info {
|
||||
&,
|
||||
&:active,
|
||||
&.active,
|
||||
&.disabled,
|
||||
&[disabled] {
|
||||
border-color: $button-info;
|
||||
background-color: $button-info;
|
||||
}
|
||||
&:hover,
|
||||
&:focus {
|
||||
border-color: $button-info-hover;
|
||||
background-color: $button-info-hover;
|
||||
}
|
||||
}
|
||||
@at-root .open .dropdown-toggle.btn-info {
|
||||
border-color: $button-info-hover;
|
||||
background-color: $button-info-hover;
|
||||
}
|
||||
|
||||
@at-root &-success {
|
||||
&,
|
||||
&:active,
|
||||
&.active,
|
||||
&.disabled,
|
||||
&[disabled] {
|
||||
border-color: $button-success;
|
||||
background-color: $button-success;
|
||||
}
|
||||
&:hover,
|
||||
&:focus {
|
||||
border-color: $button-success-hover;
|
||||
background-color: $button-success-hover;
|
||||
}
|
||||
}
|
||||
@at-root .open .dropdown-toggle.btn-success {
|
||||
border-color: $button-success-hover;
|
||||
background-color: $button-success-hover;
|
||||
}
|
||||
|
||||
@at-root &-warning {
|
||||
&,
|
||||
&:active,
|
||||
&.active,
|
||||
&.disabled,
|
||||
&[disabled] {
|
||||
border-color: $button-warning;
|
||||
background-color: $button-warning;
|
||||
}
|
||||
&:hover,
|
||||
&:focus {
|
||||
border-color: $button-warning-hover;
|
||||
background-color: $button-warning-hover;
|
||||
}
|
||||
}
|
||||
@at-root .open .dropdown-toggle.btn-warning {
|
||||
border-color: $button-warning-hover;
|
||||
background-color: $button-warning-hover;
|
||||
}
|
||||
|
||||
@at-root &-danger {
|
||||
&,
|
||||
&:active,
|
||||
&.active,
|
||||
&.disabled,
|
||||
&[disabled],
|
||||
.open .dropdown-toggle.btn {
|
||||
border-color: $button-danger;
|
||||
background-color: $button-danger;
|
||||
}
|
||||
&:hover,
|
||||
&:focus {
|
||||
border-color: $button-danger-hover;
|
||||
background-color: $button-danger-hover;
|
||||
}
|
||||
}
|
||||
@at-root .open .dropdown-toggle.btn-danger {
|
||||
border-color: $button-danger-hover;
|
||||
background-color: $button-danger-hover;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -1,133 +0,0 @@
|
|||
// Exports
|
||||
//------------------------------------------------------
|
||||
|
||||
@include exports("button-group") {
|
||||
|
||||
/**
|
||||
* button-group
|
||||
* --------------------------------------------------
|
||||
*/
|
||||
.btn-group {
|
||||
@at-root &.open .dropdown-toggle {
|
||||
@include box-shadow($value: inset 0 1px 2px rgba(0, 0, 0, .125));
|
||||
}
|
||||
|
||||
& .btn {
|
||||
border-left-color: darken($button-normal, 7%);
|
||||
}
|
||||
|
||||
@at-root &.open .btn-default.dropdown-toggle,
|
||||
& .btn-default:focus,
|
||||
& .btn-default:active,
|
||||
& .btn-default.active {
|
||||
color: $button-default;
|
||||
}
|
||||
|
||||
& .btn-primary,
|
||||
& .btn-primary:focus,
|
||||
& .btn-primary:active,
|
||||
& .btn-primary.active {
|
||||
border-left-color: darken($button-primary, 7%);
|
||||
}
|
||||
|
||||
& .btn-success,
|
||||
& .btn-success:focus,
|
||||
& .btn-success:active,
|
||||
& .btn-success.active {
|
||||
border-left-color: darken($button-success, 7%);
|
||||
}
|
||||
|
||||
& .btn-warning,
|
||||
& .btn-warning:focus,
|
||||
& .btn-warning:active,
|
||||
& .btn-warning.active {
|
||||
border-left-color: darken($button-warning, 12%);
|
||||
}
|
||||
|
||||
& .btn-danger,
|
||||
& .btn-danger:focus,
|
||||
& .btn-danger:active,
|
||||
& .btn-danger.active {
|
||||
border-left-color: darken($button-danger, 7%);
|
||||
}
|
||||
|
||||
& .btn-info,
|
||||
& .btn-info:focus,
|
||||
& .btn-info:active,
|
||||
& .btn-info.active {
|
||||
border-left-color: darken($button-info, 7%);
|
||||
}
|
||||
|
||||
& .btn:first-child,
|
||||
& .btn-primary:first-child,
|
||||
& .btn-success:first-child,
|
||||
& .btn-warning:first-child,
|
||||
& .btn-danger:first-child,
|
||||
& .btn-info:first-child {
|
||||
border-left-color: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-group-vertical {
|
||||
& .btn,
|
||||
& .btn-group .btn-primary {
|
||||
border-top-color: darken($button-normal, 7%) !important;
|
||||
}
|
||||
|
||||
& .btn-primary,
|
||||
& .btn-primary:focus,
|
||||
& .btn-primary:active,
|
||||
& .btn-primary.active,
|
||||
& .btn-group .btn-primary {
|
||||
border-top-color: darken($button-primary, 7%) !important;
|
||||
}
|
||||
|
||||
& .btn-success,
|
||||
& .btn-success:focus,
|
||||
& .btn-success:active,
|
||||
& .btn-success.active,
|
||||
& .btn-group .btn-success {
|
||||
border-top-color: darken($button-success, 7%) !important;
|
||||
}
|
||||
|
||||
& .btn-warning,
|
||||
& .btn-warning:focus,
|
||||
& .btn-warning:active,
|
||||
& .btn-warning.active,
|
||||
& .btn-group .btn-warning {
|
||||
border-top-color: darken($button-warning, 12%) !important;
|
||||
}
|
||||
|
||||
& .btn-danger,
|
||||
& .btn-danger:focus,
|
||||
& .btn-danger:active,
|
||||
& .btn-danger.active,
|
||||
& .btn-group .btn-danger {
|
||||
border-top-color: darken($button-danger, 7%) !important;
|
||||
}
|
||||
|
||||
& .btn-info,
|
||||
& .btn-info:focus,
|
||||
& .btn-info:active,
|
||||
& .btn-info.active,
|
||||
& .btn-group .btn-info {
|
||||
border-top-color: darken($button-info, 7%) !important;
|
||||
}
|
||||
|
||||
& .btn:not(.btn-default):first-child,
|
||||
& .btn-primary:first-child,
|
||||
& .btn-success:first-child,
|
||||
& .btn-warning:first-child,
|
||||
& .btn-danger:first-child,
|
||||
& .btn-info:first-child {
|
||||
border-top: none;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
|
@ -1,62 +0,0 @@
|
|||
// Variables
|
||||
//------------------------------------------------------
|
||||
$img-src: "../bootflat/img/check_flat/default.png" !default;
|
||||
|
||||
// Exports
|
||||
//------------------------------------------------------
|
||||
|
||||
@include exports("checkbox-radio") {
|
||||
|
||||
/**
|
||||
* checkbox and radio
|
||||
* --------------------------------------------------
|
||||
*/
|
||||
.checkbox, .radio {
|
||||
margin-top: 0;
|
||||
padding-left: 0;
|
||||
}
|
||||
.icheckbox_flat,
|
||||
.iradio_flat {
|
||||
display: inline-block;
|
||||
*display: inline;
|
||||
vertical-align: middle;
|
||||
margin: 0;
|
||||
padding: 0 !important;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
background: url($img-src) no-repeat;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.icheckbox_flat {
|
||||
background-position: 0 0;
|
||||
|
||||
&.checked {
|
||||
background-position: -22px 0;
|
||||
}
|
||||
&.disabled {
|
||||
background-position: -44px 0;
|
||||
cursor: default;
|
||||
}
|
||||
&.checked.disabled {
|
||||
background-position: -66px 0;
|
||||
}
|
||||
}
|
||||
|
||||
.iradio_flat {
|
||||
background-position: -88px 0;
|
||||
|
||||
&.checked {
|
||||
background-position: -110px 0;
|
||||
}
|
||||
&.disabled {
|
||||
background-position: -132px 0;
|
||||
cursor: default;
|
||||
}
|
||||
&.checked.disabled {
|
||||
background-position: -154px 0;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -1,122 +0,0 @@
|
|||
// Variables
|
||||
//------------------------------------------------------
|
||||
$dropdown-background-color: $darkgray-dark !default;
|
||||
$dropdown-background-color-hover: $darkgray-light !default;
|
||||
|
||||
$dropdown-normal: $mediumgray-dark !default;
|
||||
$dropdown-default: $white !default;
|
||||
|
||||
$dropdown-padding: 5px 20px !default;
|
||||
|
||||
$dropdown-radius: 4px !default;
|
||||
|
||||
$dropdown-font-size: 14px !default;
|
||||
$dropdown-font-color-dark: $darkgray-dark !default;
|
||||
$dropdown-font-color-light: $white !default;
|
||||
$dropdown-font-weight: 700 !default;
|
||||
|
||||
// Exports
|
||||
//------------------------------------------------------
|
||||
|
||||
@include exports("dropdown") {
|
||||
|
||||
/**
|
||||
* dropdown-menu
|
||||
* --------------------------------------------------
|
||||
*/
|
||||
.dropdown-menu {
|
||||
border: none;
|
||||
background-color: $dropdown-background-color;
|
||||
|
||||
& .dropdown-header {
|
||||
padding: $dropdown-padding;
|
||||
font-size: $dropdown-font-size;
|
||||
font-weight: $dropdown-font-weight;
|
||||
color: $dropdown-normal;
|
||||
}
|
||||
|
||||
& li a {
|
||||
padding: $dropdown-padding;
|
||||
color: $dropdown-font-color-light;
|
||||
}
|
||||
& li a:hover,
|
||||
& li a:focus,
|
||||
& .active a,
|
||||
& .active a:hover,
|
||||
& .active a:focus{
|
||||
color: $dropdown-font-color-light;
|
||||
background-color: $dropdown-background-color-hover;
|
||||
outline: none;
|
||||
}
|
||||
& .disabled a,
|
||||
& .disabled a:hover,
|
||||
& .disabled a:focus {
|
||||
color: $dropdown-background-color-hover;
|
||||
cursor: default;
|
||||
}
|
||||
& .divider {
|
||||
background-color: $dropdown-background-color-hover;
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
@at-root .dropup & {
|
||||
margin-bottom: 0;
|
||||
@include radius($type: border-radius, $value: $dropdown-radius $dropdown-radius 0 0);
|
||||
}
|
||||
}
|
||||
/**
|
||||
* dropdown-submenu
|
||||
* --------------------------------------------------
|
||||
*/
|
||||
.dropdown-submenu {
|
||||
position: relative;
|
||||
|
||||
& .dropdown-menu {
|
||||
top: 0;
|
||||
left: 100%;
|
||||
margin-top: -6px;
|
||||
margin-left: -1px;
|
||||
@include radius($type: border-radius, $value: 0 4px 4px 4px);
|
||||
}
|
||||
&:hover .dropdown-menu {
|
||||
display: block;
|
||||
}
|
||||
.dropup & .dropdown-menu {
|
||||
top: auto;
|
||||
bottom: 0;
|
||||
margin-top: 0;
|
||||
margin-bottom: -2px;
|
||||
@include radius($type: border-radius, $value: 4px 4px 4px 0);
|
||||
}
|
||||
& > a:after {
|
||||
display: block;
|
||||
content: " ";
|
||||
float: right;
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-color: transparent;
|
||||
border-style: solid;
|
||||
border-width: 5px 0 5px 5px;
|
||||
border-left-color: $dropdown-default;
|
||||
margin-top: 5px;
|
||||
margin-right: -10px;
|
||||
}
|
||||
@at-root .dropdown-default & > a:after {
|
||||
border-left-color: $dropdown-font-color-dark;
|
||||
}
|
||||
&:hover a:after {
|
||||
border-left-color: $dropdown-default;
|
||||
}
|
||||
&.pull-left {
|
||||
float: none;
|
||||
}
|
||||
&.pull-left .dropdown-menu {
|
||||
left: -100%;
|
||||
margin-left: 10px;
|
||||
@include radius($type: border-radius, $value: 4px 0 4px 4px);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -1,82 +0,0 @@
|
|||
// Variables
|
||||
//------------------------------------------------------
|
||||
$footer-background-color: $darkgray-dark !default;
|
||||
$footer-menu-title-color: $lightgray-dark !default;
|
||||
$footer-menu-item-color: $mediumgray-dark !default;
|
||||
$footer-menu-item-color-hover: $mediumgray-light !default;
|
||||
$footer-logo-color: $white !default;
|
||||
|
||||
|
||||
|
||||
// Exports
|
||||
//------------------------------------------------------
|
||||
|
||||
@include exports("footer") {
|
||||
|
||||
/**
|
||||
* footer
|
||||
* --------------------------------------------------
|
||||
*/
|
||||
|
||||
.footer {
|
||||
padding: 40px 0;
|
||||
background-color: $footer-background-color;
|
||||
|
||||
&-logo,
|
||||
&-nav {
|
||||
float: left;
|
||||
padding: 0 20px;
|
||||
width: 20%;
|
||||
}
|
||||
@media (max-width: 768px) {
|
||||
&-logo {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
&-logo,
|
||||
&-nav {
|
||||
float: none;
|
||||
display: block;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
&-logo {
|
||||
margin-top: -5px;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
|
||||
& img {
|
||||
margin-right: 10px;
|
||||
}
|
||||
& a {
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
color: $footer-logo-color;
|
||||
}
|
||||
& a:hover,
|
||||
& a:active {
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
&-nav .nav-title {
|
||||
margin-bottom: 15px;
|
||||
color: $footer-menu-title-color;
|
||||
}
|
||||
&-nav .nav-item {
|
||||
line-height: 28px;
|
||||
& > a {
|
||||
color: $footer-menu-item-color;
|
||||
}
|
||||
& > a:hover,
|
||||
& > a:active {
|
||||
color: $footer-menu-item-color-hover;
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
&-copyright {
|
||||
color: $footer-menu-item-color;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -1,212 +0,0 @@
|
|||
// Variables
|
||||
//------------------------------------------------------
|
||||
$form-normal: $mediumgray-dark !default;
|
||||
$form-default: $white !default;
|
||||
$form-primary: $aqua-dark !default;
|
||||
$form-success: $grass-dark !default;
|
||||
$form-danger: $grapefruit-dark !default;
|
||||
$form-warning: $sunflower-dark !default;
|
||||
$form-info: $mint-dark !default;
|
||||
|
||||
$message-success: $grass-dark !default;
|
||||
$message-danger: $grapefruit-dark !default;
|
||||
$message-warning: $sunflower-dark !default;
|
||||
|
||||
$form-font-color: $darkgray-dark !default;
|
||||
$form-placeholder-font-color: $lightgray-dark !default;
|
||||
|
||||
$form-disabled-color: $lightgray-dark !default;
|
||||
|
||||
$search-query-value: 17px !default;
|
||||
|
||||
$search-icon-width: 30px !default;
|
||||
$search-icon-line-height: 30px !default;
|
||||
|
||||
// Exports
|
||||
//------------------------------------------------------
|
||||
|
||||
@include exports("form") {
|
||||
|
||||
/**
|
||||
* form
|
||||
* --------------------------------------------------
|
||||
*/
|
||||
.form-control {
|
||||
color: $form-font-color;
|
||||
border-color: $form-normal;
|
||||
|
||||
&,
|
||||
&:focus {
|
||||
@include box-shadow($value: none);
|
||||
}
|
||||
&:focus {
|
||||
border-color: $form-primary;
|
||||
}
|
||||
&::-moz-placeholder,
|
||||
&:-ms-input-placeholder,
|
||||
&::-webkit-input-placeholder {
|
||||
color: $form-placeholder-font-color;
|
||||
}
|
||||
|
||||
&.disabled,
|
||||
&[disabled] {
|
||||
border-color: $form-disabled-color;
|
||||
background-color: $form-disabled-color;
|
||||
}
|
||||
}
|
||||
|
||||
.input-group-btn {
|
||||
& .btn + .btn {
|
||||
border-width: 1px;
|
||||
border-style: solid;
|
||||
border-color: darken($form-normal, 7%);
|
||||
}
|
||||
& .btn + .btn.btn-default {
|
||||
border-color: darken($form-default, 7%);
|
||||
}
|
||||
& .btn + .btn.btn-primary {
|
||||
border-color: darken($form-primary, 7%);
|
||||
}
|
||||
& .btn + .btn.btn-info {
|
||||
border-color: darken($form-info, 7%);
|
||||
}
|
||||
& .btn + .btn.btn-success {
|
||||
border-color: darken($form-success, 7%);
|
||||
}
|
||||
& .btn + .btn.btn-warning {
|
||||
border-color: darken($form-warning, 7%);
|
||||
}
|
||||
& .btn + .btn.btn-danger {
|
||||
border-color: darken($form-danger, 7%);
|
||||
}
|
||||
}
|
||||
|
||||
.input-group-addon {
|
||||
background-color: $form-normal;
|
||||
border-color: darken($form-normal, 7%);
|
||||
color: $form-default;
|
||||
|
||||
& .radio,
|
||||
& .checkbox {
|
||||
margin: -3px 0 -4px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.form-search {
|
||||
& .search-query,
|
||||
& .search-query:first-child,
|
||||
& .search-query:last-child {
|
||||
padding: 0 $search-query-value;
|
||||
@include radius($type: border-radius, $value: $search-query-value);
|
||||
}
|
||||
@at-root .input-group .form-control:last-child {
|
||||
// padding: 0 $search-query-value 0 10px;
|
||||
@include radius($type: border-top-left-radius, $value: 0);
|
||||
@include radius($type: border-bottom-left-radius, $value: 0);
|
||||
}
|
||||
@at-root .input-group .form-control:first-child {
|
||||
@include radius($type: border-top-right-radius, $value: 0);
|
||||
@include radius($type: border-bottom-right-radius, $value: 0);
|
||||
}
|
||||
& .btn {
|
||||
@include radius($type: border-radius, $value: $search-query-value);
|
||||
}
|
||||
}
|
||||
|
||||
.search-only {
|
||||
position: relative;
|
||||
& .search-icon {
|
||||
position: absolute;
|
||||
top: 2px;
|
||||
left: $search-query-value / 2;
|
||||
width: $search-icon-width;
|
||||
line-height: $search-icon-line-height;
|
||||
text-align: center;
|
||||
font-size: $search-query-value;
|
||||
color: $form-placeholder-font-color;
|
||||
z-index: 20;
|
||||
}
|
||||
& .form-control:last-child {
|
||||
padding-left: $search-icon-width + 10;
|
||||
}
|
||||
}
|
||||
|
||||
.has-success {
|
||||
& .help-block,
|
||||
& .control-label,
|
||||
& .radio,
|
||||
& .checkbox,
|
||||
& .radio-inline,
|
||||
& .checkbox-inline {
|
||||
color: $message-success;
|
||||
}
|
||||
& .form-control {
|
||||
border-color: $message-success;
|
||||
@include box-shadow($value: none);
|
||||
}
|
||||
& .form-control:focus {
|
||||
border-color: $message-success;
|
||||
@include box-shadow($value: none);
|
||||
}
|
||||
& .input-group-addon {
|
||||
background-color: $message-success;
|
||||
border-color: $message-success;
|
||||
}
|
||||
& .form-control-feedback {
|
||||
color: $message-success;
|
||||
}
|
||||
}
|
||||
.has-warning {
|
||||
& .help-block,
|
||||
& .control-label,
|
||||
& .radio,
|
||||
& .checkbox,
|
||||
& .radio-inline,
|
||||
& .checkbox-inline {
|
||||
color: $message-warning;
|
||||
}
|
||||
& .form-control {
|
||||
border-color: $message-warning;
|
||||
@include box-shadow($value: none);
|
||||
}
|
||||
& .form-control:focus {
|
||||
border-color: $message-warning;
|
||||
@include box-shadow($value: none);
|
||||
}
|
||||
& .input-group-addon {
|
||||
background-color: $message-warning;
|
||||
border-color: $message-warning;
|
||||
}
|
||||
& .form-control-feedback {
|
||||
color: $message-warning;
|
||||
}
|
||||
}
|
||||
.has-error {
|
||||
& .help-block,
|
||||
& .control-label,
|
||||
& .radio,
|
||||
& .checkbox,
|
||||
& .radio-inline,
|
||||
& .checkbox-inline {
|
||||
color: $message-danger;
|
||||
}
|
||||
& .form-control {
|
||||
border-color: $message-danger;
|
||||
@include box-shadow($value: none);
|
||||
}
|
||||
& .form-control:focus {
|
||||
border-color: $message-danger;
|
||||
@include box-shadow($value: none);
|
||||
}
|
||||
& .input-group-addon {
|
||||
background-color: $message-danger;
|
||||
border-color: $message-danger;
|
||||
}
|
||||
& .form-control-feedback {
|
||||
color: $message-danger;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -1,239 +0,0 @@
|
|||
// Global Variables
|
||||
//------------------------------------------------------
|
||||
$modules: () !default;
|
||||
|
||||
$experimental: true !default;
|
||||
|
||||
// prefix elements
|
||||
$prefix-webkit: true !global;
|
||||
$prefix-moz: true !global;
|
||||
$prefix-spec: true !global;
|
||||
|
||||
// color elements
|
||||
$white: #FFF !default;
|
||||
$black: #000 !default;
|
||||
|
||||
$bluejeans-dark: #4A89DC !default;
|
||||
$bluejeans-light: #5D9CEC !default;
|
||||
|
||||
$aqua-dark: #3BAFDA !default;
|
||||
$aqua-light: #4FC1E9 !default;
|
||||
|
||||
$mint-dark: #37BC9B !default;
|
||||
$mint-light: #48CFAD !default;
|
||||
|
||||
$grass-dark: #8CC152 !default;
|
||||
$grass-light: #A0D468 !default;
|
||||
|
||||
$sunflower-dark: #F6BB42 !default;
|
||||
$sunflower-light: #FFCE54 !default;
|
||||
|
||||
$bittersweet-dark: #E9573F !default;
|
||||
$bittersweet-light: #FC6E51 !default;
|
||||
|
||||
$grapefruit-dark: #DA4453 !default;
|
||||
$grapefruit-light: #ED5565 !default;
|
||||
|
||||
$lavender-dark: #967ADC !default;
|
||||
$lavender-light: #AC92EC !default;
|
||||
|
||||
$pinkrose-dark: #D770AD !default;
|
||||
$pinkrose-light: #EC87C0 !default;
|
||||
|
||||
$lightgray-dark: #E6E9ED !default;
|
||||
$lightgray-light: #F5F7FA !default;
|
||||
|
||||
$mediumgray-dark: #AAB2BD !default;
|
||||
$mediumgray-light: #CCD1D9 !default;
|
||||
|
||||
$darkgray-dark: #434A54 !default;
|
||||
$darkgray-light: #656D78 !default;
|
||||
|
||||
// Global Mixins
|
||||
//------------------------------------------------------
|
||||
|
||||
// We use this to loading scss files
|
||||
@mixin exports($name) {
|
||||
@if index($modules, $name) {
|
||||
} @else {
|
||||
$modules: append($modules, $name);
|
||||
@content;
|
||||
}
|
||||
}
|
||||
|
||||
// We use this to do set opacity
|
||||
@mixin opacity($opacity:50, $filter: true) {
|
||||
opacity: $opacity / 100;
|
||||
@if $filter {
|
||||
filter: alpha(opacity=$opacity);
|
||||
}
|
||||
}
|
||||
|
||||
// We use this to ellipsis text
|
||||
@mixin ellipsis($width: 100%) {
|
||||
display: inline-block;
|
||||
max-width: $width;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
// We use this to add across browser prefixes
|
||||
@mixin prefixer($property, $value, $prefixes: webkit moz spec) {
|
||||
@if $experimental {
|
||||
@each $prefix in $prefixes {
|
||||
@if $prefix != spec {
|
||||
@if $property == border-top-left-radius and $prefix == moz {
|
||||
@if $prefix-moz {
|
||||
-moz-border-radius-topleft: $value;
|
||||
}
|
||||
} @else if $property == border-top-right-radius and $prefix == moz {
|
||||
@if $prefix-moz {
|
||||
-moz-border-radius-topright: $value;
|
||||
}
|
||||
} @else if $property == border-bottom-right-radius and $prefix == moz {
|
||||
@if $prefix-moz {
|
||||
-moz-border-radius-bottomright: $value;
|
||||
}
|
||||
} @else if $property == border-bottom-left-radius and $prefix == moz {
|
||||
@if $prefix-moz {
|
||||
-moz-border-radius-bottomleft: $value;
|
||||
}
|
||||
} @else {
|
||||
@if $prefix == webkit {
|
||||
@if $prefix-webkit {
|
||||
-webkit-#{$property}: $value;
|
||||
}
|
||||
}
|
||||
@if $prefix == moz {
|
||||
@if $prefix-moz {
|
||||
-moz-#{$property}: $value;
|
||||
}
|
||||
}
|
||||
}
|
||||
} @else {
|
||||
@if $prefix-spec {
|
||||
#{$property}: $value;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// We use this to add box-sizing across browser prefixes
|
||||
@mixin box-sizing($value: border-box) {
|
||||
@include prefixer($property: box-sizing, $value: $value, $prefixes: webkit moz spec);
|
||||
}
|
||||
|
||||
// We use this to control border radius.
|
||||
@mixin radius($type: border-radius, $value: $global-radius) {
|
||||
@include prefixer($property: $type, $value: $value, $prefixes: webkit moz spec);
|
||||
}
|
||||
|
||||
// We use this to control box shadow.
|
||||
@mixin box-shadow($value) {
|
||||
@include prefixer($property: box-shadow, $value: $value, $prefixes: webkit moz spec);
|
||||
}
|
||||
// We use this to creat animation effect.
|
||||
// Examples:
|
||||
// @include keyframes(move-the-object) {
|
||||
// 0% { left: 100px; }
|
||||
// 100% { left: 200px; }
|
||||
// }
|
||||
// .object-to-animate {
|
||||
// @include animation(move-the-object .5s 1);
|
||||
// }
|
||||
@mixin animation ($value...) {
|
||||
@include prefixer($property: animation, $value: $value, $prefixes: webkit moz spec);
|
||||
}
|
||||
// Individual Animation Properties
|
||||
@mixin animation-name ($value...) {
|
||||
@include prefixer($property: animation-name, $value: $value, $prefixes: webkit moz spec);
|
||||
}
|
||||
@mixin animation-duration ($value...) {
|
||||
@include prefixer($property: animation-duration, $value: $value, $prefixes: webkit moz spec);
|
||||
}
|
||||
@mixin animation-timing-function ($value...) {
|
||||
// ease | linear | ease-in | ease-out | ease-in-out
|
||||
@include prefixer($property: animation-timing-function, $value: $value, $prefixes: webkit moz spec);
|
||||
}
|
||||
@mixin animation-iteration-count ($value...) {
|
||||
// infinite | <number>
|
||||
@include prefixer($property: animation-iteration-count, $value: $value, $prefixes: webkit moz spec);
|
||||
}
|
||||
@mixin animation-direction ($value...) {
|
||||
@include prefixer($property: animation-direction, $value: $value, $prefixes: webkit moz spec);
|
||||
}
|
||||
@mixin animation-play-state ($value...) {
|
||||
// running | paused
|
||||
@include prefixer($property: animation-play-state, $value: $value, $prefixes: webkit moz spec);
|
||||
}
|
||||
@mixin animation-delay ($value...) {
|
||||
@include prefixer($property: animation-delay, $value: $value, $prefixes: webkit moz spec);
|
||||
}
|
||||
@mixin animation-fill-mode ($value...) {
|
||||
// none | forwards | backwards | both
|
||||
@include prefixer($property: animation-fill-mode, $value: $value, $prefixes: webkit moz spec);
|
||||
}
|
||||
@mixin keyframes($name) {
|
||||
$original-prefix-webkit: $prefix-webkit;
|
||||
$original-prefix-moz: $prefix-moz;
|
||||
$original-prefix-spec: $prefix-spec;
|
||||
|
||||
@if $original-prefix-webkit {
|
||||
@include disable-prefix();
|
||||
$prefix-webkit: true !global;
|
||||
@-webkit-keyframes #{$name} {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
@if $original-prefix-moz {
|
||||
@include disable-prefix();
|
||||
$prefix-moz: true !global;
|
||||
@-moz-keyframes #{$name} {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
@if $original-prefix-spec {
|
||||
@include disable-prefix();
|
||||
$prefix-spec: true !global;
|
||||
@keyframes #{$name} {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
|
||||
$prefix-webkit: $original-prefix-webkit !global;
|
||||
$prefix-moz: $original-prefix-moz !global;
|
||||
$prefix-spec: $original-prefix-spec !global;
|
||||
}
|
||||
|
||||
// We use this to set transform.
|
||||
@mixin transform($value: none) {
|
||||
// none | <transform-function>
|
||||
@include prefixer($property: transform, $value: $value, $prefixes: webkit moz spec);
|
||||
}
|
||||
|
||||
@mixin transform-origin($value: 50%) {
|
||||
// x-axis - left | center | right | length | %
|
||||
// y-axis - top | center | bottom | length | %
|
||||
// z-axis - length
|
||||
@include prefixer($property: transform-origin, $value: $value, $prefixes: webkit moz spec);
|
||||
}
|
||||
|
||||
@mixin transform-style ($value: flat) {
|
||||
@include prefixer($property: transform-style, $value: $value, $prefixes: webkit moz spec);
|
||||
}
|
||||
|
||||
// We use this to set transition.
|
||||
// example: @include transition (all 2s ease-in-out);
|
||||
// @include transition (opacity 1s ease-in 2s, width 2s ease-out);
|
||||
// @include transition-property (transform, opacity);
|
||||
|
||||
@mixin transition ($value...) {
|
||||
@if length($value) >= 1 {
|
||||
@include prefixer($property: transition, $value: $value, $prefixes: webkit moz spec);
|
||||
} @else {
|
||||
$value: all 0.15s ease-out 0s;
|
||||
@include prefixer($property: transition, $value: $value, $prefixes: webkit moz spec);
|
||||
}
|
||||
}
|
||||
|
|
@ -1,80 +0,0 @@
|
|||
// Variables
|
||||
//------------------------------------------------------
|
||||
$jumbotron-font-color: $darkgray-dark !default;
|
||||
|
||||
$jumbotron-background-color: $white !default;
|
||||
|
||||
$jumbotron-radius: 4px;
|
||||
$jumbotron-shadow: 0 1px 2px rgba(0, 0, 0, .2) !default;
|
||||
|
||||
|
||||
// Exports
|
||||
//------------------------------------------------------
|
||||
|
||||
@include exports("jumbotron") {
|
||||
|
||||
/**
|
||||
* jumbotron
|
||||
* --------------------------------------------------
|
||||
*/
|
||||
.jumbotron {
|
||||
margin-bottom: 20px;
|
||||
padding: 0;
|
||||
@include radius($type: border-radius, $value: $jumbotron-radius);
|
||||
background-color: $jumbotron-background-color;
|
||||
@include box-shadow($value: $jumbotron-shadow);
|
||||
|
||||
@at-root .container & {
|
||||
@include radius($type: border-radius, $value: $jumbotron-radius);
|
||||
}
|
||||
|
||||
& > &-photo img {
|
||||
@include radius($type: border-radius, $value: $jumbotron-radius $jumbotron-radius 0 0);
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
& &-contents {
|
||||
padding: 20px;
|
||||
color: $jumbotron-font-color;
|
||||
}
|
||||
& .carousel,
|
||||
& .carousel-inner,
|
||||
& .carousel-inner > .item.active img {
|
||||
@include radius($type: border-radius, $value: $jumbotron-radius $jumbotron-radius 0 0);
|
||||
}
|
||||
& .carousel-control.left {
|
||||
@include radius($type: border-radius, $value: $jumbotron-radius 0 0 0);
|
||||
}
|
||||
& .carousel-control.right {
|
||||
@include radius($type: border-radius, $value: 0 $jumbotron-radius 0 0);
|
||||
}
|
||||
|
||||
& h1, & .h1,
|
||||
& h2, & .h2 {
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
& h1, & .h1 {
|
||||
font-size: 28px;
|
||||
}
|
||||
& h2, & .h2 {
|
||||
font-size: 24px;
|
||||
}
|
||||
& p {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 768px) {
|
||||
&,
|
||||
.container & {
|
||||
padding: 0;
|
||||
}
|
||||
& h1,
|
||||
& .h1 {
|
||||
font-size: 28px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -1,65 +0,0 @@
|
|||
// Variables
|
||||
//------------------------------------------------------
|
||||
$label-normal: $mediumgray-dark !default;
|
||||
$label-default: $white !default;
|
||||
$label-primary: $aqua-dark !default;
|
||||
$label-success: $grass-dark !default;
|
||||
$label-danger: $grapefruit-dark !default;
|
||||
$label-warning: $sunflower-dark !default;
|
||||
$label-info: $mint-dark !default;
|
||||
|
||||
$label-default-font-color: $darkgray-dark !default;
|
||||
|
||||
// Exports
|
||||
//------------------------------------------------------
|
||||
|
||||
@include exports("label-badge") {
|
||||
|
||||
/**
|
||||
* labels and badges
|
||||
* --------------------------------------------------
|
||||
*/
|
||||
.label,
|
||||
.badge {
|
||||
background-color: $label-normal;
|
||||
}
|
||||
|
||||
.label-default,
|
||||
.badge-default {
|
||||
border: 1px solid $button-normal;
|
||||
background-color: $label-default;
|
||||
color: $label-default-font-color;
|
||||
}
|
||||
|
||||
.label-primary,
|
||||
.badge-primary {
|
||||
border-color: $label-primary;
|
||||
background-color: $label-primary;
|
||||
}
|
||||
|
||||
.label-success,
|
||||
.badge-success {
|
||||
border-color: $label-success;
|
||||
background-color: $label-success;
|
||||
}
|
||||
|
||||
.label-danger,
|
||||
.badge-danger {
|
||||
border-color: $label-danger;
|
||||
background-color: $label-danger;
|
||||
}
|
||||
|
||||
.label-warning,
|
||||
.badge-warning {
|
||||
border-color: $label-warning;
|
||||
background-color: $label-warning;
|
||||
}
|
||||
|
||||
.label-info,
|
||||
.badge-info {
|
||||
border-color: $label-info;
|
||||
background-color: $label-info;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -1,188 +0,0 @@
|
|||
// Variables
|
||||
//------------------------------------------------------
|
||||
$list-primary: $aqua-light !default;
|
||||
$list-info: $mint-light !default;
|
||||
$list-warning: $sunflower-light !default;
|
||||
$list-success: $grass-light !default;
|
||||
$list-danger: $grapefruit-light !default;
|
||||
|
||||
$list-primary-hover: $aqua-dark !default;
|
||||
$list-info-hover: $mint-dark !default;
|
||||
$list-warning-hover: $sunflower-dark !default;
|
||||
$list-success-hover: $grass-dark !default;
|
||||
$list-danger-hover: $grapefruit-dark !default;
|
||||
|
||||
$list-border-color: $lightgray-dark !default;
|
||||
$list-background-color: $white !default;
|
||||
$list-font-color: $darkgray-dark !default;
|
||||
$list-font-color-hover: $mediumgray-dark !default;
|
||||
|
||||
$list-item-background-color: $lightgray-dark !default;
|
||||
|
||||
$list-radius: 4px !default;
|
||||
$list-shadow: 0 1px 2px rgba(0, 0, 0, .2) !default;
|
||||
|
||||
|
||||
|
||||
// Exports
|
||||
//------------------------------------------------------
|
||||
|
||||
@include exports("list") {
|
||||
|
||||
/**
|
||||
* list
|
||||
* --------------------------------------------------
|
||||
*/
|
||||
.list-group {
|
||||
@include radius($type: border-radius, $value: $list-radius);
|
||||
@include box-shadow($value: $list-shadow);
|
||||
@at-root &-item {
|
||||
border-color: transparent;
|
||||
border-top-color: $list-border-color;
|
||||
&:first-child {
|
||||
border-top: none;
|
||||
}
|
||||
@at-root &-heading {
|
||||
color: $list-font-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
a.list-group-item {
|
||||
color: $list-font-color;
|
||||
|
||||
& .list-group-item-heading {
|
||||
font-size: 16px;
|
||||
color: $list-font-color;
|
||||
}
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
background-color: $list-item-background-color;
|
||||
}
|
||||
&.active,
|
||||
&.active:hover,
|
||||
&.active:focus {
|
||||
background-color: $list-primary;
|
||||
border-color: $list-primary;
|
||||
}
|
||||
&.active .list-group-item-text,
|
||||
&.active:hover .list-group-item-text,
|
||||
&.active:focus .list-group-item-text {
|
||||
color: $list-background-color;
|
||||
}
|
||||
}
|
||||
.list-group-item-primary {
|
||||
color: darken($list-primary, 10%);
|
||||
border-color: $list-primary-hover transparent transparent transparent;
|
||||
background-color: $list-primary;
|
||||
&:first-child {
|
||||
border-color: transparent;
|
||||
}
|
||||
@at-root a.list-group-item-primary {
|
||||
color: darken($list-primary, 30%);
|
||||
&:hover,
|
||||
&:focus {
|
||||
color: $list-background-color;
|
||||
background-color: $list-primary-hover;
|
||||
}
|
||||
&.active,
|
||||
&:hover,
|
||||
&:focus {
|
||||
background-color: $list-primary-hover;
|
||||
border-color: $list-primary transparent transparent transparent;
|
||||
}
|
||||
}
|
||||
}
|
||||
.list-group-item-success {
|
||||
color: darken($list-success, 10%);
|
||||
border-color: $list-success-hover transparent transparent transparent;
|
||||
background-color: $list-success;
|
||||
&:first-child {
|
||||
border-color: transparent;
|
||||
}
|
||||
@at-root a.list-group-item-success {
|
||||
color: darken($list-success, 30%);
|
||||
&:hover,
|
||||
&:focus {
|
||||
color: $list-background-color;
|
||||
background-color: $list-success-hover;
|
||||
}
|
||||
&.active,
|
||||
&:hover,
|
||||
&:focus {
|
||||
background-color: $list-success-hover;
|
||||
border-color: $list-success transparent transparent transparent;
|
||||
}
|
||||
}
|
||||
}
|
||||
.list-group-item-warning {
|
||||
color: darken($list-warning, 10%);
|
||||
border-color: $list-warning-hover transparent transparent transparent;
|
||||
background-color: $list-warning;
|
||||
&:first-child {
|
||||
border-color: transparent;
|
||||
}
|
||||
@at-root a.list-group-item-warning {
|
||||
color: darken($list-warning, 40%);
|
||||
&:hover,
|
||||
&:focus {
|
||||
color: $list-background-color;
|
||||
background-color: $list-warning-hover;
|
||||
}
|
||||
&.active,
|
||||
&:hover,
|
||||
&:focus {
|
||||
background-color: $list-warning-hover;
|
||||
border-color: $list-warning transparent transparent transparent;
|
||||
}
|
||||
}
|
||||
}
|
||||
.list-group-item-info {
|
||||
color: darken($list-info, 10%);
|
||||
border-color: $list-info-hover transparent transparent transparent;
|
||||
background-color: $list-info;
|
||||
&:first-child {
|
||||
border-color: transparent;
|
||||
}
|
||||
@at-root a.list-group-item-info {
|
||||
color: darken($list-info, 30%);
|
||||
&:hover,
|
||||
&:focus {
|
||||
color: $list-background-color;
|
||||
background-color: $list-info-hover;
|
||||
}
|
||||
&.active,
|
||||
&:hover,
|
||||
&:focus {
|
||||
background-color: $list-info-hover;
|
||||
border-color: $list-info transparent transparent transparent;
|
||||
}
|
||||
}
|
||||
}
|
||||
.list-group-item-danger {
|
||||
color: darken($list-danger, 10%);
|
||||
border-color: $list-danger-hover transparent transparent transparent;
|
||||
background-color: $list-danger;
|
||||
&:first-child {
|
||||
border-color: transparent;
|
||||
}
|
||||
@at-root a.list-group-item-danger {
|
||||
color: darken($list-danger, 30%);
|
||||
&:hover,
|
||||
&:focus {
|
||||
color: $list-background-color;
|
||||
background-color: $list-danger-hover;
|
||||
}
|
||||
&.active,
|
||||
&:hover,
|
||||
&:focus {
|
||||
background-color: $list-danger-hover;
|
||||
border-color: $list-danger transparent transparent transparent;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -1,26 +0,0 @@
|
|||
// Variables
|
||||
//------------------------------------------------------
|
||||
$media-list-font-color-head: $darkgray-dark !default;
|
||||
$media-list-font-color-body: $mediumgray-dark !default;
|
||||
|
||||
|
||||
// Exports
|
||||
//------------------------------------------------------
|
||||
|
||||
@include exports("media-list") {
|
||||
|
||||
/**
|
||||
* media list
|
||||
* --------------------------------------------------
|
||||
*/
|
||||
.media-list {
|
||||
color: $media-list-font-color-body;
|
||||
@at-root .media-heading {
|
||||
font-size: 14px;
|
||||
color: $media-list-font-color-head;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -1,39 +0,0 @@
|
|||
// Variables
|
||||
//------------------------------------------------------
|
||||
$modal-font-color: $darkgray-dark !default;
|
||||
|
||||
$modal-radius: 4px;
|
||||
$modal-shadow: 0 1px 2px rgba(0, 0, 0, .2) !default;
|
||||
|
||||
|
||||
// Exports
|
||||
//------------------------------------------------------
|
||||
|
||||
@include exports("modal") {
|
||||
|
||||
/**
|
||||
* modal
|
||||
* --------------------------------------------------
|
||||
*/
|
||||
|
||||
.modal {
|
||||
&-content {
|
||||
border: none;
|
||||
@include radius($type: border-radius, $value: $modal-radius);
|
||||
color: $modal-font-color;
|
||||
@include box-shadow($value: $modal-shadow);
|
||||
}
|
||||
&-header {
|
||||
border-bottom: none;
|
||||
}
|
||||
&-body {
|
||||
padding: 0 15px;
|
||||
}
|
||||
&-footer {
|
||||
border-top: none;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -1,213 +0,0 @@
|
|||
// Variables
|
||||
//------------------------------------------------------
|
||||
$navbar-background-color: $mint-dark !default;
|
||||
$navbar-background-color-active: $mint-light !default;
|
||||
|
||||
$navbar-font-color: $white !default;
|
||||
$navbar-item-background-color-hover: $navbar-background-color-active !default;
|
||||
|
||||
$navbar-inverse-background-color: $black !default;
|
||||
|
||||
// Exports
|
||||
//------------------------------------------------------
|
||||
|
||||
@include exports("navbar") {
|
||||
|
||||
/**
|
||||
* navbar
|
||||
* --------------------------------------------------
|
||||
*/
|
||||
|
||||
.navbar-default {
|
||||
& {
|
||||
background-color: $navbar-background-color;
|
||||
border-color: $navbar-background-color;
|
||||
}
|
||||
& .navbar-brand,
|
||||
& .navbar-link,
|
||||
& .btn-link {
|
||||
color: darken($navbar-background-color, 15%);
|
||||
}
|
||||
& .navbar-brand:hover,
|
||||
& .navbar-brand:focus,
|
||||
& .navbar-link:hover,
|
||||
& .btn-link:hover,
|
||||
& .btn-link:focus {
|
||||
color: $navbar-font-color;
|
||||
background-color: transparent;
|
||||
}
|
||||
& .navbar-text,
|
||||
& .navbar-nav > li > a {
|
||||
color: darken($navbar-background-color, 15%);
|
||||
}
|
||||
& .navbar-nav > li > a:hover,
|
||||
& .navbar-nav > li > a:focus {
|
||||
color: $navbar-font-color;
|
||||
}
|
||||
& .navbar-nav > .active > a,
|
||||
& .navbar-nav > .active > a:hover,
|
||||
& .navbar-nav > .active > a:focus {
|
||||
color: $navbar-font-color;
|
||||
background-color: $navbar-background-color-active;
|
||||
}
|
||||
& .btn-link[disabled]:hover,
|
||||
fieldset[disabled] & .btn-link:hover,
|
||||
& .btn-link[disabled]:focus,
|
||||
fieldset[disabled] & .btn-link:focus,
|
||||
& .navbar-nav > .disabled > a,
|
||||
& .navbar-nav > .disabled > a:hover,
|
||||
& .navbar-nav > .disabled > a:focus {
|
||||
color: darken($navbar-background-color, 8%);
|
||||
background-color: transparent;
|
||||
}
|
||||
& .navbar-toggle {
|
||||
border-color: darken($navbar-background-color, 15%);
|
||||
background-color: darken($navbar-background-color, 15%);
|
||||
}
|
||||
& .navbar-toggle:hover,
|
||||
& .navbar-toggle:focus {
|
||||
border-color: darken($navbar-background-color, 10%);
|
||||
background-color: darken($navbar-background-color, 10%);
|
||||
}
|
||||
& .navbar-toggle .icon-bar {
|
||||
background-color: $navbar-background-color;
|
||||
}
|
||||
& .navbar-collapse,
|
||||
& .navbar-form {
|
||||
border-color: $navbar-item-background-color-hover;
|
||||
}
|
||||
& .navbar-nav > .open > a,
|
||||
& .navbar-nav > .open > a:hover,
|
||||
& .navbar-nav > .open > a:focus {
|
||||
color: $navbar-font-color;
|
||||
background-color: $navbar-background-color;
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
& .navbar-nav > li > a:hover,
|
||||
& .navbar-nav > li > a:focus {
|
||||
background-color: $navbar-background-color-active;
|
||||
}
|
||||
& .navbar-nav .open .dropdown-menu > .divider {
|
||||
background-color: $navbar-item-background-color-hover;
|
||||
}
|
||||
& .navbar-nav .open .dropdown-menu > li > a {
|
||||
color: darken($navbar-background-color, 15%);;
|
||||
}
|
||||
& .navbar-nav .open .dropdown-menu > li > a:hover,
|
||||
& .navbar-nav .open .dropdown-menu > li > a:focus,
|
||||
& .navbar-nav .open .dropdown-menu > .active > a,
|
||||
& .navbar-nav .open .dropdown-menu > .active > a:hover,
|
||||
& .navbar-nav .open .dropdown-menu > .active > a:focus {
|
||||
color: $navbar-font-color;
|
||||
background-color: $navbar-item-background-color-hover;
|
||||
}
|
||||
& .navbar-nav .open .dropdown-menu > .dropdown-header {
|
||||
color: darken($navbar-background-color, 15%);
|
||||
}
|
||||
& .navbar-nav .open .dropdown-menu > .disabled > a,
|
||||
& .navbar-nav .open .dropdown-menu > .disabled > a:hover,
|
||||
& .navbar-nav .open .dropdown-menu > .disabled > a:focus {
|
||||
color: darken($navbar-background-color, 10%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.navbar-inverse {
|
||||
& {
|
||||
background-color: lighten($navbar-inverse-background-color, 20%);
|
||||
border-color: lighten($navbar-inverse-background-color, 20%);
|
||||
}
|
||||
& .navbar-brand,
|
||||
& .navbar-link,
|
||||
& .btn-link {
|
||||
color: lighten($navbar-inverse-background-color, 55%);
|
||||
}
|
||||
& .navbar-brand:hover,
|
||||
& .navbar-brand:focus,
|
||||
& .navbar-link:hover,
|
||||
& .btn-link:hover,
|
||||
& .btn-link:focus {
|
||||
color: $navbar-font-color;
|
||||
background-color: transparent;
|
||||
}
|
||||
& .navbar-text,
|
||||
& .navbar-nav > li > a {
|
||||
color: lighten($navbar-inverse-background-color, 55%);
|
||||
}
|
||||
& .navbar-nav > li > a:hover,
|
||||
& .navbar-nav > li > a:focus {
|
||||
color: $navbar-font-color;
|
||||
}
|
||||
& .navbar-nav > .active > a,
|
||||
& .navbar-nav > .active > a:hover,
|
||||
& .navbar-nav > .active > a:focus {
|
||||
color: $navbar-font-color;
|
||||
background-color: $navbar-inverse-background-color;
|
||||
}
|
||||
& .btn-link[disabled]:hover,
|
||||
fieldset[disabled] & .btn-link:hover,
|
||||
& .btn-link[disabled]:focus,
|
||||
fieldset[disabled] & .btn-link:focus,
|
||||
& .navbar-nav > .disabled > a,
|
||||
& .navbar-nav > .disabled > a:hover,
|
||||
& .navbar-nav > .disabled > a:focus {
|
||||
color: lighten($navbar-inverse-background-color, 40%);
|
||||
background-color: transparent;
|
||||
}
|
||||
& .navbar-toggle {
|
||||
border-color: $navbar-inverse-background-color;
|
||||
background-color: $navbar-inverse-background-color;
|
||||
}
|
||||
& .navbar-toggle:hover,
|
||||
& .navbar-toggle:focus {
|
||||
border-color: lighten($navbar-inverse-background-color, 10%);
|
||||
background-color: lighten($navbar-inverse-background-color, 10%);
|
||||
}
|
||||
& .navbar-toggle .icon-bar {
|
||||
background-color: lighten($navbar-inverse-background-color, 55%);
|
||||
}
|
||||
& .navbar-collapse,
|
||||
& .navbar-form {
|
||||
border-color: $navbar-inverse-background-color;
|
||||
}
|
||||
& .navbar-nav > .open > a,
|
||||
& .navbar-nav > .open > a:hover,
|
||||
& .navbar-nav > .open > a:focus {
|
||||
color: $navbar-font-color;
|
||||
background-color: $navbar-inverse-background-color;
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
& .navbar-nav > li > a:hover,
|
||||
& .navbar-nav > li > a:focus {
|
||||
background-color: $navbar-inverse-background-color;
|
||||
}
|
||||
& .navbar-nav .open .dropdown-menu > .divider {
|
||||
background-color: $navbar-inverse-background-color;
|
||||
}
|
||||
& .navbar-nav .open .dropdown-menu > li > a {
|
||||
color: lighten($navbar-inverse-background-color, 55%);
|
||||
}
|
||||
& .navbar-nav .open .dropdown-menu > li > a:hover,
|
||||
& .navbar-nav .open .dropdown-menu > li > a:focus,
|
||||
& .navbar-nav .open .dropdown-menu > .active > a,
|
||||
& .navbar-nav .open .dropdown-menu > .active > a:hover,
|
||||
& .navbar-nav .open .dropdown-menu > .active > a:focus {
|
||||
color: $navbar-font-color;
|
||||
background-color: $navbar-inverse-background-color;
|
||||
}
|
||||
& .navbar-nav .open .dropdown-menu > .dropdown-header {
|
||||
color: lighten($navbar-inverse-background-color, 75%);
|
||||
}
|
||||
& .navbar-nav .open .dropdown-menu > .disabled > a,
|
||||
& .navbar-nav .open .dropdown-menu > .disabled > a:hover,
|
||||
& .navbar-nav .open .dropdown-menu > .disabled > a:focus {
|
||||
color: lighten($navbar-inverse-background-color, 40%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -1,42 +0,0 @@
|
|||
// Variables
|
||||
//------------------------------------------------------
|
||||
$paper-background-color: $grass-dark !default;
|
||||
$paper-background-color-hover: $grass-light !default;
|
||||
|
||||
$paper-font-color: $white !default;
|
||||
$paper-font-color-disabled: $lightgray-dark !default;
|
||||
|
||||
// Exports
|
||||
//------------------------------------------------------
|
||||
|
||||
@include exports("pager") {
|
||||
|
||||
/**
|
||||
* pager
|
||||
* --------------------------------------------------
|
||||
*/
|
||||
.pager {
|
||||
|
||||
& li > a,
|
||||
& li > span {
|
||||
color: $paper-font-color;
|
||||
background-color: $paper-background-color;
|
||||
border-color: $paper-background-color;
|
||||
}
|
||||
& li > a:hover,
|
||||
& li > a:focus {
|
||||
background-color: $paper-background-color-hover;
|
||||
border-color: $paper-background-color-hover;
|
||||
}
|
||||
& .disabled > a,
|
||||
& .disabled > a:hover,
|
||||
& .disabled > a:focus,
|
||||
& .disabled > span {
|
||||
color: $paper-font-color-disabled;
|
||||
background-color: $paper-font-color;
|
||||
border-color: $paper-font-color-disabled;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -1,59 +0,0 @@
|
|||
// Variables
|
||||
//------------------------------------------------------
|
||||
$pagination-background-color: $white !default;
|
||||
$pagination-background-color-hover: $mediumgray-light !default;
|
||||
$pagination-background-color-active: $grass-dark !default;
|
||||
|
||||
$pagination-font-color: $darkgray-dark !default;
|
||||
$pagination-font-color-hover: $white !default;
|
||||
$pagination-font-color-disabled: $lightgray-dark !default;
|
||||
|
||||
// Exports
|
||||
//------------------------------------------------------
|
||||
|
||||
@include exports("pagination") {
|
||||
|
||||
/**
|
||||
* pagination
|
||||
* --------------------------------------------------
|
||||
*/
|
||||
.pagination {
|
||||
|
||||
& > li > a,
|
||||
& > li > span {
|
||||
color: $pagination-font-color;
|
||||
background-color: $pagination-background-color;
|
||||
border-color: $pagination-background-color-hover;
|
||||
}
|
||||
& > li > a:hover,
|
||||
& > li > span:hover,
|
||||
& > li > a:focus,
|
||||
& > li > span:focus {
|
||||
color: $pagination-font-color-hover;
|
||||
background-color: $pagination-background-color-hover;
|
||||
border-color: $pagination-background-color-hover;
|
||||
}
|
||||
& > .active > a,
|
||||
& > .active > span,
|
||||
& > .active > a:hover,
|
||||
& > .active > span:hover,
|
||||
& > .active > a:focus,
|
||||
& > .active > span:focus {
|
||||
color: $pagination-font-color-hover;
|
||||
background-color: $pagination-background-color-active;
|
||||
border-color: $pagination-background-color-active;
|
||||
}
|
||||
& > .disabled > span,
|
||||
& > .disabled > span:hover,
|
||||
& > .disabled > span:focus,
|
||||
& > .disabled > a,
|
||||
& > .disabled > a:hover,
|
||||
& > .disabled > a:focus {
|
||||
color: $pagination-font-color-disabled;
|
||||
background-color: $pagination-background-color;
|
||||
border-color: $pagination-background-color-hover;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -1,169 +0,0 @@
|
|||
// Variables
|
||||
//------------------------------------------------------
|
||||
$panel-normal: $lightgray-dark !default;
|
||||
$panel-default: $white !default;
|
||||
$panel-primary: $aqua-dark !default;
|
||||
$panel-success: $grass-dark !default;
|
||||
$panel-danger: $grapefruit-dark !default;
|
||||
$panel-warning: $sunflower-dark !default;
|
||||
$panel-info: $mint-dark !default;
|
||||
|
||||
$panel-font-color: $darkgray-dark !default;
|
||||
|
||||
$panel-background-color: $white !default;
|
||||
$panel-shadow: 0 1px 2px rgba(0, 0, 0, .2) !default;
|
||||
$panel-radius: 4px !default;
|
||||
|
||||
|
||||
// Exports
|
||||
//------------------------------------------------------
|
||||
|
||||
@include exports("panel") {
|
||||
|
||||
/**
|
||||
* panel
|
||||
* --------------------------------------------------
|
||||
*/
|
||||
.panel {
|
||||
background-color: $panel-background-color;
|
||||
border: none;
|
||||
@include radius($type: border-radius, $value: $panel-radius);
|
||||
@include box-shadow($value: $panel-shadow);
|
||||
|
||||
& .list-group {
|
||||
@include box-shadow($value: none);
|
||||
}
|
||||
& .list-group-item:first-child {
|
||||
border-top: 1px solid $panel-normal;
|
||||
}
|
||||
|
||||
&-heading {
|
||||
@include radius($type: border-radius, $value: $panel-radius $panel-radius 0 0);
|
||||
}
|
||||
&-title {
|
||||
font-size: 14px;
|
||||
color: $panel-font-color;
|
||||
font-weight: normal;
|
||||
}
|
||||
&-footer {
|
||||
background-color: $panel-normal;
|
||||
border-top-color: $panel-normal;
|
||||
@include radius($type: border-radius, $value: 0 0 $panel-radius $panel-radius);
|
||||
}
|
||||
|
||||
@at-root &-default {
|
||||
border-color: $panel-normal;
|
||||
& > .panel-heading {
|
||||
color: $panel-font-color;
|
||||
background-color: $panel-normal;
|
||||
border-color: $panel-normal;
|
||||
}
|
||||
}
|
||||
@at-root &-primary {
|
||||
border-color: $panel-primary;
|
||||
& > .panel-heading {
|
||||
color: $panel-default;
|
||||
background-color: $panel-primary;
|
||||
border-color: $panel-primary;
|
||||
}
|
||||
}
|
||||
@at-root &-success {
|
||||
border-color: $panel-success;
|
||||
& > .panel-heading {
|
||||
color: $panel-default;
|
||||
background-color: $panel-success;
|
||||
border-color: $panel-success;
|
||||
}
|
||||
}
|
||||
@at-root &-info {
|
||||
border-color: $panel-info;
|
||||
& > .panel-heading {
|
||||
color: $panel-default;
|
||||
background-color: $panel-info;
|
||||
border-color: $panel-info;
|
||||
}
|
||||
}
|
||||
@at-root &-warning {
|
||||
border-color: $panel-warning;
|
||||
& > .panel-heading {
|
||||
color: $panel-default;
|
||||
background-color: $panel-warning;
|
||||
border-color: $panel-warning;
|
||||
}
|
||||
}
|
||||
@at-root &-danger {
|
||||
border-color: $panel-danger;
|
||||
& > .panel-heading {
|
||||
color: $panel-default;
|
||||
background-color: $panel-danger;
|
||||
border-color: $panel-danger;
|
||||
}
|
||||
}
|
||||
|
||||
@at-root &-primary > &-heading > &-title,
|
||||
&-success > &-heading > &-title,
|
||||
&-info > &-heading > &-title,
|
||||
&-warning > &-heading > &-title,
|
||||
&-danger > &-heading > &-title {
|
||||
color: $panel-default;
|
||||
}
|
||||
|
||||
& > .list-group:first-child .list-group-item:first-child,
|
||||
& > .table:first-child,
|
||||
& > .table-responsive:first-child > .table:first-child {
|
||||
@include radius($type: border-radius, $value: $panel-radius $panel-radius 0 0);
|
||||
}
|
||||
& > .list-group:last-child .list-group-item:last-child {
|
||||
@include radius($type: border-radius, $value: 0 0 $panel-radius $panel-radius);
|
||||
}
|
||||
& > .table:first-child > thead:first-child > tr:first-child td:first-child,
|
||||
& > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child td:first-child,
|
||||
& > .table:first-child > tbody:first-child > tr:first-child td:first-child,
|
||||
& > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child td:first-child,
|
||||
& > .table:first-child > thead:first-child > tr:first-child th:first-child,
|
||||
& > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child th:first-child,
|
||||
& > .table:first-child > tbody:first-child > tr:first-child th:first-child,
|
||||
& > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child th:first-child {
|
||||
@include radius($type: border-radius, $value: $panel-radius 0 0 0);
|
||||
}
|
||||
& > .table:first-child > thead:first-child > tr:first-child td:last-child,
|
||||
& > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child td:last-child,
|
||||
& > .table:first-child > tbody:first-child > tr:first-child td:last-child,
|
||||
& > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child td:last-child,
|
||||
& > .table:first-child > thead:first-child > tr:first-child th:last-child,
|
||||
& > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child th:last-child,
|
||||
& > .table:first-child > tbody:first-child > tr:first-child th:last-child,
|
||||
& > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child th:last-child {
|
||||
@include radius($type: border-radius, $value: 0 $panel-radius 0 0);
|
||||
}
|
||||
& > .table:last-child,
|
||||
& > .table-responsive:last-child > .table:last-child {
|
||||
@include radius($type: border-radius, $value: 0 0 $panel-radius $panel-radius);
|
||||
}
|
||||
& > .table:last-child > tbody:last-child > tr:last-child td:first-child,
|
||||
& > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child td:first-child,
|
||||
& > .table:last-child > tfoot:last-child > tr:last-child td:first-child,
|
||||
& > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child td:first-child,
|
||||
& > .table:last-child > tbody:last-child > tr:last-child th:first-child,
|
||||
& > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child th:first-child,
|
||||
& > .table:last-child > tfoot:last-child > tr:last-child th:first-child,
|
||||
& > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child th:first-child {
|
||||
@include radius($type: border-radius, $value: 0 0 0 $panel-radius);
|
||||
}
|
||||
& > .table:last-child > tbody:last-child > tr:last-child td:last-child,
|
||||
& > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child td:last-child,
|
||||
& > .table:last-child > tfoot:last-child > tr:last-child td:last-child,
|
||||
& > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child td:last-child,
|
||||
& > .table:last-child > tbody:last-child > tr:last-child th:last-child,
|
||||
& > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child th:last-child,
|
||||
& > .table:last-child > tfoot:last-child > tr:last-child th:last-child,
|
||||
& > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child th:last-child {
|
||||
@include radius($type: border-radius, $value: 0 0 $panel-radius 0);
|
||||
}
|
||||
& > &-body + .table,
|
||||
& > &-body + .table-responsive {
|
||||
border-top-color: $panel-normal;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -1,45 +0,0 @@
|
|||
// Variables
|
||||
//------------------------------------------------------
|
||||
$pill-background-color: $aqua-dark !default;
|
||||
$pill-background-color-hover: $lightgray-dark !default;
|
||||
$pill-font-color: $darkgray-dark !default;
|
||||
$pill-font-color-active: $white !default;
|
||||
|
||||
|
||||
// Exports
|
||||
//------------------------------------------------------
|
||||
|
||||
@include exports("pill") {
|
||||
|
||||
/**
|
||||
* pill
|
||||
* --------------------------------------------------
|
||||
*/
|
||||
.nav-pills {
|
||||
& > li.active > a,
|
||||
& > li.active > a:hover,
|
||||
& > li.active > a:focus {
|
||||
color: $pill-font-color-active;
|
||||
background-color: $pill-background-color;
|
||||
}
|
||||
& > li > a {
|
||||
color: $pill-background-color;
|
||||
}
|
||||
& > li > a:hover {
|
||||
color: $pill-font-color;
|
||||
background-color: $pill-background-color-hover;
|
||||
}
|
||||
& > .active > a > .badge {
|
||||
color: $pill-background-color;
|
||||
}
|
||||
& .open > a,
|
||||
& .open > a:focus,
|
||||
& .open > a:hover {
|
||||
color: $pill-font-color;
|
||||
background-color: $pill-background-color-hover;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -1,50 +0,0 @@
|
|||
// Variables
|
||||
//------------------------------------------------------
|
||||
$popover-background-color: $darkgray-dark !default;
|
||||
$popover-font-color: $white !default;
|
||||
$popover-title-font-color: $mediumgray-dark !default;
|
||||
|
||||
|
||||
// Exports
|
||||
//------------------------------------------------------
|
||||
|
||||
@include exports("popover") {
|
||||
|
||||
/**
|
||||
* popover
|
||||
* --------------------------------------------------
|
||||
*/
|
||||
|
||||
.popover {
|
||||
background-color: $popover-background-color;
|
||||
color: $popover-font-color;
|
||||
border-color: $popover-background-color;
|
||||
|
||||
@at-root &-title {
|
||||
padding-bottom: 0;
|
||||
font-weight: bold;
|
||||
color: $popover-title-font-color;
|
||||
background-color: transparent;
|
||||
border-bottom: none;
|
||||
}
|
||||
&.top .arrow,
|
||||
&.top .arrow:after {
|
||||
border-top-color: $popover-background-color;
|
||||
}
|
||||
&.right .arrow,
|
||||
&.right .arrow:after {
|
||||
border-right-color: $popover-background-color;
|
||||
}
|
||||
&.bottom .arrow,
|
||||
&.bottom .arrow:after {
|
||||
border-bottom-color: $popover-background-color;
|
||||
}
|
||||
&.left .arrow,
|
||||
&.left .arrow:after {
|
||||
border-left-color: $popover-background-color;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -1,42 +0,0 @@
|
|||
// Variables
|
||||
//------------------------------------------------------
|
||||
$progress-primary: $aqua-dark !default;
|
||||
$progress-success: $grass-dark !default;
|
||||
$progress-danger: $grapefruit-dark !default;
|
||||
$progress-warning: $sunflower-dark !default;
|
||||
$progress-info: $mint-dark !default;
|
||||
|
||||
$progress-background-color: $lightgray-dark !default;
|
||||
|
||||
// Exports
|
||||
//------------------------------------------------------
|
||||
@include exports("progress") {
|
||||
|
||||
/**
|
||||
* progress
|
||||
* --------------------------------------------------
|
||||
*/
|
||||
.progress {
|
||||
background-color: $progress-background-color;
|
||||
@include box-shadow($value: none);
|
||||
|
||||
&-bar {
|
||||
background-color: $progress-primary;
|
||||
@include box-shadow($value: none);
|
||||
}
|
||||
&-bar-success {
|
||||
background-color: $progress-success;
|
||||
}
|
||||
&-bar-info {
|
||||
background-color: $progress-info;
|
||||
}
|
||||
&-bar-warning {
|
||||
background-color: $progress-warning;
|
||||
}
|
||||
&-bar-danger {
|
||||
background-color: $progress-danger;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -1,179 +0,0 @@
|
|||
// Variables
|
||||
//------------------------------------------------------
|
||||
$tab-background-color: $lightgray-dark !default;
|
||||
$tab-background-color-hover: $lightgray-light !default;
|
||||
$tab-radius: 4px !default;
|
||||
|
||||
$tab-font-color: $darkgray-dark !default;
|
||||
$tab-font-color-acitve: $white !default;
|
||||
|
||||
$tab-aside-width: 74px !default;
|
||||
|
||||
$tab-border-color: $mediumgray-light !default;
|
||||
// Exports
|
||||
//------------------------------------------------------
|
||||
|
||||
@include exports("tab") {
|
||||
|
||||
/**
|
||||
* tab
|
||||
* --------------------------------------------------
|
||||
*/
|
||||
.nav-tabs {
|
||||
border-bottom: none;
|
||||
background-color: $tab-background-color;
|
||||
@include radius($type: border-radius, $value: $tab-radius $tab-radius 0 0);
|
||||
|
||||
& > li {
|
||||
margin-bottom: 0;
|
||||
border-left: 1px solid $tab-border-color;
|
||||
}
|
||||
& > li:first-child {
|
||||
border-left: none;
|
||||
}
|
||||
& > li > a {
|
||||
margin-right: 0;
|
||||
border: none;
|
||||
@include radius($type: border-radius, $value: 0);
|
||||
color: $tab-font-color;
|
||||
}
|
||||
& > li:first-child > a {
|
||||
@include radius($type: border-radius, $value: $tab-radius 0 0 0);
|
||||
}
|
||||
& > li > a:focus,
|
||||
& > li > a:hover {
|
||||
border: none;
|
||||
background-color: $tab-background-color-hover;
|
||||
}
|
||||
& > li.active > a,
|
||||
& > li.active > a:focus,
|
||||
& > li.active > a:hover {
|
||||
border: none;
|
||||
background-color: $tab-font-color-acitve !important;
|
||||
}
|
||||
|
||||
& .dropdown-toggle,
|
||||
& .dropdown-toggle:hover,
|
||||
& .dropdown-toggle:focus {
|
||||
color: $tab-font-color;
|
||||
}
|
||||
|
||||
& li.dropdown.open .dropdown-toggle {
|
||||
color: $tab-font-color;
|
||||
background-color: $tab-background-color-hover;
|
||||
}
|
||||
& li.dropdown.active.open .dropdown-toggle {
|
||||
color: $tab-font-color;
|
||||
}
|
||||
& li.dropdown.active.open .dropdown-toggle .caret,
|
||||
& li.dropdown.active .dropdown-toggle .caret {
|
||||
border-top-color: $tab-font-color;
|
||||
border-bottom-color: $tab-font-color;
|
||||
}
|
||||
& li.dropdown.open .caret,
|
||||
& li.dropdown.open.active .caret,
|
||||
& li.dropdown.open a:hover .caret,
|
||||
& li.dropdown.open a:focus .caret,
|
||||
& .dropdown-toggle .caret,
|
||||
& .dropdown-toggle:hover .caret,
|
||||
& .dropdown-toggle:focus .caret {
|
||||
border-top-color: $tab-font-color;
|
||||
border-bottom-color: $tab-font-color;
|
||||
}
|
||||
|
||||
&.nav-justified > li > a {
|
||||
margin-bottom: 0;
|
||||
text-align: center;
|
||||
}
|
||||
&.nav-justified > .dropdown .dropdown-menu {
|
||||
top: auto;
|
||||
left: auto;
|
||||
}
|
||||
&.nav-justified > li > a {
|
||||
@include radius($type: border-radius, $value: 0);
|
||||
}
|
||||
&.nav-justified > li:first-child > a {
|
||||
@include radius($type: border-radius, $value: $tab-radius 0 0 0);
|
||||
}
|
||||
&.nav-justified > li:last-child > a {
|
||||
@include radius($type: border-radius, $value: 0 $tab-radius 0 0);
|
||||
}
|
||||
&.nav-justified > .active > a,
|
||||
&.nav-justified > .active > a:hover,
|
||||
&.nav-justified > .active > a:focus {
|
||||
border: none;
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
&.nav-justified > li > a {
|
||||
border-bottom: none;
|
||||
@include radius($type: border-radius, $value: 0);
|
||||
}
|
||||
&.nav-justified > .active > a,
|
||||
&.nav-justified > .active > a:hover,
|
||||
&.nav-justified > .active > a:focus {
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
||||
|
||||
@at-root .tab-content {
|
||||
padding: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.tabs-below {
|
||||
& .nav-tabs {
|
||||
@include radius($type: border-radius, $value: 0 0 $tab-radius $tab-radius);
|
||||
}
|
||||
& .nav-tabs > li:first-child > a {
|
||||
@include radius($type: border-radius, $value: 0 0 0 $tab-radius);
|
||||
}
|
||||
& .nav-tabs.nav-justified > li:last-child > a {
|
||||
@include radius($type: border-radius, $value: 0 0 $tab-radius 0);
|
||||
}
|
||||
}
|
||||
|
||||
.tabs-left .nav-tabs > li,
|
||||
.tabs-right .nav-tabs > li {
|
||||
float: none;
|
||||
border-left: none;
|
||||
border-top: 1px solid $tab-border-color;
|
||||
}
|
||||
.tabs-left .nav-tabs > li:first-child,
|
||||
.tabs-right .nav-tabs > li:first-child {
|
||||
border-top: none;
|
||||
}
|
||||
.tabs-left .nav-tabs > li > a,
|
||||
.tabs-right .nav-tabs > li > a {
|
||||
min-width: $tab-aside-width;
|
||||
margin-right: 0;
|
||||
}
|
||||
.tabs-left {
|
||||
& .nav-tabs {
|
||||
float: left;
|
||||
margin-right: 19px;
|
||||
@include radius($type: border-radius, $value: $tab-radius 0 0 $tab-radius);
|
||||
}
|
||||
& .nav-tabs > li:first-child > a {
|
||||
@include radius($type: border-radius, $value: $tab-radius 0 0 0);
|
||||
}
|
||||
& .nav-tabs > li:last-child > a {
|
||||
@include radius($type: border-radius, $value: 0 0 0 $tab-radius);
|
||||
}
|
||||
}
|
||||
.tabs-right {
|
||||
& .nav-tabs {
|
||||
float: right;
|
||||
margin-left: 19px;
|
||||
@include radius($type: border-radius, $value: 0 $tab-radius $tab-radius 0);
|
||||
}
|
||||
& .nav-tabs > li:first-child > a {
|
||||
@include radius($type: border-radius, $value: 0 $tab-radius 0 0);
|
||||
}
|
||||
& .nav-tabs > li:last-child > a {
|
||||
@include radius($type: border-radius, $value: 0 0 $tab-radius 0);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -1,39 +0,0 @@
|
|||
// Variables
|
||||
//------------------------------------------------------
|
||||
$media-font-color: $darkgray-dark !default;
|
||||
|
||||
|
||||
$thumbnail-shadow: 0 1px 2px rgba(0, 0, 0, .2) !default;
|
||||
|
||||
|
||||
// Exports
|
||||
//------------------------------------------------------
|
||||
|
||||
@include exports("thumbnail") {
|
||||
|
||||
/**
|
||||
* thumbnail
|
||||
* --------------------------------------------------
|
||||
*/
|
||||
.thumbnail {
|
||||
border: none;
|
||||
@include box-shadow($value: $list-shadow);
|
||||
|
||||
& .caption {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
& .caption h1,
|
||||
& .caption h2,
|
||||
& .caption h3,
|
||||
& .caption h4,
|
||||
& .caption h5,
|
||||
& .caption h6 {
|
||||
margin: 5px 0 10px;
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -1,42 +0,0 @@
|
|||
// Variables
|
||||
//------------------------------------------------------
|
||||
$tooltip-background-color: $darkgray-dark !default;
|
||||
$tooltip-font-color: $white !default;
|
||||
|
||||
|
||||
// Exports
|
||||
//------------------------------------------------------
|
||||
|
||||
@include exports("tooltip") {
|
||||
|
||||
/**
|
||||
* tooltip
|
||||
* --------------------------------------------------
|
||||
*/
|
||||
|
||||
.tooltip {
|
||||
@at-root &-inner {
|
||||
color: $tooltip-font-color;
|
||||
background-color: $tooltip-background-color;
|
||||
}
|
||||
&.top &-arrow,
|
||||
&.top-left &-arrow,
|
||||
&.top-right &-arrow {
|
||||
border-top-color: $tooltip-background-color;
|
||||
}
|
||||
&.right &-arrow {
|
||||
border-right-color: $tooltip-background-color;
|
||||
}
|
||||
&.left &-arrow {
|
||||
border-left-color: $tooltip-background-color;
|
||||
}
|
||||
&.bottom &-arrow,
|
||||
&.bottom-left &-arrow,
|
||||
&.bottom-right &-arrow {
|
||||
border-bottom-color: $tooltip-background-color;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -1,126 +0,0 @@
|
|||
// Variables
|
||||
//------------------------------------------------------
|
||||
$body-font-color: $darkgray-dark !default;
|
||||
$body-background-color: $white !default;
|
||||
|
||||
$link-font-color: $aqua-dark !default;
|
||||
$link-font-color-hover: $aqua-light !default;
|
||||
|
||||
$blockquote-border-color: $mediumgray-light !default;
|
||||
|
||||
$image-radius: 4px !default;
|
||||
|
||||
// Exports
|
||||
//------------------------------------------------------
|
||||
|
||||
@include exports("typography") {
|
||||
|
||||
/**
|
||||
* typography
|
||||
* --------------------------------------------------
|
||||
*/
|
||||
|
||||
body {
|
||||
font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
||||
color: $body-font-color;
|
||||
background-color: $body-background-color;
|
||||
}
|
||||
a {
|
||||
color: $link-font-color;
|
||||
text-decoration: none;
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
color: $link-font-color-hover;
|
||||
text-decoration: none;
|
||||
}
|
||||
&:focus {
|
||||
outline: none;
|
||||
}
|
||||
}
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
.h1,
|
||||
.h2,
|
||||
.h3,
|
||||
.h4,
|
||||
.h5,
|
||||
.h6 {
|
||||
font-family: inherit;
|
||||
font-weight: 700;
|
||||
line-height: 1.1;
|
||||
color: inherit;
|
||||
}
|
||||
h1 small,
|
||||
h2 small,
|
||||
h3 small,
|
||||
h4 small,
|
||||
h5 small,
|
||||
h6 small,
|
||||
.h1 small,
|
||||
.h2 small,
|
||||
.h3 small,
|
||||
.h4 small,
|
||||
.h5 small,
|
||||
.h6 small {
|
||||
color: #e7e9ec;
|
||||
}
|
||||
h1,
|
||||
h2,
|
||||
h3 {
|
||||
margin-top: 30px;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
margin-top: 15px;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
h6 {
|
||||
font-weight: normal;
|
||||
}
|
||||
h1,
|
||||
.h1 {
|
||||
font-size: 51px;
|
||||
}
|
||||
h2,
|
||||
.h2 {
|
||||
font-size: 43px;
|
||||
}
|
||||
h3,
|
||||
.h3 {
|
||||
font-size: 30px;
|
||||
}
|
||||
h4,
|
||||
.h4 {
|
||||
font-size: 19px;
|
||||
}
|
||||
h5,
|
||||
.h5 {
|
||||
font-size: 18px;
|
||||
}
|
||||
h6,
|
||||
.h6 {
|
||||
font-size: 14px;
|
||||
}
|
||||
blockquote {
|
||||
border-left: 3px solid $blockquote-border-color;
|
||||
}
|
||||
.img-rounded {
|
||||
@include radius($type: border-radius, $value: $image-radius);
|
||||
}
|
||||
.img-comment {
|
||||
font-size: 15px;
|
||||
line-height: 1.2;
|
||||
font-style: italic;
|
||||
margin: 24px 0;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -1,43 +0,0 @@
|
|||
// Variables
|
||||
//------------------------------------------------------
|
||||
$well-font-color: $darkgray-dark !default;
|
||||
$well-background-color: $white !default;
|
||||
|
||||
$well-blockquote-color: $mediumgray-light !default;
|
||||
|
||||
$well-radius: 4px;
|
||||
$well-shadow: 0 1px 2px rgba(0, 0, 0, .2) !default;
|
||||
|
||||
|
||||
// Exports
|
||||
//------------------------------------------------------
|
||||
|
||||
@include exports("well") {
|
||||
|
||||
/**
|
||||
* well
|
||||
* --------------------------------------------------
|
||||
*/
|
||||
|
||||
.well {
|
||||
padding: 10px;
|
||||
border: none;
|
||||
@include radius($type: border-radius, $value: $well-radius);
|
||||
color: $modal-font-color;
|
||||
background-color: $well-background-color;
|
||||
@include box-shadow($value: $well-shadow);
|
||||
|
||||
& blockquote {
|
||||
border-color: $well-blockquote-color;
|
||||
}
|
||||
@at-root &-lg {
|
||||
padding: 20px;
|
||||
}
|
||||
@at-root &-sm {
|
||||
padding: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -1,5 +1,7 @@
|
|||
{% extends "_layout.html" %}
|
||||
|
||||
{% block main_content %}
|
||||
<form method="post">
|
||||
<form method="post" class="form">
|
||||
{% csrf_token %}
|
||||
{{ login_form.as_p }}
|
||||
<button class="btn btn-primary" type="submit">Login</button>
|
||||
|
|
|
|||
Reference in New Issue