site: local styles, eg for table of contents
This commit is contained in:
Simon Michael
parent
099a271672
commit
05474d9a9f
@ -1,94 +1,149 @@
|
||||
div.container { max-width: 75em; }
|
||||
|
||||
/* ul > li > ul > li { */
|
||||
/* list-style-type:none; */
|
||||
/* } */
|
||||
|
||||
div#nav { padding-top: 2em; }
|
||||
/* div#nav ul { margin-top: 0; margin-left: 1em; margin-bottom: 0; } */
|
||||
/* div#nav ul li { list-style: none; padding-bottom: 0.1em; } */
|
||||
div#nav ul li.current {
|
||||
/* list-style: square; */
|
||||
font-weight:bold;
|
||||
}
|
||||
|
||||
div#nav ul li.current {
|
||||
/* list-style: square; */
|
||||
font-weight:bold;
|
||||
}
|
||||
|
||||
ul.nav ul {
|
||||
padding-left:30px;
|
||||
}
|
||||
/* ul.nav ul li { */
|
||||
/* list-style:none; */
|
||||
/* } */
|
||||
|
||||
ul.nav li a {
|
||||
padding:4px 10px;
|
||||
}
|
||||
|
||||
code {
|
||||
color: #226600;
|
||||
font-weight:bold;
|
||||
}
|
||||
|
||||
pre {
|
||||
background: #F8F8F8; /* The same as the GitHub background color since I'm using their syntax.css */
|
||||
padding: 0 2em 0 2em;
|
||||
}
|
||||
|
||||
.description {
|
||||
font-size: 1.2em;
|
||||
margin-bottom: 30px;
|
||||
margin-top: 30px;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.download {
|
||||
float: right;
|
||||
}
|
||||
.downloadoption {
|
||||
background: #eee;
|
||||
padding: 10px 0 10px 0; /* Keep image and text away from top and bottom */
|
||||
margin-bottom: 10px; /* Ensure there is some whitespace between options */
|
||||
}
|
||||
.downloadoptionimage {
|
||||
float: left;
|
||||
width: 90px;
|
||||
margin-left: 10px; /* Offset from left border a little */
|
||||
}
|
||||
.downloadoptiontext {
|
||||
padding-left: 110px; /* Offset from image */
|
||||
padding-right: 10px; /* Offset from right border of the download option */
|
||||
}
|
||||
|
||||
.screenshotframe {
|
||||
text-align: center; /* The screenshot and it's border should be in the center of the page */
|
||||
}
|
||||
.screenshot {
|
||||
border: 10px solid #F8F8F8; /* Soft grey border */
|
||||
}
|
||||
|
||||
/* from https://github.com/blaenk/blaenk.github.io/blob/source/provider/scss/_article.scss */
|
||||
#toc {
|
||||
float:right;
|
||||
font-size:small;
|
||||
margin:2em 0 1em 1em;
|
||||
border:thin solid #ddd;
|
||||
background-color:#f0f0f0;
|
||||
max-width:40%;
|
||||
margin-top: 1em;
|
||||
}
|
||||
#toc ul {
|
||||
list-style-type: none;
|
||||
padding:0 1em 0 1em;
|
||||
#toc p {
|
||||
font-weight: bold;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
#footer {
|
||||
padding-top: 1em;
|
||||
/* font-size: 70%; */
|
||||
#toc > ol {
|
||||
margin-left: 0;
|
||||
margin-top: 5px;
|
||||
/* font-size: 14px; */
|
||||
}
|
||||
#toc ol {
|
||||
padding-left:0;
|
||||
/* margin-left:1em; */
|
||||
}
|
||||
#toc > ol > li > a {
|
||||
display:none;
|
||||
}
|
||||
#toc > ol (@media screen and (max-width: 600px)) {
|
||||
font-size: 13px;
|
||||
}
|
||||
#toc > ol ol {
|
||||
counter-reset: item;
|
||||
}
|
||||
#toc > ol > li > ol ol {
|
||||
font-size:95%;
|
||||
}
|
||||
#toc li {
|
||||
margin-top: 0;
|
||||
display: block;
|
||||
}
|
||||
#toc li (@media screen and (max-width: 600px)) {
|
||||
line-height: 1.69;
|
||||
}
|
||||
#toc > ol > li > ol > li:before {
|
||||
content: counters(item, ".") ". ";
|
||||
counter-increment: item;
|
||||
}
|
||||
#toc > ol > li > ol > li > ol > li {
|
||||
padding-left:2em;
|
||||
}
|
||||
#toc > ol > li > ol > li > ol > li > ol li {
|
||||
padding-left:1em;
|
||||
}
|
||||
#toc.right-toc {
|
||||
float: right;
|
||||
/* margin-left: 15px; */
|
||||
margin:0 0 2em 2em;
|
||||
padding: 0;
|
||||
}
|
||||
#toc.right-toc (@media screen and (max-width: 600px)) {
|
||||
float: none;
|
||||
padding: 0;
|
||||
margin-left: 0;
|
||||
margin-top: 10px;
|
||||
}
|
||||
#toc:after {
|
||||
clear: both;
|
||||
}
|
||||
/* */
|
||||
h2 {
|
||||
margin-top:1.5em;
|
||||
}
|
||||
footer {
|
||||
padding: 1em;
|
||||
color: gray;
|
||||
text-align: center;
|
||||
/* font-size: 70%; */
|
||||
}
|
||||
|
||||
|
||||
/* div.container { max-width: 75em; } */
|
||||
|
||||
/* /\* ul > li > ul > li { *\/ */
|
||||
/* /\* list-style-type:none; *\/ */
|
||||
/* /\* } *\/ */
|
||||
|
||||
/* div#nav { padding-top: 2em; } */
|
||||
/* /\* div#nav ul { margin-top: 0; margin-left: 1em; margin-bottom: 0; } *\/ */
|
||||
/* /\* div#nav ul li { list-style: none; padding-bottom: 0.1em; } *\/ */
|
||||
/* div#nav ul li.current { */
|
||||
/* /\* list-style: square; *\/ */
|
||||
/* font-weight:bold; */
|
||||
/* } */
|
||||
|
||||
/* div#nav ul li.current { */
|
||||
/* /\* list-style: square; *\/ */
|
||||
/* font-weight:bold; */
|
||||
/* } */
|
||||
|
||||
/* ul.nav ul { */
|
||||
/* padding-left:30px; */
|
||||
/* } */
|
||||
/* /\* ul.nav ul li { *\/ */
|
||||
/* /\* list-style:none; *\/ */
|
||||
/* /\* } *\/ */
|
||||
|
||||
/* ul.nav li a { */
|
||||
/* padding:4px 10px; */
|
||||
/* } */
|
||||
|
||||
/* code { */
|
||||
/* color: #226600; */
|
||||
/* font-weight:bold; */
|
||||
/* } */
|
||||
|
||||
/* pre { */
|
||||
/* background: #F8F8F8; /\* The same as the GitHub background color since I'm using their syntax.css *\/ */
|
||||
/* padding: 0 2em 0 2em; */
|
||||
/* } */
|
||||
|
||||
/* .description { */
|
||||
/* font-size: 1.2em; */
|
||||
/* margin-bottom: 30px; */
|
||||
/* margin-top: 30px; */
|
||||
/* font-style: italic; */
|
||||
/* } */
|
||||
|
||||
/* .download { */
|
||||
/* float: right; */
|
||||
/* } */
|
||||
/* .downloadoption { */
|
||||
/* background: #eee; */
|
||||
/* padding: 10px 0 10px 0; /\* Keep image and text away from top and bottom *\/ */
|
||||
/* margin-bottom: 10px; /\* Ensure there is some whitespace between options *\/ */
|
||||
/* } */
|
||||
/* .downloadoptionimage { */
|
||||
/* float: left; */
|
||||
/* width: 90px; */
|
||||
/* margin-left: 10px; /\* Offset from left border a little *\/ */
|
||||
/* } */
|
||||
/* .downloadoptiontext { */
|
||||
/* padding-left: 110px; /\* Offset from image *\/ */
|
||||
/* padding-right: 10px; /\* Offset from right border of the download option *\/ */
|
||||
/* } */
|
||||
|
||||
/* .screenshotframe { */
|
||||
/* text-align: center; /\* The screenshot and it's border should be in the center of the page *\/ */
|
||||
/* } */
|
||||
/* .screenshot { */
|
||||
/* border: 10px solid #F8F8F8; /\* Soft grey border *\/ */
|
||||
/* } */
|
||||
|
||||
/* .alert { */
|
||||
/* width:50%; */
|
||||
/* margin:1em; */
|
||||
|
||||
Loading…
Reference in New Issue
Block a user