e89b2e0a02
Pages now use service descriptions to describe services, falling back on the service type's displayable value if no description is given.
150 lines
2.8 KiB
SCSS
150 lines
2.8 KiB
SCSS
/**
|
|
* # New Life Songs DB
|
|
* @author Jonathan Bernard <jdb@jdb-labs.com>
|
|
*/
|
|
|
|
|
|
$dark: #333;
|
|
|
|
$monoFont: 'Anonymous Pro';
|
|
$headFont: 'Roboto Condensed';
|
|
$bodyFont: 'Cantarell';
|
|
|
|
@import "forSize.mixin.scss";
|
|
@import "reset.scss";
|
|
|
|
body {
|
|
color: $dark;
|
|
font-family: $bodyFont; }
|
|
|
|
header {
|
|
|
|
& > h1 > a {
|
|
color: $dark;
|
|
text-decoration: none; }
|
|
|
|
&> h1, & > h2 { font-family: $headFont; }
|
|
|
|
nav > ul > li > a {
|
|
color: $dark;
|
|
display: block;
|
|
padding: 0.1rem 0.4rem;
|
|
text-decoration: none;
|
|
|
|
&:hover, &.current {
|
|
background-color: $dark;
|
|
border-radius: 3px;
|
|
color: white; } }
|
|
}
|
|
|
|
p { margin-top: 1rem; }
|
|
|
|
section {
|
|
margin-bottom: 2rem;
|
|
|
|
& > ul {
|
|
padding: 1rem 2rem;
|
|
|
|
a { color: $dark; }
|
|
a:visited { color: $dark; } } }
|
|
|
|
section#welcome { padding: 1rem; }
|
|
|
|
table {
|
|
|
|
th { font-family: $headFont; }
|
|
td a {
|
|
color: $dark;
|
|
display: block;
|
|
text-decoration: none; } }
|
|
|
|
.api-doc {
|
|
pre, code {
|
|
background-color: #EEE;
|
|
font-family: $monoFont; }
|
|
|
|
pre { margin-left: 1rem; }
|
|
|
|
h2 {
|
|
border-bottom: solid 2px $dark;
|
|
margin-top: 2em; }
|
|
|
|
h3 { margin: 2rem 0 1rem 0; }
|
|
|
|
dl {
|
|
margin: 1rem;
|
|
|
|
& > dt {
|
|
background-color: #EEE;
|
|
font-family: $monoFont;
|
|
font-weight: bold; }
|
|
|
|
& > dd { padding: 0 0 0.5rem 1rem; } }
|
|
|
|
table.method-summary {
|
|
padding: 0 2rem;
|
|
width: 100%;
|
|
|
|
th {
|
|
border-bottom: solid thin $dark;
|
|
text-align: left; }
|
|
|
|
th.action, td.action { width: 6em; }
|
|
th.path, td.path { width: 17em; }
|
|
th.public, td.public { width: 4em; }
|
|
} }
|
|
|
|
@include forSize(notSmall) {
|
|
|
|
body { margin: 2rem auto; }
|
|
|
|
header {
|
|
position: relative;
|
|
|
|
& > h1, & > h2 { margin-bottom: 1.5em; }
|
|
|
|
nav {
|
|
position: absolute;
|
|
top: 0;
|
|
right: 0;
|
|
|
|
ul {
|
|
list-style: none;
|
|
|
|
li {
|
|
display: block;
|
|
float: right;
|
|
padding: 0.4rem 0.6rem;
|
|
|
|
} } } }
|
|
|
|
}
|
|
|
|
@include forSize(small) {
|
|
header {
|
|
margin-bottom: 1rem;
|
|
text-align: center;
|
|
|
|
& > h2 { display: none; }
|
|
& > h2.song-name, & > h2.service-desc { display: block; }
|
|
|
|
& > nav > ul > li {
|
|
display: inline-block;
|
|
font-size: 125%;
|
|
width: 32%;
|
|
} }
|
|
|
|
section { font-size: 125%; }
|
|
|
|
.dataTables_length { display: none; }
|
|
|
|
table#songs-table {
|
|
td.artists, th.artists { display: none; } }
|
|
|
|
.not-small { display: none; }
|
|
}
|
|
|
|
@include forSize(medium) { body { width: 40rem; } }
|
|
|
|
@include forSize(large) { body { width: 60rem; } }
|