Zach Wise
13 years ago
5 changed files with 0 additions and 695 deletions
@ -1,170 +0,0 @@ |
|||||||
/* Typography.less |
|
||||||
* Headings, body text, lists, etc |
|
||||||
* ---------------------------------------------------------------------------------------- */ |
|
||||||
|
|
||||||
.vmm-timeline { |
|
||||||
font-size: @base-font; |
|
||||||
font-weight: normal; |
|
||||||
line-height: @base-line; |
|
||||||
-webkit-font-smoothing: antialiased; /* Fix for webkit rendering */ |
|
||||||
-webkit-text-size-adjust: 100%; |
|
||||||
|
|
||||||
p { |
|
||||||
font-size: @base-font; |
|
||||||
font-weight: normal; |
|
||||||
line-height: @base-line; |
|
||||||
margin-bottom: @base-line; |
|
||||||
color: @color-feature-description; |
|
||||||
|
|
||||||
small { |
|
||||||
font-size: @base-font - 3; |
|
||||||
line-height: @base-line - 3; |
|
||||||
} |
|
||||||
} |
|
||||||
p:first-child { |
|
||||||
margin-top:@base-line; |
|
||||||
} |
|
||||||
.navigation { |
|
||||||
p { |
|
||||||
color: @color-nav-description; |
|
||||||
} |
|
||||||
} |
|
||||||
.feature { |
|
||||||
h3, h4, h5, h6 { |
|
||||||
margin-bottom: @base-space; |
|
||||||
} |
|
||||||
p { |
|
||||||
color: @color-feature-description; |
|
||||||
} |
|
||||||
} |
|
||||||
.date, .title { |
|
||||||
a { |
|
||||||
color: @color-nav-description; |
|
||||||
} |
|
||||||
|
|
||||||
} |
|
||||||
|
|
||||||
h1, h2, h3, h4, h5, h6 { |
|
||||||
font-weight: normal; |
|
||||||
color: @color-feature-title; |
|
||||||
text-transform: none; |
|
||||||
a { |
|
||||||
color: @color-nav-description; |
|
||||||
} |
|
||||||
small { |
|
||||||
color: @color-nav-title; |
|
||||||
} |
|
||||||
} |
|
||||||
h1.date, h2.date, h3.date, h4.date, h5.date, h6.date { |
|
||||||
font-weight: bold; |
|
||||||
} |
|
||||||
h2.start { |
|
||||||
font-size: 42px; |
|
||||||
line-height: 44px; |
|
||||||
margin-bottom: @base-space; |
|
||||||
} |
|
||||||
h1 { |
|
||||||
margin-bottom: @base-space; |
|
||||||
font-size: 32px; |
|
||||||
line-height: 34px; |
|
||||||
small { |
|
||||||
font-size: 18px; |
|
||||||
} |
|
||||||
} |
|
||||||
h2 { |
|
||||||
margin-bottom: @base-space; |
|
||||||
font-size: 28px; |
|
||||||
line-height: 30px; |
|
||||||
|
|
||||||
small { |
|
||||||
font-size: 14px; |
|
||||||
line-height: 16px; |
|
||||||
|
|
||||||
//margin-left:5px; |
|
||||||
} |
|
||||||
} |
|
||||||
h2.date { |
|
||||||
font-size: 16px; |
|
||||||
line-height:18px; |
|
||||||
margin-bottom: @base-space/4; |
|
||||||
color:@color-feature-date; |
|
||||||
|
|
||||||
//margin-bottom: @base-space; |
|
||||||
} |
|
||||||
h3, h4, h5, h6 { |
|
||||||
line-height: @base-line * 2; |
|
||||||
.active { |
|
||||||
color: @color-theme; |
|
||||||
} |
|
||||||
} |
|
||||||
h3 { |
|
||||||
font-size: 28px; |
|
||||||
line-height: 30px; |
|
||||||
//font-size: 24px; |
|
||||||
//line-height:26px; |
|
||||||
small { |
|
||||||
font-size: 14px; |
|
||||||
} |
|
||||||
} |
|
||||||
h4 { |
|
||||||
font-size: 16px; |
|
||||||
line-height:18px; |
|
||||||
small { |
|
||||||
font-size: 12px; |
|
||||||
} |
|
||||||
} |
|
||||||
h5 { |
|
||||||
font-size: 14px; |
|
||||||
line-height:16px; |
|
||||||
} |
|
||||||
h6 { |
|
||||||
font-size: 13px; |
|
||||||
line-height:14px; |
|
||||||
text-transform: uppercase; |
|
||||||
} |
|
||||||
strong { |
|
||||||
font-weight:bold; |
|
||||||
} |
|
||||||
|
|
||||||
|
|
||||||
Q { |
|
||||||
quotes: '„' '“'; |
|
||||||
font-style: italic; |
|
||||||
} |
|
||||||
|
|
||||||
/* BLOCKQUOTES |
|
||||||
================================================== */ |
|
||||||
|
|
||||||
blockquote { |
|
||||||
font-size: 28px; |
|
||||||
text-align:left; |
|
||||||
line-height: 36px; |
|
||||||
margin-bottom: 6px; |
|
||||||
padding-top: 10px; |
|
||||||
background-color:@white; |
|
||||||
color:@color-feature-title; |
|
||||||
} |
|
||||||
|
|
||||||
/* Caption and Credits |
|
||||||
================================================== */ |
|
||||||
|
|
||||||
.credit { |
|
||||||
color: @color-credit; |
|
||||||
text-align: right; |
|
||||||
font-size: 10px; |
|
||||||
line-height: 10px; |
|
||||||
display: block; |
|
||||||
margin: 0 auto; |
|
||||||
clear:both; |
|
||||||
} |
|
||||||
.caption { |
|
||||||
text-align:left; |
|
||||||
margin-top:5px; |
|
||||||
color: @color-caption; |
|
||||||
font-size: 11px; |
|
||||||
line-height: 14px; |
|
||||||
clear:both; |
|
||||||
} |
|
||||||
|
|
||||||
|
|
||||||
} |
|
||||||
@ -1,138 +0,0 @@ |
|||||||
/* |
|
||||||
GFX |
|
||||||
Icons etc |
|
||||||
----------------------------------------------------------------- */ |
|
||||||
|
|
||||||
/* Feature Navigation |
|
||||||
----------------------------------------------------------------- */ |
|
||||||
.icon-previous() { |
|
||||||
height:24px; |
|
||||||
.base-sprite(); |
|
||||||
background-repeat:no-repeat; |
|
||||||
background-position: -160px 0; width: 24px; height: 24px; |
|
||||||
overflow:hidden; |
|
||||||
} |
|
||||||
|
|
||||||
.icon-next() { |
|
||||||
.base-sprite(); |
|
||||||
background-repeat:no-repeat; |
|
||||||
background-position: -184px 0; width: 24px; height: 24px; |
|
||||||
height:24px; |
|
||||||
overflow:hidden; |
|
||||||
|
|
||||||
} |
|
||||||
/* TimeNav Navigation |
|
||||||
----------------------------------------------------------------- */ |
|
||||||
.icon-zoom-in() { |
|
||||||
.base-sprite(); |
|
||||||
background-repeat:no-repeat; |
|
||||||
background-position: -256px 0; width: 24px; height: 24px; |
|
||||||
} |
|
||||||
.icon-zoom-out() { |
|
||||||
.base-sprite(); |
|
||||||
background-repeat:no-repeat; |
|
||||||
background-position: -280px 0; width: 24px; height: 24px; |
|
||||||
} |
|
||||||
.icon-back-home() { |
|
||||||
.base-sprite(); |
|
||||||
background-repeat:no-repeat; |
|
||||||
background-position: -328px 0; width: 24px; height: 24px; |
|
||||||
} |
|
||||||
|
|
||||||
/* Time Flag |
|
||||||
----------------------------------------------------------------- */ |
|
||||||
.time-flag() { |
|
||||||
.base-sprite(); |
|
||||||
background-repeat:no-repeat; |
|
||||||
background-position: 0 0; width:153px; height: 53px; |
|
||||||
} |
|
||||||
.time-flag-active() { |
|
||||||
.base-sprite(); |
|
||||||
background-repeat:no-repeat; |
|
||||||
background-position: 0 -53px; width:153px; height: 53px; |
|
||||||
} |
|
||||||
|
|
||||||
/* Thumbnail Icons |
|
||||||
----------------------------------------------------------------- */ |
|
||||||
.icon-map() { |
|
||||||
.base-sprite(); |
|
||||||
background-repeat:no-repeat; |
|
||||||
background-position: -208px -24px; |
|
||||||
} |
|
||||||
.icon-mappin() { |
|
||||||
.base-sprite(); |
|
||||||
background-repeat:no-repeat; |
|
||||||
background-position: -208px -48px; |
|
||||||
} |
|
||||||
.icon-website() { |
|
||||||
.base-sprite(); |
|
||||||
background-repeat:no-repeat; |
|
||||||
background-position: -232px -24px; |
|
||||||
} |
|
||||||
.icon-document() { |
|
||||||
.base-sprite(); |
|
||||||
background-repeat:no-repeat; |
|
||||||
background-position: -256px -48px; |
|
||||||
} |
|
||||||
.icon-quote() { |
|
||||||
.base-sprite(); |
|
||||||
background-repeat:no-repeat; |
|
||||||
background-position: -232px -48px; |
|
||||||
} |
|
||||||
.icon-plaintext() { |
|
||||||
.base-sprite(); |
|
||||||
background-repeat:no-repeat; |
|
||||||
background-position: -280px -48px; |
|
||||||
} |
|
||||||
.icon-twitter() { |
|
||||||
.base-sprite(); |
|
||||||
background-repeat:no-repeat; |
|
||||||
background-position: -256px -24px; |
|
||||||
} |
|
||||||
.icon-video() { |
|
||||||
.base-sprite(); |
|
||||||
background-repeat:no-repeat; |
|
||||||
background-position: -328px -24px; |
|
||||||
} |
|
||||||
.icon-audio() { |
|
||||||
.base-sprite(); |
|
||||||
background-repeat:no-repeat; |
|
||||||
background-position: -304px -24px; |
|
||||||
} |
|
||||||
.icon-photo() { |
|
||||||
.base-sprite(); |
|
||||||
background-repeat:no-repeat; |
|
||||||
background-position: -280px -24px; |
|
||||||
} |
|
||||||
.icon-wikipedia() { |
|
||||||
.base-sprite(); |
|
||||||
background-repeat:no-repeat; |
|
||||||
background-position: -184px -48px; |
|
||||||
} |
|
||||||
|
|
||||||
/* Thumbnail Icons (Extra) |
|
||||||
----------------------------------------------------------------- */ |
|
||||||
.icon-vimeo() { |
|
||||||
.base-sprite(); |
|
||||||
background-repeat:no-repeat; |
|
||||||
background-position: -328px -48px; |
|
||||||
} |
|
||||||
.icon-youtube() { |
|
||||||
.base-sprite(); |
|
||||||
background-repeat:no-repeat; |
|
||||||
background-position: -328px -72px; |
|
||||||
} |
|
||||||
|
|
||||||
/* Time Tics |
|
||||||
----------------------------------------------------------------- */ |
|
||||||
.background-time-tic() { |
|
||||||
background: @color-background url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAGCAMAAAA8JaR5AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAAZQTFRFzMzM////040VdgAAAAJ0Uk5T/wDltzBKAAAAEklEQVR42mJgYAQCBrwkQIABAAHIABkHeR3aAAAAAElFTkSuQmCC); |
|
||||||
} |
|
||||||
|
|
||||||
.background-time-interval() { |
|
||||||
//background: @color-base url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAMCAMAAACdvocfAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAAZQTFRFzMzM////040VdgAAAAJ0Uk5T/wDltzBKAAAAEklEQVR42mJgYAQCBopJgAADAAbwADHy2qHzAAAAAElFTkSuQmCC); |
|
||||||
//background-repeat: no-repeat; |
|
||||||
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAMCAMAAACdvocfAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAAZQTFRFzMzM////040VdgAAAAJ0Uk5T/wDltzBKAAAAEklEQVR42mJgYAQCBopJgAADAAbwADHy2qHzAAAAAElFTkSuQmCC); |
|
||||||
|
|
||||||
} |
|
||||||
|
|
||||||
@ -1,216 +0,0 @@ |
|||||||
/* Mixins.less |
|
||||||
* Snippets of reusable CSS to develop faster and keep code readable |
|
||||||
* ----------------------------------------------------------------- */ |
|
||||||
|
|
||||||
|
|
||||||
// Clearfix for clearing floats like a boss h5bp.com/q |
|
||||||
.clearfix() { |
|
||||||
zoom: 1; |
|
||||||
&:before, |
|
||||||
&:after { |
|
||||||
display: table; |
|
||||||
content: ""; |
|
||||||
zoom: 1; |
|
||||||
} |
|
||||||
&:after { |
|
||||||
clear: both; |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
// Center-align a block level element |
|
||||||
.center-block() { |
|
||||||
display: block; |
|
||||||
margin-left: auto; |
|
||||||
margin-right: 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: @font-sansserif; |
|
||||||
font-size: @size; |
|
||||||
font-weight: @weight; |
|
||||||
line-height: @lineHeight; |
|
||||||
} |
|
||||||
.font-body(@weight: normal, @size: 14px, @lineHeight: 20px) { |
|
||||||
font-family: @fontBody, Helvetica, Arial, sans-serif; |
|
||||||
font-size: @size; |
|
||||||
font-weight: @weight; |
|
||||||
line-height: @lineHeight; |
|
||||||
} |
|
||||||
.font-header(@weight: normal, @size: 14px, @lineHeight: 20px) { |
|
||||||
font-family: @fontHeader; |
|
||||||
font-size: @size; |
|
||||||
font-weight: @weight; |
|
||||||
line-height: @lineHeight; |
|
||||||
} |
|
||||||
.serif(@weight: normal, @size: 14px, @lineHeight: 20px) { |
|
||||||
font-family: @font-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; |
|
||||||
} |
|
||||||
|
|
||||||
.navigation(@weight: normal, @size: 14px, @lineHeight: 20px) { |
|
||||||
font-family: @font-sansserif; |
|
||||||
font-size: @size; |
|
||||||
font-weight: @weight; |
|
||||||
line-height: @lineHeight; |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
// Border Radius |
|
||||||
.border-radius(@radius: 5px) { |
|
||||||
-webkit-border-radius: @radius; |
|
||||||
-moz-border-radius: @radius; |
|
||||||
border-radius: @radius; |
|
||||||
} |
|
||||||
|
|
||||||
// Drop shadows |
|
||||||
.box-shadow(@shadow: 1px 1px 7px rgba(0,0,0,.30)) { |
|
||||||
-webkit-box-shadow: @shadow; |
|
||||||
-moz-box-shadow: @shadow; |
|
||||||
box-shadow: @shadow; |
|
||||||
} |
|
||||||
|
|
||||||
// Transitions |
|
||||||
.transition(@transition) { |
|
||||||
-webkit-transition: @transition; |
|
||||||
-moz-transition: @transition; |
|
||||||
-ms-transition: @transition; |
|
||||||
-o-transition: @transition; |
|
||||||
transition: @transition; |
|
||||||
} |
|
||||||
|
|
||||||
// Background clipping |
|
||||||
.background-clip(@clip) { |
|
||||||
-webkit-background-clip: @clip; |
|
||||||
-moz-background-clip: @clip; |
|
||||||
background-clip: @clip; |
|
||||||
} |
|
||||||
|
|
||||||
// CSS3 Content Columns |
|
||||||
.content-columns(@columnCount, @columnGap: 20px) { |
|
||||||
-webkit-column-count: @columnCount; |
|
||||||
-moz-column-count: @columnCount; |
|
||||||
column-count: @columnCount; |
|
||||||
-webkit-column-gap: @columnGap; |
|
||||||
-moz-column-gap: @columnGap; |
|
||||||
column-gap: @columnGap; |
|
||||||
} |
|
||||||
|
|
||||||
// Make any element resizable for prototyping |
|
||||||
.resizable(@direction: both) { |
|
||||||
resize: @direction; // Options are horizontal, vertical, both |
|
||||||
overflow: auto; // Safari fix |
|
||||||
} |
|
||||||
|
|
||||||
// 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; |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
// Gradient Bar Colors for buttons and allerts |
|
||||||
.gradientBar(@primaryColor, @secondaryColor) { |
|
||||||
#gradient > .vertical(@primaryColor, @secondaryColor); |
|
||||||
text-shadow: 0 -1px 0 rgba(0,0,0,.25); |
|
||||||
border-color: @secondaryColor @secondaryColor darken(@secondaryColor, 15%); |
|
||||||
border-color: rgba(0,0,0,.1) rgba(0,0,0,.1) fadein(rgba(0,0,0,.1), 15%); |
|
||||||
} |
|
||||||
|
|
||||||
// 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 |
|
||||||
background-image: linear-gradient(left, @startColor, @endColor); // Le standard |
|
||||||
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",@startColor,@endColor)); // IE9 and down |
|
||||||
} |
|
||||||
.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(top, @startColor, @endColor); // FF 3.6+ |
|
||||||
background-image: -ms-linear-gradient(top, @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(top, @startColor, @endColor); // Safari 5.1+, Chrome 10+ |
|
||||||
background-image: -o-linear-gradient(top, @startColor, @endColor); // Opera 11.10 |
|
||||||
background-image: linear-gradient(top, @startColor, @endColor); // The standard |
|
||||||
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",@startColor,@endColor)); // IE9 and down |
|
||||||
} |
|
||||||
.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: 50%, @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, @midColor @colorStop, @endColor); |
|
||||||
background-image: -moz-linear-gradient(top, @startColor, @midColor @colorStop, @endColor); |
|
||||||
background-image: -ms-linear-gradient(@startColor, @midColor @colorStop, @endColor); |
|
||||||
background-image: -o-linear-gradient(@startColor, @midColor @colorStop, @endColor); |
|
||||||
background-image: linear-gradient(@startColor, @midColor @colorStop, @endColor); |
|
||||||
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",@startColor,@endColor)); // IE9 and down, gets no color-stop at all for proper fallback |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
// Reset filters for IE |
|
||||||
.reset-filter() { |
|
||||||
filter: e(%("progid:DXImageTransform.Microsoft.gradient(enabled = false)")); |
|
||||||
} |
|
||||||
|
|
||||||
// Opacity |
|
||||||
.opacity(@opacity: 100) { |
|
||||||
filter: e(%("alpha(opacity=%d)", @opacity)); |
|
||||||
-khtml-opacity: @opacity / 100; |
|
||||||
-moz-opacity: @opacity / 100; |
|
||||||
opacity: @opacity / 100; |
|
||||||
} |
|
||||||
@ -1,100 +0,0 @@ |
|||||||
/* Reset |
|
||||||
------------------------------------------------------------------------------------------- */ |
|
||||||
|
|
||||||
.vmm-timeline { |
|
||||||
|
|
||||||
/* Reset tags and common classes |
|
||||||
Display in IE6-9 and FF3 |
|
||||||
Based on: http://github.com/necolas/normalize.css |
|
||||||
------------------------------------------------------------------------------------------- */ |
|
||||||
|
|
||||||
|
|
||||||
h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, cite, code, del, dfn, em, img, q, s, samp, small, strike, strong, |
|
||||||
sub, sup, tt, var, dd, dl, dt, li, ol, ul, fieldset, form, label, legend, button, table, caption, tbody, tfoot, thead, tr, th, td, |
|
||||||
.container, .content-container, .media, .text, .slider, .date, .title, .messege, .map, .credit, .caption, .feedback, .feature, .toolbar, |
|
||||||
.marker, .dot, .line, .flag, .time, .era, .major, .minor, .navigation, .start, .active { |
|
||||||
margin: 0; padding: 0; border: 0; font-weight: normal; font-style: normal; font-size: 100%; line-height: 1; font-family: inherit; |
|
||||||
} |
|
||||||
table { border-collapse: collapse; border-spacing: 0;} |
|
||||||
ol, ul { list-style: none;} |
|
||||||
q:before, q:after, blockquote:before, blockquote:after { content: ""; } |
|
||||||
a:focus { outline: thin dotted; } |
|
||||||
a:hover, a:active { outline: 0;} |
|
||||||
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { |
|
||||||
display: block; |
|
||||||
} |
|
||||||
audio, canvas, video { |
|
||||||
display: inline-block; |
|
||||||
*display: inline; |
|
||||||
*zoom: 1; |
|
||||||
} |
|
||||||
|
|
||||||
/* Prevents modern browsers from displaying 'audio' without controls |
|
||||||
Based on: http://github.com/necolas/normalize.css |
|
||||||
------------------------------------------------------------------------------------------- */ |
|
||||||
audio:not([controls]) { |
|
||||||
display: none; |
|
||||||
} |
|
||||||
div { |
|
||||||
max-width:none; |
|
||||||
} |
|
||||||
|
|
||||||
/* Prevents sub and sup affecting line-height in all browsers |
|
||||||
Based on: http://github.com/necolas/normalize.css |
|
||||||
------------------------------------------------------------------------------------------- */ |
|
||||||
sub, sup { |
|
||||||
font-size: 75%; |
|
||||||
line-height: 0; |
|
||||||
position: relative; |
|
||||||
vertical-align: baseline; |
|
||||||
} |
|
||||||
sup { |
|
||||||
top: -0.5em; |
|
||||||
} |
|
||||||
sub { |
|
||||||
bottom: -0.25em; |
|
||||||
} |
|
||||||
|
|
||||||
/* Img border in a's and image quality |
|
||||||
Based on: http://github.com/necolas/normalize.css |
|
||||||
------------------------------------------------------------------------------------------- */ |
|
||||||
img { |
|
||||||
border: 0; |
|
||||||
-ms-interpolation-mode: bicubic; |
|
||||||
} |
|
||||||
|
|
||||||
/* Forms |
|
||||||
Based on: http://github.com/necolas/normalize.css |
|
||||||
------------------------------------------------------------------------------------------- */ |
|
||||||
button, input, select, textarea { |
|
||||||
font-size: 100%; |
|
||||||
margin: 0; |
|
||||||
vertical-align: baseline; |
|
||||||
*vertical-align: middle; |
|
||||||
} |
|
||||||
button, input { |
|
||||||
line-height: normal; // FF3/4 have !important on line-height in UA stylesheet |
|
||||||
*overflow: visible; // Inner spacing ie IE6/7 |
|
||||||
} |
|
||||||
button::-moz-focus-inner, input::-moz-focus-inner { // Inner padding and border oddities in FF3/4 |
|
||||||
border: 0; |
|
||||||
padding: 0; |
|
||||||
} |
|
||||||
button, input[type="button"], input[type="reset"], input[type="submit"] { |
|
||||||
cursor: pointer; // Cursors on all buttons applied consistently |
|
||||||
-webkit-appearance: button; // Style clicable inputs in iOS |
|
||||||
} |
|
||||||
input[type="search"] { // Appearance in Safari/Chrome |
|
||||||
-webkit-appearance: textfield; |
|
||||||
-webkit-box-sizing: content-box; |
|
||||||
-moz-box-sizing: content-box; |
|
||||||
box-sizing: content-box; |
|
||||||
} |
|
||||||
input[type="search"]::-webkit-search-decoration { |
|
||||||
-webkit-appearance: none; // Inner-padding issues in Chrome OSX, Safari 5 |
|
||||||
} |
|
||||||
textarea { |
|
||||||
overflow: auto; // Remove vertical scrollbar in IE6-9 |
|
||||||
vertical-align: top; // Readability and alignment cross-browser |
|
||||||
} |
|
||||||
} |
|
||||||
@ -1,71 +0,0 @@ |
|||||||
/* VARIABLES |
|
||||||
----------------------------------------------------- */ |
|
||||||
|
|
||||||
/* COLOR SCHEME |
|
||||||
================================================== */ |
|
||||||
@color-theme-dark: darken(@color-theme, 15); |
|
||||||
@color-theme-complement: spin(@color-theme, 180); |
|
||||||
@color-theme-complement-dark: darken(@color-theme-complement, 15); |
|
||||||
|
|
||||||
@color-theme-split1: spin(@color-theme, -158); |
|
||||||
@color-theme-split2: spin(@color-theme, 158); |
|
||||||
|
|
||||||
@color-theme-triad1: spin(@color-theme, -135); |
|
||||||
@color-theme-triad2: spin(@color-theme, 135); |
|
||||||
|
|
||||||
@color-theme-tetra1: spin(@color-theme, -90); |
|
||||||
@color-theme-tetra2: spin(@color-theme, 90); |
|
||||||
|
|
||||||
@color-theme-analog1: spin(@color-theme, -22); |
|
||||||
@color-theme-analog2: spin(@color-theme, 22); |
|
||||||
|
|
||||||
@color-background: @color-base; |
|
||||||
|
|
||||||
@white: @color-base; |
|
||||||
|
|
||||||
/* NAVIGATION COLORS |
|
||||||
================================================== */ |
|
||||||
@color-nav-date: #AAA; // 33% |
|
||||||
@color-nav-description: @color-dark-fourth; // 40% |
|
||||||
@color-nav-title: @color-dark-fourth; |
|
||||||
|
|
||||||
@color-navigation-time: @color-dark-third; // 60% |
|
||||||
@color-navigation-major-time: @color-dark-second; // 80% |
|
||||||
@color-navigation-time-strong: @color-dark; // 100% |
|
||||||
|
|
||||||
@era-background: #E2E2E2; //#E3E3E3; // 11% |
|
||||||
@era-line: @color-line; |
|
||||||
@era-text: @color-feature-date; |
|
||||||
|
|
||||||
/* FEATURE COLORS |
|
||||||
================================================== */ |
|
||||||
@color-feature-date: @color-dark-fourth; |
|
||||||
@color-feature-description: @color-dark-third; |
|
||||||
@color-feature-title: @color-dark; |
|
||||||
|
|
||||||
|
|
||||||
@color-caption: @color-dark-third; |
|
||||||
@color-credit: @color-dark-fourth; |
|
||||||
|
|
||||||
/* BASE SIZES |
|
||||||
================================================== */ |
|
||||||
@base-font: 15px; |
|
||||||
@base-line: 20px; |
|
||||||
@base-space: 15px; |
|
||||||
@base-font-small: 11px; |
|
||||||
|
|
||||||
/* FEATURE SIZES |
|
||||||
================================================== */ |
|
||||||
@feature-content-text: 200px; |
|
||||||
@feature-content-width: 720px; |
|
||||||
@feature-content-height: 400px; |
|
||||||
@feature-nav-width: 100px; |
|
||||||
@feature-nav-height: 200px; |
|
||||||
@feature-nav-icon-wh: 24px; |
|
||||||
|
|
||||||
/* NAVIGATION SIZES |
|
||||||
================================================== */ |
|
||||||
@navigation-height: 200px; |
|
||||||
@navigation-time-height: 50px; |
|
||||||
@navigation-content-height: @navigation-height - @navigation-time-height; |
|
||||||
@navigation-marker-height: 6px; |
|
||||||
Loading…
Reference in new issue