miniflux-legacy/themes/hello/scss/_core.scss
2015-01-19 19:20:29 -05:00

321 lines
5.0 KiB
SCSS
Executable File

body {
background-color: $theme-background-main;
font: {
family: $ui-font-content;
weight: normal;
}
line-height: 25px;
> header,
> section {
bottom: 0;
top: 0;
}
> section {
overflow: auto;
position: absolute;
}
}
// Sidebar
header {
background-color: $theme-background-highlight;
left: 0;
position: fixed;
overflow: hidden;
width: px2cent(200px);
nav {
margin: 20px auto;
position: relative;
width: 90%;
> ul {
margin-top: 30px;
}
li {
line-height: 30px;
overflow: hidden;
text-overflow: ellipsis;
color: lighten($theme-background-highlight, 75%);
&.active {
a {
color: $link-color-hover;
}
}
> a {
color: lighten($theme-background-highlight, 75%);
margin-left: 5px;
text-decoration: none;
font: {
family: $ui-font-highlight;
weight: bold;
}
white-space: nowrap;
&:hover {
color: $link-color-hover;
}
&:before {
@extend %awesome;
@include inline-block(middle);
color: white;
font-weight: normal;
margin-right: 10px;
text-align: center;
width: 24px;
}
&[href="?action=unread"] {
&:before {
content: "\f1ea" ;
}
}
&[href="?action=bookmarks"] {
&:before {
content: "\f02e" ;
}
}
&[href="?action=history"] {
&:before {
content: "\f1da" ;
}
}
&[href="?action=feeds"] {
&:before {
content: "\f09e" ;
}
}
&[href="?action=config"] {
&:before {
content: "\f1de" ;
}
}
&[href="?action=logout"] {
&:before {
content: "\f08b" ;
}
}
&[href="?action=more"] {
&:before {
content: "\f009";
}
}
}
}
}
.logo {
color: white;
display: block;
font-size: 1.6em;
margin: 0 auto;
text-align: center;
text-decoration: none;
width: 70%;
span {
color: lighten($logo-basecolor, 40%);
}
}
}
// Main container
section {
&.page {
right: 0;
width: px2cent( (1366px - 250px));
padding: 10px 20px;
.page-header{
position: relative;
}
a {
color: $theme-background-highlight;
}
}
}
.page {
// Toolbar
&-header {
margin: 0 0 15px;
@include pie-clearfix;
h2 {
float: left;
line-height: 30px;
@extend %title;
}
ul {
float: right;
li {
@include inline-block;
text-align: center;
a ,
a:after {
overflow: hidden;
display: block;
height: 25px;
text-decoration: none;
width: 25px;
}
a {
background-color: $button-background-grey;
color: darken($theme-background-highlight, 5%);
position: relative;
text-indent: -999px;
@include border-radius(5px);
@include box-shadow(0 3px 0 $theme-background-highlight);
@extend %awesome;
&:after {
position: absolute;
top: 0;
left: 0;
line-height: 25px;
z-index: 999;
text-indent: 0;
}
&[href*="action=unread"],
&[href*="action=feed-items"] {
&[href*="direction=asc"] {
&:after {
content: "\f162";
}
}
}
&[href*="action=unread"],
&[href*="action=feed-items"] {
&[href*="direction=desc"] {
&:after {
content: "\f163";
}
}
}
&[href*="mark-as-read"],
&[href*="mark-feed-as-read"] {
&:after {
content: "\f058";
}
}
&[href="?action=add"] {
&:after {
content: "\f067";
}
}
&[href="?action=import"] {
&:after {
content: "\f093";
}
}
&[href="?action=export"] {
&:after {
content: "\f019";
}
}
&[href="?action=refresh-all"] {
&:after {
content: "\f021";
}
}
&[href="?action=confirm-flush-history"] {
&:after {
content: "\f014";
}
}
&[href="?action=feeds"] {
&:after {
content: "\f09e";
}
}
&[href="?action=config"] {
&:after {
content: "\f013";
}
}
&[href="?action=help"] {
&:after {
content: "\f128";
}
}
&[href="?action=services"] {
&:after {
content: "\f1e0";
}
}
&[href="?action=about"] {
&:after {
content: "\f129";
}
}
&[href="?action=database"] {
&:after {
content: "\f1c0";
}
}
&[href="?action=api"] {
&:after {
content: "\f084";
}
}
&[href*="action=refresh-feed"] {
&:after {
content: "\f021";
}
}
&[href*="action=console"] {
&:after {
content: "\f120";
}
}
&[href*="action=flush-console"] {
&:after {
content: "\f12d";
}
}
}
}
}
}
&-section {
h2 {
@extend %title;
margin: {
bottom: 15px;
top: 15px;
}
}
}
}
// Counters
#page {
&-counter {
margin: 0 3px;
&:not(:empty):before {
content: " (";
}
&:not(:empty):after {
content: ") ";
}
}
}
#nav-counter {
@extend #page-counter;
}
.items-count {
@extend #page-counter;
}