silverstripe-framework/admin/scss/_menu.scss

92 lines
1.8 KiB
SCSS
Raw Normal View History

2011-04-15 01:27:23 +02:00
.cms-menu {
z-index: 10;
background-color: $color-widget-bg;
@include box-shadow($color-shadow-light, 3px, 0, 3px);
2011-04-15 01:27:23 +02:00
a {
text-decoration: none;
}
}
.cms-menu-list {
li {
background-color: $color-base;
@include linear-gradient(color-stops(
$color-base,
darken($color-base, 20%)
));
border-bottom: 1px solid $color-shadow-light;
2011-04-15 01:27:23 +02:00
a {
display: block;
height: 32px;
vertical-align: middle;
font-size: 14px;
@include text-shadow($color-shadow-light);
color: $color-text-dark;
padding: 5px;
2011-04-15 01:27:23 +02:00
.icon {
display: block;
float: left;
margin-right: 5px;
@include sprite-background("icons-32.png");
@include sprite-position(1, 1);
}
.text {
display: block;
padding-top: 10px;
}
}
&.current {
background-color: $color-menu-button;
@include linear-gradient(color-stops(
$color-menu-button,
darken($color-menu-button, 20%)
));
li {
background-color: darken($color-menu-button, 5%);
@include linear-gradient(color-stops(
darken($color-menu-button, 5%),
darken($color-menu-button, 10%)
));
}
2011-04-15 01:27:23 +02:00
a {
color: $color-text-light;
@include text-shadow($color-shadow-dark);
2011-04-15 01:27:23 +02:00
}
}
// nested elements
li {
&:first {
@include box-shadow($color-shadow-dark, 0, 4px, 4px);
}
2011-04-15 01:27:23 +02:00
a {
font-size: 12px;
@include text-shadow($color-shadow-dark);
2011-04-15 01:27:23 +02:00
margin: 0;
padding-left: 30px;
color: $color-text-light;
2011-04-15 01:27:23 +02:00
}
&.current a {
font-weight: bold;
}
}
}
li#Menu-CMSMain a .icon {@include sprite-position(1, 1);}
li#Menu-CMSMain.current a .icon, li#Menu-CMSMain a:hover .icon {@include sprite-position(2, 1);}
li#Menu-AssetAdmin a .icon {@include sprite-position(1, 2);}
li#Menu-AssetAdmin.current a .icon, li#Menu-AssetAdmin a:hover .icon {@include sprite-position(2, 2);}
}