Last active
May 16, 2018 14:51
-
-
Save RyanHendricks/323ccf3964bbdf74599b7568ef18b126 to your computer and use it in GitHub Desktop.
[CSS Snippets] #css
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
@import url("https://fonts.googleapis.com/css?family=Roboto+Mono|Source+Sans+Pro:300,400,600"); | |
* { | |
-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; | |
box-sizing: border-box | |
} | |
body:not(.ready) { | |
overflow: hidden | |
} | |
body:not(.ready) .app-nav, | |
body:not(.ready)>nav, | |
body:not(.ready) [data-cloak] { | |
display: none | |
} | |
div#app { | |
font-size: 30px; | |
font-weight: lighter; | |
margin: 40vh auto; | |
text-align: center | |
} | |
div#app:empty:before { | |
content: "Loading..." | |
} | |
.emoji { | |
height: 19.2px; | |
height: 1.2rem; | |
vertical-align: middle | |
} | |
.progress { | |
background-color: #2689CC; | |
background-color: var(--theme-color, #2689CC); | |
height: 2px; | |
left: 0; | |
position: fixed; | |
right: 0; | |
top: 0; | |
transition: width .2s, opacity .4s; | |
width: 0; | |
z-index: 5 | |
} | |
.search .search-keyword, | |
.search a:hover { | |
color: #4193Cb; | |
color: var(--theme-color, #4193Cb) | |
} | |
.search .search-keyword { | |
font-style: normal | |
} | |
body, | |
html { | |
height: 100% | |
} | |
body { | |
-moz-osx-font-smoothing: grayscale; | |
-webkit-font-smoothing: antialiased; | |
color: #34495e; | |
font-family: Source Sans Pro, Helvetica Neue, Arial, sans-serif; | |
font-size: 15px; | |
letter-spacing: 0; | |
margin: 0; | |
overflow-x: hidden | |
} | |
img { | |
max-width: 100% | |
} | |
kbd { | |
border: 1px solid #ccc; | |
border-radius: 3px; | |
display: inline-block; | |
font-size: 12px!important; | |
line-height: 12px; | |
margin-bottom: 3px; | |
padding: 3px 5px; | |
vertical-align: middle | |
} | |
.app-nav { | |
left: 0; | |
margin: 25px 60px 0 0; | |
position: absolute; | |
right: 0; | |
text-align: right; | |
z-index: 2 | |
} | |
.app-nav p { | |
margin: 0 | |
} | |
.app-nav>a { | |
margin: 0 16px; | |
margin: 0 1rem; | |
padding: 5px 0 | |
} | |
.app-nav li, | |
.app-nav ul { | |
display: inline-block; | |
list-style: none; | |
margin: 0 | |
} | |
.app-nav a { | |
color: inherit; | |
font-size: 16px; | |
text-decoration: none; | |
transition: color .3s | |
} | |
.app-nav a.active, | |
.app-nav a:hover { | |
color: #4193Cb; | |
color: var(--theme-color, #4193Cb) | |
} | |
.app-nav a.active { | |
border-bottom: 2px solid #4193Cb; | |
border-bottom: 2px solid var(--theme-color, #4193Cb) | |
} | |
.app-nav li { | |
display: inline-block; | |
margin: 0 16px; | |
margin: 0 1rem; | |
padding: 5px 0; | |
position: relative | |
} | |
.app-nav li ul { | |
background-color: #fff; | |
border: 1px solid #ddd; | |
border-bottom-color: #ccc; | |
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 | |
} | |
.app-nav li ul li { | |
display: block; | |
font-size: 14px; | |
line-height: 16px; | |
line-height: 1rem; | |
margin: 0; | |
margin: 8px 14px; | |
white-space: nowrap | |
} | |
.app-nav li ul a { | |
display: block; | |
font-size: inherit; | |
margin: 0; | |
padding: 0 | |
} | |
.app-nav li ul a.active { | |
border-bottom: 0 | |
} | |
.app-nav li:hover ul { | |
display: block | |
} | |
.app-nav.no-badge { | |
margin-right: 25px | |
} | |
.github-corner { | |
border-bottom: 0; | |
position: fixed; | |
right: 0; | |
text-decoration: none; | |
top: 0; | |
z-index: 1 | |
} | |
.github-corner svg { | |
color: #fff; | |
fill: #4193Cb; | |
fill: var(--theme-color, #4193Cb); | |
height: 80px; | |
width: 80px | |
} | |
.github-corner:hover .octo-arm { | |
-webkit-animation: a .56s ease-in-out; | |
animation: a .56s ease-in-out | |
} | |
main { | |
display: block; | |
position: relative; | |
width: 100vw; | |
height: 100% | |
} | |
.anchor { | |
display: inline-block; | |
text-decoration: none; | |
transition: all .3s | |
} | |
.anchor span { | |
color: #34495e | |
} | |
.anchor:hover { | |
text-decoration: underline | |
} | |
.sidebar { | |
border-right: 1px solid rgba(0, 0, 0, .07); | |
overflow-y: auto; | |
padding: 40px 0; | |
top: 0; | |
bottom: 0; | |
left: 0; | |
position: absolute; | |
transition: -webkit-transform .25s ease-out; | |
transition: transform .25s ease-out; | |
transition: transform .25s ease-out, -webkit-transform .25s ease-out; | |
width: 300px; | |
z-index: 3 | |
} | |
.sidebar>h1 { | |
margin: 0 auto 16px; | |
margin: 0 auto 1rem; | |
font-size: 24px; | |
font-size: 1.5rem; | |
font-weight: 300; | |
text-align: center | |
} | |
.sidebar>h1 a { | |
color: inherit; | |
text-decoration: none | |
} | |
.sidebar>h1 .app-nav { | |
display: block; | |
position: static | |
} | |
.sidebar .sidebar-nav { | |
line-height: 2em | |
} | |
.sidebar ul { | |
margin: 0; | |
padding: 0 | |
} | |
.sidebar li>p { | |
font-weight: 700; | |
margin: 0 | |
} | |
.sidebar ul, | |
.sidebar ul li { | |
list-style: none | |
} | |
.sidebar ul li a { | |
border-bottom: none; | |
display: block | |
} | |
.sidebar ul li ul { | |
padding-left: 20px | |
} | |
.sidebar::-webkit-scrollbar { | |
width: 4px | |
} | |
.sidebar::-webkit-scrollbar-thumb { | |
background: transparent; | |
border-radius: 4px | |
} | |
.sidebar:hover::-webkit-scrollbar-thumb { | |
background: hsla(0, 0%, 53%, .4) | |
} | |
.sidebar:hover::-webkit-scrollbar-track { | |
background: hsla(0, 0%, 53%, .1) | |
} | |
.sidebar-toggle { | |
background-color: transparent; | |
background-color: hsla(0, 0%, 100%, .8); | |
border: 0; | |
outline: none; | |
padding: 10px; | |
bottom: 0; | |
left: 0; | |
position: absolute; | |
text-align: center; | |
transition: opacity .3s; | |
width: 30px; | |
width: 284px; | |
z-index: 4 | |
} | |
.sidebar-toggle .sidebar-toggle-button:hover { | |
opacity: .4 | |
} | |
.sidebar-toggle span { | |
background-color: #4193Cb; | |
background-color: var(--theme-color, #4193Cb); | |
display: block; | |
margin-bottom: 4px; | |
width: 16px; | |
height: 2px | |
} | |
body.sticky .sidebar, | |
body.sticky .sidebar-toggle { | |
position: fixed | |
} | |
.content { | |
padding-top: 60px; | |
top: 0; | |
right: 0; | |
bottom: 0; | |
left: 300px; | |
position: absolute; | |
transition: left .25s ease | |
} | |
.markdown-section { | |
margin: 0 auto; | |
max-width: 800px; | |
padding: 30px 15px 40px; | |
position: relative | |
} | |
.markdown-section>* { | |
box-sizing: border-box; | |
font-size: inherit | |
} | |
.markdown-section>:first-child { | |
margin-top: 0!important | |
} | |
.markdown-section hr { | |
border: none; | |
border-bottom: 1px solid #eee; | |
margin: 2em 0 | |
} | |
.markdown-section table { | |
border-collapse: collapse; | |
border-spacing: 0; | |
display: block; | |
margin-bottom: 16px; | |
margin-bottom: 1rem; | |
overflow: auto; | |
width: 100% | |
} | |
.markdown-section th { | |
font-weight: 700 | |
} | |
.markdown-section td, | |
.markdown-section th { | |
border: 1px solid #ddd; | |
padding: 6px 13px | |
} | |
.markdown-section tr { | |
border-top: 1px solid #ccc | |
} | |
.markdown-section p.tip, | |
.markdown-section tr:nth-child(2n) { | |
background-color: #f8f8f8 | |
} | |
.markdown-section p.tip { | |
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 | |
} | |
.markdown-section p.tip code { | |
background-color: #efefef | |
} | |
.markdown-section p.tip em { | |
color: #34495e | |
} | |
.markdown-section p.tip:before { | |
background-color: #f66; | |
border-radius: 100%; | |
color: #fff; | |
content: "!"; | |
font-family: Dosis, Source Sans Pro, Helvetica Neue, Arial, sans-serif; | |
font-size: 14px; | |
font-weight: 700; | |
left: -12px; | |
line-height: 20px; | |
position: absolute; | |
width: 20px; | |
height: 20px; | |
text-align: center; | |
top: 14px | |
} | |
.markdown-section p.warn { | |
background: rgba(66, 185, 131, .1); | |
border-radius: 2px; | |
padding: 16px; | |
padding: 1rem | |
} | |
body.close .sidebar { | |
-webkit-transform: translateX(-300px); | |
transform: translateX(-300px) | |
} | |
body.close .sidebar-toggle { | |
width: auto | |
} | |
body.close .content { | |
left: 0 | |
} | |
@media print { | |
.app-nav, | |
.github-corner, | |
.sidebar, | |
.sidebar-toggle { | |
display: none | |
} | |
} | |
@media screen and (max-width:768px) { | |
.github-corner, | |
.sidebar, | |
.sidebar-toggle { | |
position: fixed | |
} | |
.app-nav { | |
margin-top: 16px | |
} | |
.app-nav li ul { | |
top: 30px | |
} | |
main { | |
height: auto; | |
overflow-x: hidden | |
} | |
.sidebar { | |
left: -300px; | |
transition: -webkit-transform .25s ease-out; | |
transition: transform .25s ease-out; | |
transition: transform .25s ease-out, -webkit-transform .25s ease-out | |
} | |
.content { | |
left: 0; | |
max-width: 100vw; | |
position: static; | |
padding-top: 20px; | |
transition: -webkit-transform .25s ease; | |
transition: transform .25s ease; | |
transition: transform .25s ease, -webkit-transform .25s ease | |
} | |
.app-nav, | |
.github-corner { | |
transition: -webkit-transform .25s ease-out; | |
transition: transform .25s ease-out; | |
transition: transform .25s ease-out, -webkit-transform .25s ease-out | |
} | |
.sidebar-toggle { | |
background-color: transparent; | |
width: auto | |
} | |
body.close .sidebar { | |
-webkit-transform: translateX(300px); | |
transform: translateX(300px) | |
} | |
body.close .sidebar-toggle { | |
background-color: hsla(0, 0%, 100%, .8); | |
transition: background-color 1s; | |
width: 284px | |
} | |
body.close .content { | |
-webkit-transform: translateX(300px); | |
transform: translateX(300px) | |
} | |
body.close .app-nav, | |
body.close .github-corner { | |
display: none | |
} | |
.github-corner .octo-arm { | |
-webkit-animation: a .56s ease-in-out; | |
animation: a .56s ease-in-out | |
} | |
.github-corner:hover .octo-arm { | |
-webkit-animation: none; | |
animation: none | |
} | |
} | |
@-webkit-keyframes a { | |
0%, | |
to { | |
-webkit-transform: rotate(0); | |
transform: rotate(0) | |
} | |
20%, | |
60% { | |
-webkit-transform: rotate(-25deg); | |
transform: rotate(-25deg) | |
} | |
40%, | |
80% { | |
-webkit-transform: rotate(10deg); | |
transform: rotate(10deg) | |
} | |
} | |
@keyframes a { | |
0%, | |
to { | |
-webkit-transform: rotate(0); | |
transform: rotate(0) | |
} | |
20%, | |
60% { | |
-webkit-transform: rotate(-25deg); | |
transform: rotate(-25deg) | |
} | |
40%, | |
80% { | |
-webkit-transform: rotate(10deg); | |
transform: rotate(10deg) | |
} | |
} | |
section.cover { | |
-webkit-box-align: center; | |
-ms-flex-align: center; | |
align-items: center; | |
background-position: 50%; | |
background-repeat: no-repeat; | |
background-size: cover; | |
height: 100vh; | |
display: none | |
} | |
section.cover .cover-main { | |
-webkit-box-flex: 1; | |
-ms-flex: 1; | |
flex: 1; | |
margin: -20px 16px 0; | |
text-align: center; | |
z-index: 1 | |
} | |
section.cover a { | |
color: inherit | |
} | |
section.cover a, | |
section.cover a:hover { | |
text-decoration: none | |
} | |
section.cover p { | |
line-height: 24px; | |
line-height: 1.5rem; | |
margin: 1em 0 | |
} | |
section.cover h1 { | |
color: inherit; | |
font-size: 40px; | |
font-size: 2.5rem; | |
font-weight: 300; | |
margin: 10px 0 40px; | |
margin: .625rem 0 2.5rem; | |
position: relative; | |
text-align: center | |
} | |
section.cover h1 a { | |
display: block | |
} | |
section.cover h1 small { | |
bottom: -7px; | |
bottom: -.4375rem; | |
font-size: 16px; | |
font-size: 1rem; | |
position: absolute | |
} | |
section.cover blockquote { | |
font-size: 24px; | |
font-size: 1.5rem; | |
text-align: center | |
} | |
section.cover ul { | |
line-height: 1.8; | |
list-style-type: none; | |
margin: 1em auto; | |
max-width: 500px; | |
padding: 0 | |
} | |
section.cover .cover-main>p:last-child a { | |
border-color: #4193Cb; | |
border: 1px solid var(--theme-color, #4193Cb); | |
border-radius: 2rem; | |
box-sizing: border-box; | |
color: #4193Cb; | |
color: var(--theme-color, #4193Cb); | |
display: inline-block; | |
font-size: 16.8px; | |
font-size: 1.05rem; | |
letter-spacing: 1.6px; | |
letter-spacing: .1rem; | |
margin-right: 16px; | |
margin-right: 1rem; | |
padding: .75em 32px; | |
padding: .75em 2rem; | |
text-decoration: none; | |
transition: all .15s ease | |
} | |
section.cover .cover-main>p:last-child a:last-child { | |
background-color: #4193Cb; | |
background-color: var(--theme-color, #4193Cb); | |
color: #fff; | |
margin-right: 0 | |
} | |
section.cover .cover-main>p:last-child a:last-child:hover { | |
color: inherit; | |
opacity: .8 | |
} | |
section.cover .cover-main>p:last-child a:hover { | |
color: inherit | |
} | |
section.cover blockquote>p>a { | |
border-bottom: 2px solid #4193Cb; | |
border-bottom: 2px solid var(--theme-color, #4193Cb); | |
transition: color .3s | |
} | |
section.cover blockquote>p>a:hover { | |
color: #4193Cb; | |
color: var(--theme-color, #4193Cb) | |
} | |
section.cover.show { | |
display: -webkit-box; | |
display: -ms-flexbox; | |
display: flex | |
} | |
section.cover.has-mask .mask { | |
background-color: #fff; | |
opacity: .8; | |
position: absolute; | |
width: 100%; | |
height: 100% | |
} | |
.sidebar, | |
body { | |
background-color: #fff | |
} | |
.sidebar { | |
color: #364149 | |
} | |
.sidebar li { | |
margin: 6px 0 6px 15px | |
} | |
.sidebar ul li a { | |
color: #505d6b; | |
font-size: 14px; | |
font-weight: 400; | |
overflow: hidden; | |
text-decoration: none; | |
text-overflow: ellipsis; | |
white-space: nowrap | |
} | |
.sidebar ul li a:hover { | |
text-decoration: underline | |
} | |
.sidebar ul li ul { | |
padding: 0 | |
} | |
.sidebar ul li.active>a { | |
border-right: 2px solid; | |
color: #4193Cb; | |
color: var(--theme-color, #4193Cb); | |
font-weight: 600 | |
} | |
.app-sub-sidebar .section-link:before { | |
content: "-"; | |
padding-right: 4px | |
} | |
.markdown-section h1, | |
.markdown-section h2, | |
.markdown-section h3, | |
.markdown-section h4, | |
.markdown-section strong { | |
color: #2c3e50; | |
font-weight: 600 | |
} | |
.markdown-section a { | |
color: #4193Cb; | |
color: var(--theme-color, #4193Cb); | |
font-weight: 600 | |
} | |
.markdown-section h1 { | |
font-size: 32px; | |
font-size: 2rem; | |
margin: 0 0 16px; | |
margin: 0 0 1rem | |
} | |
.markdown-section h2 { | |
font-size: 28px; | |
font-size: 1.75rem; | |
margin: 45px 0 12.8px; | |
margin: 45px 0 .8rem | |
} | |
.markdown-section h3 { | |
font-size: 24px; | |
font-size: 1.5rem; | |
margin: 40px 0 9.6px; | |
margin: 40px 0 .6rem | |
} | |
.markdown-section h4 { | |
font-size: 20px; | |
font-size: 1.25rem | |
} | |
.markdown-section h5, | |
.markdown-section h6 { | |
font-size: 16px; | |
font-size: 1rem | |
} | |
.markdown-section h6 { | |
color: #777 | |
} | |
.markdown-section figure, | |
.markdown-section ol, | |
.markdown-section p, | |
.markdown-section ul { | |
margin: 1.2em 0 | |
} | |
.markdown-section ol, | |
.markdown-section p, | |
.markdown-section ul { | |
line-height: 25.6px; | |
line-height: 1.6rem; | |
word-spacing: .8px; | |
word-spacing: .05rem | |
} | |
.markdown-section ol, | |
.markdown-section ul { | |
padding-left: 24px; | |
padding-left: 1.5rem | |
} | |
.markdown-section blockquote { | |
border-left: 4px solid #4193Cb; | |
border-left: 4px solid var(--theme-color, #4193Cb); | |
color: #858585; | |
margin: 2em 0; | |
padding-left: 20px | |
} | |
.markdown-section blockquote p { | |
font-weight: 600; | |
margin-left: 0 | |
} | |
.markdown-section iframe { | |
margin: 1em 0 | |
} | |
.markdown-section em { | |
color: #7f8c8d | |
} | |
.markdown-section code { | |
border-radius: 2px; | |
color: #e96900; | |
font-size: 12.8px; | |
font-size: .8rem; | |
margin: 0 2px; | |
padding: 3px 5px; | |
white-space: pre-wrap | |
} | |
.markdown-section code, | |
.markdown-section pre { | |
background-color: #f8f8f8; | |
font-family: Roboto Mono, Monaco, courier, monospace | |
} | |
.markdown-section pre { | |
-moz-osx-font-smoothing: initial; | |
-webkit-font-smoothing: initial; | |
line-height: 24px; | |
line-height: 1.5rem; | |
margin: 1.2em 0; | |
overflow: auto; | |
padding: 0 22.4px; | |
padding: 0 1.4rem; | |
position: relative; | |
word-wrap: normal | |
} | |
.token.cdata, | |
.token.comment, | |
.token.doctype, | |
.token.prolog { | |
color: #8e908c | |
} | |
.token.namespace { | |
opacity: .7 | |
} | |
.token.boolean, | |
.token.number { | |
color: #c76b29 | |
} | |
.token.punctuation { | |
color: #525252 | |
} | |
.token.property { | |
color: #c08b30 | |
} | |
.token.tag { | |
color: #2973b7 | |
} | |
.token.string { | |
color: #4193Cb; | |
color: var(--theme-color, #4193Cb) | |
} | |
.token.selector { | |
color: #6679cc | |
} | |
.token.attr-name { | |
color: #2973b7 | |
} | |
.language-css .token.string, | |
.style .token.string, | |
.token.entity, | |
.token.url { | |
color: #22a2c9 | |
} | |
.token.attr-value, | |
.token.control, | |
.token.directive, | |
.token.unit { | |
color: #4193Cb; | |
color: var(--theme-color, #4193Cb) | |
} | |
.token.keyword { | |
color: #e96900 | |
} | |
.token.atrule, | |
.token.regex, | |
.token.statement { | |
color: #22a2c9 | |
} | |
.token.placeholder, | |
.token.variable { | |
color: #3d8fd1 | |
} | |
.token.deleted { | |
text-decoration: line-through | |
} | |
.token.inserted { | |
border-bottom: 1px dotted #202746; | |
text-decoration: none | |
} | |
.token.italic { | |
font-style: italic | |
} | |
.token.bold, | |
.token.important { | |
font-weight: 700 | |
} | |
.token.important { | |
color: #c94922 | |
} | |
.token.entity { | |
cursor: help | |
} | |
.markdown-section pre>code { | |
-moz-osx-font-smoothing: initial; | |
-webkit-font-smoothing: initial; | |
background-color: #f8f8f8; | |
border-radius: 2px; | |
color: #525252; | |
display: block; | |
font-family: Roboto Mono, Monaco, courier, monospace; | |
font-size: 12.8px; | |
font-size: .8rem; | |
line-height: inherit; | |
margin: 0 2px; | |
max-width: inherit; | |
overflow: inherit; | |
padding: 2.2em 5px; | |
white-space: inherit | |
} | |
.markdown-section code:after, | |
.markdown-section code:before { | |
letter-spacing: .8px; | |
letter-spacing: .05rem | |
} | |
code .token { | |
-moz-osx-font-smoothing: initial; | |
-webkit-font-smoothing: initial; | |
min-height: 24px; | |
min-height: 1.5rem | |
} | |
pre:after { | |
color: #ccc; | |
content: attr(data-lang); | |
font-size: 9.6px; | |
font-size: .6rem; | |
font-weight: 600; | |
height: 15px; | |
line-height: 15px; | |
padding: 5px 10px 0; | |
position: absolute; | |
right: 0; | |
text-align: right; | |
top: 0 | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
*,body{-webkit-font-smoothing:antialiased}.emoji,kbd{vertical-align:middle}.anchor,.app-nav a,.github-corner{text-decoration:none}*,.app-nav li ul,.markdown-section>*{box-sizing:border-box}@font-face{font-family:'Roboto Mono';font-style:normal;font-weight:400;src:local('Roboto Mono'),local('RobotoMono-Regular'),url(https://fonts.gstatic.com/s/robotomono/v5/hMqPNLsu_dywMa4C_DEpY50EAVxt0G0biEntp43Qt6E.ttf) format('truetype')}@font-face{font-family:'Source Sans Pro';font-style:normal;font-weight:300;src:local('Source Sans Pro Light'),local('SourceSansPro-Light'),url(https://fonts.gstatic.com/s/sourcesanspro/v11/toadOcfmlt9b38dHJxOBGMw1o1eFRj7wYC6JbISqOjY.ttf) format('truetype')}@font-face{font-family:'Source Sans Pro';font-style:normal;font-weight:400;src:local('Source Sans Pro Regular'),local('SourceSansPro-Regular'),url(https://fonts.gstatic.com/s/sourcesanspro/v11/ODelI1aHBYDBqgeIAH2zlNzbP97U9sKh0jjxbPbfOKg.ttf) format('truetype')}@font-face{font-family:'Source Sans Pro';font-style:normal;font-weight:600;src:local('Source Sans Pro SemiBold'),local('SourceSansPro-SemiBold'),url(https://fonts.gstatic.com/s/sourcesanspro/v11/toadOcfmlt9b38dHJxOBGNNE-IuDiR70wI4zXaKqWCM.ttf) format('truetype')}*{-webkit-overflow-scrolling:touch;-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:none;-webkit-touch-callout:none}body:not(.ready){overflow:hidden}body:not(.ready) .app-nav,body:not(.ready) [data-cloak],body:not(.ready)>nav{display:none}.app-nav li,kbd{display:inline-block}div#app{font-size:30px;font-weight:lighter;margin:40vh auto;text-align:center}div#app:empty:before{content:"Loading..."}.emoji{height:19.2px;height:1.2rem}.progress{background-color:#2689CC;background-color:var(--theme-color,#2689CC);height:2px;left:0;position:fixed;right:0;top:0;transition:width .2s,opacity .4s;width:0;z-index:5}.search .search-keyword,.search a:hover{color:#4193Cb;color:var(--theme-color,#4193Cb)}.search .search-keyword{font-style:normal}body,html{height:100%}body{-moz-osx-font-smoothing:grayscale;color:#34495e;font-family:Source Sans Pro,Helvetica Neue,Arial,sans-serif;font-size:15px;letter-spacing:0;margin:0;overflow-x:hidden}.markdown-section pre,.markdown-section pre>code,code .token{-moz-osx-font-smoothing:initial;-webkit-font-smoothing:initial}img{max-width:100%}kbd{border:1px solid #ccc;border-radius:3px;font-size:12px!important;line-height:12px;margin-bottom:3px;padding:3px 5px}.app-nav{left:0;margin:25px 60px 0 0;position:absolute;right:0;text-align:right;z-index:2}.app-nav p{margin:0}.app-nav>a{margin:0 1rem;padding:5px 0}.app-nav li,.app-nav ul{display:inline-block;list-style:none;margin:0}.app-nav a{color:inherit;font-size:16px;transition:color .3s}.app-nav a.active,.app-nav a:hover{color:#4193Cb;color:var(--theme-color,#4193Cb)}.app-nav a.active{border-bottom:2px solid #4193Cb;border-bottom:2px solid var(--theme-color,#4193Cb)}.app-nav li{margin:0 1rem;padding:5px 0;position:relative}.app-nav li ul{background-color:#fff;border:1px solid #ddd;border-bottom-color:#ccc;border-radius:4px;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}.app-nav li ul a.active,.github-corner{border-bottom:0}.app-nav li ul a,.app-nav li:hover ul,main{display:block}.app-nav li ul li{display:block;font-size:14px;line-height:16px;line-height:1rem;margin:8px 14px;white-space:nowrap}.app-nav li ul a{font-size:inherit;margin:0;padding:0}.app-nav.no-badge{margin-right:25px}.github-corner{position:fixed;right:0;top:0;z-index:1}.github-corner svg{color:#fff;fill:#4193Cb;fill:var(--theme-color,#4193Cb);height:80px;width:80px}.github-corner:hover .octo-arm{-webkit-animation:a .56s ease-in-out;animation:a .56s ease-in-out}main{position:relative;width:100vw;height:100%}.anchor{display:inline-block;transition:all .3s}.anchor span{color:#34495e}.anchor:hover{text-decoration:underline}.sidebar ul li a,.sidebar>h1 a,section.cover a,section.cover a:hover{text-decoration:none}.sidebar{border-right:1px solid rgba(0,0,0,.07);overflow-y:auto;padding:40px 0;top:0;bottom:0;left:0;position:absolute;transition:-webkit-transform .25s ease-out;transition:transform .25s ease-out;transition:transform .25s ease-out,-webkit-transform .25s ease-out;width:300px;z-index:3}.sidebar>h1{margin:0 auto 1rem;font-size:24px;font-size:1.5rem;font-weight:300;text-align:center}.markdown-section th,.sidebar li>p{font-weight:700}.sidebar>h1 a{color:inherit}.sidebar>h1 .app-nav{display:block;position:static}.sidebar .sidebar-nav{line-height:2em}.sidebar ul{margin:0;padding:0}.sidebar li>p{margin:0}.sidebar ul,.sidebar ul li{list-style:none}.sidebar ul li a{border-bottom:none;display:block}.sidebar ul li ul{padding-left:20px}.sidebar::-webkit-scrollbar{width:4px}.sidebar::-webkit-scrollbar-thumb{background:0 0;border-radius:4px}.sidebar:hover::-webkit-scrollbar-thumb{background:hsla(0,0%,53%,.4)}.sidebar:hover::-webkit-scrollbar-track{background:hsla(0,0%,53%,.1)}.sidebar-toggle{background-color:transparent;background-color:hsla(0,0%,100%,.8);border:0;outline:0;padding:10px;bottom:0;left:0;position:absolute;text-align:center;transition:opacity .3s;width:30px;width:284px;z-index:4}.sidebar-toggle .sidebar-toggle-button:hover{opacity:.4}.sidebar-toggle span{background-color:#4193Cb;background-color:var(--theme-color,#4193Cb);display:block;margin-bottom:4px;width:16px;height:2px}body.sticky .sidebar,body.sticky .sidebar-toggle{position:fixed}.content{padding-top:60px;top:0;right:0;bottom:0;left:300px;position:absolute;transition:left .25s ease}.markdown-section{margin:0 auto;max-width:800px;padding:30px 15px 40px;position:relative}.markdown-section>*{font-size:inherit}.markdown-section>:first-child{margin-top:0!important}.markdown-section hr{border:none;border-bottom:1px solid #eee;margin:2em 0}.markdown-section table{border-collapse:collapse;border-spacing:0;display:block;margin-bottom:1rem;overflow:auto;width:100%}.markdown-section td,.markdown-section th{border:1px solid #ddd;padding:6px 13px}.markdown-section tr{border-top:1px solid #ccc}.markdown-section p.tip,.markdown-section tr:nth-child(2n){background-color:#f8f8f8}.markdown-section p.tip{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}.markdown-section p.tip code{background-color:#efefef}.markdown-section p.tip em{color:#34495e}.markdown-section p.tip:before{background-color:#f66;border-radius:100%;color:#fff;content:"!";font-family:Dosis,Source Sans Pro,Helvetica Neue,Arial,sans-serif;font-size:14px;font-weight:700;left:-12px;line-height:20px;position:absolute;width:20px;height:20px;text-align:center;top:14px}.markdown-section p.warn{background:rgba(66,185,131,.1);border-radius:2px;padding:1rem}body.close .sidebar{-webkit-transform:translateX(-300px);transform:translateX(-300px)}body.close .sidebar-toggle{width:auto}body.close .content{left:0}@media print{.app-nav,.github-corner,.sidebar,.sidebar-toggle{display:none}}@media screen and (max-width:768px){.github-corner,.sidebar,.sidebar-toggle{position:fixed}.app-nav{margin-top:16px}.app-nav li ul{top:30px}main{height:auto;overflow-x:hidden}.sidebar{left:-300px;transition:-webkit-transform .25s ease-out;transition:transform .25s ease-out;transition:transform .25s ease-out,-webkit-transform .25s ease-out}.content{left:0;max-width:100vw;position:static;padding-top:20px;transition:-webkit-transform .25s ease;transition:transform .25s ease;transition:transform .25s ease,-webkit-transform .25s ease}.app-nav,.github-corner{transition:-webkit-transform .25s ease-out;transition:transform .25s ease-out;transition:transform .25s ease-out,-webkit-transform .25s ease-out}.sidebar-toggle{background-color:transparent;width:auto}body.close .sidebar{-webkit-transform:translateX(300px);transform:translateX(300px)}body.close .sidebar-toggle{background-color:hsla(0,0%,100%,.8);transition:background-color 1s;width:284px}body.close .content{-webkit-transform:translateX(300px);transform:translateX(300px)}body.close .app-nav,body.close .github-corner{display:none}.github-corner .octo-arm{-webkit-animation:a .56s ease-in-out;animation:a .56s ease-in-out}.github-corner:hover .octo-arm{-webkit-animation:none;animation:none}}@-webkit-keyframes a{0%,to{-webkit-transform:rotate(0);transform:rotate(0)}20%,60%{-webkit-transform:rotate(-25deg);transform:rotate(-25deg)}40%,80%{-webkit-transform:rotate(10deg);transform:rotate(10deg)}}@keyframes a{0%,to{-webkit-transform:rotate(0);transform:rotate(0)}20%,60%{-webkit-transform:rotate(-25deg);transform:rotate(-25deg)}40%,80%{-webkit-transform:rotate(10deg);transform:rotate(10deg)}}section.cover{-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-position:50%;background-repeat:no-repeat;background-size:cover;height:100vh;display:none}section.cover .cover-main{-webkit-box-flex:1;-ms-flex:1;flex:1;margin:-20px 16px 0;text-align:center;z-index:1}section.cover a{color:inherit}section.cover p{line-height:24px;line-height:1.5rem;margin:1em 0}section.cover h1{color:inherit;font-size:40px;font-size:2.5rem;font-weight:300;margin:.625rem 0 2.5rem;position:relative;text-align:center}section.cover h1 a{display:block}section.cover h1 small{bottom:-7px;bottom:-.4375rem;font-size:16px;font-size:1rem;position:absolute}section.cover blockquote{font-size:24px;font-size:1.5rem;text-align:center}section.cover ul{line-height:1.8;list-style-type:none;margin:1em auto;max-width:500px;padding:0}section.cover .cover-main>p:last-child a{border:1px solid var(--theme-color,#4193Cb);border-radius:2rem;box-sizing:border-box;color:#4193Cb;color:var(--theme-color,#4193Cb);display:inline-block;font-size:16.8px;font-size:1.05rem;letter-spacing:1.6px;letter-spacing:.1rem;margin-right:1rem;padding:.75em 2rem;text-decoration:none;transition:all .15s ease}section.cover .cover-main>p:last-child a:last-child{background-color:#4193Cb;background-color:var(--theme-color,#4193Cb);color:#fff;margin-right:0}section.cover .cover-main>p:last-child a:last-child:hover{color:inherit;opacity:.8}section.cover .cover-main>p:last-child a:hover{color:inherit}section.cover blockquote>p>a{border-bottom:2px solid #4193Cb;border-bottom:2px solid var(--theme-color,#4193Cb);transition:color .3s}section.cover blockquote>p>a:hover{color:#4193Cb;color:var(--theme-color,#4193Cb)}section.cover.show{display:-webkit-box;display:-ms-flexbox;display:flex}section.cover.has-mask .mask{background-color:#fff;opacity:.8;position:absolute;width:100%;height:100%}.sidebar,body{background-color:#fff}.markdown-section code,.markdown-section pre,.markdown-section pre>code{background-color:#f8f8f8;font-family:Roboto Mono,Monaco,courier,monospace}.sidebar{color:#364149}.sidebar li{margin:6px 0 6px 15px}.sidebar ul li a{color:#505d6b;font-size:14px;font-weight:400;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sidebar ul li a:hover{text-decoration:underline}.sidebar ul li ul{padding:0}.sidebar ul li.active>a{border-right:2px solid;color:#4193Cb;color:var(--theme-color,#4193Cb);font-weight:600}.app-sub-sidebar .section-link:before{content:"-";padding-right:4px}.markdown-section h1,.markdown-section h2,.markdown-section h3,.markdown-section h4,.markdown-section strong{color:#2c3e50;font-weight:600}.markdown-section a{color:#4193Cb;color:var(--theme-color,#4193Cb);font-weight:600}.markdown-section h1{font-size:32px;font-size:2rem;margin:0 0 1rem}.markdown-section h2{font-size:28px;font-size:1.75rem;margin:45px 0 .8rem}.markdown-section h3{font-size:24px;font-size:1.5rem;margin:40px 0 .6rem}.markdown-section h4{font-size:20px;font-size:1.25rem}.markdown-section h5,.markdown-section h6{font-size:16px;font-size:1rem}.markdown-section h6{color:#777}.markdown-section figure,.markdown-section ol,.markdown-section p,.markdown-section ul{margin:1.2em 0}.markdown-section ol,.markdown-section p,.markdown-section ul{line-height:25.6px;line-height:1.6rem;word-spacing:.8px;word-spacing:.05rem}.markdown-section ol,.markdown-section ul{padding-left:1.5rem}.markdown-section blockquote{border-left:4px solid #4193Cb;border-left:4px solid var(--theme-color,#4193Cb);color:#858585;margin:2em 0;padding-left:20px}.markdown-section blockquote p{font-weight:600;margin-left:0}.markdown-section iframe{margin:1em 0}.markdown-section em{color:#7f8c8d}.markdown-section code{border-radius:2px;color:#e96900;font-size:12.8px;font-size:.8rem;margin:0 2px;padding:3px 5px;white-space:pre-wrap}.markdown-section pre{line-height:24px;line-height:1.5rem;margin:1.2em 0;overflow:auto;padding:0 1.4rem;position:relative;word-wrap:normal}.token.cdata,.token.comment,.token.doctype,.token.prolog{color:#8e908c}.token.namespace{opacity:.7}.token.boolean,.token.number{color:#c76b29}.token.punctuation{color:#525252}.token.property{color:#c08b30}.token.tag{color:#2973b7}.token.string{color:#4193Cb;color:var(--theme-color,#4193Cb)}.token.selector{color:#6679cc}.token.attr-name{color:#2973b7}.language-css .token.string,.style .token.string,.token.entity,.token.url{color:#22a2c9}.token.attr-value,.token.control,.token.directive,.token.unit{color:#4193Cb;color:var(--theme-color,#4193Cb)}.token.keyword{color:#e96900}.token.atrule,.token.regex,.token.statement{color:#22a2c9}.token.placeholder,.token.variable{color:#3d8fd1}.token.deleted{text-decoration:line-through}.token.inserted{border-bottom:1px dotted #202746;text-decoration:none}.token.italic{font-style:italic}.token.bold,.token.important{font-weight:700}.token.important{color:#c94922}.token.entity{cursor:help}.markdown-section pre>code{border-radius:2px;color:#525252;display:block;font-size:12.8px;font-size:.8rem;line-height:inherit;margin:0 2px;max-width:inherit;overflow:inherit;padding:2.2em 5px;white-space:inherit}.markdown-section code:after,.markdown-section code:before{letter-spacing:.8px;letter-spacing:.05rem}code .token{min-height:24px;min-height:1.5rem}pre:after{color:#ccc;content:attr(data-lang);font-size:9.6px;font-size:.6rem;font-weight:600;height:15px;line-height:15px;padding:5px 10px 0;position:absolute;right:0;text-align:right;top:0} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment