diff options
| author | Jules Laplace <julescarbon@gmail.com> | 2019-01-07 23:01:11 +0100 |
|---|---|---|
| committer | Jules Laplace <julescarbon@gmail.com> | 2019-01-07 23:01:11 +0100 |
| commit | 4777c058469847cbe02eb2a24634b21ee37384fc (patch) | |
| tree | 3fd87861241a75f59819bc0771eb3e97bd88e2f6 /docs/css | |
| parent | d317978119fc0936d9c342edf47e55be230cd215 (diff) | |
move docs
Diffstat (limited to 'docs/css')
| -rw-r--r-- | docs/css/css.css | 342 |
1 files changed, 0 insertions, 342 deletions
diff --git a/docs/css/css.css b/docs/css/css.css deleted file mode 100644 index 6271eb3..0000000 --- a/docs/css/css.css +++ /dev/null @@ -1,342 +0,0 @@ -@font-face { - font-family: nhg; - src: url(../fonts/NHaasGroteskTXPro-55Rg.ttf); - font-weight: normal; - font-style: normal; -} -@font-face { - font-family: nhg; - src: url(../fonts/NHaasGroteskTXPro-56It.ttf); - font-weight: normal; - font-style: italic; -} -@font-face { - font-family: nhg; - src: url(../fonts/NHaasGroteskTXPro-75Bd.ttf); - font-weight: bold; - font-style: normal; -} -@font-face { - font-family: nhg; - src: url(../fonts/NHaasGroteskTXPro-76BdIt.ttf); - font-weight: bold; - font-style: italic; -} -.desktop .m, -.mobile .d { display: none; } -html, body { - margin: 0; padding: 0; width: 100%; height: 100%; - font-family: nhg, sans-serif; - color: rgba(255,255,255,0.9); -} -html { - background-color: rgb(0,0,0); - background-image: linear-gradient(rgba(20, 10, 0, 0.0), rgba(20, 10, 0, 1.0)); - background-attachment: fixed; - transition: background-color 1s; -} -html.day { - background-color: rgb(80,10,60); -} -html.night { - background-color: rgb(8,10,30); -} -body { - background-color: rgba(0,0,0,0); - transition: background-color 1000ms, opacity 500ms; - opacity: 1; -} -body.loading { - background-color: rgba(255,128,192,1); - background-color: black; - opacity: 0; -} -body.fade { - opacity: 1; - background-color: black; - background-color: rgba(255,128,192,1); -} -.shards { - position: absolute; - top: 0; left: 0; - width: 100%; height: 100%; - overflow: hidden; - pointer-events: none; -} -.bgs { - position: absolute; - top: 50%; left: 50%; - opacity: 0.7; - transition: opacity 500ms; - perspective: 10000px; -} -.stars { - transition: all 500ms cubic-bezier(0,0,0,1); - transform: translateZ(0) scaleX(1) scaleY(1); -} -.stars.fade { - transform: translateZ(0) scaleX(1.03) scaleY(1.03); -} -.fade { - opacity: 0; -} -.bg { - position: absolute; - top: 0; left: 0; - transition: all 120s; -} -header { - background-color: rgba(40,20,30,0.9); - position: absolute; - width: 100%; - bottom: 100px; - left: 0; -} -p { - margin: 0; padding: 0; - line-height: 1.4; -} -p + p { - margin-top: 14px;ß -} -a { - text-decoration: none; - color: rgba(255,255,255,0.8); - transition: color 200ms; - border-bottom: 1px dotted; -} -.desktop a:hover { - color: rgba(255,255,255,1.0); -} -img { - max-width: 100%; -} -img.cover { - max-width: 300px; -} -.menu a { - margin-right: 10px; - border-bottom: 0; -} -.menu a.active { - border-bottom: 1px dotted; - color: rgba(255,255,255,1.0); -} -.logo { - width: 400px; - opacity: 0.8; - animation: fade 10s infinite; -} -.row { - display: flex; - flex-direction: row; - align-items: center; - justify-content: space-between; -} -h1 { - font-size: 32px; - margin: 0; - padding: 10px 20px; - letter-spacing: -2px; - text-transform: uppercase; - cursor: pointer; - opacity: 0.9; - transition: opacity 500ms; - color: white; -} -.desktop h1:hover { - opacity: 1; -} -h2 { - margin: 0; - padding: 0 0 15px 0; - letter-spacing: -1px; -} -h3 { - margin: 0; - padding: 0 0 6px 0; - letter-spacing: 1px; - font-weight: normal; - font-style: italic; - font-size: 14px; - text-transform: uppercase; - opacity: 0.7; -} -ul { - margin: 0 0 20px 0; - padding: 0; - list-style-type: none; -} -ul li { - list-style-type: none; - line-height: 1.4; -} -ol { - margin: 0 0 20px 0; - padding: 0; -} -ol li { - line-height: 1.4; -} -.player { - padding: 12px 20px; - width: 300px; - display: flex; - flex-direction: row; - justify-content: flex-start; - align-items: center; - cursor: pointer; - border-left: 1px solid #000; -} -.player .icon { - width: 1.2em; - height: 1.2em; - background-image: url(../img/pause-inv.png); - background-size: 100%; - background-position: center; - border: 2px solid rgba(255,255,255,0.3); - border-radius: 100%; - margin: 0 10px 0 10px; -} -.player.playing .icon { - background-image: url(../img/pause-inv.png); -} -.player.paused .icon { - background-image: url(../img/play-inv.png); -} -.player .track { - transition: all 100ms; - flex: auto; -} -.desktop .player:hover .track { - color: rgba(255,255,255,1.0); -} -.playlist { - -webkit-overflow-scrolling: touch; - overflow-y: auto; - max-height: calc(100vh - 140px); - width: 331px; - max-width: calc(100vw - 30px); - background: black; - position: absolute; - bottom: 160px; right: 0; - margin: 0px 10px; - padding: 0px; - height: 0; overflow: hidden; - transition: all 0.5s cubic-bezier(0,1,1,1); -} -.playlist.visible { - height: 180px; -} -.playlist ul { - margin: 0; padding: 0; -} -.playlist li { - margin: 0; padding: 10px; - cursor: pointer; - transition: all 0.2s; - background: rgba(20,5,10,0.5); -} -.playlist li.active { - color: #000; - background: rgba(255,255,255,0.9); -} -.playlistToggle { - align-self: flex-end; - width: 15px; - height: 15px; - padding: 10px; - display: flex; - flex-direction: column; - justify-content:space-between; -} -.playlistToggle div { - width: 100%; - height: 2px; - border-bottom: 1px solid #999; - background: white; -} -section { - -webkit-overflow-scrolling: touch; - overflow-y: auto; - max-height: calc(100vh - 140px); - max-width: 500px; - background: black; - position: absolute; - bottom: 160px; left: 0; - margin: 10px 10px; - padding: 10px; - background: rgba(20,5,10,0.5); - pointer-events: none; - opacity: 0; - transition: opacity 200ms; -} -.bio #bio, -.discography #discography, -.hardware #hardware, -.contact #contact { - opacity: 1; - pointer-events: auto; -} -@keyframes fade { - 0% { opacity: 0.6; } - 50% { opacity: 1.0; } - 90% { opacity: 0.7; } -100% { opacity: 0.6; } -} - -@media (max-width: 700px) { - * { box-sizing: border-box; } - header { - bottom: auto; - top: 0px; - } - header .row { - flex-direction: column; - } - header .row .menu { - flex-direction: row; - flex-wrap: wrap; - } - h1 { - flex: 1 1 100%; - text-align: center; - } - .menu a { - display: block; - text-align: center; - margin-left: 6px; - margin-right: 6px; - padding-bottom: 10px; - } - .menu a.active { - border: 0; - } - .playlist { - width: 100vw; - margin: 0; - bottom: 59px; - } - section { - height: calc(100vh - 150px); - width: 100%; - max-width: auto; - min-width: auto; - max-height: auto; - padding-bottom: 20px; - bottom: auto; - top: 90px; - margin: 0; - } - .player { - position: fixed; - bottom: 0; - background: rgba(80,10,60,0.6); - width: 100vw; - padding: 12px 20px; - } - .playlistToggle { - width: 36px; - height: 36px; - } -}
\ No newline at end of file |
