109 lines
2.7 KiB
SCSS
109 lines
2.7 KiB
SCSS
/* ___ rounded ___ */
|
|
|
|
@mixin clearfix {
|
|
&:after {
|
|
content: ".";
|
|
display: block;
|
|
height: 0;
|
|
clear: both;
|
|
visibility: hidden;
|
|
};
|
|
}
|
|
|
|
@mixin rounded($side, $radius: 10px, $important: false) {
|
|
@if $important == true {
|
|
$important: !important; }
|
|
@else {
|
|
$important: ""; }
|
|
|
|
border-#{$side}-radius: $radius unquote($important);
|
|
-moz-border-radius-#{$side}: $radius unquote($important);
|
|
-webkit-border-#{$side}-radius: $radius unquote($important);
|
|
}
|
|
|
|
@mixin border-rounded($vert, $horz, $radius, $important: false) {
|
|
@if $important == true {
|
|
$important: !important; }
|
|
@else {
|
|
$important: ""; }
|
|
|
|
border-#{$vert}-#{$horz}-radius: $radius unquote($important);
|
|
-moz-border-radius-#{$vert}#{$horz}: $radius unquote($important);
|
|
-webkit-border-#{$vert}-#{$horz}-radius: $radius unquote($important);
|
|
}
|
|
|
|
@mixin full-rounded($radius: 10px) {
|
|
border-radius: $radius;
|
|
-moz-border-radius: $radius;
|
|
-webkit-border-radius: $radius;
|
|
}
|
|
|
|
/* ___ box shadow ___ */
|
|
|
|
@mixin box-shadow($hoffset, $voffset, $depth, $color) {
|
|
box-shadow: $hoffset $voffset $depth $color;
|
|
-moz-box-shadow: $hoffset $voffset $depth $color;
|
|
-webkit-box-shadow: $hoffset $voffset $depth $color;
|
|
}
|
|
|
|
@mixin box-shadow-with-inset($color_top, $color_bottom: $color_top, $important: false) {
|
|
$color_bottom: $color_top !default;
|
|
|
|
@if $important == true {
|
|
$important: " !important"; }
|
|
@else {
|
|
$important: ""; }
|
|
|
|
box-shadow: inset 0 1px 0 0 $color_top, 0 1px 0 0 $color_bottom unquote($important);
|
|
-moz-box-shadow: inset 0 1px 0 0 $color_top, 0 1px 0 0 $color_bottom unquote($important);
|
|
-webkit-box-shadow: inset 0 1px 0 0 $color_top, 0 1px 0 0 $color_bottom unquote($important);
|
|
}
|
|
|
|
@mixin no-box-shadow($important: false) {
|
|
@if $important == true {
|
|
$important: " !important"; }
|
|
@else {
|
|
$important: ""; }
|
|
|
|
box-shadow: none $important;
|
|
-moz-box-shadow: none $important;
|
|
-webkit-box-shadow: none $important;
|
|
}
|
|
|
|
/* ___ others ___ */
|
|
|
|
@mixin reset {
|
|
padding: 0px;
|
|
margin: 0px;
|
|
list-style: none;
|
|
|
|
a {
|
|
text-decoration: none;
|
|
}
|
|
}
|
|
|
|
@mixin absolute-position($vside, $vvalue, $hside, $hvalue, $display: block) {
|
|
display: $display;
|
|
position: absolute;
|
|
#{$vside}: $vvalue;
|
|
#{$hside}: $hvalue;
|
|
}
|
|
|
|
@mixin linear-background-gradient($from, $to) {
|
|
background: mix($from, $to);
|
|
background: -moz-linear-gradient(0% 100% 90deg, $to, $from);
|
|
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from($from), to($to));
|
|
}
|
|
|
|
@mixin icon($where, $width, $height, $enabled: false, $top: 0, $left: 0) {
|
|
position: relative;
|
|
width: $width;
|
|
height: $height;
|
|
line-height: $height + 1;
|
|
@if $enabled == true {
|
|
background-position: -#{$width} $where; }
|
|
@else {
|
|
background-position: 0 $where; }
|
|
top: $top;
|
|
left: $left;
|
|
} |