Merge branch 'css-to-stylus'
This commit is contained in:
commit
7446743cd6
|
@ -9,5 +9,12 @@ matrix:
|
||||||
env:
|
env:
|
||||||
global:
|
global:
|
||||||
secure: l3/qEC4krRerllLQzni8j5AjngFi6pluWvBWj//1mJLoIEYwxlQ9mYxEdd9BqccWWFn3K0bVYCVC/64+tP6sRfLkZCe2gPUtwe7ITwCDbapUxmkiRObVJCs5yMQZt6idyhHUDKAXKgNCrusfI2BM3tKGBfRK7Cnn/R/7p/U9+q7D1sgJtUKp6ypVzK6A3jLNp3dFLFI19a5KmbZMVsaa7tOhtdDJjjr7ebsc9z7HMW5/OItiWU3FSauVQQlUMaCiEgFuIG7H7OnBAYWB/gNEtLuwfLqU9UjtWk/njNNRnmJ7m3y5HbQhv5H5F5mJUOq9XFlPLwPwyTeVztSGdQm6k8Pp2pgKBUjY27afBl9BWU+msmN6k0oXfhvIebiBPe/x2udiKeFik1xqOOEU1q9dF0sZiuPxCSM1n7tgWklJ8epgaRQaMPPQw9pO/2H5/ynHCJqBlw6WcdiqWtwAyyr/GEx62u/cg5IVkqb7KLmYsWzjS8wYG4CYs1eIxCw2xPZxP0FGuUXvxTBUPipFze6Z7FqxVauXtVe2D7c1P4738HZP660rmR0GYtHtKLny1QxCCK9sxd9JmcezFCSz4YeQ1od9xc0OzGJ2ullKNGizmGfYmgL6X8faNylLIEdaiHAcY16xV3L0g3fXL1Qg360UHQyj7GIv+0nqQnf+H9xRTTU=
|
secure: l3/qEC4krRerllLQzni8j5AjngFi6pluWvBWj//1mJLoIEYwxlQ9mYxEdd9BqccWWFn3K0bVYCVC/64+tP6sRfLkZCe2gPUtwe7ITwCDbapUxmkiRObVJCs5yMQZt6idyhHUDKAXKgNCrusfI2BM3tKGBfRK7Cnn/R/7p/U9+q7D1sgJtUKp6ypVzK6A3jLNp3dFLFI19a5KmbZMVsaa7tOhtdDJjjr7ebsc9z7HMW5/OItiWU3FSauVQQlUMaCiEgFuIG7H7OnBAYWB/gNEtLuwfLqU9UjtWk/njNNRnmJ7m3y5HbQhv5H5F5mJUOq9XFlPLwPwyTeVztSGdQm6k8Pp2pgKBUjY27afBl9BWU+msmN6k0oXfhvIebiBPe/x2udiKeFik1xqOOEU1q9dF0sZiuPxCSM1n7tgWklJ8epgaRQaMPPQw9pO/2H5/ynHCJqBlw6WcdiqWtwAyyr/GEx62u/cg5IVkqb7KLmYsWzjS8wYG4CYs1eIxCw2xPZxP0FGuUXvxTBUPipFze6Z7FqxVauXtVe2D7c1P4738HZP660rmR0GYtHtKLny1QxCCK9sxd9JmcezFCSz4YeQ1od9xc0OzGJ2ullKNGizmGfYmgL6X8faNylLIEdaiHAcY16xV3L0g3fXL1Qg360UHQyj7GIv+0nqQnf+H9xRTTU=
|
||||||
|
addons:
|
||||||
|
apt:
|
||||||
|
packages:
|
||||||
|
- nodejs
|
||||||
|
- npm
|
||||||
|
install:
|
||||||
|
- npm install stylus nib
|
||||||
after_success:
|
after_success:
|
||||||
- test $TRAVIS_PULL_REQUEST == "false" && test $TRAVIS_BRANCH == "master" && bash deploy.sh
|
- test $TRAVIS_PULL_REQUEST == "false" && test $TRAVIS_BRANCH == "master" && bash deploy.sh
|
||||||
|
|
|
@ -8,6 +8,7 @@ repository = "https://github.com/azerupi/mdBook"
|
||||||
keywords = ["book", "gitbook", "rustbook", "markdown"]
|
keywords = ["book", "gitbook", "rustbook", "markdown"]
|
||||||
license = "MPL-2.0"
|
license = "MPL-2.0"
|
||||||
readme = "README.md"
|
readme = "README.md"
|
||||||
|
build = "build.rs"
|
||||||
exclude = [
|
exclude = [
|
||||||
"book-example/*",
|
"book-example/*",
|
||||||
]
|
]
|
||||||
|
@ -25,6 +26,7 @@ tempdir = "*"
|
||||||
default = ["output"]
|
default = ["output"]
|
||||||
debug = []
|
debug = []
|
||||||
output = []
|
output = []
|
||||||
|
regenerate-css = []
|
||||||
|
|
||||||
[[bin]]
|
[[bin]]
|
||||||
doc = false
|
doc = false
|
||||||
|
|
|
@ -12,6 +12,14 @@ To have an idea of what a rendered book looks like,take a look at the [**Documen
|
||||||
|
|
||||||
## Installation
|
## Installation
|
||||||
|
|
||||||
|
Before building mdBook, make sure that you installed `stylus` and `nib` from `npm` because it is used to compile the stylesheets
|
||||||
|
|
||||||
|
Install [node.js](https://nodejs.org/en/)
|
||||||
|
|
||||||
|
```
|
||||||
|
npm install -g stylus nib
|
||||||
|
```
|
||||||
|
|
||||||
```
|
```
|
||||||
git clone --depth=1 https://github.com/azerupi/mdBook.git
|
git clone --depth=1 https://github.com/azerupi/mdBook.git
|
||||||
cd mdBook
|
cd mdBook
|
||||||
|
|
|
@ -0,0 +1,29 @@
|
||||||
|
// build.rs
|
||||||
|
|
||||||
|
use std::process::Command;
|
||||||
|
use std::env;
|
||||||
|
use std::path::Path;
|
||||||
|
|
||||||
|
fn main() {
|
||||||
|
|
||||||
|
if let Ok(_) = env::var("CARGO_FEATURE_REGENERATE_CSS") {
|
||||||
|
|
||||||
|
// Compile stylus stylesheet to css
|
||||||
|
let manifest_dir = env::var("CARGO_MANIFEST_DIR").unwrap();
|
||||||
|
|
||||||
|
let theme_dir = Path::new(&manifest_dir).join("src/theme/");
|
||||||
|
let stylus_dir = theme_dir.join("stylus/book.styl");
|
||||||
|
|
||||||
|
if !Command::new("stylus")
|
||||||
|
.arg(format!("{}", stylus_dir.to_str().unwrap()))
|
||||||
|
.arg("--out")
|
||||||
|
.arg(format!("{}", theme_dir.to_str().unwrap()))
|
||||||
|
.arg("--use")
|
||||||
|
.arg("nib")
|
||||||
|
.status().unwrap()
|
||||||
|
.success() {
|
||||||
|
panic!("Stylus encoutered an error");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
|
@ -1,162 +1,15 @@
|
||||||
html, body {
|
html,
|
||||||
|
body {
|
||||||
font-family: "Open Sans", sans-serif;
|
font-family: "Open Sans", sans-serif;
|
||||||
color: #333;
|
color: #333;
|
||||||
}
|
}
|
||||||
|
.left {
|
||||||
@media only screen {
|
float: left;
|
||||||
/* Light theme */
|
}
|
||||||
.light .sidebar {
|
.right {
|
||||||
border-right: 1px solid rgba(0, 0, 0, 0.07);
|
float: right;
|
||||||
background-color: #fafafa;
|
}
|
||||||
color: #364149;
|
.sidebar {
|
||||||
}
|
|
||||||
.light .page-wrapper {
|
|
||||||
background: none repeat scroll 0 0 #FFF;
|
|
||||||
}
|
|
||||||
.light .chapter li {
|
|
||||||
color: #aaa;
|
|
||||||
}
|
|
||||||
.light .chapter li .active,
|
|
||||||
.light .chapter li a:hover {
|
|
||||||
/* Animate color change */
|
|
||||||
color: #008cff;
|
|
||||||
}
|
|
||||||
.light .menu-bar,
|
|
||||||
.light .nav-chapters {
|
|
||||||
color: #CCC;
|
|
||||||
}
|
|
||||||
.light .chapter li a,
|
|
||||||
.light .menu-bar i:hover,
|
|
||||||
.light .nav-chapters:hover {
|
|
||||||
/* Animate color change */
|
|
||||||
color: #333;
|
|
||||||
}
|
|
||||||
.light .content a {
|
|
||||||
color: #4183c4;
|
|
||||||
}
|
|
||||||
/* Theme changer */
|
|
||||||
.light .theme-popup {
|
|
||||||
background: #fafafa;
|
|
||||||
border: 1px solid #ccc;
|
|
||||||
}
|
|
||||||
.light .theme-popup .theme:hover {
|
|
||||||
background-color: #e6e6e6;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Coal theme */
|
|
||||||
.coal {
|
|
||||||
color: #98a3ad;
|
|
||||||
background-color: #141617;
|
|
||||||
}
|
|
||||||
.coal .sidebar {
|
|
||||||
background-color: #292c2f;
|
|
||||||
color: #a1adb8;
|
|
||||||
}
|
|
||||||
.coal .chapter li {
|
|
||||||
color: #505254;
|
|
||||||
}
|
|
||||||
.coal .chapter li .active,
|
|
||||||
.coal .chapter li a:hover {
|
|
||||||
/* Animate color change */
|
|
||||||
color: #3473ad;
|
|
||||||
}
|
|
||||||
.coal .menu-bar,
|
|
||||||
.coal .nav-chapters {
|
|
||||||
color: #43484d;
|
|
||||||
}
|
|
||||||
.coal .chapter li a,
|
|
||||||
.coal .menu-bar i:hover,
|
|
||||||
.coal .nav-chapters:hover {
|
|
||||||
color: #b3c0cc;
|
|
||||||
}
|
|
||||||
.coal .content a {
|
|
||||||
color: #2b79a2;
|
|
||||||
}
|
|
||||||
/* Theme changer */
|
|
||||||
.coal .theme-popup {
|
|
||||||
background: #141617;
|
|
||||||
border: 1px solid #43484d;
|
|
||||||
}
|
|
||||||
.coal .theme-popup .theme:hover {
|
|
||||||
background-color: #1f2124;
|
|
||||||
}
|
|
||||||
/* Dark blue colored theme */
|
|
||||||
.navy {
|
|
||||||
background-color: #161923;
|
|
||||||
color: #bcbdd0;
|
|
||||||
}
|
|
||||||
.navy .sidebar {
|
|
||||||
background-color: #282d3f;
|
|
||||||
color: #c8c9db;
|
|
||||||
}
|
|
||||||
.navy .chapter li {
|
|
||||||
color: #505274;
|
|
||||||
}
|
|
||||||
.navy .chapter li .active,
|
|
||||||
.navy .chapter li a:hover {
|
|
||||||
/* Animate color change */
|
|
||||||
color: #2b79a2;
|
|
||||||
}
|
|
||||||
.navy .menu-bar,
|
|
||||||
.navy .nav-chapters {
|
|
||||||
color: #737480;
|
|
||||||
}
|
|
||||||
.navy .chapter li a,
|
|
||||||
.navy .menu-bar i:hover,
|
|
||||||
.navy .nav-chapters:hover {
|
|
||||||
color: #b7b9cc;
|
|
||||||
}
|
|
||||||
.navy .content a {
|
|
||||||
color: #2b79a2;
|
|
||||||
}
|
|
||||||
/* Theme changer */
|
|
||||||
.navy .theme-popup {
|
|
||||||
background: #161923;
|
|
||||||
border: 1px solid #737480;
|
|
||||||
}
|
|
||||||
.navy .theme-popup .theme:hover {
|
|
||||||
background-color: #282e40;
|
|
||||||
}
|
|
||||||
/* Rust theme */
|
|
||||||
.rust {
|
|
||||||
background-color: #e1e1db;
|
|
||||||
color: #262625;
|
|
||||||
}
|
|
||||||
.rust .sidebar {
|
|
||||||
background-color: #3b2e2a;
|
|
||||||
color: #c8c9db;
|
|
||||||
}
|
|
||||||
.rust .chapter li {
|
|
||||||
color: #505254;
|
|
||||||
}
|
|
||||||
.rust .chapter li .active,
|
|
||||||
.rust .chapter li a:hover {
|
|
||||||
/* Animate color change */
|
|
||||||
color: #e69f67;
|
|
||||||
}
|
|
||||||
.rust .menu-bar,
|
|
||||||
.rust .nav-chapters {
|
|
||||||
color: #737480;
|
|
||||||
}
|
|
||||||
.rust .chapter li a {
|
|
||||||
color: #bfbfba;
|
|
||||||
}
|
|
||||||
.rust .menu-bar i:hover,
|
|
||||||
.rust .nav-chapters:hover {
|
|
||||||
color: #262625;
|
|
||||||
}
|
|
||||||
.rust .content a {
|
|
||||||
color: #2b79a2;
|
|
||||||
}
|
|
||||||
/* Theme changer */
|
|
||||||
.rust .theme-popup {
|
|
||||||
background: #e1e1db;
|
|
||||||
border: 1px solid #b38f6b;
|
|
||||||
}
|
|
||||||
.rust .theme-popup .theme:hover {
|
|
||||||
background-color: #99908a;
|
|
||||||
}
|
|
||||||
.sidebar {
|
|
||||||
position: absolute;
|
position: absolute;
|
||||||
left: 0;
|
left: 0;
|
||||||
top: 0;
|
top: 0;
|
||||||
|
@ -164,133 +17,123 @@ html, body {
|
||||||
width: 300px;
|
width: 300px;
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
padding: 10px 10px;
|
padding: 10px 10px;
|
||||||
font-size: 14px;
|
font-size: 0.875em;
|
||||||
|
-webkit-box-sizing: border-box;
|
||||||
|
-moz-box-sizing: border-box;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
-webkit-overflow-scrolling: touch;
|
-webkit-overflow-scrolling: touch;
|
||||||
|
-webkit-transition: left 0.5s;
|
||||||
/* Animation: slide away */
|
-moz-transition: left 0.5s;
|
||||||
-webkit-transition: left 0.5s; /* Safari */
|
-o-transition: left 0.5s;
|
||||||
-o-transition: left 0.5s; /* Opera */
|
-ms-transition: left 0.5s;
|
||||||
-moz-transition: left 0.5s; /* Mozilla Firefox */
|
|
||||||
transition: left 0.5s;
|
transition: left 0.5s;
|
||||||
|
}
|
||||||
|
@media only screen and (max-width: 1060px) {
|
||||||
|
.sidebar {
|
||||||
|
left: -300px;
|
||||||
}
|
}
|
||||||
|
}
|
||||||
.page-wrapper {
|
.chapter {
|
||||||
|
list-style: none outside none;
|
||||||
|
padding-left: 0;
|
||||||
|
line-height: 1.9em;
|
||||||
|
}
|
||||||
|
.chapter li a {
|
||||||
|
padding: 5px 0;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
.chapter li a:hover {
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
.chapter .spacer {
|
||||||
|
width: 100%;
|
||||||
|
height: 3px;
|
||||||
|
margin: 10px 0px;
|
||||||
|
}
|
||||||
|
.section {
|
||||||
|
list-style: none outside none;
|
||||||
|
padding-left: 20px;
|
||||||
|
line-height: 2.5em;
|
||||||
|
}
|
||||||
|
.section li {
|
||||||
|
-o-text-overflow: ellipsis;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
overflow: hidden;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
.page-wrapper {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
left: 315px;
|
left: 315px;
|
||||||
right: 0;
|
right: 0;
|
||||||
top: 0;
|
top: 0;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
|
-webkit-box-sizing: border-box;
|
||||||
|
-moz-box-sizing: border-box;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
-webkit-overflow-scrolling: touch;
|
-webkit-overflow-scrolling: touch;
|
||||||
|
|
||||||
min-height: 100%;
|
min-height: 100%;
|
||||||
|
-webkit-transition: left 0.5s;
|
||||||
/* Animation: slide away */
|
-moz-transition: left 0.5s;
|
||||||
-webkit-transition: left 0.5s; /* Safari */
|
-o-transition: left 0.5s;
|
||||||
-o-transition: left 0.5s; /* Opera */
|
-ms-transition: left 0.5s;
|
||||||
-moz-transition: left 0.5s; /* Mozilla Firefox */
|
|
||||||
transition: left 0.5s;
|
transition: left 0.5s;
|
||||||
|
}
|
||||||
|
@media only screen and (max-width: 1060px) {
|
||||||
|
.page-wrapper {
|
||||||
|
left: 15px;
|
||||||
|
padding-right: 15px;
|
||||||
}
|
}
|
||||||
|
}
|
||||||
.page {
|
.page {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 0;
|
top: 0;
|
||||||
right: 0;
|
right: 0;
|
||||||
left: 0;
|
left: 0;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
|
|
||||||
padding-right: 15px;
|
padding-right: 15px;
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
}
|
}
|
||||||
|
.content {
|
||||||
.content {
|
|
||||||
margin-left: auto;
|
margin-left: auto;
|
||||||
margin-right:auto;
|
margin-right: auto;
|
||||||
max-width: 750px;
|
max-width: 750px;
|
||||||
padding-bottom: 50px;
|
padding-bottom: 50px;
|
||||||
}
|
}
|
||||||
|
.content a {
|
||||||
.chapter {
|
|
||||||
list-style: none outside none;
|
|
||||||
padding-left: 0;
|
|
||||||
line-height: 30px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.section {
|
|
||||||
list-style: none outside none;
|
|
||||||
padding-left: 20px;
|
|
||||||
line-height: 40px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.section li {
|
|
||||||
text-overflow: ellipsis;
|
|
||||||
overflow: hidden;
|
|
||||||
white-space: nowrap;
|
|
||||||
}
|
|
||||||
|
|
||||||
.chapter li a {
|
|
||||||
padding: 5px 0;
|
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
|
.content a:hover {
|
||||||
.chapter li a:hover {
|
text-decoration: underline;
|
||||||
text-decoration: none;
|
}
|
||||||
}
|
.content img {
|
||||||
|
max-width: 100%;
|
||||||
.chapter .affix {
|
}
|
||||||
|
.menu-bar {
|
||||||
}
|
|
||||||
|
|
||||||
.chapter .spacer {
|
|
||||||
width: 100%;
|
|
||||||
height: 3px;
|
|
||||||
background-color: #f4f4f4;
|
|
||||||
margin: 10px 0px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.navy .chapter .spacer {
|
|
||||||
background-color: #2d334f;
|
|
||||||
}
|
|
||||||
|
|
||||||
.coal .chapter .spacer {
|
|
||||||
background-color: #393939;
|
|
||||||
}
|
|
||||||
|
|
||||||
.rust .chapter .spacer {
|
|
||||||
background-color: #45373a;
|
|
||||||
}
|
|
||||||
|
|
||||||
.menu-bar {
|
|
||||||
position: relative;
|
position: relative;
|
||||||
height: 50px;
|
height: 50px;
|
||||||
}
|
}
|
||||||
|
.menu-bar i {
|
||||||
.menu-bar i {
|
|
||||||
position: relative;
|
position: relative;
|
||||||
margin: 0 10px;
|
margin: 0 10px;
|
||||||
z-index: 10;
|
z-index: 10;
|
||||||
line-height: 50px;
|
line-height: 50px;
|
||||||
-webkit-transition: color 0.5s; /* Safari */
|
-webkit-transition: color 0.5s;
|
||||||
-o-transition: color 0.5s; /* Opera */
|
-moz-transition: color 0.5s;
|
||||||
-moz-transition: color 0.5s; /* Mozilla Firefox */
|
-o-transition: color 0.5s;
|
||||||
|
-ms-transition: color 0.5s;
|
||||||
transition: color 0.5s;
|
transition: color 0.5s;
|
||||||
}
|
}
|
||||||
|
.menu-bar i:hover {
|
||||||
.menu-bar .left-buttons {
|
|
||||||
float: left;
|
|
||||||
}
|
|
||||||
|
|
||||||
.menu-bar .right-buttons {
|
|
||||||
float: right;
|
|
||||||
}
|
|
||||||
|
|
||||||
.menu-bar i:hover {
|
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
.menu-bar .left-buttons {
|
||||||
.menu-title {
|
float: left;
|
||||||
|
}
|
||||||
|
.menu-bar .right-buttons {
|
||||||
|
float: right;
|
||||||
|
}
|
||||||
|
.menu-title {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
font-weight: 200;
|
font-weight: 200;
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
|
@ -302,211 +145,303 @@ html, body {
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
|
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
-webkit-transition: opacity 0.5s ease-in-out; /* Safari */
|
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
|
||||||
-o-transition: opacity 0.5s ease-in-out; /* Opera */
|
filter: alpha(opacity=0);
|
||||||
-moz-transition: opacity 0.5s ease-in-out; /* Mozilla Firefox */
|
-webkit-transition: opacity 0.5s ease-in-out;
|
||||||
|
-moz-transition: opacity 0.5s ease-in-out;
|
||||||
|
-o-transition: opacity 0.5s ease-in-out;
|
||||||
|
-ms-transition: opacity 0.5s ease-in-out;
|
||||||
transition: opacity 0.5s ease-in-out;
|
transition: opacity 0.5s ease-in-out;
|
||||||
}
|
}
|
||||||
|
.menu-bar:hover .menu-title {
|
||||||
.menu-bar:hover .menu-title {
|
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
}
|
-ms-filter: none;
|
||||||
|
filter: none;
|
||||||
.left {
|
}
|
||||||
float: left;
|
.nav-chapters {
|
||||||
}
|
font-size: 2.5em;
|
||||||
|
|
||||||
.right {
|
|
||||||
float: right;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Content */
|
|
||||||
|
|
||||||
.content a {
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.content a:hover {
|
|
||||||
text-decoration: underline;
|
|
||||||
}
|
|
||||||
|
|
||||||
.content img {
|
|
||||||
max-width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Nav icons */
|
|
||||||
.nav-chapters {
|
|
||||||
font-size: 40px;
|
|
||||||
text-align: center;
|
text-align: center;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
|
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 50px; /* Height of menu-bar */
|
top: 50px /* Height of menu-bar */;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
max-width: 150px;
|
max-width: 150px;
|
||||||
min-width: 90px;
|
min-width: 90px;
|
||||||
|
display: -webkit-box;
|
||||||
|
display: -moz-box;
|
||||||
|
display: -webkit-flex;
|
||||||
|
display: -ms-flexbox;
|
||||||
|
display: box;
|
||||||
display: flex;
|
display: flex;
|
||||||
|
-webkit-box-pack: center;
|
||||||
|
-moz-box-pack: center;
|
||||||
|
-o-box-pack: center;
|
||||||
|
-ms-flex-pack: center;
|
||||||
|
-webkit-justify-content: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
|
-ms-flex-line-pack: center;
|
||||||
|
-webkit-align-content: center;
|
||||||
align-content: center;
|
align-content: center;
|
||||||
|
-webkit-box-orient: vertical;
|
||||||
|
-moz-box-orient: vertical;
|
||||||
|
-o-box-orient: vertical;
|
||||||
|
-webkit-flex-direction: column;
|
||||||
|
-ms-flex-direction: column;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
-webkit-transition: color 0.5s;
|
||||||
-webkit-transition: color 0.5s; /* Safari */
|
-moz-transition: color 0.5s;
|
||||||
-o-transition: color 0.5s; /* Opera */
|
-o-transition: color 0.5s;
|
||||||
-moz-transition: color 0.5s; /* Mozilla Firefox */
|
-ms-transition: color 0.5s;
|
||||||
transition: color 0.5s;
|
transition: color 0.5s;
|
||||||
}
|
}
|
||||||
|
.mobile-nav-chapters {
|
||||||
.mobile-nav-chapters { display: none; }
|
display: none;
|
||||||
|
}
|
||||||
.nav-chapters:hover {
|
.nav-chapters:hover {
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
|
.previous {
|
||||||
.previous {
|
|
||||||
left: 0;
|
left: 0;
|
||||||
}
|
}
|
||||||
|
.next {
|
||||||
.next {
|
|
||||||
right: 0;
|
right: 0;
|
||||||
}
|
}
|
||||||
|
.theme-popup {
|
||||||
|
|
||||||
/* Theme Popup */
|
|
||||||
.theme-popup {
|
|
||||||
position: fixed;
|
position: fixed;
|
||||||
left: -40px;
|
left: -40px;
|
||||||
|
-webkit-border-radius: 4px;
|
||||||
border-radius: 4px;
|
border-radius: 4px;
|
||||||
|
|
||||||
font-size: 0.7em;
|
font-size: 0.7em;
|
||||||
}
|
}
|
||||||
|
.theme-popup .theme {
|
||||||
.theme-popup .theme {
|
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 2px 10px;
|
padding: 2px 10px;
|
||||||
line-height: 25px;
|
line-height: 25px;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
@media only screen and (max-width: 1060px) {
|
|
||||||
.sidebar {
|
|
||||||
left: -300px;
|
|
||||||
}
|
|
||||||
.page-wrapper {
|
|
||||||
left: 15px;
|
|
||||||
padding-right: 15px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Fix the navigation arrows that collapsed with the text on smaller screens */
|
|
||||||
|
|
||||||
@media only screen and (max-width: 1250px) {
|
@media only screen and (max-width: 1250px) {
|
||||||
/* Light theme */
|
|
||||||
.light .mobile-nav-chapters {
|
|
||||||
background-color: #E0E0E0;
|
|
||||||
color: #999;
|
|
||||||
}
|
|
||||||
.light .mobile-nav-chapters i:hover {
|
|
||||||
color: #333;
|
|
||||||
}
|
|
||||||
/* Coal theme */
|
|
||||||
.coal .mobile-nav-chapters {
|
|
||||||
background-color: #212426;
|
|
||||||
color: #43484d;
|
|
||||||
}
|
|
||||||
.coal .mobile-nav-chapters i:hover {
|
|
||||||
color: #b3c0cc;
|
|
||||||
}
|
|
||||||
/* Navy theme */
|
|
||||||
.navy .mobile-nav-chapters {
|
|
||||||
background-color: #242838;
|
|
||||||
color: #737480;
|
|
||||||
}
|
|
||||||
.navy .mobile-nav-chapters i:hover {
|
|
||||||
color: #b7b9cc;
|
|
||||||
}
|
|
||||||
/* Rust theme */
|
|
||||||
.rust .mobile-nav-chapters {
|
|
||||||
background-color: #4d413d;
|
|
||||||
color: #737480;
|
|
||||||
}
|
|
||||||
.rust .mobile-nav-chapters i:hover {
|
|
||||||
color: #b7b9cc;
|
|
||||||
}
|
|
||||||
.nav-chapters {
|
.nav-chapters {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mobile-nav-chapters {
|
.mobile-nav-chapters {
|
||||||
font-size: 40px;
|
font-size: 2.5em;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
|
|
||||||
max-width: 150px;
|
max-width: 150px;
|
||||||
min-width: 90px;
|
min-width: 90px;
|
||||||
|
-webkit-box-pack: center;
|
||||||
|
-moz-box-pack: center;
|
||||||
|
-o-box-pack: center;
|
||||||
|
-ms-flex-pack: center;
|
||||||
|
-webkit-justify-content: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
|
-ms-flex-line-pack: center;
|
||||||
|
-webkit-align-content: center;
|
||||||
align-content: center;
|
align-content: center;
|
||||||
|
|
||||||
position: relative;
|
position: relative;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
margin-bottom: 50px;
|
margin-bottom: 50px;
|
||||||
|
-webkit-border-radius: 5px;
|
||||||
border-radius: 5px;
|
border-radius: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.next {
|
.next {
|
||||||
float: right;
|
float: right;
|
||||||
}
|
}
|
||||||
|
|
||||||
.previous {
|
.previous {
|
||||||
float: left;
|
float: left;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.light {
|
||||||
@media only print {
|
color: #333;
|
||||||
.sidebar, .menu-bar, .nav-chapters, .mobile-nav-chapters {
|
background-color: #fff;
|
||||||
display: none;
|
}
|
||||||
}
|
.light .sidebar {
|
||||||
|
background-color: #fafafa;
|
||||||
.page-wrapper {
|
color: #364149;
|
||||||
left: 0;
|
}
|
||||||
}
|
.light .chapter li {
|
||||||
|
color: #aaa;
|
||||||
.content {
|
}
|
||||||
max-width: 100%;
|
.light .chapter li a {
|
||||||
}
|
color: #364149;
|
||||||
|
}
|
||||||
code {
|
.light .chapter li .active,
|
||||||
background-color: #666666;
|
.light .chapter li a:hover {
|
||||||
border-radius: 5px;
|
/* Animate color change */
|
||||||
|
color: #008cff;
|
||||||
/* Force background to be printed in Chrome */
|
}
|
||||||
-webkit-print-color-adjust: exact;
|
.light .chapter .spacer {
|
||||||
}
|
background-color: #f4f4f4;
|
||||||
|
}
|
||||||
a, a:visited, a:active, a:hover {
|
.light .menu-bar,
|
||||||
color: #4183c4;
|
.light .nav-chapters,
|
||||||
text-decoration: none;
|
.light .mobile-nav-chapters {
|
||||||
}
|
color: #ccc;
|
||||||
|
}
|
||||||
h1, h2, h3, h4, h5, h6 {
|
.light .menu-bar i:hover,
|
||||||
page-break-inside: avoid;
|
.light .nav-chapters:hover,
|
||||||
page-break-after: avoid;
|
.light .mobile-nav-chapters i:hover {
|
||||||
/*break-after: avoid;*/
|
color: #333;
|
||||||
}
|
}
|
||||||
|
.light .mobile-nav-chapters i:hover {
|
||||||
pre, code {
|
color: #364149;
|
||||||
page-break-inside: avoid;
|
}
|
||||||
white-space: pre-wrap; /* CSS 3 */
|
.light .mobile-nav-chapters {
|
||||||
white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
|
background-color: #fafafa;
|
||||||
white-space: -pre-wrap; /* Opera 4-6 */
|
}
|
||||||
white-space: -o-pre-wrap; /* Opera 7 */
|
.light .content a {
|
||||||
word-wrap: break-word; /* Internet Explorer 5.5+ */
|
color: #4183c4;
|
||||||
}
|
}
|
||||||
|
.light .theme-popup {
|
||||||
|
background: #fafafa;
|
||||||
|
border: 1px solid #ccc;
|
||||||
|
}
|
||||||
|
.light .theme-popup .theme:hover {
|
||||||
|
background-color: #e6e6e6;
|
||||||
|
}
|
||||||
|
.coal {
|
||||||
|
color: #98a3ad;
|
||||||
|
background-color: #141617;
|
||||||
|
}
|
||||||
|
.coal .sidebar {
|
||||||
|
background-color: #292c2f;
|
||||||
|
color: #a1adb8;
|
||||||
|
}
|
||||||
|
.coal .chapter li {
|
||||||
|
color: #505254;
|
||||||
|
}
|
||||||
|
.coal .chapter li a {
|
||||||
|
color: #a1adb8;
|
||||||
|
}
|
||||||
|
.coal .chapter li .active,
|
||||||
|
.coal .chapter li a:hover {
|
||||||
|
/* Animate color change */
|
||||||
|
color: #3473ad;
|
||||||
|
}
|
||||||
|
.coal .chapter .spacer {
|
||||||
|
background-color: #393939;
|
||||||
|
}
|
||||||
|
.coal .menu-bar,
|
||||||
|
.coal .nav-chapters,
|
||||||
|
.coal .mobile-nav-chapters {
|
||||||
|
color: #43484d;
|
||||||
|
}
|
||||||
|
.coal .menu-bar i:hover,
|
||||||
|
.coal .nav-chapters:hover,
|
||||||
|
.coal .mobile-nav-chapters i:hover {
|
||||||
|
color: #b3c0cc;
|
||||||
|
}
|
||||||
|
.coal .mobile-nav-chapters i:hover {
|
||||||
|
color: #a1adb8;
|
||||||
|
}
|
||||||
|
.coal .mobile-nav-chapters {
|
||||||
|
background-color: #292c2f;
|
||||||
|
}
|
||||||
|
.coal .content a {
|
||||||
|
color: #2b79a2;
|
||||||
|
}
|
||||||
|
.coal .theme-popup {
|
||||||
|
background: #141617;
|
||||||
|
border: 1px solid #43484d;
|
||||||
|
}
|
||||||
|
.coal .theme-popup .theme:hover {
|
||||||
|
background-color: #1f2124;
|
||||||
|
}
|
||||||
|
.navy {
|
||||||
|
color: #bcbdd0;
|
||||||
|
background-color: #161923;
|
||||||
|
}
|
||||||
|
.navy .sidebar {
|
||||||
|
background-color: #282d3f;
|
||||||
|
color: #c8c9db;
|
||||||
|
}
|
||||||
|
.navy .chapter li {
|
||||||
|
color: #505274;
|
||||||
|
}
|
||||||
|
.navy .chapter li a {
|
||||||
|
color: #c8c9db;
|
||||||
|
}
|
||||||
|
.navy .chapter li .active,
|
||||||
|
.navy .chapter li a:hover {
|
||||||
|
/* Animate color change */
|
||||||
|
color: #2b79a2;
|
||||||
|
}
|
||||||
|
.navy .chapter .spacer {
|
||||||
|
background-color: #2d334f;
|
||||||
|
}
|
||||||
|
.navy .menu-bar,
|
||||||
|
.navy .nav-chapters,
|
||||||
|
.navy .mobile-nav-chapters {
|
||||||
|
color: #737480;
|
||||||
|
}
|
||||||
|
.navy .menu-bar i:hover,
|
||||||
|
.navy .nav-chapters:hover,
|
||||||
|
.navy .mobile-nav-chapters i:hover {
|
||||||
|
color: #b7b9cc;
|
||||||
|
}
|
||||||
|
.navy .mobile-nav-chapters i:hover {
|
||||||
|
color: #c8c9db;
|
||||||
|
}
|
||||||
|
.navy .mobile-nav-chapters {
|
||||||
|
background-color: #282d3f;
|
||||||
|
}
|
||||||
|
.navy .content a {
|
||||||
|
color: #2b79a2;
|
||||||
|
}
|
||||||
|
.navy .theme-popup {
|
||||||
|
background: #161923;
|
||||||
|
border: 1px solid #737480;
|
||||||
|
}
|
||||||
|
.navy .theme-popup .theme:hover {
|
||||||
|
background-color: #282e40;
|
||||||
|
}
|
||||||
|
.rust {
|
||||||
|
color: #262625;
|
||||||
|
background-color: #e1e1db;
|
||||||
|
}
|
||||||
|
.rust .sidebar {
|
||||||
|
background-color: #3b2e2a;
|
||||||
|
color: #c8c9db;
|
||||||
|
}
|
||||||
|
.rust .chapter li {
|
||||||
|
color: #505254;
|
||||||
|
}
|
||||||
|
.rust .chapter li a {
|
||||||
|
color: #c8c9db;
|
||||||
|
}
|
||||||
|
.rust .chapter li .active,
|
||||||
|
.rust .chapter li a:hover {
|
||||||
|
/* Animate color change */
|
||||||
|
color: #e69f67;
|
||||||
|
}
|
||||||
|
.rust .chapter .spacer {
|
||||||
|
background-color: #45373a;
|
||||||
|
}
|
||||||
|
.rust .menu-bar,
|
||||||
|
.rust .nav-chapters,
|
||||||
|
.rust .mobile-nav-chapters {
|
||||||
|
color: #737480;
|
||||||
|
}
|
||||||
|
.rust .menu-bar i:hover,
|
||||||
|
.rust .nav-chapters:hover,
|
||||||
|
.rust .mobile-nav-chapters i:hover {
|
||||||
|
color: #262625;
|
||||||
|
}
|
||||||
|
.rust .mobile-nav-chapters i:hover {
|
||||||
|
color: #c8c9db;
|
||||||
|
}
|
||||||
|
.rust .mobile-nav-chapters {
|
||||||
|
background-color: #3b2e2a;
|
||||||
|
}
|
||||||
|
.rust .content a {
|
||||||
|
color: #2b79a2;
|
||||||
|
}
|
||||||
|
.rust .theme-popup {
|
||||||
|
background: #e1e1db;
|
||||||
|
border: 1px solid #b38f6b;
|
||||||
|
}
|
||||||
|
.rust .theme-popup .theme:hover {
|
||||||
|
background-color: #99908a;
|
||||||
}
|
}
|
||||||
|
|
|
@ -0,0 +1,9 @@
|
||||||
|
@import "nib"
|
||||||
|
|
||||||
|
@import 'general'
|
||||||
|
@import 'sidebar'
|
||||||
|
@import 'page'
|
||||||
|
@import 'menu'
|
||||||
|
@import 'nav-icons'
|
||||||
|
@import 'theme-popup'
|
||||||
|
@import 'themes'
|
|
@ -0,0 +1,12 @@
|
||||||
|
html, body {
|
||||||
|
font-family: "Open Sans", sans-serif;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.left {
|
||||||
|
float: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
.right {
|
||||||
|
float: right;
|
||||||
|
}
|
|
@ -0,0 +1,39 @@
|
||||||
|
.menu-bar {
|
||||||
|
position: relative
|
||||||
|
height: 50px
|
||||||
|
|
||||||
|
i {
|
||||||
|
position: relative
|
||||||
|
margin: 0 10px
|
||||||
|
z-index: 10
|
||||||
|
line-height: 50px
|
||||||
|
|
||||||
|
transition: color 0.5s
|
||||||
|
|
||||||
|
&:hover { cursor: pointer }
|
||||||
|
}
|
||||||
|
|
||||||
|
.left-buttons { float: left }
|
||||||
|
.right-buttons { float: right }
|
||||||
|
}
|
||||||
|
|
||||||
|
.menu-title {
|
||||||
|
display: inline-block
|
||||||
|
font-weight: 200
|
||||||
|
font-size: 20px
|
||||||
|
line-height: 50px
|
||||||
|
position: absolute
|
||||||
|
top: 0
|
||||||
|
left: 0
|
||||||
|
right: 0
|
||||||
|
bottom: 0
|
||||||
|
text-align: center
|
||||||
|
margin: 0
|
||||||
|
|
||||||
|
opacity: 0
|
||||||
|
transition: opacity 0.5s ease-in-out
|
||||||
|
}
|
||||||
|
|
||||||
|
.menu-bar:hover .menu-title {
|
||||||
|
opacity: 1
|
||||||
|
}
|
|
@ -0,0 +1,23 @@
|
||||||
|
.nav-chapters {
|
||||||
|
font-size: 2.5em
|
||||||
|
text-align: center
|
||||||
|
text-decoration: none
|
||||||
|
|
||||||
|
position: absolute
|
||||||
|
top: 50px /* Height of menu-bar */
|
||||||
|
bottom: 0
|
||||||
|
margin: 0
|
||||||
|
max-width: 150px
|
||||||
|
min-width: 90px
|
||||||
|
display: flex
|
||||||
|
justify-content: center
|
||||||
|
align-content: center
|
||||||
|
flex-direction: column
|
||||||
|
|
||||||
|
transition: color 0.5s
|
||||||
|
}
|
||||||
|
|
||||||
|
.mobile-nav-chapters { display: none }
|
||||||
|
.nav-chapters:hover { text-decoration: none }
|
||||||
|
.previous { left: 0 }
|
||||||
|
.next { right: 0 }
|
|
@ -0,0 +1,45 @@
|
||||||
|
.page-wrapper {
|
||||||
|
position: absolute
|
||||||
|
overflow-y: auto
|
||||||
|
left: 315px
|
||||||
|
right: 0
|
||||||
|
top: 0
|
||||||
|
bottom: 0
|
||||||
|
box-sizing: border-box
|
||||||
|
-webkit-overflow-scrolling: touch
|
||||||
|
|
||||||
|
min-height: 100%
|
||||||
|
|
||||||
|
// Animation: slide away
|
||||||
|
transition: left 0.5s
|
||||||
|
|
||||||
|
@media only screen and (max-width: 1060px) {
|
||||||
|
left: 15px;
|
||||||
|
padding-right: 15px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.page {
|
||||||
|
position: absolute
|
||||||
|
top: 0
|
||||||
|
right: 0
|
||||||
|
left: 0
|
||||||
|
bottom: 0
|
||||||
|
|
||||||
|
padding-right: 15px
|
||||||
|
overflow-y: auto
|
||||||
|
}
|
||||||
|
|
||||||
|
.content {
|
||||||
|
margin-left: auto
|
||||||
|
margin-right:auto
|
||||||
|
max-width: 750px
|
||||||
|
padding-bottom: 50px
|
||||||
|
|
||||||
|
a {
|
||||||
|
text-decoration: none;
|
||||||
|
&:hover { text-decoration: underline; }
|
||||||
|
}
|
||||||
|
|
||||||
|
img { max-width: 100%; }
|
||||||
|
}
|
|
@ -0,0 +1,45 @@
|
||||||
|
@media only print {
|
||||||
|
|
||||||
|
.sidebar,
|
||||||
|
.menu-bar,
|
||||||
|
.nav-chapters,
|
||||||
|
.mobile-nav-chapters {
|
||||||
|
display: none
|
||||||
|
}
|
||||||
|
|
||||||
|
.page-wrapper {
|
||||||
|
left: 0
|
||||||
|
}
|
||||||
|
|
||||||
|
.content {
|
||||||
|
max-width: 100%
|
||||||
|
}
|
||||||
|
|
||||||
|
code {
|
||||||
|
background-color: #666666
|
||||||
|
border-radius: 5px
|
||||||
|
|
||||||
|
/* Force background to be printed in Chrome */
|
||||||
|
-webkit-print-color-adjust: exact
|
||||||
|
}
|
||||||
|
|
||||||
|
a, a:visited, a:active, a:hover {
|
||||||
|
color: #4183c4
|
||||||
|
text-decoration: none
|
||||||
|
}
|
||||||
|
|
||||||
|
h1, h2, h3, h4, h5, h6 {
|
||||||
|
page-break-inside: avoid
|
||||||
|
page-break-after: avoid
|
||||||
|
/*break-after: avoid*/
|
||||||
|
}
|
||||||
|
|
||||||
|
pre, code {
|
||||||
|
page-break-inside: avoid
|
||||||
|
white-space: pre-wrap /* CSS 3 */
|
||||||
|
white-space: -moz-pre-wrap /* Mozilla, since 1999 */
|
||||||
|
white-space: -pre-wrap /* Opera 4-6 */
|
||||||
|
white-space: -o-pre-wrap /* Opera 7 */
|
||||||
|
word-wrap: break-word /* Internet Explorer 5.5+ */
|
||||||
|
}
|
||||||
|
}
|
|
@ -0,0 +1,50 @@
|
||||||
|
.sidebar {
|
||||||
|
position: absolute
|
||||||
|
left: 0
|
||||||
|
top: 0
|
||||||
|
bottom: 0
|
||||||
|
width: 300px
|
||||||
|
overflow-y: auto
|
||||||
|
padding: 10px 10px
|
||||||
|
font-size: 0.875em
|
||||||
|
box-sizing: border-box
|
||||||
|
-webkit-overflow-scrolling: touch
|
||||||
|
|
||||||
|
// Animation: slide away
|
||||||
|
transition: left 0.5s
|
||||||
|
|
||||||
|
@media only screen and (max-width: 1060px) {
|
||||||
|
left: -300px
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.chapter {
|
||||||
|
list-style: none outside none
|
||||||
|
padding-left: 0
|
||||||
|
line-height: 1.9em
|
||||||
|
|
||||||
|
li a {
|
||||||
|
padding: 5px 0
|
||||||
|
text-decoration: none
|
||||||
|
|
||||||
|
&:hover { text-decoration: none }
|
||||||
|
}
|
||||||
|
|
||||||
|
.spacer {
|
||||||
|
width: 100%
|
||||||
|
height: 3px
|
||||||
|
margin: 10px 0px
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.section {
|
||||||
|
list-style: none outside none
|
||||||
|
padding-left: 20px
|
||||||
|
line-height: 2.5em
|
||||||
|
|
||||||
|
li {
|
||||||
|
text-overflow: ellipsis
|
||||||
|
overflow: hidden
|
||||||
|
white-space: nowrap
|
||||||
|
}
|
||||||
|
}
|
|
@ -0,0 +1,47 @@
|
||||||
|
.theme-popup {
|
||||||
|
position: fixed
|
||||||
|
left: -40px
|
||||||
|
|
||||||
|
border-radius: 4px
|
||||||
|
font-size: 0.7em
|
||||||
|
|
||||||
|
.theme {
|
||||||
|
margin: 0
|
||||||
|
padding: 2px 10px
|
||||||
|
line-height: 25px
|
||||||
|
white-space: nowrap
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media only screen and (max-width: 1250px) {
|
||||||
|
|
||||||
|
.nav-chapters {
|
||||||
|
display: none
|
||||||
|
}
|
||||||
|
|
||||||
|
.mobile-nav-chapters {
|
||||||
|
font-size: 2.5em
|
||||||
|
text-align: center
|
||||||
|
text-decoration: none
|
||||||
|
|
||||||
|
max-width: 150px
|
||||||
|
min-width: 90px
|
||||||
|
|
||||||
|
justify-content: center
|
||||||
|
align-content: center
|
||||||
|
|
||||||
|
position: relative
|
||||||
|
display: inline-block
|
||||||
|
margin-bottom: 50px
|
||||||
|
|
||||||
|
border-radius: 5px
|
||||||
|
}
|
||||||
|
|
||||||
|
.next {
|
||||||
|
float: right
|
||||||
|
}
|
||||||
|
|
||||||
|
.previous {
|
||||||
|
float: left
|
||||||
|
}
|
||||||
|
}
|
|
@ -0,0 +1,56 @@
|
||||||
|
.{unquote($theme-name)} {
|
||||||
|
color: $fg
|
||||||
|
background-color: $bg
|
||||||
|
|
||||||
|
.sidebar {
|
||||||
|
background-color: $sidebar-bg
|
||||||
|
color: $sidebar-fg
|
||||||
|
}
|
||||||
|
|
||||||
|
.chapter li {
|
||||||
|
color: $sidebar-non-existant
|
||||||
|
|
||||||
|
a { color: $sidebar-fg }
|
||||||
|
|
||||||
|
.active,
|
||||||
|
a:hover {
|
||||||
|
/* Animate color change */
|
||||||
|
color: $sidebar-active
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.chapter .spacer {
|
||||||
|
background-color: $sidebar-spacer
|
||||||
|
}
|
||||||
|
|
||||||
|
.menu-bar,
|
||||||
|
.nav-chapters,
|
||||||
|
.mobile-nav-chapters {
|
||||||
|
color: $icons
|
||||||
|
}
|
||||||
|
|
||||||
|
.menu-bar i:hover,
|
||||||
|
.nav-chapters:hover,
|
||||||
|
.mobile-nav-chapters i:hover {
|
||||||
|
color: $icons-hover
|
||||||
|
}
|
||||||
|
|
||||||
|
.mobile-nav-chapters i:hover {
|
||||||
|
color: $sidebar-fg
|
||||||
|
}
|
||||||
|
|
||||||
|
.mobile-nav-chapters {
|
||||||
|
background-color: $sidebar-bg
|
||||||
|
}
|
||||||
|
|
||||||
|
.content a {
|
||||||
|
color: $links
|
||||||
|
}
|
||||||
|
|
||||||
|
.theme-popup {
|
||||||
|
background: $theme-popup-bg
|
||||||
|
border: 1px solid $theme-popup-border
|
||||||
|
|
||||||
|
.theme:hover { background-color: $theme-hover }
|
||||||
|
}
|
||||||
|
}
|
|
@ -0,0 +1,21 @@
|
||||||
|
$theme-name = 'coal'
|
||||||
|
|
||||||
|
$bg = #141617
|
||||||
|
$fg = #98a3ad
|
||||||
|
|
||||||
|
$sidebar-bg = #292c2f
|
||||||
|
$sidebar-fg = #a1adb8
|
||||||
|
$sidebar-non-existant = #505254
|
||||||
|
$sidebar-active = #3473ad
|
||||||
|
$sidebar-spacer = #393939
|
||||||
|
|
||||||
|
$icons = #43484d
|
||||||
|
$icons-hover = #b3c0cc
|
||||||
|
|
||||||
|
$links = #2b79a2
|
||||||
|
|
||||||
|
$theme-popup-bg = #141617
|
||||||
|
$theme-popup-border = #43484d
|
||||||
|
$theme-hover = #1f2124
|
||||||
|
|
||||||
|
@import 'base'
|
|
@ -0,0 +1,4 @@
|
||||||
|
@import 'light'
|
||||||
|
@import 'coal'
|
||||||
|
@import 'navy'
|
||||||
|
@import 'rust'
|
|
@ -0,0 +1,21 @@
|
||||||
|
$theme-name = 'light'
|
||||||
|
|
||||||
|
$bg = #ffffff
|
||||||
|
$fg = #333333
|
||||||
|
|
||||||
|
$sidebar-bg = #fafafa
|
||||||
|
$sidebar-fg = #364149
|
||||||
|
$sidebar-non-existant = #aaaaaa
|
||||||
|
$sidebar-active = #008cff
|
||||||
|
$sidebar-spacer = #f4f4f4
|
||||||
|
|
||||||
|
$icons = #cccccc
|
||||||
|
$icons-hover = #333333
|
||||||
|
|
||||||
|
$links = #4183c4
|
||||||
|
|
||||||
|
$theme-popup-bg = #fafafa
|
||||||
|
$theme-popup-border = #cccccc
|
||||||
|
$theme-hover = #e6e6e6
|
||||||
|
|
||||||
|
@import 'base'
|
|
@ -0,0 +1,21 @@
|
||||||
|
$theme-name = 'navy'
|
||||||
|
|
||||||
|
$bg = #161923
|
||||||
|
$fg = #bcbdd0
|
||||||
|
|
||||||
|
$sidebar-bg = #282d3f
|
||||||
|
$sidebar-fg = #c8c9db
|
||||||
|
$sidebar-non-existant = #505274
|
||||||
|
$sidebar-active = #2b79a2
|
||||||
|
$sidebar-spacer = #2d334f
|
||||||
|
|
||||||
|
$icons = #737480
|
||||||
|
$icons-hover = #b7b9cc
|
||||||
|
|
||||||
|
$links = #2b79a2
|
||||||
|
|
||||||
|
$theme-popup-bg = #161923
|
||||||
|
$theme-popup-border = #737480
|
||||||
|
$theme-hover = #282e40
|
||||||
|
|
||||||
|
@import 'base'
|
|
@ -0,0 +1,21 @@
|
||||||
|
$theme-name = 'rust'
|
||||||
|
|
||||||
|
$bg = #e1e1db
|
||||||
|
$fg = #262625
|
||||||
|
|
||||||
|
$sidebar-bg = #3b2e2a
|
||||||
|
$sidebar-fg = #c8c9db
|
||||||
|
$sidebar-non-existant = #505254
|
||||||
|
$sidebar-active = #e69f67
|
||||||
|
$sidebar-spacer = #45373a
|
||||||
|
|
||||||
|
$icons = #737480
|
||||||
|
$icons-hover = #262625
|
||||||
|
|
||||||
|
$links = #2b79a2
|
||||||
|
|
||||||
|
$theme-popup-bg = #e1e1db
|
||||||
|
$theme-popup-border = #b38f6b
|
||||||
|
$theme-hover = #99908a
|
||||||
|
|
||||||
|
@import 'base'
|
Loading…
Reference in New Issue