diff options
Diffstat (limited to 'src')
82 files changed, 53987 insertions, 1099 deletions
diff --git a/src/css/akn.css b/src/css/akn.css index e7ded1e..df3e43d 100644 --- a/src/css/akn.css +++ b/src/css/akn.css @@ -2,24 +2,32 @@ animation: fadeIn 0.5s; } +:root { + --back: #000501; + --extr: #73ab84; + --text: #99d19c; + --link: #79c7c5; + --hili: #ade1e5; +} + @keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } @font-face { - font-family: 'Hack Nerd Font'; - src: url('../fonts/Hack.woff2') format('woff'); - font-weight: normal; + font-family: 'Doto'; + src: url('../fonts/Doto.woff2') format('woff'); + font-weight: 700; } body { - word-break: break-all; + word-break: normal; padding: 1%; - font-family: 'Hack Nerd Font'; + font-family: 'Doto'; font-size: medium; - background-color: #1a1a1a; - color: #7ef07e; + background-color: var(--back); + color: var(--text); display: block; margin: auto; padding: 5px; @@ -41,16 +49,22 @@ div { p { word-break: break-word; text-align: left; - /* margin: 0px; */ } a { - color:rgb(51, 200, 234); + color: var(--link); text-decoration:none; } a:hover{ - color: #c5f0ff; + color: var(--hili); +} + +ul, ol { + list-style-position: inside; +} +#header { + cursor: pointer; } .header { @@ -86,17 +100,18 @@ fieldset { #menu a {display:inline-block;} -.footer p { margin: 0px; } +#footer p { margin: 0px; } -.footer { +#footer div { display: flex; gap: 5px; flex-direction: row; } +#footer { text-align: center; } .inv {display:block;text-align:center;} -pre {overflow:auto;} - -.whole{ +pre { + font-family: 'Doto'; + overflow:auto; } #gotop-link{ @@ -114,7 +129,7 @@ h1 { #contact { border-style: dashed; border-width: 3px; - border-color: #276a4b; + border-color: var(--link); } label { @@ -126,7 +141,7 @@ input { border: 0px; border-radius: 0px; padding: 1vh 1vw; - color: yellow; + color: var(--text); background: black; border: lightyellow 1px dashed; } @@ -135,10 +150,10 @@ input { border-radius: 0px; border-width: 1px; border-style: solid; - border-color: #7ef07e; + border-color: var(--hili); padding: 1.1%; - background: #1a1a1a; - color: #7ef07e; + background: var(--back); + color: var(--link); text-align: center; padding: 1% 0 1% 0; } @@ -161,8 +176,8 @@ textarea { } .success { - background-color: green; - color: white; + background-color: var(--link); + color: var(--back); } .alert { @@ -197,9 +212,11 @@ select { border: 1px solid; background-color: #1a1a1a; color: #7ef07e; + width: 100%; } article { + font-family: monospace; border: none; border-radius: 40px; border-left: 2px dashed #672178; @@ -232,9 +249,8 @@ article { .main{ position: fixed; top: 48px; -/* background-color: #2a2a2a;*/ - background-color: #000000; - bottom: 62px; + background-color: var(--back); + bottom: 32px; width: auto; right: 0vw; left: 0vw; @@ -242,7 +258,7 @@ article { padding-right: 2vw; padding-top: 1vh; padding-bottom: 1vh; - max-height: 80vh; + max-height: 90vh; height: auto; min-height: 45vh; overflow-y: auto; @@ -284,30 +300,27 @@ h1 { padding: 2px; overflow-y: auto; display: flex; - align-items: end; - background: #cacaca; + /* background: #cacaca; */ width: 100%; - color:rgb(51, 200, 234); + color: var(--text); } .button { border: 0px; padding: 7px; - color: white; + color: var(--text); } button { -/* color: rgb(51, 200, 234);*/ - color: rgb(0, 255, 231); + color: var(--text); text-decoration: none; - font-family: 'Hack Nerd Font'; - border: 1px solid #17392e; + font-family: 'Doto'; padding: 10px; margin: 1px; cursor: pointer; display: flex; - background: #000000; - border: 1px solid #17392e; + background: var(--back); + border: 1px solid var(--link); padding: 1vh 1vw; margin: 1px; width: auto; @@ -319,8 +332,9 @@ button { } button:hover { - background: #535353; - border-color: #eef7ff; + background: var(--text); + color: var(--back); + border-color: var(--extr); } #mobile-menu { @@ -341,7 +355,7 @@ button:hover { #double-floor { display: flex; - flex-direction: column; + flex-direction: row; } .upper-floor { @@ -361,7 +375,7 @@ button:hover { article hr { border: none; border-top-width: 1px; - border-top-color: #672178; + border-top-color: var(--hili); border-top-style: dotted; margin-left: 0vw; margin-right: 0vw; @@ -370,7 +384,7 @@ article hr { hr { border: none; border-top-width: 1px; - border-top-color: #7ef07e; + border-top-color: var(--hili); border-top-style: dashed; margin-left: 10vw; margin-right: 10vw; @@ -394,14 +408,15 @@ audio { } summary { - background-color: #080808; + background-color: var(--back); padding: 4px; + word-break: break-all; } details { - border: 2px solid #3a3a3a; - background-color: #000000; - padding: 0px; + border: 2px solid var(--hili); + background-color: var(--back); + padding: 5px; } #logs-area-element { @@ -409,17 +424,13 @@ details { } .zchain-details { - border: 2px solid #672178; + border: 2px solid var(--hili); padding: 24px; } + #settings-section { gap: 5px; flex-direction: column; -/* - flex-wrap: wrap; - justify-content: space-between; - align-items: flex-start; -*/ } #settings-section div { @@ -434,18 +445,11 @@ details { } #settings-section button {} -footer { - position: absolute; - right: 0; - bottom: 0; - padding: 2px; - text-align: right; -} -.footer { +#footer { margin: 0px; font-size: medium; position: fixed; - height: 62px; + height: 32px; display: flex; justify-content: center; align-items: center; @@ -456,6 +460,7 @@ footer { width: -moz-available; width: -webkit-fill-available; } + @media (max-width: 850px) { #double-floor { flex-direction: column; @@ -476,7 +481,7 @@ footer { top: 0px; z-index: 0; align-items: center; - background-color: #1a1a1a8a; + background-color: var(--back); height: 100%; width: 100%; } @@ -492,13 +497,13 @@ footer { } } -@media (max-width: 880px) { - .footer { - font-size: smaller; +@media (max-width: 960px) { + #footer { + font-size: 8px; gap: 0px; flex-direction: column; } - .footer span { + #footer span { display: none; } } @@ -517,10 +522,7 @@ footer { margin: 0px; padding: 1vh 4vw; display: flex; - flex-direction: row; - flex-wrap: wrap; - justify-content: space-between; - align-content: flex-start; + flex-direction: column; } #home-grid { @@ -538,3 +540,198 @@ footer { align-items: center; justify-content: center; } + +.manual-scan { + display: flex; + flex-direction: row; + justify-content: start; + align-items: center; + flex-wrap: wrap; + gap: 5px; +} + +.where-am-i { + height: 32px; + display: flex; + flex-direction: row; + align-items: center; + gap: 10px; +} + +.where-am-i img { + height: 32px; + display: flex; + flex-direction: row; +} + +#results-header { + display: flex; + flex-direction: row; + justify-content: space-between; + align-items: center; + align-content: center; + flex-wrap: wrap; +} + +/* Radio CSS */ +* { + padding: 0px; + margin: 0; +} + +#radio-main div { + display: flex; + flex-direction: column; + gap: 0px; +} + +#radio-main { + order: 2; + gap: 10px; +} + +#radio-main .div-groups-row { + display: flex; + flex-direction: row; + align-items: center; +} + +#radio-main progress { + width: auto; +} + +#radio-main button { + /* + background: var(--back); + border: dotted 2px; + color: var(--text); + */ + border: solid 2px var(--hili); + font-family: 'Doto'; + width: 100%; + font-size: 24px; +} + +#radio-main .no-break { + display: flex; + flex-direction: row; + flex-wrap: nowrap; + word-break: none; +} + +#radio-main button:hover { + background: var(--hili); + color: var(--text); + border: solid 2px var(--text); +} + +#radio-main pre { + border: 1px dotted; + overflow-x: auto; + padding: 0.5vh 1vw; +} + +#radio-main details { + border: 1px dotted; + padding: 1vh 2vw; + width: 88vh; +} + +#radio-main summary { + border-bottom: 1px dotted; + padding: 0.5vh 1vw; +} + +#radio-main summary:hover { + background-color: lightgreen; + color: black; +} + +#radio-main .start-top { + display: flex; + flex-direction: row; + flex-wrap: wrap; + justify-content: space-evenly; + align-items: flex-start; + gap: 10px; +} + +#radio-main .previously-played { + flex-direction: column-reverse; + overflow-y: auto; + height: 40vh; + gap: 5px; +} + +#radio-main .div-row { + flex-direction: row; + align-items: center; + justify-content: center; + flex-wrap: wrap; +} + +#radio-main .previously-played img { + width: 48px; +} + +#radio-main .previously-played div { + gap: 5px; +} + + +#radio-main .previously-played div:hover { + background-color: lightgreen; + color: black; +} + +#radio-main .div-inline-reverse { + display: flex; + flex-direction: row-reverse; + flex-wrap: wrap; + align-items: center; + justify-content: space-evenly; +} + +#radio-main .div-inline { + display: flex; + flex-direction: row; + flex-wrap: wrap; + align-items: center; + justify-content: space-evenly; +} + +#radio-main table { + width: 100%; +} + +#radio-main th, #radio-main td { + background-color: black; + padding: 2px; +} + +#radio-main tr { + background-color: black; + display: flex; + flex-direction: row; + flex-wrap: nowrap; + justify-content: space-between; + borde |