Files
webawesome/source/css/_docs.css
2017-09-26 10:45:55 -04:00

165 lines
2.3 KiB
CSS

body {
border-top: solid .3rem #0074d9;
}
#head {
padding: 0 2rem;
margin: 2rem 0;
}
#head img {
width: 24rem;
margin: 0 auto;
display: inline-block;
}
#nav {
text-align: right;
list-style: none;
border-right: solid 1px #ddd;
padding-right: 1rem;
}
#nav li {
margin: .5rem 0;
display: block;
}
#nav a.current {
color: #aaa;
cursor: default;
}
@media screen and (max-width: 767px) {
#nav {
border: none;
text-align: center;
padding: 0;
margin: 0 0 2rem 0;
}
#nav li {
margin: .5rem;
display: inline-block;
}
}
#foot {
text-align: center;
margin: 2rem 0;
}
#foot img {
width: 14rem;
display: inline-block;
margin: .5rem 0;
}
h1[id]:not(:first-child),
h2[id]:not(:first-child),
h3[id]:not(:first-child),
h4[id]:not(:first-child) {
margin-top: 3rem;
}
h3[id],
h4[id] {
color: #aaa;
}
pre {
margin-bottom: 1.5rem !important; /* Prism overrides our bottom margin */
}
pre code {
white-space: pre;
padding: 0;
display: block;
}
a code {
color: inherit;
}
.browsers {
text-align: center;
}
.browsers img {
max-width: 6rem;
display: inline-block;
margin: 0 1rem 1rem 0;
}
/* Sizing examples */
.width-sizing-example {
border: solid 1px #ddd;
padding: 1rem;
margin-bottom: 1.5rem;
}
.width-sizing-example div {
background: #0074d9;
color: white;
text-align: center;
padding: .25rem;
margin-bottom: 1.5rem;
}
.width-sizing-example div:last-child {
margin-bottom: 0;
}
.height-sizing-example {
border: solid 1px #ddd;
height: 15rem;
padding: 1rem .5rem;
margin-bottom: 1.5rem;
}
.height-sizing-example div {
width: calc(25% - 1rem);
float: left;
background: #0074d9;
color: white;
text-align: center;
padding: .25rem;
margin: 0 .5rem;
}
/* Loader example */
.loader-example {
margin-left: -.5rem;
margin-right: -.5rem;
}
.loader-example div {
float: left;
width: 6rem;
height: 6rem;
border: dashed 1px #ddd;
margin: 0 .5rem 1rem .5rem;
}
/* Grid example */
.grid-example {
margin-bottom: 1.5rem;
}
.grid-example .row .col,
.grid-example .row [class*="col-"] {
background: #0074d9;
border: solid 1px white;
color: white;
text-align: center;
padding-top: .5rem;
padding-bottom: .5rem;
}
.grid-example .row .row .col,
.grid-example .row .row [class*="col-"] {
background: tomato;
margin-top: .5rem;
margin-bottom: .5rem;
}