mirror of
https://github.com/nicoburns/blessed-rs
synced 2024-11-24 20:53:03 +00:00
Convert CSS to SASS
This commit is contained in:
Nico Burns
parent
1c7f4e99ae
commit
8ca5c16fe8
8 changed files with 541 additions and 162 deletions
98
Cargo.lock
generated
98
Cargo.lock
generated
|
|
@ -20,6 +20,12 @@ dependencies = [
|
|||
"libc",
|
||||
]
|
||||
|
||||
[[package]]
|
||||
name = "arc-swap"
|
||||
version = "1.5.1"
|
||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "983cd8b9d4b02a6dc6ffa557262eb5858a27a0038ffffe21a0f133eaa819a164"
|
||||
|
||||
[[package]]
|
||||
name = "async-trait"
|
||||
version = "0.1.58"
|
||||
|
|
@ -97,6 +103,7 @@ dependencies = [
|
|||
"axum",
|
||||
"fxhash",
|
||||
"once_cell",
|
||||
"rsass",
|
||||
"serde",
|
||||
"serde_json",
|
||||
"tera",
|
||||
|
|
@ -130,6 +137,12 @@ version = "3.11.1"
|
|||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "572f695136211188308f16ad2ca5c851a712c464060ae6974944458eb83880ba"
|
||||
|
||||
[[package]]
|
||||
name = "bytecount"
|
||||
version = "0.6.3"
|
||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "2c676a478f63e9fa2dd5368a42f28bba0d6c560b775f38583c8bbaa7fcd67c9c"
|
||||
|
||||
[[package]]
|
||||
name = "byteorder"
|
||||
version = "1.4.3"
|
||||
|
|
@ -292,6 +305,15 @@ dependencies = [
|
|||
"crypto-common",
|
||||
]
|
||||
|
||||
[[package]]
|
||||
name = "fastrand"
|
||||
version = "1.8.0"
|
||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "a7a407cfaa3385c4ae6b23e84623d48c2798d06e3e6a1878f7f59f17b3f86499"
|
||||
dependencies = [
|
||||
"instant",
|
||||
]
|
||||
|
||||
[[package]]
|
||||
name = "fnv"
|
||||
version = "1.0.7"
|
||||
|
|
@ -520,6 +542,15 @@ dependencies = [
|
|||
"winapi-util",
|
||||
]
|
||||
|
||||
[[package]]
|
||||
name = "instant"
|
||||
version = "0.1.12"
|
||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "7a5bbe824c507c5da5956355e86a746d82e0e1464f65d862cc5e71da70e94b2c"
|
||||
dependencies = [
|
||||
"cfg-if",
|
||||
]
|
||||
|
||||
[[package]]
|
||||
name = "itoa"
|
||||
version = "1.0.4"
|
||||
|
|
@ -612,6 +643,12 @@ dependencies = [
|
|||
"unicase",
|
||||
]
|
||||
|
||||
[[package]]
|
||||
name = "minimal-lexical"
|
||||
version = "0.2.1"
|
||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "68354c5c6bd36d73ff3feceb05efa59b6acb7626617f4962be322a825e61f79a"
|
||||
|
||||
[[package]]
|
||||
name = "mio"
|
||||
version = "0.8.5"
|
||||
|
|
@ -624,6 +661,27 @@ dependencies = [
|
|||
"windows-sys",
|
||||
]
|
||||
|
||||
[[package]]
|
||||
name = "nom"
|
||||
version = "7.1.1"
|
||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "a8903e5a29a317527874d0402f867152a3d21c908bb0b933e416c65e301d4c36"
|
||||
dependencies = [
|
||||
"memchr",
|
||||
"minimal-lexical",
|
||||
]
|
||||
|
||||
[[package]]
|
||||
name = "nom_locate"
|
||||
version = "4.0.0"
|
||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "37794436ca3029a3089e0b95d42da1f0b565ad271e4d3bb4bad0c7bb70b10605"
|
||||
dependencies = [
|
||||
"bytecount",
|
||||
"memchr",
|
||||
"nom",
|
||||
]
|
||||
|
||||
[[package]]
|
||||
name = "nu-ansi-term"
|
||||
version = "0.46.0"
|
||||
|
|
@ -634,6 +692,17 @@ dependencies = [
|
|||
"winapi",
|
||||
]
|
||||
|
||||
[[package]]
|
||||
name = "num-bigint"
|
||||
version = "0.4.3"
|
||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "f93ab6289c7b344a8a9f60f88d80aa20032336fe78da341afc91c8a2341fc75f"
|
||||
dependencies = [
|
||||
"autocfg",
|
||||
"num-integer",
|
||||
"num-traits",
|
||||
]
|
||||
|
||||
[[package]]
|
||||
name = "num-integer"
|
||||
version = "0.1.45"
|
||||
|
|
@ -644,6 +713,17 @@ dependencies = [
|
|||
"num-traits",
|
||||
]
|
||||
|
||||
[[package]]
|
||||
name = "num-rational"
|
||||
version = "0.4.1"
|
||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "0638a1c9d0a3c0914158145bc76cff373a75a627e6ecbfb71cbe6f453a5a19b0"
|
||||
dependencies = [
|
||||
"autocfg",
|
||||
"num-integer",
|
||||
"num-traits",
|
||||
]
|
||||
|
||||
[[package]]
|
||||
name = "num-traits"
|
||||
version = "0.2.15"
|
||||
|
|
@ -917,6 +997,24 @@ version = "0.6.28"
|
|||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "456c603be3e8d448b072f410900c09faf164fbce2d480456f50eea6e25f9c848"
|
||||
|
||||
[[package]]
|
||||
name = "rsass"
|
||||
version = "0.26.0"
|
||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "665387d3be91521de331a04cc7118c8c129ffe43c5f4e8a61e78990850046b5a"
|
||||
dependencies = [
|
||||
"arc-swap",
|
||||
"fastrand",
|
||||
"lazy_static",
|
||||
"nom",
|
||||
"nom_locate",
|
||||
"num-bigint",
|
||||
"num-integer",
|
||||
"num-rational",
|
||||
"num-traits",
|
||||
"tracing",
|
||||
]
|
||||
|
||||
[[package]]
|
||||
name = "ryu"
|
||||
version = "1.0.11"
|
||||
|
|
|
|||
|
|
@ -17,4 +17,7 @@ tower-http = { version = "0.3", features = ["fs", "trace"] }
|
|||
tracing = "0.1"
|
||||
tracing-subscriber = { version = "0.3", features = ["env-filter"] }
|
||||
|
||||
[build-dependencies]
|
||||
rsass = "0.26"
|
||||
|
||||
[features]
|
||||
|
|
|
|||
43
build.rs
Normal file
43
build.rs
Normal file
|
|
@ -0,0 +1,43 @@
|
|||
use std::path::PathBuf;
|
||||
use rsass::{compile_scss_path, output::{Format, Style}};
|
||||
use std::fs;
|
||||
|
||||
fn get_input_path(filename: &str) -> PathBuf {
|
||||
let mut path = PathBuf::with_capacity(50);
|
||||
path.push(".");
|
||||
path.push("styles");
|
||||
path.push(filename);
|
||||
path.set_extension("scss");
|
||||
path
|
||||
}
|
||||
|
||||
fn get_output_path(filename: &str) -> PathBuf {
|
||||
let mut path = PathBuf::with_capacity(50);
|
||||
path.push(".");
|
||||
path.push("static");
|
||||
path.push(filename);
|
||||
path.set_extension("css");
|
||||
path
|
||||
}
|
||||
|
||||
fn main () {
|
||||
println!("cargo:rerun-if-changed=styles");
|
||||
|
||||
|
||||
let entrypoints = ["index"];
|
||||
for filename in &entrypoints {
|
||||
|
||||
let input_path = get_input_path(filename);
|
||||
let css = compile_scss_path(
|
||||
&input_path,
|
||||
Format {
|
||||
style: Style::Expanded,
|
||||
..Default::default()
|
||||
}
|
||||
).unwrap();
|
||||
|
||||
let output_path = get_output_path(filename);
|
||||
fs::write(output_path, css).unwrap();
|
||||
|
||||
}
|
||||
}
|
||||
337
static/index.css
337
static/index.css
|
|
@ -1,202 +1,215 @@
|
|||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
body {
|
||||
/*font-family: "fira sans", system-ui, Arial, Helvetica, sans-serif;*/
|
||||
font-family: system-ui, Arial, Helvetica, sans-serif;
|
||||
background-color: #FFF;
|
||||
color: #333;
|
||||
/*font-family: "fira sans", system-ui, Arial, Helvetica, sans-serif;*/
|
||||
font-family: system-ui, Arial, Helvetica, sans-serif;
|
||||
background-color: #FFF;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
#main-container {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
margin: 24px;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
margin: 24px;
|
||||
}
|
||||
|
||||
#left-sidebar {
|
||||
width: 200px;
|
||||
}
|
||||
|
||||
.toc {
|
||||
position: sticky;
|
||||
overflow-y: auto;
|
||||
top: 24px;
|
||||
max-height: calc(100vh - 24px);
|
||||
}
|
||||
.toc ul {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
}
|
||||
.toc li {
|
||||
padding-left: 0;
|
||||
margin: 3px 0px;
|
||||
font-size: 1em;
|
||||
}
|
||||
.toc li > a {
|
||||
color: #999;
|
||||
text-decoration: none;
|
||||
}
|
||||
.toc li > ul {
|
||||
/*display: none;*/
|
||||
}
|
||||
.toc > ul > li.active:not(.active ~ .active) > a {
|
||||
color: #333;
|
||||
text-decoration: none;
|
||||
}
|
||||
.toc > ul > li.active:not(.active ~ .active) > ul {
|
||||
display: block;
|
||||
}
|
||||
.toc > ul > li.active:not(.active ~ .active) > ul > li.active:not(.active ~ .active) > a {
|
||||
color: #333;
|
||||
text-decoration: none;
|
||||
}
|
||||
.subtoc {
|
||||
margin-left: 12px;
|
||||
}
|
||||
.subtoc li {
|
||||
font-size: 0.85em;
|
||||
width: 200px;
|
||||
}
|
||||
|
||||
#content {
|
||||
max-width: 1200px;
|
||||
margin-left: 24px;
|
||||
max-width: 1200px;
|
||||
margin-left: 24px;
|
||||
}
|
||||
|
||||
#header {
|
||||
border-bottom: 1px solid #CCC;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background-color: #FFF;
|
||||
background-color: #fef6f1;
|
||||
border-bottom: 1px solid #CCC;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background-color: #FFF;
|
||||
background-color: #fef6f1;
|
||||
}
|
||||
|
||||
.page-heading-group {
|
||||
flex: 0 0 auto;
|
||||
margin-top: -6px;
|
||||
#header .logo {
|
||||
height: 120px;
|
||||
}
|
||||
|
||||
img.logo {
|
||||
height: 120px;
|
||||
#header .page-heading-group {
|
||||
flex: 0 0 auto;
|
||||
margin-top: -6px;
|
||||
}
|
||||
|
||||
h1.page-heading {
|
||||
color: #333;
|
||||
color: #4d4a45;
|
||||
font-size: 3rem;
|
||||
font-weight: normal;
|
||||
margin: 0;
|
||||
#header .page-heading-group .page-heading {
|
||||
color: #333;
|
||||
color: #4d4a45;
|
||||
font-size: 3rem;
|
||||
font-weight: normal;
|
||||
margin: 0;
|
||||
}
|
||||
h2.page-subheading {
|
||||
font-size: 1.5rem;
|
||||
font-weight: normal;
|
||||
margin: 0;
|
||||
color: #666;
|
||||
color: #77482d;
|
||||
color: #644735;
|
||||
}
|
||||
|
||||
.hflex {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: stretch;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
p.introduction {
|
||||
color: #494949;
|
||||
}
|
||||
|
||||
p, li {
|
||||
color: #000;
|
||||
line-height: 1.35;
|
||||
}
|
||||
|
||||
#content ul {
|
||||
max-width: 800px;
|
||||
padding-left: 48px;
|
||||
}
|
||||
|
||||
#content li {
|
||||
margin-bottom: 12px;
|
||||
padding-left: 12px;
|
||||
}
|
||||
|
||||
section {
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 1.8em;
|
||||
font-weight: normal;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
h4 {
|
||||
font-size: 1.4em;
|
||||
font-weight: normal;
|
||||
margin-bottom: 0;
|
||||
margin-top: 0;
|
||||
}
|
||||
p.group-description {
|
||||
color: #494949;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
a, a:hover, a:visited, a:active {
|
||||
color: #3298dc
|
||||
}
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
/* border: 1px solid #f9f9f9; */
|
||||
#header .page-heading-group .page-subheading {
|
||||
font-size: 1.5rem;
|
||||
font-weight: normal;
|
||||
margin: 0;
|
||||
color: #666;
|
||||
color: #77482d;
|
||||
color: #644735;
|
||||
}
|
||||
|
||||
.full-width {
|
||||
width: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.fixed-layout {
|
||||
table-layout: fixed;
|
||||
.hflex {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: stretch;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.use-case-column {
|
||||
width: 250px;
|
||||
p.introduction {
|
||||
color: #494949;
|
||||
}
|
||||
|
||||
table th {
|
||||
padding: 6px 18px 6px 6px;
|
||||
border: 1px solid #CCC;
|
||||
text-align: left;
|
||||
font-size: 0.8em;
|
||||
white-space: nowrap;
|
||||
color: #000;
|
||||
p, li {
|
||||
color: #000;
|
||||
line-height: 1.35;
|
||||
}
|
||||
|
||||
table td {
|
||||
padding: 6px 6px;
|
||||
border: 1px solid #CCC;
|
||||
font-size: 14px;
|
||||
#content ul {
|
||||
max-width: 800px;
|
||||
padding-left: 48px;
|
||||
}
|
||||
|
||||
table tbody:nth-of-type(odd) {
|
||||
background-color: #f6f8fa;
|
||||
#content li {
|
||||
margin-bottom: 12px;
|
||||
padding-left: 12px;
|
||||
}
|
||||
|
||||
table tbody:nth-of-type(even) {
|
||||
background-color: #FFF;
|
||||
section {
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 1.8em;
|
||||
font-weight: normal;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
h4 {
|
||||
font-size: 1.4em;
|
||||
font-weight: normal;
|
||||
margin-bottom: 0;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
p.group-description {
|
||||
color: #494949;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
a, a:hover, a:visited, a:active {
|
||||
color: #3298dc;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 800px) {
|
||||
#main-container { margin: 0 12px; }
|
||||
#left-sidebar { display: none; }
|
||||
#content { margin-left: 0; }
|
||||
#main-container {
|
||||
margin: 0 12px;
|
||||
}
|
||||
#left-sidebar {
|
||||
display: none;
|
||||
}
|
||||
#content {
|
||||
margin-left: 0;
|
||||
}
|
||||
.logo {
|
||||
height: 70px;
|
||||
}
|
||||
.page-heading {
|
||||
font-size: 2rem;
|
||||
}
|
||||
.page-subheading {
|
||||
font-size: 1rem;
|
||||
}
|
||||
h3 {
|
||||
margin-top: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
img.logo { height: 70px }
|
||||
h1.page-heading { font-size: 2rem }
|
||||
h2.page-subheading { font-size: 1rem }
|
||||
.toc {
|
||||
position: sticky;
|
||||
overflow-y: auto;
|
||||
top: 24px;
|
||||
max-height: calc(100vh - 24px);
|
||||
}
|
||||
.toc ul {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
}
|
||||
.toc li {
|
||||
padding-left: 0;
|
||||
margin: 3px 0px;
|
||||
font-size: 1em;
|
||||
}
|
||||
.toc li > a {
|
||||
color: #999;
|
||||
text-decoration: none;
|
||||
}
|
||||
.toc li > ul {
|
||||
/*display: none;*/
|
||||
}
|
||||
.toc > ul > li.active:not(.active ~ .active) > a {
|
||||
color: #333;
|
||||
text-decoration: none;
|
||||
}
|
||||
.toc > ul > li.active:not(.active ~ .active) > ul {
|
||||
display: block;
|
||||
}
|
||||
.toc > ul > li.active:not(.active ~ .active) > ul > li.active:not(.active ~ .active) > a {
|
||||
color: #333;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
h3 { margin-top: 14px }
|
||||
.use-case-column { width: 100px; }
|
||||
}
|
||||
.subtoc {
|
||||
margin-left: 12px;
|
||||
}
|
||||
|
||||
.subtoc li {
|
||||
font-size: 0.85em;
|
||||
}
|
||||
|
||||
.fixed-layout {
|
||||
table-layout: fixed;
|
||||
}
|
||||
|
||||
.use-case-column {
|
||||
width: 250px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 800px) {
|
||||
.use-case-column {
|
||||
width: 100px;
|
||||
}
|
||||
}
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
/* border: 1px solid #f9f9f9; */
|
||||
}
|
||||
table tbody:nth-of-type(odd) {
|
||||
background-color: #f6f8fa;
|
||||
}
|
||||
table tbody:nth-of-type(even) {
|
||||
background-color: #FFF;
|
||||
}
|
||||
table th {
|
||||
padding: 6px 18px 6px 6px;
|
||||
border: 1px solid #CCC;
|
||||
text-align: left;
|
||||
font-size: 0.8em;
|
||||
white-space: nowrap;
|
||||
color: #000;
|
||||
}
|
||||
table td {
|
||||
padding: 6px 6px;
|
||||
border: 1px solid #CCC;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
|
|
|||
3
styles/index.scss
Normal file
3
styles/index.scss
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
@import "page";
|
||||
@import "toc";
|
||||
@import "table";
|
||||
131
styles/page.scss
Normal file
131
styles/page.scss
Normal file
|
|
@ -0,0 +1,131 @@
|
|||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
body {
|
||||
/*font-family: "fira sans", system-ui, Arial, Helvetica, sans-serif;*/
|
||||
font-family: system-ui, Arial, Helvetica, sans-serif;
|
||||
background-color: #FFF;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
#main-container {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
margin: 24px;
|
||||
}
|
||||
|
||||
#left-sidebar {
|
||||
width: 200px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
#content {
|
||||
max-width: 1200px;
|
||||
margin-left: 24px;
|
||||
}
|
||||
|
||||
#header {
|
||||
border-bottom: 1px solid #CCC;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background-color: #FFF;
|
||||
background-color: #fef6f1;
|
||||
|
||||
.logo {
|
||||
height: 120px;
|
||||
}
|
||||
|
||||
.page-heading-group {
|
||||
flex: 0 0 auto;
|
||||
margin-top: -6px;
|
||||
|
||||
.page-heading {
|
||||
color: #333;
|
||||
color: #4d4a45;
|
||||
font-size: 3rem;
|
||||
font-weight: normal;
|
||||
margin: 0;
|
||||
}
|
||||
.page-subheading {
|
||||
font-size: 1.5rem;
|
||||
font-weight: normal;
|
||||
margin: 0;
|
||||
color: #666;
|
||||
color: #77482d;
|
||||
color: #644735;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
.full-width {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.hflex {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: stretch;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
p.introduction {
|
||||
color: #494949;
|
||||
}
|
||||
|
||||
p, li {
|
||||
color: #000;
|
||||
line-height: 1.35;
|
||||
}
|
||||
|
||||
#content ul {
|
||||
max-width: 800px;
|
||||
padding-left: 48px;
|
||||
}
|
||||
|
||||
#content li {
|
||||
margin-bottom: 12px;
|
||||
padding-left: 12px;
|
||||
}
|
||||
|
||||
section {
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 1.8em;
|
||||
font-weight: normal;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
h4 {
|
||||
font-size: 1.4em;
|
||||
font-weight: normal;
|
||||
margin-bottom: 0;
|
||||
margin-top: 0;
|
||||
}
|
||||
p.group-description {
|
||||
color: #494949;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
a, a:hover, a:visited, a:active {
|
||||
color: #3298dc
|
||||
}
|
||||
|
||||
|
||||
@media screen and (max-width: 800px) {
|
||||
#main-container { margin: 0 12px; }
|
||||
#left-sidebar { display: none; }
|
||||
#content { margin-left: 0; }
|
||||
|
||||
.logo { height: 70px }
|
||||
.page-heading { font-size: 2rem }
|
||||
.page-subheading { font-size: 1rem }
|
||||
|
||||
h3 { margin-top: 14px }
|
||||
}
|
||||
40
styles/table.scss
Normal file
40
styles/table.scss
Normal file
|
|
@ -0,0 +1,40 @@
|
|||
.fixed-layout {
|
||||
table-layout: fixed;
|
||||
}
|
||||
|
||||
.use-case-column {
|
||||
width: 250px;
|
||||
}
|
||||
@media screen and (max-width: 800px) {
|
||||
.use-case-column { width: 100px; }
|
||||
}
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
/* border: 1px solid #f9f9f9; */
|
||||
|
||||
// Zebra striping
|
||||
tbody:nth-of-type(odd) { background-color: #f6f8fa; }
|
||||
tbody:nth-of-type(even) { background-color: #FFF; }
|
||||
|
||||
th {
|
||||
padding: 6px 18px 6px 6px;
|
||||
border: 1px solid #CCC;
|
||||
text-align: left;
|
||||
font-size: 0.8em;
|
||||
white-space: nowrap;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
td {
|
||||
padding: 6px 6px;
|
||||
border: 1px solid #CCC;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
48
styles/toc.scss
Normal file
48
styles/toc.scss
Normal file
|
|
@ -0,0 +1,48 @@
|
|||
.toc {
|
||||
position: sticky;
|
||||
overflow-y: auto;
|
||||
top: 24px;
|
||||
max-height: calc(100vh - 24px);
|
||||
|
||||
ul {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
li {
|
||||
padding-left: 0;
|
||||
margin: 3px 0px;
|
||||
font-size: 1em;
|
||||
> a {
|
||||
color: #999;
|
||||
text-decoration: none;
|
||||
}
|
||||
> ul {
|
||||
/*display: none;*/
|
||||
}
|
||||
}
|
||||
|
||||
> ul > li.active:not(.active ~ .active) {
|
||||
> a {
|
||||
color: #333;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
// Sub-lists
|
||||
> ul {
|
||||
display: block;
|
||||
|
||||
> li.active:not(.active ~ .active) > a {
|
||||
color: #333;
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.subtoc {
|
||||
margin-left: 12px;
|
||||
}
|
||||
.subtoc li {
|
||||
font-size: 0.85em;
|
||||
}
|
||||
Loading…
Reference in a new issue