Pony.fm/public/styles/layout.less
2013-08-13 00:11:14 -05:00

144 lines
No EOL
2.1 KiB
Text

@import-once 'base/bootstrap/bootstrap';
@import-once 'mixins';
@import-once 'variables';
html, body {
}
html body {
height: 100%;
background: @pfm-dark-grey;
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}
header, .site-body {
.box-shadow(0 0 7px rgba(0, 0, 0, .3));
max-width: 1200px;
margin: auto;
}
header {
> a {
display: block;
float: left;
width: (@pfm-sidebar-size - 25);
height: 64px;
line-height: 52px;
background: @pfm-purple;
color: #fff;
font-size: 24pt;
padding-left: 25px;
font-weight: lighter;
position: relative;
z-index: 600;
font-family: 'Josefin Sans', sans-serif;
&:hover {
background: darken(@pfm-purple, 25%);
color: #fff;
text-decoration: none;
}
}
}
.now-playing {
margin-left: @pfm-sidebar-size;
height: 64px;
background: #eee;
position: relative;
z-index: 500;
}
.sidebar {
width: @pfm-sidebar-size;
height: 100%;
background: @pfm-light-grey;
float: left;
list-style: none;
padding: 0px;
margin: 0px;
font-size: 10pt;
li {
margin: 0px;
padding: 0px;
line-height: normal;
&.selected {
background: #fff;
> a {
color: #000;
}
}
h3 {
padding: 10px 25px;
padding-right: 10px;
margin: 0px;
font-size: 10pt;
color: #eee;
background: darken(@pfm-light-grey, 10%);
line-height: normal;
a {
display: block;
float: right;
width: 20px;
text-align: center;
color: #fff;
&:hover {
text-decoration: none;
color: #000;
}
}
}
.dropdown-menu a {
color: #000;
}
&:hover > a.dropdown-toggle {
display: block;
}
> a.dropdown-toggle {
float: right;
padding: 10px 0px;
display: none;
}
> a {
display: block;
padding: 10px 25px;
padding-right: 0px;
overflow: hidden;
color: #fff;
> i {
display: block;
float: right;
width: 20px;
text-align: center;
margin-right: 10px;
}
&:hover {
text-decoration: none;
}
}
}
}
.site-content {
overflow: hidden;
margin-left: @pfm-sidebar-size;
background: #fff;
height: 100%;
z-index: 100;
}
.file-over-notice {
display: none;
}