diff options
Diffstat (limited to 'assets')
| -rw-r--r-- | assets/css/advent.css | 67 | ||||
| -rw-r--r-- | assets/css/auth.css | 46 | ||||
| -rw-r--r-- | assets/css/button.css | 34 | ||||
| -rw-r--r-- | assets/css/charsheet.css (renamed from assets/charsheet/charsheet.css) | 2 | ||||
| -rw-r--r-- | assets/css/gizmo.css | 35 | ||||
| -rw-r--r-- | assets/css/greencircle.css | 124 | ||||
| -rw-r--r-- | assets/css/jam.css | 48 | ||||
| -rw-r--r-- | assets/css/pubnix-index.css | 94 | ||||
| -rw-r--r-- | assets/css/register.css | 77 | ||||
| -rw-r--r-- | assets/css/shared.css | 30 | ||||
| -rw-r--r-- | assets/css/soundboard.css | 55 | ||||
| -rw-r--r-- | assets/css/throwshade.css | 69 | ||||
| -rw-r--r-- | assets/fonts/iosevka-comfy-regular.ttf (renamed from assets/iosevka-comfy-regular.ttf) | bin | 7811628 -> 7811628 bytes | |||
| -rw-r--r-- | assets/images/debtclonk.png (renamed from assets/debtclonk.png) | bin | 3900843 -> 3900843 bytes | |||
| -rw-r--r-- | assets/images/icon.png (renamed from assets/icon.png) | bin | 983 -> 983 bytes | |||
| -rw-r--r-- | assets/images/l.png (renamed from assets/l.png) | bin | 2511 -> 2511 bytes | |||
| -rw-r--r-- | assets/images/mrblue.png (renamed from assets/mrblue.png) | bin | 771 -> 771 bytes | |||
| -rw-r--r-- | assets/images/mrgreen.png (renamed from assets/mrgreen.png) | bin | 714 -> 714 bytes | |||
| -rw-r--r-- | assets/images/mrred.png (renamed from assets/mrred.png) | bin | 768 -> 768 bytes | |||
| -rw-r--r-- | assets/images/rectangular.jpg (renamed from assets/rectangular.jpg) | bin | 92324 -> 92324 bytes | |||
| -rw-r--r-- | assets/images/test.gif (renamed from assets/test.gif) | bin | 3763 -> 3763 bytes | |||
| -rw-r--r-- | assets/images/upload.gif (renamed from assets/upload.gif) | bin | 4597 -> 4597 bytes | |||
| -rw-r--r-- | assets/js/charsheet/charsheet.js (renamed from assets/charsheet/charsheet.js) | 0 | ||||
| -rw-r--r-- | assets/js/charsheet/gl-matrix-min.js (renamed from assets/charsheet/gl-matrix-min.js) | 0 | ||||
| -rw-r--r-- | assets/main.css | 733 |
25 files changed, 680 insertions, 734 deletions
diff --git a/assets/css/advent.css b/assets/css/advent.css new file mode 100644 index 0000000..c6097b8 --- /dev/null +++ b/assets/css/advent.css @@ -0,0 +1,67 @@ +/* advent */ +#lcolonq-advent { + overflow-y: scroll; + color: white; + background-color: black; + min-height: 100vh; + height: auto; + display: flex; + flex-direction: column; + align-items: center; +} +#lcolonq-advent-container { + height: 100%; + margin-left: 3rem; + margin-right: 3rem; +} +.lcolonq-advent-header { + text-align: center; + padding-bottom: 1rem; +} +.lcolonq-advent-header h1 { + margin-top: 0rem; + margin-bottom: 0rem; + font-size: 15vw; +} +.lcolonq-advent-subtitle { + font-weight: bold; +} +.lcolonq-advent-body { + margin-left: auto; + margin-right: auto; + max-width: 40rem; + text-align: justify; +} +.lcolonq-advent-link { + text +} +.lcolonq-advent-puzzle { + display: block; + text-decoration: none; + color: white; + border: solid; + border-color: white; + margin-top: 1rem; + padding: 0.5rem; +} +.lcolonq-advent-puzzle:hover { + background-color: #111111; +} +.lcolonq-advent-puzzle h3 { + margin: 0px; +} +.lcolonq-advent-puzzle-author { + font-weight: bold; +} +.lcolonq-advent-puzzle-body { + margin-left: 1rem; + margin-right: 1rem; +} +.lcolonq-advent-link { + text-decoration: none; + color: white; + font-weight: bold; +} +.lcolonq-advent-submit { + display: none; +} diff --git a/assets/css/auth.css b/assets/css/auth.css new file mode 100644 index 0000000..20ab50d --- /dev/null +++ b/assets/css/auth.css @@ -0,0 +1,46 @@ +/* auth */ +.lcolonq-auth { + position: absolute; + top: 0px; + left: 0px; + display: grid; + width: 100%; + height: 100%; + grid-template-rows: 1fr 1fr 1fr 1fr; + grid-template-columns: 1fr 2fr 1fr; +} + +.lcolonq-auth-box-outer { + grid-row: 2; + grid-column: 2; +} + +.lcolonq-auth-box { + display: flex; + justify-content: center; + gap: 1rem; +} + +.lcolonq-auth-box h1 { + margin-top: 0rem; +} + +#lcolonq-auth-submit { + display: none; +} + +#lcolonq-auth-below { + text-align: center; +} + +#lcolonq-auth-register { + font-size: 0.7rem; + color: CanvasText; +} + +#lcolonq-auth-error { + grid-row: 3; + grid-column: 2; + text-align: center; + color: red; +} diff --git a/assets/css/button.css b/assets/css/button.css new file mode 100644 index 0000000..2a918fd --- /dev/null +++ b/assets/css/button.css @@ -0,0 +1,34 @@ +/* button */ +body.lcolonq-button-body { + background-color: #eeeeee; + user-select: none; +} + +.lcolonq-button { + position: absolute; + height: 90vh; + width: 40vw; + object-fit: fill; + image-rendering: pixelated; + border: dotted #888888; + margin-top: 5vh; + margin-bottom: 5vh; + margin-left: 5vw; + margin-right: 5vw; +} + +a.lcolonq-button-link :hover { + background-color: #cccccc; +} + +a.lcolonq-button-link :active { + background-color: #aaaaaa; +} + +#lcolonq-button-green { + left: 0px; +} + +#lcolonq-button-red { + right: 0px; +} diff --git a/assets/charsheet/charsheet.css b/assets/css/charsheet.css index 753ea55..e973732 100644 --- a/assets/charsheet/charsheet.css +++ b/assets/css/charsheet.css @@ -1,6 +1,6 @@ @font-face { font-family: "Iosevka Comfy"; - src: url("../iosevka-comfy-regular.ttf") format("truetype"); + src: url("../fonts/iosevka-comfy-regular.ttf") format("truetype"); } @media (max-width: 768px) { diff --git a/assets/css/gizmo.css b/assets/css/gizmo.css new file mode 100644 index 0000000..91c6188 --- /dev/null +++ b/assets/css/gizmo.css @@ -0,0 +1,35 @@ +/* gizmo */ +#lcolonq-gizmo-body { + width: 100vw; + height: 100vh; +} +#lcolonq-gizmo { + width: 100%; + height: 100%; +} +#lcolonq-gizmo-top { + position: absolute; + opacity: 0; + transition: opacity 0.2s ease-in-out; + right: 0px; + top: 0px; + color: white; + background-color: black; + padding-top: 1rem; + padding-left: 1rem; + padding-right: 1rem; + padding-bottom: 1rem; +} +#lcolonq-gizmo-top:hover { + opacity: 1; +} +#lcolonq-gizmo-bottom { + background-color: white; + width: 100%; + height: 100%; +} +#lcolonq-gizmo-contents { + border: none; + width: 100%; + height: 100%; +} diff --git a/assets/css/greencircle.css b/assets/css/greencircle.css new file mode 100644 index 0000000..d884cb9 --- /dev/null +++ b/assets/css/greencircle.css @@ -0,0 +1,124 @@ +/* greencircle */ +#lcolonq-gc-body { + overflow-y: scroll; + height: auto; +} + +#lcolonq-gc-hero { + height: 100vh; + display: flex; + flex-direction: column; + align-items: center; +} + +#lcolonq-gc-spin { + height: 60vh; + width: 60vh; + margin-top: 20vh; + margin-bottom: 20vh; + display: grid; + place-items: center; +} + +#lcolonq-gc-logo { + grid-area: 1 / 1; + margin-top: 2vh; + margin-left: 8vh; + height: 100%; + image-rendering: pixelated; +} + +#lcolonq-gc-spin-image { + grid-area: 1 / 1; + animation: spin 40s linear infinite; + margin-left: 2vh; + height: 250%; + width: 250%; + user-select: none; + pointer-events: none; +} + +@keyframes spin { + 100% { + transform: rotate(360deg); + } +} + +@media (max-width : 320px) { + #lcolonq-gc-logo { + max-width: 60vw; + max-height: 60vw; + } + #lcolonq-gc-spin-image { + height: 160%; + width: 160%; + } +} + +#lcolonq-gc-explainer { + text-align: justify; + padding-left: 1rem; + padding-right: 1rem; + height: 100vh; + mask-image: linear-gradient(180deg, white 50%, transparent 95%); + overflow: hidden; +} + +#lcolonq-gc-explainer h1 { + text-align: center; + font-size: 1.9rem; +} + +#lcolonq-gc-relentless { + text-align: justify; + padding-left: 1rem; + padding-right: 1rem; + text-align: center; +} + +#lcolonq-gc-relentless h1 { + font-size: 1.9rem; +} + +#lcolonq-gc-panels { + margin-left: 1rem; + margin-right: 1rem; + margin-bottom: 1rem; + display: grid; + justify-content: center; + grid-template-columns: repeat(auto-fit, 15rem); + grid-auto-rows: minmax(10rem, auto); + gap: 1rem; +} + +@media (max-width : 320px) { + #lcolonq-gc-panels { + grid-template-columns: 1fr; + } +} + +.lcolonq-gc-panel { + border: solid black; + color: inherit; + text-decoration: none; + padding: 1rem; + display: none; + cursor: pointer; +} + +.lcolonq-gc-panel:hover { + background-color: #eeeeee; +} + +.lcolonq-gc-visible { + display: block; +} + +.lcolonq-gc-panel h2 { + text-align: center; +} + +.lcolonq-gc-now { + font-weight: bold; + color: red; +} diff --git a/assets/css/jam.css b/assets/css/jam.css new file mode 100644 index 0000000..0cc2e0a --- /dev/null +++ b/assets/css/jam.css @@ -0,0 +1,48 @@ +#lcolonq-jam { + overflow: scroll; + text-align: justify; +} + +.lcolonq-jam-cool { + text-transform: lowercase; +} + +a { + text-decoration: none; + font-weight: bold; + color: black; +} + +#lcolonq-jam h1 { + text-align: center; +} +#lcolonq-jam h2 { + text-align: center; +} +#lcolonq-jam h4 { + margin: 0px; +} +#lcolonq-jam-content { + max-width: 34rem; + margin-left: auto; + margin-right: auto; + padding-left: 1rem; + padding-right: 1rem; +} + +.lcolonq-green { + color: green; +} + +.lcolonq-jam-subtitle { + margin-top: -1.4rem; + text-align: center; + font-size: 0.8em; + color: darkgrey; +} + +#lcolonq-jam-footer { + text-align: center !important; + font-size: 0.5em; + color: darkgrey; +} diff --git a/assets/css/pubnix-index.css b/assets/css/pubnix-index.css new file mode 100644 index 0000000..987f2cc --- /dev/null +++ b/assets/css/pubnix-index.css @@ -0,0 +1,94 @@ +/* pubnix-index */ +body.lcolonq-pubnix-index { + font-family: "Iosevka Comfy"; + font-weight: bold; + color: black; + user-select: none; + image-rendering: pixelated; + background-color: #eeeeee; + background-size: 40px 40px; + background-image: + linear-gradient(to right, grey 1px, transparent 1px), + linear-gradient(to bottom, grey 1px, transparent 1px); +} + +body.lcolonq-pubnix-index-obs { + background-color: rbga(0,0,0,0); +} + +#lcolonq-pubnix-index-title { + position: absolute; + top: 2rem; + bottom: 0px; + left: 0px; + right: 0px; + text-align: center; + font-size: 20vw; +} + +.lcolonq-pubnix-index-letter { + display: inline-block; +} + +.lcolonq-pubnix-index-letter:hover { + color: #333333; +} + +#lcolonq-pubnix-index-subtitle { + font-size: 5vw; + margin-top: -5vw; + margin-right: 12vw; + text-align: right; +} + +#lcolonq-pubnix-index-header { + background-color: #cccccf; + position: absolute; + left: 0px; + right: 0px; + top: 0px; + height: 2rem; + border-bottom: 0.2rem ridge; +} + +#lcolonq-pubnix-index-header a { + color: black; +} + +#lcolonq-pubnix-index-header marquee { + color: black; + padding-top: 0.4rem; +} + +#lcolonq-pubnix-index-footer { + background-color: #cccccf; + position: absolute; + left: 0px; + right: 0px; + bottom: 0px; + height: 2rem; + border-top: 0.2rem groove; +} + +#lcolonq-pubnix-index-footer a { + display: inline-block; + color: black; + margin-top: 0.2rem; + margin-left: 0.1rem; + margin-right: 0.1rem; + padding: 0.1rem; + text-decoration: none; + border: 0.1rem outset; +} + +#lcolonq-pubnix-index-footer a:active { + border: 0.1rem inset; +} + +#lcolonq-pubnix-index-canvas { + position: absolute; + bottom: 2rem; + left: 0px; + width: 832px; + height: 832px; +} diff --git a/assets/css/register.css b/assets/css/register.css new file mode 100644 index 0000000..c384e6a --- /dev/null +++ b/assets/css/register.css @@ -0,0 +1,77 @@ +/* register */ +#lcolonq-register-container { + position: absolute; + top: 0px; + left: 0px; + display: grid; + width: 100%; + height: 100%; + grid-template-rows: 1fr 1fr 1fr; + grid-template-columns: 1fr 2fr 1fr; +} + +#lcolonq-register-box { + grid-row: 2; + grid-column: 2; + display: flex; + flex-direction: column; + align-items: center; +} + +#lcolonq-register-link { + width: max-content; + text-align: center; + display: block; + background-color: #6441a5; + border-radius: 0.5rem; + color: white; + background-color: #6441a5; + border-radius: 0.5rem; + padding: 10px; + cursor: pointer; + user-select: none; +} + +#lcolonq-register-link:hover { + background-color: #533094; +} + +#lcolonq-registered-container { + position: absolute; + top: 0px; + left: 0px; + display: grid; + width: 100%; + height: 100%; + grid-template-rows: 1fr 1fr 1fr; + grid-template-columns: 1fr 2fr 1fr; +} + +#lcolonq-registered-box { + grid-row: 2; + grid-column: 2; + display: flex; + justify-content: center; +} + +.lcolonq-registered-fieldname { + font-weight: bold; +} + +#lcolonq-register-error-container { + position: absolute; + top: 0px; + left: 0px; + display: grid; + width: 100%; + height: 100%; + grid-template-rows: 1fr 1fr 1fr; + grid-template-columns: 1fr 2fr 1fr; +} + +#lcolonq-register-error-box { + grid-row: 2; + grid-column: 2; + display: flex; + justify-content: center; +} diff --git a/assets/css/shared.css b/assets/css/shared.css new file mode 100644 index 0000000..aed4cc7 --- /dev/null +++ b/assets/css/shared.css @@ -0,0 +1,30 @@ +/* shared */ +@font-face { + font-family: "Iosevka Comfy"; + src: url("../fonts/iosevka-comfy-regular.ttf") format("truetype"); +} + +html { + font-family: "Iosevka Comfy"; + font-size: 16pt; +} + +body { + overflow: hidden; + margin: 0 !important; + padding: 0 !important; + height: 100%; + width: 100%; +} + +.right { + float: right; +} + +.lcolonq-invisible { + visibility: hidden; +} + +.lcolonq-reverse { + transform: scale(-1, 1); +} diff --git a/assets/css/soundboard.css b/assets/css/soundboard.css new file mode 100644 index 0000000..9e5b966 --- /dev/null +++ b/assets/css/soundboard.css @@ -0,0 +1,55 @@ +/* soundboard */ +#lcolonq-soundboard { + color: white; + background-color: black; + overflow-y: scroll; + height: auto; + min-height: 100vh; + display: flex; + flex-direction: column; + align-items: center; +} +#lcolonq-soundboard-container { + top: 0px; + width: min(90vw, 30rem); + height: 100%; +} +#lcolonq-soundboard-entryframe { + overflow: hidden; + margin-top: 3rem; + margin-bottom: 3rem; + margin-left: 2rem; + margin-right: 2rem; +} +#lcolonq-soundboard-entry { + font-size: 30pt; + width: calc(100% - 2.2rem); + padding: 1rem; + color: white; + background-color: #111111; + border: 0.1rem solid darkgrey; +} +#lcolonq-soundboard-entry:focus { + outline: none; +} +#lcolonq-soundboard-entrytext { + white-space: nowrap; + color: darkgrey; +} +#lcolonq-soundboard-docs { + display: grid; + gap: 1rem; + grid-auto-flow: dense; + grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); + grid-auto-rows: minmax(10rem, auto); + margin-bottom: 1rem; +} +.lcolonq-soundboard-doc { + border: 0.1rem solid darkgrey; + padding: 0.5rem; +} +.lcolonq-soundboard-doc h3 { + text-align: center; + margin-top: 0px; + margin-bottom: 0.5rem; +} diff --git a/assets/css/throwshade.css b/assets/css/throwshade.css new file mode 100644 index 0000000..d49b3b4 --- /dev/null +++ b/assets/css/throwshade.css @@ -0,0 +1,69 @@ +/* throwshade */ +#lcolonq-throwshade-body { + overflow-y: scroll; +} +#lcolonq-throwshade { + height: 100vh; + display: flex; + flex-direction: column; + justify-content: space-evenly; + /* background-image: url("./assets/rectangular.jpg"); */ + background-color: darkgray; + background-size: 100% 100%; +} +.lcolonq-throwshade-canvas { + width: 100%; + height: 60%; + display: flex; + flex-direction: column; + justify-content: space-evenly; +} +.lcolonq-throwshade-canvas canvas { + margin: auto; + display: block; + width: auto; + height: 100%; + image-rendering: pixelated; +} +#lcolonq-throwshade-bottom { + flex-grow: 1; + height: 40%; + display: flex; + flex-direction: row; + justify-content: space-evenly; + padding-top: 0.6rem; +} +#lcolonq-throwshade-bottom-left { + flex-grow: 1; + padding-bottom: 1rem; + padding-left: 0.7rem; + padding-right: 1rem; +} +#lcolonq-throwshade-textarea { + width: 100%; + height: 100%; + resize: none; + border: none; + overflow: auto; + outline: none; + box-shadow: none; + color: white; + background-color: rgb(0 0 0 / 0.8); +} +#lcolonq-throwshade-bottom-right { + flex-grow: 1; + padding-bottom: 1rem; + padding-left: 0.7rem; + padding-right: 1rem; + display: flex; + flex-direction: column; + justify-content: space-evenly; + max-width: 40%; +} +#lcolonq-throwshade-bottom-right img { + cursor: pointer; + height: 40%; +} +#lcolonq-throwshade-current { + margin: 0.5rem; +} diff --git a/assets/iosevka-comfy-regular.ttf b/assets/fonts/iosevka-comfy-regular.ttf Binary files differindex b474adc..b474adc 100644 --- a/assets/iosevka-comfy-regular.ttf +++ b/assets/fonts/iosevka-comfy-regular.ttf diff --git a/assets/debtclonk.png b/assets/images/debtclonk.png Binary files differindex dd56bd7..dd56bd7 100644 --- a/assets/debtclonk.png +++ b/assets/images/debtclonk.png diff --git a/assets/icon.png b/assets/images/icon.png Binary files differindex 0431e3f..0431e3f 100644 --- a/assets/icon.png +++ b/assets/images/icon.png diff --git a/assets/l.png b/assets/images/l.png Binary files differindex 7533019..7533019 100644 --- a/assets/l.png +++ b/assets/images/l.png diff --git a/assets/mrblue.png b/assets/images/mrblue.png Binary files differindex 8cf2a0b..8cf2a0b 100644 --- a/assets/mrblue.png +++ b/assets/images/mrblue.png diff --git a/assets/mrgreen.png b/assets/images/mrgreen.png Binary files differindex 1f1edca..1f1edca 100644 --- a/assets/mrgreen.png +++ b/assets/images/mrgreen.png diff --git a/assets/mrred.png b/assets/images/mrred.png Binary files differindex 966cd1b..966cd1b 100644 --- a/assets/mrred.png +++ b/assets/images/mrred.png diff --git a/assets/rectangular.jpg b/assets/images/rectangular.jpg Binary files differindex 5b7f79f..5b7f79f 100644 --- a/assets/rectangular.jpg +++ b/assets/images/rectangular.jpg diff --git a/assets/test.gif b/assets/images/test.gif Binary files differindex b386852..b386852 100644 --- a/assets/test.gif +++ b/assets/images/test.gif diff --git a/assets/upload.gif b/assets/images/upload.gif Binary files differindex e4994a3..e4994a3 100644 --- a/assets/upload.gif +++ b/assets/images/upload.gif diff --git a/assets/charsheet/charsheet.js b/assets/js/charsheet/charsheet.js index c43a2b2..c43a2b2 100644 --- a/assets/charsheet/charsheet.js +++ b/assets/js/charsheet/charsheet.js diff --git a/assets/charsheet/gl-matrix-min.js b/assets/js/charsheet/gl-matrix-min.js index 747b3a7..747b3a7 100644 --- a/assets/charsheet/gl-matrix-min.js +++ b/assets/js/charsheet/gl-matrix-min.js diff --git a/assets/main.css b/assets/main.css deleted file mode 100644 index 1376a18..0000000 --- a/assets/main.css +++ /dev/null @@ -1,733 +0,0 @@ -/* shared */ -@font-face { - font-family: "Iosevka Comfy"; - src: url("./iosevka-comfy-regular.ttf") format("truetype"); -} - -html { - font-family: "Iosevka Comfy"; - font-size: 16pt; -} - -body { - overflow: hidden; - margin: 0 !important; - padding: 0 !important; - height: 100%; - width: 100%; -} - -.right { - float: right; -} - -.lcolonq-invisible { - visibility: hidden; -} - -.lcolonq-reverse { - transform: scale(-1, 1); -} - -/* pubnix-index */ -body.lcolonq-pubnix-index { - font-family: "Iosevka Comfy"; - font-weight: bold; - color: black; - user-select: none; - image-rendering: pixelated; - background-color: #eeeeee; - background-size: 40px 40px; - background-image: - linear-gradient(to right, grey 1px, transparent 1px), - linear-gradient(to bottom, grey 1px, transparent 1px); -} - -body.lcolonq-pubnix-index-obs { - background-color: rbga(0,0,0,0); -} - -#lcolonq-pubnix-index-title { - position: absolute; - top: 2rem; - bottom: 0px; - left: 0px; - right: 0px; - text-align: center; - font-size: 20vw; -} - -.lcolonq-pubnix-index-letter { - display: inline-block; -} - -.lcolonq-pubnix-index-letter:hover { - color: #333333; -} - -#lcolonq-pubnix-index-subtitle { - font-size: 5vw; - margin-top: -5vw; - margin-right: 12vw; - text-align: right; -} - -#lcolonq-pubnix-index-header { - background-color: #cccccf; - position: absolute; - left: 0px; - right: 0px; - top: 0px; - height: 2rem; - border-bottom: 0.2rem ridge; -} - -#lcolonq-pubnix-index-header a { - color: black; -} - -#lcolonq-pubnix-index-header marquee { - color: black; - padding-top: 0.4rem; -} - -#lcolonq-pubnix-index-footer { - background-color: #cccccf; - position: absolute; - left: 0px; - right: 0px; - bottom: 0px; - height: 2rem; - border-top: 0.2rem groove; -} - -#lcolonq-pubnix-index-footer a { - display: inline-block; - color: black; - margin-top: 0.2rem; - margin-left: 0.1rem; - margin-right: 0.1rem; - padding: 0.1rem; - text-decoration: none; - border: 0.1rem outset; -} - -#lcolonq-pubnix-index-footer a:active { - border: 0.1rem inset; -} - -#lcolonq-pubnix-index-canvas { - position: absolute; - bottom: 2rem; - left: 0px; - width: 832px; - height: 832px; -} - -/* button */ -body.lcolonq-button-body { - background-color: #eeeeee; - user-select: none; -} - -.lcolonq-button { - position: absolute; - height: 90vh; - width: 40vw; - object-fit: fill; - image-rendering: pixelated; - border: dotted #888888; - margin-top: 5vh; - margin-bottom: 5vh; - margin-left: 5vw; - margin-right: 5vw; -} - -a.lcolonq-button-link :hover { - background-color: #cccccc; -} - -a.lcolonq-button-link :active { - background-color: #aaaaaa; -} - -#lcolonq-button-green { - left: 0px; -} - -#lcolonq-button-red { - right: 0px; -} - -/* register */ -#lcolonq-register-container { - position: absolute; - top: 0px; - left: 0px; - display: grid; - width: 100%; - height: 100%; - grid-template-rows: 1fr 1fr 1fr; - grid-template-columns: 1fr 2fr 1fr; -} - -#lcolonq-register-box { - grid-row: 2; - grid-column: 2; - display: flex; - flex-direction: column; - align-items: center; -} - -#lcolonq-register-link { - width: max-content; - text-align: center; - display: block; - background-color: #6441a5; - border-radius: 0.5rem; - color: white; - background-color: #6441a5; - border-radius: 0.5rem; - padding: 10px; - cursor: pointer; - user-select: none; -} - -#lcolonq-register-link:hover { - background-color: #533094; -} - -#lcolonq-registered-container { - position: absolute; - top: 0px; - left: 0px; - display: grid; - width: 100%; - height: 100%; - grid-template-rows: 1fr 1fr 1fr; - grid-template-columns: 1fr 2fr 1fr; -} - -#lcolonq-registered-box { - grid-row: 2; - grid-column: 2; - display: flex; - justify-content: center; -} - -.lcolonq-registered-fieldname { - font-weight: bold; -} - -#lcolonq-register-error-container { - position: absolute; - top: 0px; - left: 0px; - display: grid; - width: 100%; - height: 100%; - grid-template-rows: 1fr 1fr 1fr; - grid-template-columns: 1fr 2fr 1fr; -} - -#lcolonq-register-error-box { - grid-row: 2; - grid-column: 2; - display: flex; - justify-content: center; -} - -/* menu */ -#lcolonq-menu { - overflow-y: scroll; - height: auto; - display: flex; - flex-direction: column; - align-items: center; -} - -#lcolonq-menu-grid { - top: 0px; - display: grid; - height: 100%; - grid-template-rows: max-content 4fr; - margin: 0 50px; -} - -#lcolonq-menu-header { - grid-row: 1; - grid-column: 2; - text-align: center; - padding-bottom: 1rem; -} - -#lcolonq-menu-header h1 { - margin-bottom: 0rem; -} - -#lcolonq-menu-body { - grid-row: 2; - grid-column: 2; -} - -#lcolonq-menu-body-grid { - display: grid; - grid-auto-flow: dense; - grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); - grid-auto-rows: minmax(10rem, auto); - gap: 1rem; - margin-bottom: 1rem; -} - -#lcolonq-menu-friendzone { - grid-column: 1/-1; - display: grid; - grid-auto-flow: dense; - grid-template-columns: subgrid; - grid-template-rows: auto; /* first row is just the title */ - grid-auto-rows: minmax(10rem, auto); - gap: 1rem; - outline: solid; - outline-offset: 2rem; - margin-top: 2rem; - margin-bottom: 2rem; -} - -#lcolonq-menu-friendzone-title { - grid-column: 1/-1; - text-align: center; - margin-top: 0rem; -} - -.lcolonq-menu-box { - border: solid; - border-color: black; - padding-left: 1rem; - padding-right: 1rem; - padding-bottom: 1rem; - display: flex; - flex-direction: column; - user-select: none; -} - -.lcolonq-menu-box:hover { - background-color: #eeeeee; -} - -.lcolonq-menu-box h3 { - text-align: center; - margin-top: 0.5rem; - margin-bottom: 0.5rem; -} - -.lcolonq-menu-box-long { - grid-row-end: span 2; -} - -.lcolonq-menu-box textarea { - resize: none; - margin-top: 1rem; - flex: 1; -} - -/* auth */ -.lcolonq-auth { - position: absolute; - top: 0px; - left: 0px; - display: grid; - width: 100%; - height: 100%; - grid-template-rows: 1fr 1fr 1fr 1fr; - grid-template-columns: 1fr 2fr 1fr; -} - -.lcolonq-auth-box-outer { - grid-row: 2; - grid-column: 2; -} - -.lcolonq-auth-box { - display: flex; - justify-content: center; - gap: 1rem; -} - -.lcolonq-auth-box h1 { - margin-top: 0rem; -} - -#lcolonq-auth-submit { - display: none; -} - -#lcolonq-auth-below { - text-align: center; -} - -#lcolonq-auth-register { - font-size: 0.7rem; - color: CanvasText; -} - -#lcolonq-auth-error { - grid-row: 3; - grid-column: 2; - text-align: center; - color: red; -} - -/* greencircle */ -#lcolonq-gc-body { - overflow-y: scroll; - height: auto; -} - -#lcolonq-gc-hero { - height: 100vh; - display: flex; - flex-direction: column; - align-items: center; -} - -#lcolonq-gc-spin { - height: 60vh; - width: 60vh; - margin-top: 20vh; - margin-bottom: 20vh; - display: grid; - place-items: center; -} - -#lcolonq-gc-logo { - grid-area: 1 / 1; - margin-top: 2vh; - margin-left: 8vh; - height: 100%; - image-rendering: pixelated; -} - -#lcolonq-gc-spin-image { - grid-area: 1 / 1; - animation: spin 40s linear infinite; - margin-left: 2vh; - height: 250%; - width: 250%; - user-select: none; - pointer-events: none; -} - -@keyframes spin { - 100% { - transform: rotate(360deg); - } -} - -@media (max-width : 320px) { - #lcolonq-gc-logo { - max-width: 60vw; - max-height: 60vw; - } - #lcolonq-gc-spin-image { - height: 160%; - width: 160%; - } -} - -#lcolonq-gc-explainer { - text-align: justify; - padding-left: 1rem; - padding-right: 1rem; - height: 100vh; - mask-image: linear-gradient(180deg, white 50%, transparent 95%); - overflow: hidden; -} - -#lcolonq-gc-explainer h1 { - text-align: center; - font-size: 1.9rem; -} - -#lcolonq-gc-relentless { - text-align: justify; - padding-left: 1rem; - padding-right: 1rem; - text-align: center; -} - -#lcolonq-gc-relentless h1 { - font-size: 1.9rem; -} - -#lcolonq-gc-panels { - margin-left: 1rem; - margin-right: 1rem; - margin-bottom: 1rem; - display: grid; - justify-content: center; - grid-template-columns: repeat(auto-fit, 15rem); - grid-auto-rows: minmax(10rem, auto); - gap: 1rem; -} - -@media (max-width : 320px) { - #lcolonq-gc-panels { - grid-template-columns: 1fr; - } -} - -.lcolonq-gc-panel { - border: solid black; - color: inherit; - text-decoration: none; - padding: 1rem; - display: none; - cursor: pointer; -} - -.lcolonq-gc-panel:hover { - background-color: #eeeeee; -} - -.lcolonq-gc-visible { - display: block; -} - -.lcolonq-gc-panel h2 { - text-align: center; -} - -.lcolonq-gc-now { - font-weight: bold; - color: red; -} - -/* throwshade */ -#lcolonq-throwshade-body { - overflow-y: scroll; -} -#lcolonq-throwshade { - height: 100vh; - display: flex; - flex-direction: column; - justify-content: space-evenly; - /* background-image: url("./assets/rectangular.jpg"); */ - background-color: darkgray; - background-size: 100% 100%; -} -.lcolonq-throwshade-canvas { - width: 100%; - height: 60%; - display: flex; - flex-direction: column; - justify-content: space-evenly; -} -.lcolonq-throwshade-canvas canvas { - margin: auto; - display: block; - width: auto; - height: 100%; - image-rendering: pixelated; -} -#lcolonq-throwshade-bottom { - flex-grow: 1; - height: 40%; - display: flex; - flex-direction: row; - justify-content: space-evenly; - padding-top: 0.6rem; -} -#lcolonq-throwshade-bottom-left { - flex-grow: 1; - padding-bottom: 1rem; - padding-left: 0.7rem; - padding-right: 1rem; -} -#lcolonq-throwshade-textarea { - width: 100%; - height: 100%; - resize: none; - border: none; - overflow: auto; - outline: none; - box-shadow: none; - color: white; - background-color: rgb(0 0 0 / 0.8); -} -#lcolonq-throwshade-bottom-right { - flex-grow: 1; - padding-bottom: 1rem; - padding-left: 0.7rem; - padding-right: 1rem; - display: flex; - flex-direction: column; - justify-content: space-evenly; - max-width: 40%; -} -#lcolonq-throwshade-bottom-right img { - cursor: pointer; - height: 40%; -} -#lcolonq-throwshade-current { - margin: 0.5rem; -} - -/* gizmo */ -#lcolonq-gizmo-body { - width: 100vw; - height: 100vh; -} -#lcolonq-gizmo { - width: 100%; - height: 100%; -} -#lcolonq-gizmo-top { - position: absolute; - opacity: 0; - transition: opacity 0.2s ease-in-out; - right: 0px; - top: 0px; - color: white; - background-color: black; - padding-top: 1rem; - padding-left: 1rem; - padding-right: 1rem; - padding-bottom: 1rem; -} -#lcolonq-gizmo-top:hover { - opacity: 1; -} -#lcolonq-gizmo-bottom { - background-color: white; - width: 100%; - height: 100%; -} -#lcolonq-gizmo-contents { - border: none; - width: 100%; - height: 100%; -} - -/* soundboard */ -#lcolonq-soundboard { - color: white; - background-color: black; - overflow-y: scroll; - height: auto; - min-height: 100vh; - display: flex; - flex-direction: column; - align-items: center; -} -#lcolonq-soundboard-container { - top: 0px; - width: min(90vw, 30rem); - height: 100%; -} -#lcolonq-soundboard-entryframe { - overflow: hidden; - margin-top: 3rem; - margin-bottom: 3rem; - margin-left: 2rem; - margin-right: 2rem; -} -#lcolonq-soundboard-entry { - font-size: 30pt; - width: calc(100% - 2.2rem); - padding: 1rem; - color: white; - background-color: #111111; - border: 0.1rem solid darkgrey; -} -#lcolonq-soundboard-entry:focus { - outline: none; -} -#lcolonq-soundboard-entrytext { - white-space: nowrap; - color: darkgrey; -} -#lcolonq-soundboard-docs { - display: grid; - gap: 1rem; - grid-auto-flow: dense; - grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); - grid-auto-rows: minmax(10rem, auto); - margin-bottom: 1rem; -} -.lcolonq-soundboard-doc { - border: 0.1rem solid darkgrey; - padding: 0.5rem; -} -.lcolonq-soundboard-doc h3 { - text-align: center; - margin-top: 0px; - margin-bottom: 0.5rem; -} - -/* advent */ -#lcolonq-advent { - overflow-y: scroll; - color: white; - background-color: black; - min-height: 100vh; - height: auto; - display: flex; - flex-direction: column; - align-items: center; -} -#lcolonq-advent-container { - height: 100%; - margin-left: 3rem; - margin-right: 3rem; -} -.lcolonq-advent-header { - text-align: center; - padding-bottom: 1rem; -} -.lcolonq-advent-header h1 { - margin-top: 0rem; - margin-bottom: 0rem; - font-size: 15vw; -} -.lcolonq-advent-subtitle { - font-weight: bold; -} -.lcolonq-advent-body { - margin-left: auto; - margin-right: auto; - max-width: 40rem; - text-align: justify; -} -.lcolonq-advent-link { - text -} -.lcolonq-advent-puzzle { - display: block; - text-decoration: none; - color: white; - border: solid; - border-color: white; - margin-top: 1rem; - padding: 0.5rem; -} -.lcolonq-advent-puzzle:hover { - background-color: #111111; -} -.lcolonq-advent-puzzle h3 { - margin: 0px; -} -.lcolonq-advent-puzzle-author { - font-weight: bold; -} -.lcolonq-advent-puzzle-body { - margin-left: 1rem; - margin-right: 1rem; -} -.lcolonq-advent-link { - text-decoration: none; - color: white; - font-weight: bold; -} -.lcolonq-advent-submit { - display: none; -} |
