mirror of
https://github.com/tenrok/bootstrap.git
synced 2026-06-11 18:02:28 +03:00
update to use latest version of bootstrap, docs cleanup, etc
This commit is contained in:
Mark Otto
@@ -1,17 +0,0 @@
|
||||
/*
|
||||
Master Stylesheet
|
||||
This file is only for importing all required stylesheets for LESS to include and then compile.
|
||||
*/
|
||||
|
||||
// CSS Reset
|
||||
@import "reset.less";
|
||||
|
||||
// Core
|
||||
@import "bootstrap.less";
|
||||
@import "scaffolding.less";
|
||||
|
||||
// Styled patterns and elements
|
||||
@import "type.less";
|
||||
@import "forms.less";
|
||||
@import "tables.less";
|
||||
@import "patterns.less";
|
||||
Vendored
+12
-206
@@ -1,211 +1,17 @@
|
||||
/*
|
||||
Bootstrap v1.1
|
||||
Variables and mixins to bootstrap any new web development project. Modified from original version for Twitter.
|
||||
Master Stylesheet
|
||||
This file is only for importing all required stylesheets for LESS to include and then compile.
|
||||
*/
|
||||
|
||||
// CSS Reset
|
||||
@import "reset.less";
|
||||
|
||||
/* Variables
|
||||
-------------------------------------------------- */
|
||||
// Core
|
||||
@import "preboot.less";
|
||||
@import "scaffolding.less";
|
||||
|
||||
// Links
|
||||
@link-color: #0069d6;
|
||||
@link-hover-color: darken(@link-color, 10);
|
||||
|
||||
// Grays
|
||||
@white: #fff;
|
||||
@gray-lighter: #ccc;
|
||||
@gray-light: #777;
|
||||
@gray: #555;
|
||||
@gray-dark: #333;
|
||||
@black: #000;
|
||||
|
||||
// Accent Colors
|
||||
@blue: #08b5fb;
|
||||
@blue-dark: #0069d6;
|
||||
@green: #46a546;
|
||||
@red: #9d261d;
|
||||
@yellow: #ffc40d;
|
||||
@orange: #f89406;
|
||||
@pink: #c3325f;
|
||||
@purple: #7a43b6;
|
||||
|
||||
// Baseline grid
|
||||
@baseline: 20px;
|
||||
|
||||
// Griditude
|
||||
@grid_columns: 16;
|
||||
@grid_column_width: 40px;
|
||||
@grid_gutter_width: 20px;
|
||||
@site_width: (@grid_columns * @grid_column_width) + (@grid_gutter_width * (@grid_columns - 1));
|
||||
|
||||
|
||||
/* Mixins
|
||||
-------------------------------------------------- */
|
||||
|
||||
// Clearfix for clearing floats like a boss
|
||||
.clearfix {
|
||||
zoom: 1;
|
||||
&:after {
|
||||
display: block;
|
||||
visibility: hidden;
|
||||
height: 0;
|
||||
clear: both;
|
||||
content: ".";
|
||||
}
|
||||
}
|
||||
|
||||
// Floats
|
||||
.right {
|
||||
float: right;
|
||||
}
|
||||
.left {
|
||||
float: left;
|
||||
}
|
||||
|
||||
// Input placeholder text
|
||||
.placeholder(@color: @gray-light) {
|
||||
:-moz-placeholder {
|
||||
color: @color;
|
||||
}
|
||||
::-webkit-input-placeholder {
|
||||
color: @color;
|
||||
}
|
||||
}
|
||||
|
||||
// Font Stacks
|
||||
.font(@weight: normal, @size: 14px, @lineheight: 20px) {
|
||||
font-size: @size;
|
||||
font-weight: @weight;
|
||||
line-height: @lineheight;
|
||||
}
|
||||
.sans-serif(@weight: normal, @size: 14px, @lineheight: 20px) {
|
||||
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
font-size: @size;
|
||||
font-weight: @weight;
|
||||
line-height: @lineheight;
|
||||
}
|
||||
.serif(@weight: normal, @size: 14px, @lineheight: 20px) {
|
||||
font-family: "Georgia", Times New Roman, Times, sans-serif;
|
||||
font-size: @size;
|
||||
font-weight: @weight;
|
||||
line-height: @lineheight;
|
||||
}
|
||||
.monospace(@weight: normal, @size: 12px, @lineheight: 20px) {
|
||||
font-family: "Monaco", Courier New, monospace;
|
||||
font-size: @size;
|
||||
font-weight: @weight;
|
||||
line-height: @lineheight;
|
||||
}
|
||||
|
||||
// Grid System
|
||||
.container {
|
||||
width: @site_width;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.columns(@column_span: 1) {
|
||||
display: inline;
|
||||
float: left;
|
||||
width: (@grid_column_width * @column_span) + (@grid_gutter_width * (@column_span - 1));
|
||||
margin-left: @grid_gutter_width;
|
||||
&:first-child {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
.offset(@column_offset: 1) {
|
||||
margin-left: (@grid_column_width * @column_offset) + (@grid_gutter_width * (@column_offset - 1)) !important;
|
||||
}
|
||||
|
||||
// Border Radius
|
||||
.border-radius(@radius: 5px) {
|
||||
-moz-border-radius: @radius;
|
||||
border-radius: @radius;
|
||||
}
|
||||
|
||||
// Drop shadows
|
||||
.box-shadow(@shadow: 0 1px 3px rgba(0,0,0,.25)) {
|
||||
-webkit-box-shadow: @shadow;
|
||||
-moz-box-shadow: @shadow;
|
||||
box-shadow: @shadow;
|
||||
}
|
||||
|
||||
// Transitions
|
||||
.transition(@transition) {
|
||||
-webkit-transition: @transition;
|
||||
-moz-transition: @transition;
|
||||
transition: @transition;
|
||||
}
|
||||
|
||||
// CSS3 Content Columns
|
||||
.content-columns(@column_count, @column_gap: 20px) {
|
||||
-webkit-column-count: @count;
|
||||
-webkit-column-gap: @gap;
|
||||
-moz-column-count: @count;
|
||||
-moz-column-gap: @gap;
|
||||
column-count: @count;
|
||||
column-gap: @gap;
|
||||
}
|
||||
|
||||
// Buttons
|
||||
.button(@color: #f9f9f9, @padding: 4px 14px, @text_color: #555, @text_shadow: 0 1px 0 rgba(255,255,255,.75), @font_size: 13px, @border_color: rgba(0,0,0,.1), @rounded: 4px) {
|
||||
display: inline-block;
|
||||
#gradient > .vertical-three-colors(@color, @color, 0.25, darken(@color, 10%));
|
||||
padding: @padding;
|
||||
text-shadow: @text_shadow;
|
||||
color: @text_color;
|
||||
line-height: @baseline;
|
||||
border: 1px solid @border_color;
|
||||
border-bottom-color: fadein(@border_color, 15%);
|
||||
.border-radius(@rounded);
|
||||
@shadow: inset 0 1px 0 rgba(255,255,255,.25), 0 1px 2px rgba(0,0,0,.1);
|
||||
.box-shadow(@shadow);
|
||||
cursor: pointer;
|
||||
&:hover {
|
||||
background-position: 0 -15px;
|
||||
color: darken(@text_color, 10%);
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
|
||||
// Add an alphatransparency value to any background or border color (via Elyse Holladay)
|
||||
#translucent {
|
||||
.background(@color: @white, @alpha: 1) {
|
||||
background-color: hsla(hue(@color), saturation(@color), lightness(@color), @alpha);
|
||||
}
|
||||
.border(@color: @white, @alpha: 1) {
|
||||
border-color: hsla(hue(@color), saturation(@color), lightness(@color), @alpha);
|
||||
background-clip: padding-box;
|
||||
}
|
||||
}
|
||||
|
||||
// Gradients
|
||||
#gradient {
|
||||
.horizontal(@startColor: #555, @endColor: #333) {
|
||||
background-color: @endColor;
|
||||
background-repeat: no-repeat;
|
||||
background-image: -webkit-gradient(linear, left top, right top, from(@startColor), to(@endColor));
|
||||
background-image: -webkit-linear-gradient(right center, @startColor, @endColor);
|
||||
background-image: -moz-linear-gradient(right center, @startColor, @endColor);
|
||||
background-image: -o-linear-gradient(left, @startColor, @endColor);
|
||||
background-image: -khtml-gradient(linear, left top, right top, from(@startColor), to(@endColor));
|
||||
filter: e(%("progid:DXImageTransform.Microsoft.Gradient(StartColorStr='%d', EndColorStr='%d', GradientType=1)",@startColor,@endColor));
|
||||
-ms-filter: %("progid:DXImageTransform.Microsoft.gradient(startColorStr='%d', EndColorStr='%d', GradientType=1))",@startColor,@endColor);
|
||||
}
|
||||
.vertical(@startColor: #555, @endColor: #333) {
|
||||
background-color: @endColor;
|
||||
background-repeat: no-repeat;
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, from(@startColor), to(@endColor));
|
||||
background-image: -webkit-linear-gradient(@startColor, @endColor);
|
||||
background-image: -moz-linear-gradient(@startColor, @endColor);
|
||||
background-image: -o-linear-gradient(top, @startColor, @endColor);
|
||||
background-image: -khtml-gradient(linear, left top, left bottom, from(@startColor), to(@endColor));
|
||||
filter: e(%("progid:DXImageTransform.Microsoft.Gradient(StartColorStr='%d', EndColorStr='%d', GradientType=0)",@startColor,@endColor));
|
||||
-ms-filter: %("progid:DXImageTransform.Microsoft.gradient(startColorStr='%d', EndColorStr='%d', GradientType=0))",@startColor,@endColor);
|
||||
}
|
||||
.vertical-three-colors(@startColor: #00b3ee, @midColor: #7a43b6, @colorStop: 0.5, @endColor: #c3325f) {
|
||||
background-color: @endColor;
|
||||
background-repeat: no-repeat;
|
||||
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@startColor), color-stop(@colorStop, @midColor), to(@endColor));
|
||||
background-image: -webkit-linear-gradient(@startColor, color-stop(@colorStop, @midColor), @endColor);
|
||||
background-image: -moz-linear-gradient(@startColor, color-stop(@midColor, @colorStop), @endColor);
|
||||
}
|
||||
}
|
||||
// Styled patterns and elements
|
||||
@import "type.less";
|
||||
@import "forms.less";
|
||||
@import "tables.less";
|
||||
@import "patterns.less";
|
||||
+5
-5
@@ -18,7 +18,7 @@ form {
|
||||
margin-left: 150px;
|
||||
font-size: 20px;
|
||||
line-height: 1;
|
||||
color: @gray-dark;
|
||||
color: @grayDark;
|
||||
}
|
||||
}
|
||||
// Parent element that clears floats and wraps labels and fields together
|
||||
@@ -27,7 +27,7 @@ form {
|
||||
}
|
||||
// Set font for forms
|
||||
label, input, select, textarea {
|
||||
.sans-serif(normal,13px,normal);
|
||||
#font > .sans-serif(normal,13px,normal);
|
||||
}
|
||||
// Float labels left
|
||||
label {
|
||||
@@ -177,7 +177,7 @@ div.actions {
|
||||
.help-block {
|
||||
font-size: 12px;
|
||||
line-height: @baseline;
|
||||
color: @gray-light;
|
||||
color: @grayLight;
|
||||
}
|
||||
.help-inline {
|
||||
padding-left: 5px;
|
||||
@@ -196,7 +196,7 @@ div.actions {
|
||||
margin-bottom: 0;
|
||||
font-size: 12px;
|
||||
line-height: @baseline;
|
||||
color: @gray-light;
|
||||
color: @grayLight;
|
||||
}
|
||||
ol {
|
||||
margin-bottom: 10px;
|
||||
@@ -234,7 +234,7 @@ div.input-append {
|
||||
width: auto;
|
||||
min-width: 16px;
|
||||
padding: 5px 4px 5px 5px;
|
||||
color: @gray-light;
|
||||
color: @grayLight;
|
||||
font-weight: normal;
|
||||
line-height: 18px;
|
||||
height: 18px;
|
||||
|
||||
+11
-11
@@ -36,7 +36,7 @@ div.topbar {
|
||||
a.logo {
|
||||
margin-left: -10px;
|
||||
margin-right: 10px;
|
||||
color: @gray-light;
|
||||
color: @grayLight;
|
||||
font-size: 20px;
|
||||
font-weight: 200;
|
||||
img {
|
||||
@@ -77,7 +77,7 @@ div.topbar {
|
||||
.box-shadow(@shadow);
|
||||
// Links get text shadow
|
||||
a {
|
||||
color: @gray-light;
|
||||
color: @grayLight;
|
||||
text-shadow: 0 -1px 0 rgba(0,0,0,.25);
|
||||
.transition(all linear .1s);
|
||||
}
|
||||
@@ -113,9 +113,9 @@ div.topbar {
|
||||
opacity: 1;
|
||||
position: relative;
|
||||
input {
|
||||
background-color: @gray-light;
|
||||
background-color: @grayLight;
|
||||
background-color: rgba(255,255,255,.3);
|
||||
.sans-serif(13px, normal, 1);
|
||||
#font > .sans-serif(13px, normal, 1);
|
||||
width: 220px;
|
||||
padding: 4px 9px;
|
||||
color: #fff;
|
||||
@@ -127,10 +127,10 @@ div.topbar {
|
||||
.transition(none);
|
||||
// Placeholder text gets special styles; can't be bundled together though for some reason
|
||||
&:-moz-placeholder {
|
||||
color: @gray-lighter;
|
||||
color: @grayLighter;
|
||||
}
|
||||
&::-webkit-input-placeholder {
|
||||
color: @gray-lighter;
|
||||
color: @grayLighter;
|
||||
}
|
||||
&:hover {
|
||||
background-color: #444;
|
||||
@@ -141,7 +141,7 @@ div.topbar {
|
||||
&.focused {
|
||||
outline: none;
|
||||
background-color: #fff;
|
||||
color: @gray-dark;
|
||||
color: @grayDark;
|
||||
text-shadow: 0 1px 0 #fff;
|
||||
border: 0;
|
||||
padding: 5px 10px;
|
||||
@@ -315,7 +315,7 @@ div.page-header {
|
||||
// One-liner alert bars
|
||||
div.alert-message {
|
||||
#gradient > .vertical(transparent, rgba(0,0,0,0.15));
|
||||
background-color: @gray-lighter;
|
||||
background-color: @grayLighter;
|
||||
margin-bottom: @baseline;
|
||||
padding: 10px 15px 9px;
|
||||
.border-radius(6px);
|
||||
@@ -457,14 +457,14 @@ ul.pills {
|
||||
line-height: 30px;
|
||||
.border-radius(15px);
|
||||
&:hover {
|
||||
background: @link-hover-color;
|
||||
background: @linkColorHover;
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
text-shadow: 0 1px 1px rgba(0,0,0,.25);
|
||||
}
|
||||
}
|
||||
&.active a {
|
||||
background: @link-color;
|
||||
background: @linkColor;
|
||||
color: #fff;
|
||||
text-shadow: 0 1px 1px rgba(0,0,0,.25);
|
||||
}
|
||||
@@ -501,7 +501,7 @@ div.pagination {
|
||||
&.disabled a,
|
||||
&.disabled a:hover {
|
||||
background-color: none;
|
||||
color: @gray-light;
|
||||
color: @grayLight;
|
||||
}
|
||||
&.next a,
|
||||
&:last-child a {
|
||||
|
||||
@@ -0,0 +1,255 @@
|
||||
/*
|
||||
Preboot
|
||||
Variables and mixins to pre-ignite any new web development project
|
||||
*/
|
||||
|
||||
|
||||
/* Variables
|
||||
-------------------------------------------------- */
|
||||
|
||||
// Links
|
||||
@linkColor: #08b5fb;
|
||||
@linkColorHover: darken(@linkColor, 10);
|
||||
|
||||
// Grays
|
||||
@black: #000;
|
||||
@grayDark: lighten(@black, 25%);
|
||||
@gray: lighten(@black, 50%);
|
||||
@grayLight: lighten(@black, 70%);
|
||||
@grayLighter: lighten(@black, 90%);
|
||||
@white: #fff;
|
||||
|
||||
// Accent Colors
|
||||
@blue: #08b5fb;
|
||||
@green: #46a546;
|
||||
@red: #9d261d;
|
||||
@yellow: #ffc40d;
|
||||
@orange: #f89406;
|
||||
@pink: #c3325f;
|
||||
@purple: #7a43b6;
|
||||
|
||||
// Baseline grid
|
||||
@baseline: 20px;
|
||||
|
||||
// Griditude
|
||||
@gridColumns: 16;
|
||||
@gridColumnWidth: 40px;
|
||||
@gridGutterWidth: 20px;
|
||||
@siteWidth: (@gridColumns * @gridColumnWidth) + (@gridGutterWidth * (@gridColumns - 1));
|
||||
|
||||
|
||||
/* Color Scheme
|
||||
-------------------------------------------------- */
|
||||
|
||||
@baseColor: @blue; // Set a base color
|
||||
@complement: spin(@baseColor, 180); // Determine a complementary color
|
||||
@split1: spin(@baseColor, 158); // Split complements
|
||||
@split2: spin(@baseColor, -158);
|
||||
@triad1: spin(@baseColor, 135); // Triads colors
|
||||
@triad2: spin(@baseColor, -135);
|
||||
@tetra1: spin(@baseColor, 90); // Tetra colors
|
||||
@tetra2: spin(@baseColor, -90);
|
||||
@analog1: spin(@baseColor, 22); // Analogs colors
|
||||
@analog2: spin(@baseColor, -22);
|
||||
|
||||
|
||||
/* Mixins
|
||||
-------------------------------------------------- */
|
||||
|
||||
// Clearfix for clearing floats like a boss
|
||||
.clearfix {
|
||||
zoom: 1;
|
||||
&:after {
|
||||
display: block;
|
||||
visibility: hidden;
|
||||
height: 0;
|
||||
clear: both;
|
||||
content: ".";
|
||||
}
|
||||
}
|
||||
|
||||
// Center-align a block level element
|
||||
.center-block {
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
// Sizing shortcuts
|
||||
.size(@height: 5px, @width: 5px) {
|
||||
height: @height;
|
||||
width: @width;
|
||||
}
|
||||
.square(@size: 5px) {
|
||||
.size(@size, @size);
|
||||
}
|
||||
|
||||
// Input placeholder text
|
||||
.placeholder(@color: @grayLight) {
|
||||
:-moz-placeholder {
|
||||
color: @color;
|
||||
}
|
||||
::-webkit-input-placeholder {
|
||||
color: @color;
|
||||
}
|
||||
}
|
||||
|
||||
// Font Stacks
|
||||
#font {
|
||||
.shorthand(@weight: normal, @size: 14px, @lineHeight: 20px) {
|
||||
font-size: @size;
|
||||
font-weight: @weight;
|
||||
line-height: @lineHeight;
|
||||
}
|
||||
.sans-serif(@weight: normal, @size: 14px, @lineHeight: 20px) {
|
||||
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
font-size: @size;
|
||||
font-weight: @weight;
|
||||
line-height: @lineHeight;
|
||||
}
|
||||
.serif(@weight: normal, @size: 14px, @lineHeight: 20px) {
|
||||
font-family: "Georgia", Times New Roman, Times, sans-serif;
|
||||
font-size: @size;
|
||||
font-weight: @weight;
|
||||
line-height: @lineHeight;
|
||||
}
|
||||
.monospace(@weight: normal, @size: 12px, @lineHeight: 20px) {
|
||||
font-family: "Monaco", Courier New, monospace;
|
||||
font-size: @size;
|
||||
font-weight: @weight;
|
||||
line-height: @lineHeight;
|
||||
}
|
||||
}
|
||||
|
||||
// Grid System
|
||||
.container {
|
||||
width: @siteWidth;
|
||||
margin: 0 auto;
|
||||
.clearfix();
|
||||
}
|
||||
.columns(@columnSpan: 1) {
|
||||
display: inline;
|
||||
float: left;
|
||||
width: (@gridColumnWidth * @columnSpan) + (@gridGutterWidth * (@columnSpan - 1));
|
||||
margin-left: @gridGutterWidth;
|
||||
&:first-child {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
.offset(@columnOffset: 1) {
|
||||
margin-left: (@gridColumnWidth * @columnOffset) + (@gridGutterWidth * (@columnOffset - 1)) !important;
|
||||
}
|
||||
|
||||
// Border Radius
|
||||
.border-radius(@radius: 5px) {
|
||||
-webkit-border-radius: @radius;
|
||||
-moz-border-radius: @radius;
|
||||
border-radius: @radius;
|
||||
}
|
||||
|
||||
// Drop shadows
|
||||
.box-shadow(@shadow: 0 1px 3px rgba(0,0,0,.25)) {
|
||||
-webkit-box-shadow: @shadow;
|
||||
-moz-box-shadow: @shadow;
|
||||
box-shadow: @shadow;
|
||||
}
|
||||
|
||||
// Transitions
|
||||
.transition(@transition) {
|
||||
-webkit-transition: @transition;
|
||||
-moz-transition: @transition;
|
||||
transition: @transition;
|
||||
}
|
||||
|
||||
// CSS3 Content Columns
|
||||
.content-columns(@columnCount, @columnGap: 20px) {
|
||||
-webkit-column-count: @columnCount;
|
||||
-webkit-column-gap: @columnGap;
|
||||
-moz-column-count: @columnCount;
|
||||
-moz-column-gap: @columnGap;
|
||||
column-count: @columnCount;
|
||||
column-gap: @columnGap;
|
||||
}
|
||||
|
||||
// Buttons
|
||||
.button(@color: #f5f5f5, @textColor: #333, @textShadow: 0 1px 1px rgba(255,255,255,.75), @fontSize: 13px, @padding: 9px 15px 10px, @borderRadius: 6px) {
|
||||
display: inline-block;
|
||||
#gradient > .vertical(@color,darken(saturate(@color,10),10));
|
||||
padding: @padding;
|
||||
text-shadow: @textShadow;
|
||||
color: @textColor;
|
||||
font-size: @fontSize;
|
||||
line-height: 20px;
|
||||
.border-radius(@borderRadius);
|
||||
@shadow: inset 0 1px 0 rgba(255,255,255,.2), inset 0 -1px 0 rgba(0,0,0,.2), 0 1px 2px rgba(0,0,0,.25);
|
||||
.box-shadow(@shadow);
|
||||
&:hover {
|
||||
background-position: 0 -15px;
|
||||
color: @textColor;
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
|
||||
// Add an alphatransparency value to any background or border color (via Elyse Holladay)
|
||||
#translucent {
|
||||
.background(@color: @white, @alpha: 1) {
|
||||
background-color: hsla(hue(@color), saturation(@color), lightness(@color), @alpha);
|
||||
}
|
||||
.border(@color: @white, @alpha: 1) {
|
||||
border-color: hsla(hue(@color), saturation(@color), lightness(@color), @alpha);
|
||||
background-clip: padding-box;
|
||||
}
|
||||
}
|
||||
|
||||
// Gradients
|
||||
#gradient {
|
||||
.horizontal (@startColor: #555, @endColor: #333) {
|
||||
background-color: @endColor;
|
||||
background-repeat: repeat-x;
|
||||
background-image: -khtml-gradient(linear, left top, right top, from(@startColor), to(@endColor)); // Konqueror
|
||||
background-image: -moz-linear-gradient(left, @startColor, @endColor); // FF 3.6+
|
||||
background-image: -ms-linear-gradient(left, @startColor, @endColor); // IE10
|
||||
background-image: -webkit-gradient(linear, left top, right top, color-stop(0%, @startColor), color-stop(100%, @endColor)); // Safari 4+, Chrome 2+
|
||||
background-image: -webkit-linear-gradient(left, @startColor, @endColor); // Safari 5.1+, Chrome 10+
|
||||
background-image: -o-linear-gradient(left, @startColor, @endColor); // Opera 11.10
|
||||
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",@startColor,@endColor)); /* IE6 & IE7 */
|
||||
-ms-filter: %("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",@startColor,@endColor); /* IE8+ */
|
||||
background-image: linear-gradient(left, @startColor, @endColor); // Le standard
|
||||
}
|
||||
.vertical (@startColor: #555, @endColor: #333) {
|
||||
background-color: @endColor;
|
||||
background-repeat: repeat-x;
|
||||
background-image: -khtml-gradient(linear, left top, left bottom, from(@startColor), to(@endColor)); /* Konqueror */
|
||||
background-image: -moz-linear-gradient(@startColor, @endColor); /* FF 3.6+ */
|
||||
background-image: -ms-linear-gradient(@startColor, @endColor); /* IE10 */
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, @startColor), color-stop(100%, @endColor)); /* Safari 4+, Chrome 2+ */
|
||||
background-image: -webkit-linear-gradient(@startColor, @endColor); /* Safari 5.1+, Chrome 10+ */
|
||||
background-image: -o-linear-gradient(@startColor, @endColor); /* Opera 11.10 */
|
||||
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",@startColor,@endColor)); /* IE6 & IE7 */
|
||||
-ms-filter: %("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",@startColor,@endColor); /* IE8+ */
|
||||
background-image: linear-gradient(@startColor, @endColor); /* the standard */
|
||||
}
|
||||
.directional (@startColor: #555, @endColor: #333, @deg: 45deg) {
|
||||
background-color: @endColor;
|
||||
background-repeat: repeat-x;
|
||||
background-image: -moz-linear-gradient(@deg, @startColor, @endColor); /* FF 3.6+ */
|
||||
background-image: -ms-linear-gradient(@deg, @startColor, @endColor); /* IE10 */
|
||||
background-image: -webkit-linear-gradient(@deg, @startColor, @endColor); /* Safari 5.1+, Chrome 10+ */
|
||||
background-image: -o-linear-gradient(@deg, @startColor, @endColor); /* Opera 11.10 */
|
||||
background-image: linear-gradient(@deg, @startColor, @endColor); /* the standard */
|
||||
}
|
||||
.vertical-three-colors(@startColor: #00b3ee, @midColor: #7a43b6, @colorStop: 0.5, @endColor: #c3325f) {
|
||||
background-color: @endColor;
|
||||
background-repeat: no-repeat;
|
||||
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@startColor), color-stop(@colorStop, @midColor), to(@endColor));
|
||||
background-image: -webkit-linear-gradient(@startColor, color-stop(@colorStop, @midColor), @endColor);
|
||||
background-image: -moz-linear-gradient(@startColor, color-stop(@midColor, @colorStop), @endColor);
|
||||
}
|
||||
}
|
||||
|
||||
// Opacity
|
||||
.opacity(@opacity: 100) {
|
||||
filter: e(%("alpha(opacity=%d)", @opacity));
|
||||
-khtml-opacity: @opacity / 100;
|
||||
-moz-opacity: @opacity / 100;
|
||||
opacity: @opacity / 100;
|
||||
}
|
||||
@@ -35,10 +35,9 @@ html, body {
|
||||
}
|
||||
body {
|
||||
margin: 0;
|
||||
.sans-serif(normal,14px,20px);
|
||||
#font > .sans-serif(normal,14px,20px);
|
||||
color: @gray;
|
||||
text-rendering: optimizeLegibility;
|
||||
.box-shadow(inset 0 1px 0 #fff);
|
||||
}
|
||||
|
||||
// Container (centered, fixed-width layouts)
|
||||
@@ -68,11 +67,11 @@ div.container-fluid {
|
||||
|
||||
// Links
|
||||
a {
|
||||
color: @link-color;
|
||||
color: @linkColor;
|
||||
text-decoration: none;
|
||||
line-height: inherit;
|
||||
&:hover {
|
||||
color: @link-hover-color;
|
||||
color: @linkColorHover;
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
@@ -81,7 +80,7 @@ a {
|
||||
.btn {
|
||||
.button();
|
||||
&.primary {
|
||||
#gradient > .vertical(@blue, @blue-dark);
|
||||
#gradient > .vertical(@blue, darken(@blue, 15));
|
||||
color: #fff;
|
||||
text-shadow: 0 -1px 0 rgba(0,0,0,.25);
|
||||
&:hover {
|
||||
|
||||
+1
-2
@@ -13,7 +13,6 @@ table {
|
||||
text-align: left;
|
||||
border-collapse: separate;
|
||||
th, td {
|
||||
// #translucent > .background(@green, .15);
|
||||
padding: 10px 10px 9px;
|
||||
line-height: @baseline;
|
||||
vertical-align: middle;
|
||||
@@ -51,8 +50,8 @@ table.zebra-striped {
|
||||
background-position: right -23px;
|
||||
background-repeat: no-repeat;
|
||||
background-color: rgba(141,192,219,.25);
|
||||
.border-radius(3px 3px 0 0);
|
||||
text-shadow: 0 1px 1px rgba(255,255,255,.75);
|
||||
.border-radius(3px 3px 0 0);
|
||||
}
|
||||
th.header:hover { // Style the ascending (reverse alphabetical) column header
|
||||
background-image: url(assets/img/tablesorter-indicators.png);
|
||||
|
||||
+10
-10
@@ -8,11 +8,11 @@
|
||||
-------------------------------------------------- */
|
||||
|
||||
p {
|
||||
.font(normal,14px,@baseline);
|
||||
#font > .shorthand(normal,14px,@baseline);
|
||||
margin-bottom: @baseline;
|
||||
small {
|
||||
font-size: 12px;
|
||||
color: @gray-light;
|
||||
color: @grayLight;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -22,9 +22,9 @@ p {
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
font-weight: 500;
|
||||
color: @gray-dark;
|
||||
color: @grayDark;
|
||||
small {
|
||||
color: @gray-light;
|
||||
color: @grayLight;
|
||||
}
|
||||
}
|
||||
h1 {
|
||||
@@ -62,7 +62,7 @@ h5 {
|
||||
}
|
||||
h6 {
|
||||
font-size: 13px;
|
||||
color: @gray-light;
|
||||
color: @grayLight;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
@@ -167,7 +167,7 @@ em {
|
||||
line-height: inherit;
|
||||
}
|
||||
.muted {
|
||||
color: @gray-lighter;
|
||||
color: @grayLighter;
|
||||
}
|
||||
|
||||
// Blockquotes
|
||||
@@ -176,13 +176,13 @@ blockquote {
|
||||
border-left: 5px solid #eee;
|
||||
padding-left: 15px;
|
||||
p {
|
||||
.font(300,14px,@baseline);
|
||||
#font > .shorthand(300,14px,@baseline);
|
||||
margin-bottom: 0;
|
||||
}
|
||||
cite {
|
||||
display: block;
|
||||
.font(300,12px,@baseline);
|
||||
color: @gray-light;
|
||||
#font > .shorthand(300,12px,@baseline);
|
||||
color: @grayLight;
|
||||
&:before {
|
||||
content: '\2014 \00A0';
|
||||
}
|
||||
@@ -236,7 +236,7 @@ pre ol {
|
||||
border-left-color: lighten(@orange, 35%);
|
||||
font-size: 11px;
|
||||
line-height: @baseline;
|
||||
color: @gray-light;
|
||||
color: @grayLight;
|
||||
text-shadow: 0 1px 1px rgba(255,255,255,.5);
|
||||
word-wrap: break-word;
|
||||
&:hover {
|
||||
|
||||
Reference in New Issue
Block a user