266 lines
8.5 KiB
SCSS
266 lines
8.5 KiB
SCSS
// styles and effects
|
|
.round-corners {
|
|
-moz-border-radius: 3px;
|
|
-webkit-border-radius: 3px;
|
|
-khtml-border-radius: 3px;
|
|
border-radius: 3px;
|
|
}
|
|
|
|
@mixin rounded {
|
|
-moz-border-radius: 50px;
|
|
-webkit-border-radius: 50px;
|
|
-khtml-border-radius: 50px;
|
|
border-radius: 50px;
|
|
}
|
|
|
|
.rounded {
|
|
@include rounded;
|
|
}
|
|
|
|
@mixin animate-background-color {
|
|
transition: background-color .3s ease-in-out;
|
|
-moz-transition: background-color .3s ease-in-out;
|
|
-webkit-transition: background-color .3s ease-in-out;
|
|
-o-transition: background-color .3s ease-in-out;
|
|
}
|
|
|
|
.animate-background-color {
|
|
@include animate-background-color;
|
|
}
|
|
|
|
@mixin animate-text-color {
|
|
transition: color .2s ease-in-out;
|
|
-moz-transition: color .2s ease-in-out;
|
|
-webkit-transition: color .2s ease-in-out;
|
|
-o-transition: color .2s ease-in-out;
|
|
}
|
|
|
|
.animate-text-color {
|
|
@include animate-text-color;
|
|
}
|
|
|
|
@mixin animate-opacity {
|
|
transition: opacity .2s ease-in-out;
|
|
-moz-transition: opacity .2s ease-in-out;
|
|
-webkit-transition: opacity .2s ease-in-out;
|
|
-o-transition: opacity .2s ease-in-out;
|
|
}
|
|
|
|
.animate-opacity {
|
|
@include animate-opacity;
|
|
}
|
|
|
|
@mixin drop-shadow {
|
|
-webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1) !important;
|
|
-moz-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1) !important;
|
|
box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1) !important;
|
|
@include animate-opacity;
|
|
}
|
|
|
|
.drop-shadow {
|
|
@include drop-shadow;
|
|
}
|
|
@mixin hyphenate {
|
|
-webkit-hyphens: auto;
|
|
-moz-hyphens: auto;
|
|
hyphens: auto;
|
|
}
|
|
|
|
.hyphenate {
|
|
@include hyphenate;
|
|
}
|
|
|
|
@mixin uppercase {
|
|
text-transform: uppercase;
|
|
}
|
|
|
|
.uppercase {
|
|
@include uppercase;
|
|
}
|
|
|
|
@mixin padded {
|
|
padding: ($baseline * 3) 0;
|
|
}
|
|
|
|
.padded {
|
|
@include padded;
|
|
}
|
|
|
|
@mixin padded-medium {
|
|
padding: ($baseline * 2) 0;
|
|
}
|
|
|
|
.padded-medium {
|
|
@include padded-medium;
|
|
}
|
|
|
|
@mixin padded-small{
|
|
padding: $baseline 0;
|
|
}
|
|
|
|
.padded-small {
|
|
@include padded-small;
|
|
}
|
|
|
|
@mixin transition($transition) {
|
|
-webkit-transition: $transition;
|
|
-o-transition: $transition;
|
|
transition: $transition;
|
|
}
|
|
|
|
@mixin translate3d($x, $y: 0, $z: 0) {
|
|
-webkit-transform: translate3d($x, $y, $z);
|
|
-moz-transform: translate3d($x, $y, $z);
|
|
-ms-transform: translate3d($x, $y, $z);
|
|
-o-transform: translate3d($x, $y, $z);
|
|
}
|
|
|
|
@mixin clearfix {
|
|
zoom:1;
|
|
&:before, &:after{ content:""; display:table; }
|
|
&:after{ clear: both; }
|
|
}
|
|
|
|
.clearfix {
|
|
@include clearfix;
|
|
}
|
|
|
|
@mixin inner-bg-large {
|
|
background-image: #c1b4d5; /* Old browsers */
|
|
background-image: image-url("sidebar_background_inner.png"), -moz-linear-gradient(45deg, #c1b4d5 0%, #98d3f8 100%); /* FF3.6+ */
|
|
background-image: image-url("sidebar_background_inner.png"), -webkit-gradient(linear, left bottom, right top, color-stop(0%,#c1b4d5), color-stop(100%,#98d3f8)); /* Chrome,Safari4+ */
|
|
background-image: image-url("sidebar_background_inner.png"), -webkit-linear-gradient(45deg, #c1b4d5 0%,#98d3f8 100%); /* Chrome10+,Safari5.1+ */
|
|
background-image: image-url("sidebar_background_inner.png"), -o-linear-gradient(45deg, #c1b4d5 0%,#98d3f8 100%); /* Opera 11.10+ */
|
|
background-image: image-url("sidebar_background_inner.png"), -ms-linear-gradient(45deg, #c1b4d5 0%,#98d3f8 100%); /* IE10+ */
|
|
background-image: image-url("sidebar_background_inner.png"), linear-gradient(45deg, #c1b4d5 0%,#98d3f8 100%); /* W3C */
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c1b4d5', endColorstr='#98d3f8',GradientType=1 ); /* IE6-8 fallback on horizontal gradient */
|
|
background-repeat: no-repeat;
|
|
background-position: 0 0;
|
|
}
|
|
|
|
.inner-bg-large {
|
|
@include inner-bg-large;
|
|
}
|
|
|
|
@mixin inner-bg-small {
|
|
background: #c1b4d5; /* Old browsers */
|
|
background: -moz-linear-gradient(45deg, #c1b4d5 0%, #98d3f8 100%); /* FF3.6+ */
|
|
background: -webkit-gradient(linear, left bottom, right top, color-stop(0%,#c1b4d5), color-stop(100%,#98d3f8)); /* Chrome,Safari4+ */
|
|
background: -webkit-linear-gradient(45deg, #c1b4d5 0%,#98d3f8 100%); /* Chrome10+,Safari5.1+ */
|
|
background: -o-linear-gradient(45deg, #c1b4d5 0%,#98d3f8 100%); /* Opera 11.10+ */
|
|
background: -ms-linear-gradient(45deg, #c1b4d5 0%,#98d3f8 100%); /* IE10+ */
|
|
background: linear-gradient(45deg, #c1b4d5 0%,#98d3f8 100%); /* W3C */
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c1b4d5', endColorstr='#98d3f8',GradientType=1 ); /* IE6-8 fallback on horizontal gradient */
|
|
}
|
|
|
|
.inner-bg-small {
|
|
}
|
|
|
|
|
|
@mixin docs-bg-large {
|
|
background-image: image-url("sidebar_background_docs.png"), #362d6c; /* Old browsers */
|
|
background-image: image-url("sidebar_background_docs.png"), -moz-linear-gradient(45deg, #362d6c 0%, #0c5593 100%); /* FF3.6+ */
|
|
background-image: image-url("sidebar_background_docs.png"), -webkit-gradient(linear, left bottom, right top, color-stop(0%,#362d6c), color-stop(100%,#0c5593)); /* Chrome,Safari4+ */
|
|
background-image: image-url("sidebar_background_docs.png"), -webkit-linear-gradient(45deg, #362d6c 0%,#0c5593 100%); /* Chrome10+,Safari5.1+ */
|
|
background-image: image-url("sidebar_background_docs.png"), -o-linear-gradient(45deg, #362d6c 0%,#0c5593 100%); /* Opera 11.10+ */
|
|
background-image: image-url("sidebar_background_docs.png"), -ms-linear-gradient(45deg, #362d6c 0%,#0c5593 100%); /* IE10+ */
|
|
background-image: image-url("sidebar_background_docs.png"), linear-gradient(45deg, #362d6c 0%,#0c5593 100%); /* W3C */
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#362d6c', endColorstr='#0c5593',GradientType=1 ); /* IE6-8 fallback on horizontal gradient */
|
|
background-repeat: no-repeat;
|
|
background-position: 0 140px, 0 0;
|
|
}
|
|
|
|
.docs-bg-large {
|
|
@include docs-bg-large;
|
|
}
|
|
|
|
@mixin docs-bg-small {
|
|
background: #362d6c; /* Old browsers */
|
|
background: -moz-linear-gradient(45deg, #362d6c 0%, #0c5593 100%); /* FF3.6+ */
|
|
background: -webkit-gradient(linear, left bottom, right top, color-stop(0%,#362d6c), color-stop(100%,#0c5593)); /* Chrome,Safari4+ */
|
|
background: -webkit-linear-gradient(45deg, #362d6c 0%,#0c5593 100%); /* Chrome10+,Safari5.1+ */
|
|
background: -o-linear-gradient(45deg, #362d6c 0%,#0c5593 100%); /* Opera 11.10+ */
|
|
background: -ms-linear-gradient(45deg, #362d6c 0%,#0c5593 100%); /* IE10+ */
|
|
background: linear-gradient(45deg, #362d6c 0%,#0c5593 100%); /* W3C */
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#362d6c', endColorstr='#0c5593',GradientType=1 ); /* IE6-8 fallback on horizontal gradient */
|
|
}
|
|
|
|
.docs-bg-small {
|
|
@include docs-bg-small;
|
|
}
|
|
|
|
@mixin get-started-bg {
|
|
background-image: #362d6c; /* Old browsers */
|
|
background-image: -moz-linear-gradient(45deg, #362d6c 0%, #0c5593 100%); /* FF3.6+ */
|
|
background-image: -webkit-gradient(linear, left bottom, right top, color-stop(0%,#362d6c), color-stop(100%,#0c5593)); /* Chrome,Safari4+ */
|
|
background-image: -webkit-linear-gradient(45deg, #362d6c 0%,#0c5593 100%); /* Chrome10+,Safari5.1+ */
|
|
background-image: -o-linear-gradient(45deg, #362d6c 0%,#0c5593 100%); /* Opera 11.10+ */
|
|
background-image: -ms-linear-gradient(45deg, #362d6c 0%,#0c5593 100%); /* IE10+ */
|
|
background-image: linear-gradient(45deg, #362d6c 0%,#0c5593 100%); /* W3C */
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#362d6c', endColorstr='#0c5593',GradientType=1 ); /* IE6-8 fallback on horizontal gradient */
|
|
background-position: center 0;
|
|
background-repeat: no-repeat;
|
|
}
|
|
|
|
.get-started-bg {
|
|
@include get-started-bg;
|
|
}
|
|
|
|
/*
|
|
.sidebar-nav-selected {
|
|
background: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(71,101,118,1) 100%);
|
|
background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,0)), color-stop(100%,rgba(71,101,118,1)));
|
|
background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(71,101,118,1) 100%);
|
|
background: -o-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(71,101,118,1) 100%);
|
|
background: -ms-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(71,101,118,1) 100%);
|
|
background: linear-gradient(to right, rgba(255,255,255,0) 0%,rgba(71,101,118,1) 100%);
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#476576',GradientType=1 );
|
|
}
|
|
*/
|
|
|
|
|
|
// helpers
|
|
@mixin reset {
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
.reset {
|
|
@include reset;
|
|
}
|
|
|
|
@mixin kill-effects {
|
|
-webkit-box-shadow: 0 0;
|
|
-moz-box-shadow: 0 0;
|
|
box-shadow: 0 0;
|
|
-webkit-border-radius: 0px;
|
|
-moz-border-radius: 0px;
|
|
border-radius: 0px;
|
|
font-family: inherit;
|
|
color: inherit;
|
|
background-color: transparent;
|
|
background-image: none;
|
|
border: 0;
|
|
text-shadow: none;
|
|
}
|
|
|
|
.kill-effects {
|
|
@include kill-effects;
|
|
}
|
|
|
|
.debug {
|
|
border: 1px solid #ff0000;
|
|
}
|
|
|
|
|
|
@mixin hover {
|
|
&:hover {
|
|
cursor: pointer;
|
|
@include animate-text-color;
|
|
}
|
|
}
|
|
|
|
.hover {
|
|
@include hover;
|
|
}
|