From 748c931c827c09bc59b776e41d27643af9cac332 Mon Sep 17 00:00:00 2001
From: Jake Vanderwerf <get@jakevanderwerf.ca>
Date: Thu, 28 May 2026 19:15:07 +0000
Subject: [PATCH] =gitblit setup
---
dash.css | 429 +++++++++++++++++++++--------------------------------
1 files changed, 168 insertions(+), 261 deletions(-)
diff --git a/dash.css b/dash.css
index cc105ef..3a181d2 100644
--- a/dash.css
+++ b/dash.css
@@ -1,93 +1,58 @@
-header > a {
- margin: 0 auto;
+.replace {
+ margin-left: var(--btn_)!important;
+}
+
+.dashboard aside.main.left {
+ bottom: 0;
+}
+.dashboard .qtoggle {
+ left: 0;
+ bottom: 0;
+ margin: 0!important;
}
nav.sidebar {
+ --wrap: nowrap;
+ --align: flex-start;
position: fixed;
- top: var(--btn);
bottom: 0;
- left: 0;
+ top: var(--btn);
z-index: var(--z-4);
+ height: calc(100% - var(--btn));
background-color: rgb(var(--base));
box-shadow: rgba(var(--base), var(--op-45)) var(--shdw);
width: var(--btn);
transition: var(--trans-size);
overflow: hidden auto;
- height: 100%;
+ margin-left: 0!important;
padding-bottom: var(--btn);
}
- nav.sidebar > ul {
- --gap: 0;
+ nav.sidebar.left {
+ left: 0;
}
- nav.sidebar .toggle.main.main {
- padding: 0;
- position: fixed;
- left: unset;
- bottom: 0;
+ nav.sidebar.right {
right: 0;
- z-index: var(--z-8);
- box-shadow: rgba(var(--base), var(--op-45)) var(--shdw);
- width: var(--btn);
- height: var(--btn);
}
- nav.sidebar .toggle.main .icon {
- --w: 1.2em;
- }
- nav.sidebar .toggle:not(.main) {
- display: none;
- }
- nav.sidebar.open .toggle:not(.main) {
- display: inline-flex;
- }
+
nav.sidebar .icon {
--w: var(--chip_);
- width: var(--btn);
- min-width: var(--chip);
- transition: var(--trans-size), transform var(--trans-base);
- }
- nav.sidebar.open .icon {
- --w: var(--chip);
width: var(--w);
+ transition: var(--trans-size);
}
nav.sidebar.open {
width: fit-content;
- max-width: 100%;
+ max-width: 85vw;
}
-
+ nav.sidebar.open .icon {
+ --w: var(--chip);
+ }
nav.sidebar ul {
height: max-content;
width: 100%;
--gap: 0;
- }
-
- nav.sidebar .toggle {
- width: var(--btn);
- height: var(--chipchip);
- box-shadow: none;
- background-color: transparent;
- min-height: 0;
- }
- nav.sidebar .toggle:hover,
- nav.sidebar .toggle:focus {
- background-color: rgb(var(--action-0));
- color: var(--action-contrast);
- }
-
-
- nav.sidebar .title {
- max-width: 0;
- opacity: 0;
- transition: max-width var(--trans-base);
- }
- nav.sidebar.open .title {
- white-space: nowrap;
- max-width: max-content;
- opacity: 1;
- }
- nav.sidebar .icon {
- min-width: var(--chip_);
+ --dir: column;
}
nav.sidebar li {
@@ -95,224 +60,162 @@
--wrap: nowrap;
--align: flex-start;
overflow: hidden;
+ height: max-content;
}
- nav.sidebar.open li >div {
+ nav.sidebar ul ul {
+ max-height: 0;
+ overflow: hidden;
+ transform: scaleY(0);
+ transform-origin: top;
+ transition: var(--trans-base);
+ }
+ nav.sidebar li.open > ul {
+ max-height: max-content;
+ transform: scaleY(1);
+ }
+ nav.sidebar.open li > div {
width: 100%;
padding-right: var(--btn);
}
- nav.sidebar .has-submenu {
- height: max-content;
- }
- nav.sidebar li ul {
- width: 0;
- }
- nav.sidebar li.open ul {
- width: max-content;
- }
nav.sidebar.open li.has-submenu > div {
padding-right: 0;
}
- nav.sidebar.open li.has-submenu > ul {
- padding-left: var(--chip);
- }
-
- nav.sidebar .a {
- color: rgb(var(--contrast-200));
- }
- nav.sidebar a,
- nav.sidebar .a {
- height: var(--chipchip);
- display: flex;
- justify-content: center;
- align-items: center;
- transition: none;
- padding-left: 0;
- }
- nav.sidebar.open a,
- nav.sidebar.open .a {
- width: 100%;
- justify-content: flex-start;
+ nav.sidebar.open li.has-submenu > ul {
+ padding-left: var(--chip);
}
- nav.sidebar .has-submenu ul {
- max-height: 0;
- height: 0;
- overflow: hidden;
- transition: var(--trans-size);
+ nav.sidebar .title {
+ display: none;
}
- nav.sidebar .has-submenu.open > ul {
- height: 100%;
- max-height: fit-content;
+ nav.sidebar.open .title {
+ display: block;
+ white-space: nowrap;
}
-
-
-/** Queue Modifications **/
-aside.main.main#queue {
- bottom: 0;
-}
-
-button.qtoggle.sticky {
- bottom: 0;
- left: 0;
-}
-
-section.replace {
- margin: 0 var(--btn_) 0 calc(var(--btn) + var(--chipchip));
-}
- section.replace > * {
- max-width: 100%;
- }
-
- .dashboard :is(h1,h2,h3,h4,h5,h6) {
- text-transform: none;
- margin: .5em 0 1em;
- }
-
-ul.dashboard {
- margin: 0;
- padding: 0;
- display: flex;
- justify-content: flex-start;
- gap: .5rem;
- flex-wrap: wrap;
-}
- ul.dashboard li {
- list-style: none;
- }
- ul.dashboard p {
- margin: 0;
- }
-
- .dashboard main > footer,
- .dashboard .main-actions {
- position: absolute;
- left: var(--offScreen);
- width: 0;
- padding: 0;
- }
-
-/** FILTERS **/
-.all-filters {
- margin: 1rem 0;
- padding: 1rem 0;
- border: 1px solid rgb(var(--base-100));
- border-width: 1px 0;
- --gap: 0;
- width: 100%;
-}
- .all-filters summary {
- width: 100%;
- }
- .all-filters summary:hover {
- color: rgb(var(--action-0));
- }
-
- .all-filters .row {
+ nav.sidebar a {
--justify: flex-start;
}
- .all-filters + [data-action="clear-filters"] {
- --w: 1em;
- width: max-content;
- font-size: var(--txt-x-small);
- min-height: var(--chip);
- margin-left: auto;
- display: block;
- position: relative;
- top: -1rem;
+ nav.sidebar .a {
+ gap: .5rem;
+ display:flex;
+ width: 100%;
+ justify-content: flex-start;
+ align-items: center;
+ min-height: var(--btn);
+ padding: var(--padding);
}
+ nav.sidebar .toggle:not(.main) {
+ display: none;
+ width: var(--btn);
+ height: var(--chipchip);
+
+ }
+ nav.sidebar.open .toggle {
+ display: flex;
+ }
+ nav.sidebar .toggle.main {
+ position: fixed;
+ left: unset;
+ bottom: 0;
+ right: 0;
+ width: var(--btn);
+ height: var(--btn);
+ z-index: var(--z-8);
+ box-shadow: rgba(var(--base), var(--op-45)) var(--shdw);
+ }
-.all-filters [data-action="refresh"] {
- margin-left: auto;
- --w: 1em!important;
- flex-wrap: nowrap;
- width: max-content;
- justify-content:flex-start;
- transition: var(--trans-size);
- min-height: var(--chip);
+/**********************************************************************
+FILTERS
+**********************************************************************/
+
+/*** details.all-filters ALL FILTERS ***/
+.all-filters {
font-size: var(--txt-x-small);
}
- .all-filters [data-action="refresh"]:focus,
- .all-filters [data-action="refresh"]:hover {
- width: max-content;
- }
- .all-filters [data-action="refresh"] span {
- max-width: 0;
- transition: var(--trans-size);
- overflow: hidden;
- white-space: nowrap;
- }
- .all-filters [data-action="refresh"]:focus span,
- .all-filters [data-action="refresh"]:hover span {
- max-width: max-content;
- }
-
-
-.all-filters .btn + label {
- box-shadow: var(--shdw-none);
- color: rgb(var(--contrast-200));
+.all-filters[open] {
+ border: 2px solid rgb(var(--action-0));
+ padding: 0;
+ border-radius: 0 0 var(--radius-outer) var(--radius-outer);
}
-.all-filters .radio-options input:not(.ch):checked + label {
- box-shadow: rgba(var(--base),var(--op-6)) var(--shdw-inset);
- color: rgb(var(--contrast-50));
- border-color: rgb(var(--contrast-50));
+.all-filters[open] summary,
+.all-filters summary:hover {
+ background-color: rgb(var(--action-0));
+ color: rgb(var(--action-contrast));
}
-
-
-
-.all-filters .filters{
+.all-filters summary:hover::after {
+ background-color: rgb(var(--action-contrast));
+}
+.all-filters summary {
width: 100%;
}
-.filters.row.start,
-.controls .radio-options {
- --align: center;
- --justify: flex-start;
- --gap: .5rem;
+.all-filters >.row.row {
+ padding: 0 .75rem;
+ width: var(--content);
+ position: relative;
}
-.all-filters span.label {
+.all-filters > .row > .label,
+.all-filters > .row > .row > .label {
+ font-family: var(--heading);
+ font-weight: var(--fw-h-bold);
text-transform: uppercase;
- font-size: var(--txt-small);
- font-weight: 900;
- width: 15vw;
- display: inline-flex;
- align-items: center;
- padding-right: 2rem;
}
-@media (max-width: 767px) {
- .all-filters > .row {
- padding: .5rem 0;
- }
- .all-filters span.label {
- padding-top: .5rem;
- width: 100%;
- border-top: 1px solid rgb(var(--base-200));
- }
+.all-filters > .row > .label {
+ width: 20%;
}
-.controls .icon {
- --w: 1.4rem;
+.all-filters > .row > .row > .label {
+ white-space: nowrap;
}
-.all-filters .btn + label,
-.all-filters button {
- height: var(--chip_);
- padding: .125rem!important;
- min-width: 0;
- min-height: var(--chip_);
- width: var(--chip_);
+
+.all-filters button,
+.all-filters .btn + label {
+ width: var(--chipchip);
+ min-height: var(--chipchip);
+ padding: 0;
}
-.all-filters > .row {
- padding: .25rem 0;
+.all-filters button,
+.all-filters .btn + label {
+ position: unset;
}
-.all-filters .btn + label:hover,
-.all-filters .btn + label:focus,
-.all-filters button:hover,
-.all-filters button:focus {
- background-color: transparent;
- color: rgb(var(--action-0));
- border-color: rgb(var(--action-0));
+.all-filters button .label,
+.all-filters .row:has(> .btn:not(:checked) + label:hover) :checked + label .label,
+.btn + label .label {
+ position: absolute;
+ top: 2rem;
+ left: 1rem;
+ width: max-content;
+ white-space: nowrap;
+ opacity: 0;
+ z-index: var(--z-4);
}
-/******************************************************
+.all-filters .radio-options.order > .row {
+ position: relative;
+ padding-bottom: 2rem;
+}
+.all-filters .radio-options .row .btn + label .label {
+ bottom: 0;
+ top: unset;
+ left: 0;
+ height: max-content;
+}
+
+.all-filters button:hover .label,
+.btn:checked + label .label,
+.btn + label:hover .label {
+ opacity: 1;
+}
+.all-filters .radio-options.order > .row {
+ max-width: 49%;
+}
+.all-filters .radio-options.order {
+ margin-top: 1rem;
+}
+.all-filters .filters >.row,
+.all-filters .filters select {
+ width: max-content;
+}
+/**********************************************************************
SEARCH
-******************************************************/
+**********************************************************************/
.search-container:not(.open) input[type=search],
.search-container:not(.open) .clear-search {
@@ -340,18 +243,22 @@
width: 100%;
}
-/********************************************************
-TABS
-********************************************************/
-nav.tabs {
- position: fixed;
- z-index:var(--z-4);
- width: calc(100% - var(--btn));
- top: var(--btn);
- left: var(--btn);
- background-color: rgba(var(--base), var(--op-45));
- box-shadow: rgba(var(--base), var(--op-6)) var(--shdw-down);
+
+section.main-actions.main-actions {
+ padding: 0;
+ position:absolute;
+ left: var(--offScreen);
}
-.replace:has(nav.tabs) {
- margin-top: var(--btn);
+
+.dashboard main>footer {
+ padding: 0;
+ margin: 0;
+ position: absolute;
+ left: var(--offScreen);
+}
+
+.item .select-item-label {
+ width: 100%;
+ height: 100%;
+ aspect-ratio: 1;
}
\ No newline at end of file
--
Gitblit v1.10.0