This repository has been archived by the owner on Feb 26, 2024. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 683
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
7ef1468
commit b4d8ada
Showing
23 changed files
with
11,713 additions
and
183,020 deletions.
There are no files selected for viewing
This file was deleted.
Oops, something went wrong.
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
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,160 @@ | ||
.code { | ||
position: relative; | ||
margin-top: 2.5vw; | ||
} | ||
.code strike { | ||
opacity: 0.5; | ||
} | ||
.code strike, | ||
.code strike * { | ||
color: red !important; | ||
font-style: italic; | ||
} | ||
.code:before { | ||
content: " "; | ||
width: 100%; | ||
height: 90%; | ||
position: absolute; | ||
left: 0; | ||
top: 5%; | ||
border-radius: 5%/50%; | ||
background: rgba(255, 255, 255, 0.35); | ||
box-shadow: 0 0 100px 0 white; | ||
z-index: 9; | ||
opacity: 0.025; | ||
animation: lights 0.4s infinite alternate; | ||
animation-timing-function: linear; | ||
mix-blend-mode: hard-light; | ||
pointer-events: none; | ||
} | ||
@keyframes lights { | ||
to { | ||
opacity: 0.03; | ||
} | ||
} | ||
.code-lang { | ||
float: right; | ||
padding: 0.5vw 1vw; | ||
position: absolute; | ||
right: 0; | ||
top: 0; | ||
border-radius: 10%/40%; | ||
font-size: 0.8em; | ||
background: var(--dark-porsche); | ||
font-family: "Open sans"; | ||
transform: translate(-3vw, calc(-100% + 3.05vw)); | ||
padding: 0.5vw 1vw 3vw; | ||
text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.5); | ||
box-shadow: 0 -1px 1px rgba(224, 191, 168, 1); | ||
} | ||
.code-inner { | ||
border-radius: 50%/5%; | ||
overflow: hidden; | ||
box-shadow: 0 5px 50px rgba(0, 0, 0, 0.1); | ||
} | ||
.code pre { | ||
overflow: hidden; | ||
border-radius: 5%/50%; | ||
border: solid var(--dark-porsche); | ||
border-width: 0 0.5vw; | ||
|
||
box-shadow: 0 5px 50px rgba(0, 0, 0, 0.2), 0 -1px 1px rgba(224, 191, 168, 1), | ||
0 1px 1px rgba(29, 21, 11, 0.75); | ||
margin-bottom: -1px; | ||
} | ||
*:not(pre) > code, | ||
.hljs { | ||
font-family: "Share Tech Mono", monospace; | ||
text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.7); | ||
} | ||
.hljs { | ||
overflow: visible; | ||
display: block; | ||
overflow-x: auto; | ||
padding: 2.5vw 3.25vw; | ||
line-height: 1.3; | ||
background: var(--dark-chocolate); | ||
color: var(--very-light-porsche); | ||
border-radius: 50%/5%; | ||
border: solid var(--dark-porsche); | ||
border-width: 0.5vw 0; | ||
position: relative; | ||
transition: box-shadow 3s ease-in-out; | ||
transition-delay: 0.5s; | ||
z-index: 3; | ||
margin: 1px 0; | ||
|
||
box-shadow: 0 -3px 1px rgba(224, 191, 168, 1), | ||
0 1px 1px rgba(29, 21, 11, 0.75); | ||
} | ||
|
||
.hljs-comment, | ||
.hljs-quote, | ||
.hljs-meta { | ||
color: var(--light-pink); | ||
} | ||
|
||
.hljs-keyword, | ||
.hljs-selector-tag, | ||
.hljs-tag, | ||
.hljs-name { | ||
color: var(--porsche); | ||
} | ||
|
||
.hljs-attr, | ||
.hljs-attribute, | ||
.hljs-selector-id { | ||
color: var(--light-turquoise); | ||
} | ||
|
||
.hljs-string, | ||
.hljs-selector-attr, | ||
.hljs-selector-pseudo, | ||
.hljs-addition { | ||
color: var(--dark-turquoise); | ||
} | ||
|
||
.hljs-subst { | ||
color: var(--turquoise); | ||
} | ||
|
||
.hljs-regexp, | ||
.hljs-link { | ||
color: var(--medium-dark-porsche); | ||
} | ||
|
||
.hljs-title, | ||
.hljs-section, | ||
.hljs-type, | ||
.hljs-doctag { | ||
color: var(--light-turquoise); | ||
} | ||
|
||
.hljs-built_in { | ||
color: var(--medium-dark-turquoise); | ||
} | ||
|
||
.hljs-symbol, | ||
.hljs-bullet, | ||
.hljs-variable, | ||
.hljs-template-variable, | ||
.hljs-literal { | ||
color: var(--light-pink); | ||
} | ||
|
||
.hljs-params { | ||
color: var(--light-porsche); | ||
} | ||
|
||
.hljs-number, | ||
.hljs-deletion { | ||
color: var(--pink); | ||
} | ||
|
||
.hljs-emphasis { | ||
font-style: italic; | ||
} | ||
|
||
.hljs-strong { | ||
font-weight: bold; | ||
} |
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
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,214 @@ | ||
:root { | ||
--main-bg-color: #33262a; | ||
--main-bg-light-contrast: #443338; | ||
--main-bg-medium-contrast: #5a4d51; | ||
--main-bg-heavy-contrast: #806f74; | ||
--medium-bg-color: rgba(255, 255, 255, 0.1); | ||
--body-text: #fff0e1; | ||
--turquoise: #3fe0c5; | ||
--porsche: #e4a663; | ||
--light-porsche: #f7e6d5; | ||
--light-turquoise: #99f4e5; | ||
--medium-dark-turquoise: #1bd4b5; | ||
} | ||
@media (prefers-color-scheme: light) { | ||
:root { | ||
--main-bg-color: #fff; | ||
--main-bg-light-contrast: #f1f1f1; | ||
--main-bg-medium-contrast: #aaa; | ||
--main-bg-heavy-contrast: #bbb; | ||
--medium-bg-color: rgba(0, 0, 0, 0.05); | ||
--body-text: #5e464d; | ||
|
||
--turquoise: #258575; | ||
--porsche: #785632; | ||
--light-porsche: #736456; | ||
--light-turquoise: #4b7a73; | ||
--medium-dark-turquoise: #12826f; | ||
} | ||
} | ||
html, | ||
body { | ||
background-color: var(--main-bg-color); | ||
margin: 0; | ||
padding: 0; | ||
color: var(--body-text); | ||
font-family: "Open Sans", sans-serif; | ||
} | ||
::-webkit-scrollbar { | ||
width: 12px; | ||
} | ||
::-webkit-scrollbar-track { | ||
background: var(--main-bg-light-contrast); | ||
} | ||
::-webkit-scrollbar-thumb { | ||
background: var(--main-bg-medium-contrast); | ||
} | ||
::-webkit-scrollbar-thumb:hover { | ||
background: var(--main-bg-heavy-contrast); | ||
} | ||
h1 { | ||
color: var(--porsche); | ||
font-family: "Grand Hotel"; | ||
font-weight: normal; | ||
margin: 0.5rem 0.5rem 0.5rem 1rem; | ||
} | ||
.signature { | ||
font-size: 1em; | ||
padding: 1.5em 2em; | ||
background: var(--medium-bg-color); | ||
margin-top: 4em; | ||
font-family: "Share Tech Mono", monospace; | ||
} | ||
a { | ||
color: var(--turquoise); | ||
text-decoration: none; | ||
} | ||
a:hover, | ||
a:focus { | ||
color: var(--turquoise); | ||
text-decoration: underline; | ||
} | ||
.small { | ||
font-size: 0.9em; | ||
} | ||
.container { | ||
display: flex; | ||
height: 100vh; | ||
flex-direction: column; | ||
} | ||
.tag { | ||
font-weight: bold; | ||
font-size: 1.1em; | ||
text-transform: capitalize; | ||
} | ||
.example_container { | ||
margin-bottom: 4rem; | ||
} | ||
.tag_example { | ||
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.25); | ||
padding-bottom: 1rem !important; | ||
} | ||
.return_type { | ||
margin: 1em 0; | ||
} | ||
.return_type > p:nth-child(2) { | ||
display: inline; | ||
} | ||
.console-line { | ||
border-top: solid 1px rgba(255, 255, 255, 0.05); | ||
padding: 0 1em; | ||
} | ||
.run-button { | ||
background: rgba(255, 255, 255, 0.1); | ||
color: rgba(255, 255, 255, 0.9); | ||
position: absolute; | ||
right: 14px; | ||
padding: 0.25em 0.5em; | ||
cursor: pointer; | ||
border-radius: 0 0 3px 3px; | ||
z-index: 1000; | ||
text-transform: uppercase; | ||
box-shadow: 0 1px 5px rgba(0, 0, 0, 0.3); | ||
position: absolute; | ||
transition: background-color 0.2s ease-in-out; | ||
} | ||
.run-button:hover { | ||
background-color: rgba(255, 255, 255, 0.13); | ||
} | ||
.editor-container { | ||
position: relative; | ||
z-index: 999; | ||
} | ||
.editor-container::before { | ||
content: " "; | ||
pointer-events: none; | ||
width: 100%; | ||
position: absolute; | ||
height: 7px; | ||
background-image: linear-gradient(rgba(0, 0, 0, 0.1), transparent); | ||
z-index: 1; | ||
} | ||
.console-container { | ||
position: relative; | ||
} | ||
.console { | ||
font-family: "Droid Sans Mono", monospace, monospace, "Droid Sans Fallback"; | ||
font-size: 14px; | ||
font-feature-settings: "liga" 0, "calt" 0; | ||
line-height: 19px; | ||
letter-spacing: 0px; | ||
height: 200px; | ||
position: relative; | ||
overflow: auto; | ||
padding: 0.3em 0.1em; | ||
display: flex; | ||
flex-direction: column-reverse; | ||
} | ||
.console::-webkit-scrollbar { | ||
width: 12px; | ||
} | ||
.console::-webkit-scrollbar-track { | ||
background: #1e1e1e; | ||
} | ||
.console::-webkit-scrollbar-thumb { | ||
background: hsla(0, 0%, 47%, 0.4); | ||
} | ||
.console::-webkit-scrollbar-thumb:hover { | ||
background: hsla(0, 0%, 50%, 0.7); | ||
} | ||
.tab-container { | ||
border-top: solid 1px #393939; | ||
position: relative; | ||
z-index: 9; | ||
font-size: 0.75em; | ||
text-transform: uppercase; | ||
} | ||
.tab { | ||
display: inline-block; | ||
border-bottom: solid 1px transparent; | ||
opacity: 0.6; | ||
padding: 1em; | ||
padding: 1em; | ||
cursor: pointer; | ||
color: white; | ||
transition: all 0.15s ease-in-out; | ||
} | ||
.tab-active, | ||
.tab:hover { | ||
opacity: 1; | ||
} | ||
.tab-active { | ||
border-bottom: solid 1px white; | ||
} | ||
header { | ||
background-color: var(--main-bg-color); | ||
box-shadow: 0 6px 6px rgba(0, 0, 0, 0.25); | ||
z-index: 999; | ||
} | ||
main { | ||
display: flex; | ||
overflow: auto; | ||
} | ||
aside { | ||
overflow: auto; | ||
box-shadow: 0 0 0.5rem rgba(0, 0, 0, 0.15); | ||
} | ||
aside ul { | ||
list-style: none; | ||
padding-left: 1.5rem; | ||
margin: 1rem 0; | ||
} | ||
aside ul li { | ||
margin: 0.5rem 1rem 0.5rem 0; | ||
} | ||
article { | ||
flex: 1; | ||
overflow: auto; | ||
} | ||
article div.content { | ||
padding: 0 2rem; | ||
} | ||
article div.wide-content { | ||
padding: 0 0; | ||
} |
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Oops, something went wrong.