order css source alphabetically

This commit is contained in:
Johannes Rappen 2017-03-09 22:22:35 +01:00
parent 0b1fc2343f
commit 262bf13964
5 changed files with 149 additions and 150 deletions

View File

@ -11,16 +11,16 @@ section.cover {
}
&.has-mask .mask {
position: absolute;
size: 100%;
background-color: $color-bg;
opacity: .8;
position: absolute;
size: 100%;
}
.cover-main {
flex: 1;
text-align: center;
margin: -20px 16px 0;
text-align: center;
z-index: 1;
}
@ -34,65 +34,65 @@ section.cover {
}
p {
margin: 1em 0;
line-height: 1.5rem;
margin: 1em 0;
}
h1 {
text-align: center;
font-size: 2.5rem;
position: relative;
margin: .625rem 0 2.5rem;
font-weight: 300;
color: inherit;
font-size: 2.5rem;
font-weight: 300;
margin: .625rem 0 2.5rem;
position: relative;
text-align: center;
a {
display: block;
}
small {
position: absolute;
bottom: -.4375rem;
font-size: 1rem;
position: absolute;
}
}
blockquote {
text-align: center;
font-size: 1.5rem;
text-align: center;
}
ul {
max-width: 500px;
line-height: 1.8;
list-style-type: none;
margin: 1em auto;
max-width: 500px;
padding: 0;
line-height: 1.8;
}
.cover-main > p:last-child a {
border-radius: 2em;
border-width: 1px;
border-style: solid;
border-color: var(--theme-color, $color-primary);
border-radius: 2em;
border-style: solid;
border-width: 1px;
box-sizing: border-box;
color: var(--theme-color, $color-primary);
display: inline-block;
font-size: 1.05em;
letter-spacing: 0.1em;
margin-right: 1em;
padding: 0.75em 2em;
text-decoration: none;
transition: all 0.15s ease;
margin-right: 1em;
display: inline-block;
&:last-child {
margin-right: 0;
background-color: var(--theme-color, $color-primary);
color: #fff;
margin-right: 0;
&:hover {
opacity: .8;
color: inherit;
opacity: .8;
}
}

View File

@ -1,10 +1,10 @@
* {
box-sizing: border-box;
-webkit-font-smoothing: antialiased;
-webkit-overflow-scrolling: touch;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-webkit-text-size-adjust: none;
-webkit-touch-callout: none;
-webkit-font-smoothing: antialiased;
box-sizing: border-box;
}
body:not(.ready) {
@ -16,10 +16,10 @@ body:not(.ready) {
}
div#app {
text-align: center;
font-size: 30px;
font-weight: lighter;
margin: 40vh auto;
text-align: center;
&:empty::before {
content: "Loading...";
@ -59,12 +59,12 @@ html, body {
body {
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
color: $color-text;
font-family: 'Source Sans Pro', 'Helvetica Neue', Arial, sans-serif;
font-size: 15px;
letter-spacing: 0;
margin: 0;
overflow-x: hidden;
color: $color-text;
}
img {
@ -72,24 +72,24 @@ img {
}
kbd {
display: inline-block;
padding: 3px 5px;
margin-bottom : 3px;
font-size: 12px !important;
line-height: 12px;
vertical-align: middle;
border: solid 1px #ccc;
border-radius: 3px;
display: inline-block;
font-size: 12px !important;
line-height: 12px;
margin-bottom : 3px;
padding: 3px 5px;
vertical-align: middle;
}
/* navbar */
nav.app-nav {
left: 0;
margin: 25px 60px 0 0;
position: absolute;
right: 0;
left: 0;
z-index: 10;
margin: 25px 60px 0 0;
text-align: right;
z-index: 10;
&.no-badge {
margin-right: 25px;
@ -105,15 +105,15 @@ nav.app-nav {
}
ul, li {
list-style: none;
display: inline-block;
list-style: none;
margin: 0;
}
a {
color: inherit;
font-size: 16px;
text-decoration: none;
color: inherit;
transition: color .3s;
&:hover {
@ -121,41 +121,41 @@ nav.app-nav {
}
&.active {
color: var(--theme-color, $color-primary);
border-bottom: 2px solid var(--theme-color, $color-primary);
color: var(--theme-color, $color-primary);
}
}
/* navbar dropdown */
li {
position: relative;
display: inline-block;
margin: 0 1em;
padding: 5px 0;
position: relative;
ul {
display: none;
box-sizing: border-box;
max-height: calc(100vh - 61px);
overflow-y: scroll;
position: absolute;
top: 100%;
right: -15px;
background-color: #fff;
padding: 10px 0;
border: 1px solid #ddd;
border-bottom-color: #ccc;
text-align: left;
border-radius: 4px;
box-sizing: border-box;
display: none;
max-height: calc(100vh - 61px);
overflow-y: scroll;
padding: 10px 0;
position: absolute;
right: -15px;
text-align: left;
top: 100%;
white-space: nowrap;
li {
display: block;
font-size: 14px;
line-height: 1em;
margin: 0;
margin: 8px 14px;
white-space: nowrap;
line-height: 1em;
}
a {
@ -178,12 +178,12 @@ nav.app-nav {
/* github corner */
.github-corner {
position: fixed;
top: 0;
right: 0;
z-index: 1;
text-decoration: none;
border-bottom: 0;
position: fixed;
right: 0;
text-decoration: none;
top: 0;
z-index: 1;
&:hover .octo-arm {
animation:octocat-wave 560ms ease-in-out;
@ -191,23 +191,23 @@ nav.app-nav {
svg {
color: $color-bg;
fill: var(--theme-color, $color-primary);
height: 80px;
width: 80px;
fill: var(--theme-color, $color-primary);
}
}
/* main */
main {
display: block;
size: 100vw 100%;
position: relative;
size: 100vw 100%;
}
.anchor {
display: inline-block;
text-decoration: none;
transition: all .3s;
display: inline-block;
span {
color: $color-text;
@ -220,19 +220,19 @@ main {
/* sidebar */
.sidebar {
border-right: 1px solid rgba(0, 0, 0, .07);
overflow-y: auto;
padding: 40px 0;
position: absolute 0 * 0 0;
transition: transform 250ms ease-out;
width: $sidebar-width;
z-index: 20;
border-right: 1px solid rgba(0, 0, 0, .07);
> h1 {
text-align: center;
margin: 0 auto 1em;
font-size: 1.5em;
font-weight: 300;
text-align: center;
a {
color: inherit;
@ -255,8 +255,8 @@ main {
}
ul li a {
display: block;
border-bottom: none;
display: block;
}
ul li ul {
@ -284,17 +284,17 @@ main {
/* sidebar toggle */
.sidebar-toggle {
background-color: transparent;
background-color: rgba($color-bg, .8);
border: 0;
outline: none;
outline: none;
padding: 10px;
position: absolute * * 0 0;
text-align: center;
transition: opacity .3s;
width: 30px;
z-index: 30;
outline: none;
width: calc($sidebar-width - 16px);
padding: 10px;
background-color: rgba($color-bg, .8);
z-index: 30;
.sidebar-toggle-button:hover {
opacity: .4;
@ -303,8 +303,8 @@ main {
span {
background-color: var(--theme-color, $color-primary);
display: block;
size: 16px 2px;
margin-bottom: 4px;
size: 16px 2px;
}
}
@ -316,17 +316,17 @@ body.sticky {
/* main content */
.content {
position: absolute 0 0 0 $sidebar-width;
padding-top: 20px;
position: absolute 0 0 0 $sidebar-width;
transition: left 250ms ease;
}
/* markdown content found on pages */
.markdown-section {
position: relative;
margin: 0 auto;
max-width: 800px;
padding: 20px 15px 40px 15px;
position: relative;
> * {
box-sizing: border-box;
@ -340,28 +340,28 @@ body.sticky {
.markdown-section hr {
border: none;
margin: 2em 0;
border-bottom: 1px solid #eee;
margin: 2em 0;
}
.markdown-section table {
display: block;
width: 100%;
overflow: auto;
border-spacing: 0;
border-collapse: collapse;
border-spacing: 0;
display: block;
margin-bottom: 1em;
overflow: auto;
width: 100%;
}
.markdown-section th {
border: 1px solid #ddd;
font-weight: bold;
padding: 6px 13px;
border: 1px solid #ddd;
}
.markdown-section td {
padding: 6px 13px;
border: 1px solid #ddd;
padding: 6px 13px;
}
.markdown-section tr {
@ -372,28 +372,28 @@ body.sticky {
}
.markdown-section p.tip {
padding: 12px 24px 12px 30px;
margin: 2em 0;
border-left: 4px solid #f66;
background-color: #f8f8f8;
position: relative;
border-bottom-right-radius: 2px;
border-left: 4px solid #f66;
border-top-right-radius: 2px;
margin: 2em 0;
padding: 12px 24px 12px 30px;
position: relative;
&:before {
position: absolute;
top: 14px;
left: -12px;
background-color: #f66;
border-radius: 100%;
color: $color-bg;
content: "!";
size: 20px;
border-radius: 100%;
text-align: center;
line-height: 20px;
font-weight: bold;
font-family: 'Dosis', 'Source Sans Pro', 'Helvetica Neue', Arial, sans-serif;
font-size: 14px;
font-weight: bold;
left: -12px;
line-height: 20px;
position: absolute;
size: 20px;
text-align: center;
top: 14px;
}
code {
@ -406,9 +406,9 @@ body.sticky {
}
.markdown-section p.warn {
padding: 1em;
background: rgba($color-primary, 0.1);
border-radius: 2px;
padding: 1em;
}
body.close {
@ -460,8 +460,8 @@ body.close {
}
.sidebar-toggle {
width: auto;
background-color: transparent;
width: auto;
}
body.close {
@ -470,9 +470,9 @@ body.close {
}
.sidebar-toggle {
width: calc($sidebar-width - 16px);
background-color: rgba($color-bg, .8);
transition: 1s background-color;
width: calc($sidebar-width - 16px);
}
.content {

View File

@ -20,8 +20,8 @@ $sidebar-width: 16em;
li {
list-style: none;
padding: 0.2em 0 0.2em 1em;
margin: 0;
padding: 0.2em 0 0.2em 1em;
}
ul li ul {
@ -29,11 +29,11 @@ $sidebar-width: 16em;
}
li.active {
background-color: #eee;
a {
color: #333;
}
background-color: #eee;
}
}
@ -42,8 +42,8 @@ $sidebar-width: 16em;
.markdown-section h3,
.markdown-section h4,
.markdown-section strong {
font-weight: 400;
color: #333;
font-weight: 400;
}
.markdown-section a {
@ -54,30 +54,29 @@ $sidebar-width: 16em;
.markdown-section p,
.markdown-section ul,
.markdown-section ol {
word-spacing: 0.05em;
line-height: 1.6em;
margin: 0 0 1em 0;
word-spacing: 0.05em;
}
.markdown-section h1 {
margin: 0 0 1em;
font-size: 2em;
font-weight: 500;
margin: 0 0 1em;
}
.markdown-section h2 {
padding: 1rem 0 0 0;
margin: 0 0 1rem 0;
font-size: 1.8em;
font-weight: 400;
margin: 0 0 1rem 0;
padding: 1rem 0 0 0;
}
.markdown-section h3 {
margin: 52px 0 1.2em;
font-size: 1.5em;
margin: 52px 0 1.2em;
}
.markdown-section h4 {
font-size: 1.25em;
}
@ -87,8 +86,8 @@ $sidebar-width: 16em;
}
.markdown-section h6 {
font-size: 1em;
color: #777;
font-size: 1em;
}
.markdown-section figure,
@ -104,13 +103,13 @@ $sidebar-width: 16em;
}
.markdown-section li {
margin: 0;
line-height: 1.5;
margin: 0;
}
.markdown-section blockquote {
color: #858585;
border-left: 4px solid var(--theme-color, $color-primary);
color: #858585;
margin: 2em 0;
padding-left: 20px;
}
@ -130,29 +129,29 @@ $sidebar-width: 16em;
.markdown-section code {
background-color: #f9f9f9;
padding: 0.2em 0.4em;
border-radius: 3px;
white-space: pre;
font-family: Inconsolata;
padding: 0.2em 0.4em;
white-space: pre;
}
.markdown-section pre {
background-color: #f9f9f9;
border-left: 2px solid #eee;
padding: 8px;
margin: 0 0 1em 0;
font-family: Inconsolata;
padding: 0 10px 12px 0;
font-size: 16px;
margin: 0 0 1em 0;
padding: 8px;
padding: 0 10px 12px 0;
overflow: auto;
word-wrap: normal;
}
/* code highlight */
.token.cdata,
.token.comment,
.token.prolog,
.token.doctype,
.token.cdata {
.token.prolog {
color: #93a1a1; /* base1 */
}
@ -218,15 +217,15 @@ $sidebar-width: 16em;
}
.markdown-section pre>code {
background-color: #f8f8f8;
border-radius: 2px;
display: block;
font-family: Inconsolata;
overflow: inherit;
max-width: inherit;
position: relative;
background-color: #f8f8f8;
padding: 20px 0.8em 20px;
line-height: 1.1em;
border-radius: 2px;
max-width: inherit;
overflow: inherit;
padding: 20px 0.8em 20px;
position: relative;
}
.markdown-section code::after, .markdown-section code::before {
@ -234,7 +233,7 @@ $sidebar-width: 16em;
}
code .token {
min-height: 1.5em;
-webkit-font-smoothing: initial;
-moz-osx-font-smoothing: initial;
min-height: 1.5em;
}

View File

@ -14,8 +14,8 @@ body {
/* sidebar */
.sidebar {
color: #c8c8c8;
background-color: $color-bg;
color: #c8c8c8;
li {
margin: 6px 15px;
@ -23,11 +23,11 @@ body {
ul li a {
color: #c8c8c8;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
text-decoration: none;
font-size: 14px;
overflow: hidden;
text-decoration: none;
text-overflow: ellipsis;
white-space: nowrap;
&:hover {
text-decoration: underline;
@ -50,8 +50,8 @@ body {
.markdown-section h3,
.markdown-section h4,
.markdown-section strong {
font-weight: 600;
color: #2c3e50;
font-weight: 600;
}
.markdown-section a {
@ -60,8 +60,8 @@ body {
}
.markdown-section h1 {
margin: 0 0 1em;
font-size: 2em;
margin: 0 0 1em;
}
.markdown-section h2 {
@ -70,8 +70,8 @@ body {
}
.markdown-section h3 {
margin: 40px 0 .6em;
font-size: 1.5em;
margin: 40px 0 .6em;
}
.markdown-section h4 {
@ -83,8 +83,8 @@ body {
}
.markdown-section h6 {
font-size: 1em;
color: #777;
font-size: 1em;
}
.markdown-section figure,
@ -107,8 +107,8 @@ body {
}
.markdown-section blockquote {
color: #858585;
border-left: 4px solid var(--theme-color, $color-primary);
color: #858585;
margin: 2em 0;
padding-left: 20px;
}
@ -127,14 +127,14 @@ body {
}
.markdown-section code {
background-color: #282828;
border-radius: 2px;
color: #657b83;
font-family: 'Roboto Mono', Monaco, courier, monospace;
font-size: 0.8em;
margin: 0 2px;
padding: 3px 5px;
white-space: nowrap;
font-size: 0.8em;
font-family: 'Roboto Mono', Monaco, courier, monospace;
background-color: #282828;
}
.markdown-section pre {
@ -144,9 +144,9 @@ body {
font-family: 'Roboto Mono', Monaco, courier, monospace;
line-height: 1.5em;
margin: 1.2em 0;
overflow: auto;
padding: 0 1.4em;
position: relative;
overflow: auto;
word-wrap: normal;
}
@ -257,10 +257,10 @@ body {
font-size: 0.8em;
line-height: inherit;
margin: 0 2px;
max-width: inherit;
overflow: inherit;
padding: 2.2em 5px;
white-space: inherit;
max-width: inherit;
}
.markdown-section code::after, .markdown-section code::before {
@ -268,9 +268,9 @@ body {
}
code .token {
min-height: 1.5em;
-webkit-font-smoothing: initial;
-moz-osx-font-smoothing: initial;
-webkit-font-smoothing: initial;
min-height: 1.5em;
}
pre::after {
@ -293,7 +293,7 @@ pre::after {
}
input[type="search"] {
border-color: #4f4f4f;
background: #4f4f4f;
border-color: #4f4f4f;
color: #c8c8c8;
}

View File

@ -14,8 +14,8 @@ body {
/* sidebar */
.sidebar {
color: #364149;
background-color: $color-bg;
color: #364149;
li {
margin: 6px 0 6px 15px;
@ -23,12 +23,12 @@ body {
ul li a {
color: #505d6b;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
text-decoration: none;
font-size: 14px;
font-weight: normal;
overflow: hidden;
text-decoration: none;
text-overflow: ellipsis;
white-space: nowrap;
&:hover {
text-decoration: underline;
@ -40,9 +40,9 @@ body {
}
ul li.active>a {
border-right: 2px solid;
color: var(--theme-color, $color-primary);
font-weight: 600;
border-right: 2px solid;
}
}
@ -61,8 +61,8 @@ body {
.markdown-section h3,
.markdown-section h4,
.markdown-section strong {
font-weight: 600;
color: #2c3e50;
font-weight: 600;
}
.markdown-section a {
@ -71,8 +71,8 @@ body {
}
.markdown-section h1 {
margin: 0 0 1em;
font-size: 2em;
margin: 0 0 1em;
}
.markdown-section h2 {
@ -81,8 +81,8 @@ body {
}
.markdown-section h3 {
margin: 40px 0 .6em;
font-size: 1.5em;
margin: 40px 0 .6em;
}
.markdown-section h4 {
@ -94,8 +94,8 @@ body {
}
.markdown-section h6 {
font-size: 1em;
color: #777;
font-size: 1em;
}
.markdown-section figure,
@ -118,8 +118,8 @@ body {
}
.markdown-section blockquote {
color: #858585;
border-left: 4px solid var(--theme-color, $color-primary);
color: #858585;
margin: 2em 0;
padding-left: 20px;
}
@ -138,14 +138,14 @@ body {
}
.markdown-section code {
background-color: #f8f8f8;
border-radius: 2px;
color: #e96900;
font-family: 'Roboto Mono', Monaco, courier, monospace;
font-size: 0.8em;
margin: 0 2px;
padding: 3px 5px;
white-space: nowrap;
font-size: 0.8em;
font-family: 'Roboto Mono', Monaco, courier, monospace;
background-color: #f8f8f8;
}
.markdown-section pre {
@ -155,9 +155,9 @@ body {
font-family: 'Roboto Mono', Monaco, courier, monospace;
line-height: 1.5em;
margin: 1.2em 0;
overflow: auto;
padding: 0 1.4em;
position: relative;
overflow: auto;
word-wrap: normal;
}
@ -268,10 +268,10 @@ body {
font-size: 0.8em;
line-height: inherit;
margin: 0 2px;
max-width: inherit;
overflow: inherit;
padding: 2.2em 5px;
white-space: inherit;
max-width: inherit;
}
.markdown-section code::after, .markdown-section code::before {
@ -279,9 +279,9 @@ body {
}
code .token {
min-height: 1.5em;
-webkit-font-smoothing: initial;
-moz-osx-font-smoothing: initial;
-webkit-font-smoothing: initial;
min-height: 1.5em;
}
pre::after {