Vulcan/client/sass/partials/_mixins.scss
2012-08-31 18:58:12 +09:00

77 lines
No EOL
1.5 KiB
SCSS

@function black($opacity){
@return rgba(0,0,0,$opacity)
}
@function white($opacity){
@return rgba(255,255,255,$opacity)
}
@function red($opacity){
@return rgba($red,$opacity)
}
.grid-block{
background:#fff;
@include border-radius(3px);
// border:1px solid $light-blue;
padding:$grid-padding;
margin-bottom:$grid-margin;
@include box-shadow(0 1px 1px black(0.15));
}
@mixin border-box{
-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box; /* Firefox, other Gecko */
box-sizing: border-box; /* Opera/IE 8+ */
}
@mixin nav-ul {
list-style-type:none;
padding:0;
margin:0;
@include cf;
& li{
display:block;
float:left;
&:last-child{
margin-right:0px;
}
}
}
@mixin hide-text{
text-indent: 100%;
white-space: nowrap;
overflow: hidden;
}
@mixin hide-text2{
font: 0/0 a;
text-shadow: none;
color: transparent;
}
@mixin letterpress($opacity){
text-shadow:white($opacity) 0 1px 0;
}
@mixin box-emboss($opacity, $opacity2){
box-shadow:white($opacity) 0 1px 0, inset black($opacity2) 0 1px 0;
}
@mixin cf{
/* For modern browsers */
&:before,&:after {
content:"";
display:table;
}
&:after {
clear:both;
}
/* For IE 6/7 (trigger hasLayout) */
*zoom:1;
}
@mixin breakpoint($point) {
@if $point == wide {
@media (max-width: 9999px) { @content; }
}
@if $point == large {
@media (max-width: 1200px) { @content; }
}
@if $point == tablet {
@media (max-width: 800px) { @content; }
}
@else if $point == phone {
@media (max-width: 320px) { @content; }
}
}