diff options
| -rw-r--r-- | assets/css/menu.css | 92 |
1 files changed, 92 insertions, 0 deletions
diff --git a/assets/css/menu.css b/assets/css/menu.css new file mode 100644 index 0000000..d0a0828 --- /dev/null +++ b/assets/css/menu.css @@ -0,0 +1,92 @@ +/* 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; +} |
