mirror of
https://github.com/bigchaindb/site.git
synced 2024-11-22 01:36:55 +01:00
many readability improvements
* tweak visual hierarchy & spacing * tweak TOC * tweak code styles * new default syntax theme
This commit is contained in:
parent
4fe14e94fd
commit
0d4fb77be5
@ -16,16 +16,21 @@
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: $font-size-h2;
|
||||
font-size: $font-size-h3;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: $font-size-h3;
|
||||
margin-left: -1.25rem;
|
||||
font-size: $font-size-h4;
|
||||
margin-bottom: ($spacer * 2);
|
||||
margin-top: ($spacer * 2);
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: $font-size-h4;
|
||||
font-size: $font-size-base;
|
||||
font-weight: $font-weight-bold;
|
||||
color: #fff;
|
||||
margin-bottom: $spacer;
|
||||
margin-top: ($spacer * 2);
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -76,34 +81,29 @@ h1.guide__title {
|
||||
border-radius: $border-radius;
|
||||
}
|
||||
|
||||
.toc-entry {
|
||||
|
||||
}
|
||||
|
||||
li.toc-h1 {
|
||||
margin-bottom: $spacer / 2;
|
||||
|
||||
// custom numbers
|
||||
&:before {
|
||||
font-size: $font-size-h5;
|
||||
opacity: .5;
|
||||
font-size: $font-size-base;
|
||||
opacity: .6;
|
||||
color: $brand-primary;
|
||||
}
|
||||
|
||||
a {
|
||||
@extend .h5;
|
||||
font-size: $font-size-base;
|
||||
margin: 0;
|
||||
box-shadow: none;
|
||||
color: $brand-primary;
|
||||
}
|
||||
|
||||
ul {
|
||||
padding-left: $spacer * 3;
|
||||
padding-left: $spacer * 2.6;
|
||||
}
|
||||
}
|
||||
|
||||
li.toc-h2 {
|
||||
a {
|
||||
font-size: $font-size-base;
|
||||
font-size: $font-size-sm;
|
||||
color: $text-color;
|
||||
}
|
||||
}
|
||||
|
@ -8,7 +8,7 @@ kbd,
|
||||
pre,
|
||||
samp {
|
||||
font-family: $font-family-monospace;
|
||||
font-size: .75rem;
|
||||
font-size: .7rem;
|
||||
hyphens: none;
|
||||
}
|
||||
|
||||
@ -39,7 +39,7 @@ kbd {
|
||||
// Blocks of code
|
||||
pre {
|
||||
display: block;
|
||||
padding: 1em;
|
||||
padding: $spacer / 1.5;
|
||||
margin: 0 0 $spacer;
|
||||
line-height: $line-height;
|
||||
word-break: break-all;
|
||||
|
@ -10,10 +10,11 @@
|
||||
> h1,
|
||||
h2,
|
||||
.faq__question {
|
||||
border-bottom: 1px solid $brand-main-blue-light;
|
||||
border-bottom: 2px solid $brand-main-blue-light;
|
||||
padding-bottom: $spacer;
|
||||
margin-bottom: ($spacer * 2);
|
||||
text-align: center;
|
||||
margin-top: ($spacer * 3);
|
||||
position: relative;
|
||||
|
||||
&:hover {
|
||||
.header-link {
|
||||
@ -26,10 +27,13 @@
|
||||
.header-link {
|
||||
box-shadow: none;
|
||||
transition-timing-function: $timing-bounce;
|
||||
display: inline-block;
|
||||
display: block;
|
||||
padding: 0 .25rem;
|
||||
opacity: 0;
|
||||
transform: translate3d(20px, 0, 0) scale(0);
|
||||
position: absolute;
|
||||
left: -1.15rem;
|
||||
top: 0;
|
||||
|
||||
&,
|
||||
.header-icon {
|
||||
|
@ -1,295 +1,12 @@
|
||||
|
||||
// https://github.com/richleland/pygments-css/blob/master/zenburn.css
|
||||
// https://github.com/mgyongyosi/OneDarkJekyll/blob/master/syntax-one-dark.css
|
||||
|
||||
/* stylelint-disable */
|
||||
.highlight pre {
|
||||
color: #fdce93;
|
||||
color: $code-color;
|
||||
background-color: $code-bg;
|
||||
}
|
||||
|
||||
.highlight .hll {
|
||||
background-color: #222;
|
||||
}
|
||||
|
||||
.highlight .c {
|
||||
color: #7f9f7f;
|
||||
}
|
||||
|
||||
.highlight .err {
|
||||
color: #e37170;
|
||||
background-color: #3d3535;
|
||||
}
|
||||
|
||||
.highlight .g {
|
||||
color: #7f9f7f;
|
||||
}
|
||||
|
||||
.highlight .k {
|
||||
color: #f0dfaf;
|
||||
}
|
||||
|
||||
.highlight .l {
|
||||
color: $code-color;
|
||||
}
|
||||
|
||||
.highlight .n {
|
||||
color: #dcdccc;
|
||||
}
|
||||
|
||||
.highlight .o {
|
||||
color: #f0efd0;
|
||||
}
|
||||
|
||||
.highlight .x {
|
||||
color: $code-color;
|
||||
}
|
||||
|
||||
.highlight .p {
|
||||
color: #41706f;
|
||||
}
|
||||
|
||||
.highlight .cm {
|
||||
color: #7f9f7f;
|
||||
}
|
||||
|
||||
.highlight .cp {
|
||||
color: #7f9f7f;
|
||||
}
|
||||
|
||||
.highlight .c1 {
|
||||
color: #7f9f7f;
|
||||
}
|
||||
|
||||
.highlight .cs {
|
||||
color: #cd0000;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.highlight .gd {
|
||||
color: #cd0000;
|
||||
}
|
||||
|
||||
.highlight .ge {
|
||||
color: $code-color;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.highlight .gr {
|
||||
color: red;
|
||||
}
|
||||
|
||||
.highlight .gh {
|
||||
color: #dcdccc;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.highlight .gi {
|
||||
color: #00cd00;
|
||||
}
|
||||
|
||||
.highlight .go {
|
||||
color: gray;
|
||||
}
|
||||
|
||||
.highlight .gp {
|
||||
color: #dcdccc;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.highlight .gs {
|
||||
color: $code-color;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.highlight .gu {
|
||||
color: purple;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.highlight .gt {
|
||||
color: #0040D0;
|
||||
}
|
||||
|
||||
.highlight .kc {
|
||||
color: #dca3a3;
|
||||
}
|
||||
|
||||
.highlight .kd {
|
||||
color: #ffff86;
|
||||
}
|
||||
|
||||
.highlight .kn {
|
||||
color: #dfaf8f;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.highlight .kp {
|
||||
color: #cdcf99;
|
||||
}
|
||||
|
||||
.highlight .kr {
|
||||
color: #cdcd00;
|
||||
}
|
||||
|
||||
.highlight .kt {
|
||||
color: #00cd00;
|
||||
}
|
||||
|
||||
.highlight .ld {
|
||||
color: #cc9393;
|
||||
}
|
||||
|
||||
.highlight .m {
|
||||
color: #8cd0d3;
|
||||
}
|
||||
|
||||
.highlight .s {
|
||||
color: #cc9393;
|
||||
}
|
||||
|
||||
.highlight .na {
|
||||
color: #9ac39f;
|
||||
}
|
||||
|
||||
.highlight .nb {
|
||||
color: #efef8f;
|
||||
}
|
||||
|
||||
.highlight .nc {
|
||||
color: #efef8f;
|
||||
}
|
||||
|
||||
.highlight .no {
|
||||
color: $code-color;
|
||||
}
|
||||
|
||||
.highlight .nd {
|
||||
color: $code-color;
|
||||
}
|
||||
|
||||
.highlight .ni {
|
||||
color: #c28182;
|
||||
}
|
||||
|
||||
.highlight .ne {
|
||||
color: #c3bf9f;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.highlight .nf {
|
||||
color: #efef8f;
|
||||
}
|
||||
|
||||
.highlight .nl {
|
||||
color: $code-color;
|
||||
}
|
||||
|
||||
.highlight .nn {
|
||||
color: #8fbede;
|
||||
}
|
||||
|
||||
.highlight .nx {
|
||||
color: $code-color;
|
||||
}
|
||||
|
||||
.highlight .py {
|
||||
color: $code-color;
|
||||
}
|
||||
|
||||
.highlight .nt {
|
||||
color: #9ac39f;
|
||||
}
|
||||
|
||||
.highlight .nv {
|
||||
color: #dcdccc;
|
||||
}
|
||||
|
||||
.highlight .ow {
|
||||
color: #f0efd0;
|
||||
}
|
||||
|
||||
.highlight .w {
|
||||
color: $code-color;
|
||||
}
|
||||
|
||||
.highlight .mf {
|
||||
color: #8cd0d3;
|
||||
}
|
||||
|
||||
.highlight .mh {
|
||||
color: #8cd0d3;
|
||||
}
|
||||
|
||||
.highlight .mi {
|
||||
color: #8cd0d3;
|
||||
}
|
||||
|
||||
.highlight .mo {
|
||||
color: #8cd0d3;
|
||||
}
|
||||
|
||||
.highlight .sb {
|
||||
color: #cc9393;
|
||||
}
|
||||
|
||||
.highlight .sc {
|
||||
color: #cc9393;
|
||||
}
|
||||
|
||||
.highlight .sd {
|
||||
color: #cc9393;
|
||||
}
|
||||
|
||||
.highlight .s2 {
|
||||
color: #cc9393;
|
||||
}
|
||||
|
||||
.highlight .se {
|
||||
color: #cc9393;
|
||||
}
|
||||
|
||||
.highlight .sh {
|
||||
color: #cc9393;
|
||||
}
|
||||
|
||||
.highlight .si {
|
||||
color: #cc9393;
|
||||
}
|
||||
|
||||
.highlight .sx {
|
||||
color: #cc9393;
|
||||
}
|
||||
|
||||
.highlight .sr {
|
||||
color: #cc9393;
|
||||
}
|
||||
|
||||
.highlight .s1 {
|
||||
color: #cc9393;
|
||||
}
|
||||
|
||||
.highlight .ss {
|
||||
color: #cc9393;
|
||||
}
|
||||
|
||||
.highlight .bp {
|
||||
color: #efef8f;
|
||||
}
|
||||
|
||||
.highlight .vc {
|
||||
color: #efef8f;
|
||||
}
|
||||
|
||||
.highlight .vg {
|
||||
color: #dcdccc;
|
||||
}
|
||||
|
||||
.highlight .vi {
|
||||
color: #ffffc7;
|
||||
}
|
||||
|
||||
.highlight .il {
|
||||
color: #8cd0d3;
|
||||
}
|
||||
.highlight .hll{background:#282c34}.highlight .c{color:#5c6370;font-style:italic}.highlight .err{color:#960050;background-color:#1e0010}.highlight .k{color:#c678dd}.highlight .l{color:#98c379}.highlight .n{color:#abb2bf}.highlight .o{color:#abb2bf}.highlight .p{color:#abb2bf}.highlight .cm{color:#5c6370;font-style:italic}.highlight .cp{color:#5c6370;font-style:italic}.highlight .c1{color:#5c6370;font-style:italic}.highlight .cs{color:#5c6370;font-style:italic}.highlight .ge{font-style:italic}.highlight .gs{font-weight:700}.highlight .kc{color:#c678dd}.highlight .kd{color:#c678dd}.highlight .kn{color:#c678dd}.highlight .kp{color:#c678dd}.highlight .kr{color:#c678dd}.highlight .kt{color:#c678dd}.highlight .ld{color:#98c379}.highlight .m{color:#d19a66}.highlight .s{color:#98c379}.highlight .na{color:#d19a66}.highlight .nb{color:#e5c07b}.highlight .nc{color:#e5c07b}.highlight .no{color:#e5c07b}.highlight .nd{color:#e5c07b}.highlight .ni{color:#e5c07b}.highlight .ne{color:#e5c07b}.highlight .nf{color:#abb2bf}.highlight .nl{color:#e5c07b}.highlight .nn{color:#abb2bf}.highlight .nx{color:#abb2bf}.highlight .py{color:#e5c07b}.highlight .nt{color:#e06c75}.highlight .nv{color:#e5c07b}.highlight .ow{font-weight:700}.highlight .w{color:#f8f8f2}.highlight .mf{color:#d19a66}.highlight .mh{color:#d19a66}.highlight .mi{color:#d19a66}.highlight .mo{color:#d19a66}.highlight .sb{color:#98c379}.highlight .sc{color:#98c379}.highlight .sd{color:#98c379}.highlight .s2{color:#98c379}.highlight .se{color:#98c379}.highlight .sh{color:#98c379}.highlight .si{color:#98c379}.highlight .sx{color:#98c379}.highlight .sr{color:#56b6c2}.highlight .s1{color:#98c379}.highlight .ss{color:#56b6c2}.highlight .bp{color:#e5c07b}.highlight .vc{color:#e5c07b}.highlight .vg{color:#e5c07b}.highlight .vi{color:#e06c75}.highlight .il{color:#d19a66}.highlight .gu{color:#75715e}.highlight .gd{color:#f92672}.highlight .gi{color:#a6e22e}
|
||||
|
||||
/* stylelint-enable */
|
||||
|
@ -9,6 +9,7 @@
|
||||
&:before {
|
||||
@extend .h5;
|
||||
content: 'Contents';
|
||||
font-size: $font-size-base;
|
||||
display: block;
|
||||
margin-top: 0;
|
||||
}
|
||||
@ -28,6 +29,8 @@
|
||||
counter-increment: item;
|
||||
margin-right: $spacer / 4;
|
||||
color: $brand-main-gray-light;
|
||||
width: 1rem;
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -113,8 +113,8 @@ $gutter-space: ($spacer * 2) !default;
|
||||
//
|
||||
// Code
|
||||
//
|
||||
$code-color: $text-color !default;
|
||||
$code-bg: $gray-dark !default;
|
||||
$code-color: $brand-main-gray-lighter !default;
|
||||
$code-bg: darken($gray-dark, 5%) !default;
|
||||
|
||||
$kbd-color: $code-color !default;
|
||||
$kbd-bg: $code-bg !default;
|
||||
|
Loading…
Reference in New Issue
Block a user