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 | 783 +++++++++++++++----------------------------------------
1 files changed, 222 insertions(+), 561 deletions(-)
diff --git a/dash.css b/dash.css
index 6ed6b8e..3a181d2 100644
--- a/dash.css
+++ b/dash.css
@@ -1,201 +1,221 @@
-:target {
- outline: none!important;
- padding: 0!important;
-}
-.dashboard > header {
- justify-content: flex-end;
-}
-.dashboard > header img {
- width: var(--height);
-}
-.dashboard h1:first-of-type {
- margin-top: 4rem!important;
-}
-main > footer {
- max-width: 100%!important;
- position: fixed;
- z-index: var(--z-top);
- bottom: 0;
- left: 0;
- right: 0;
- width: 100%;
- margin: 4rem 0 0 0!important;
- height: var(--height);
- padding: 0!important;
- background-color: var(--base);
- box-shadow: var(--shadow);
-}
-main>* {
- max-width: min(768px, 90vw)!important;
- margin: 0 auto!important;
-}
-main h1 {
- margin: 0!important;
- font-size: var(--large);
+.replace {
+ margin-left: var(--btn_)!important;
}
-.item-grid .item {
+.dashboard aside.main.left {
+ bottom: 0;
+}
+.dashboard .qtoggle {
+ left: 0;
+ bottom: 0;
+ margin: 0!important;
+}
+
+nav.sidebar {
+ --wrap: nowrap;
+ --align: flex-start;
+ position: fixed;
+ bottom: 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;
+ margin-left: 0!important;
+ padding-bottom: var(--btn);
+}
+ nav.sidebar.left {
+ left: 0;
+ }
+ nav.sidebar.right {
+ right: 0;
+ }
+
+ nav.sidebar .icon {
+ --w: var(--chip_);
+ width: var(--w);
+ transition: var(--trans-size);
+ }
+
+ nav.sidebar.open {
+ width: fit-content;
+ max-width: 85vw;
+ }
+ nav.sidebar.open .icon {
+ --w: var(--chip);
+ }
+
+ nav.sidebar ul {
+ height: max-content;
+ width: 100%;
+ --gap: 0;
+ --dir: column;
+ }
+
+ nav.sidebar li {
+ --justify: center;
+ --wrap: nowrap;
+ --align: flex-start;
+ overflow: hidden;
+ height: max-content;
+ }
+ 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.open li.has-submenu > div {
+ padding-right: 0;
+ }
+ nav.sidebar.open li.has-submenu > ul {
+ padding-left: var(--chip);
+ }
+ nav.sidebar .title {
+ display: none;
+ }
+ nav.sidebar.open .title {
+ display: block;
+ white-space: nowrap;
+ }
+
+ nav.sidebar a {
+ --justify: flex-start;
+ }
+ 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);
+ }
+
+
+/**********************************************************************
+FILTERS
+**********************************************************************/
+
+/*** details.all-filters ALL FILTERS ***/
+.all-filters {
+ font-size: var(--txt-x-small);
+}
+.all-filters[open] {
+ border: 2px solid rgb(var(--action-0));
+ padding: 0;
+ border-radius: 0 0 var(--radius-outer) var(--radius-outer);
+}
+.all-filters[open] summary,
+.all-filters summary:hover {
+ background-color: rgb(var(--action-0));
+ color: rgb(var(--action-contrast));
+}
+.all-filters summary:hover::after {
+ background-color: rgb(var(--action-contrast));
+}
+.all-filters summary {
+ width: 100%;
+}
+.all-filters >.row.row {
+ padding: 0 .75rem;
+ width: var(--content);
position: relative;
}
-img {
- width: 100%;
- height: auto;
- aspect-ratio: 1;
- object-fit: cover;
-}
-
-.replace {
- margin-bottom: var(--offHeight)!important;
-}
-/********************************************
-GRID VIEW
-********************************************/
-.item-grid {
- margin-bottom: 4rem;
-}
-.item-grid:has(.select-item:checked) .item {
- padding: .75rem;
- opacity : .8;
- filter: var(--filter);
-}
-.item-grid .item:has(.select-item:checked) {
- padding: .5rem;
- filter: none;
- opacity: 1;
- background-color: var(--action-0);
-}
-
-.grid-view .item > input[type=checkbox]:not(.label-button) + label {
- padding-left: 0;
- margin: 0;
-}
-.grid-view .item > input[type=checkbox] + label::before {
- transform: unset;
- top: .5rem;
- left: .5rem;
-}
-.grid-view .item > input[type=checkbox] + label::after {
- top: .5rem;
- left: .75rem;
- transform: translateY(20%) rotate(45deg);
-}
-
-.grid-view .item .item-actions {
- position: absolute;
- bottom: 0;
- right: 0;
-}
-
-.list-view h3,
-.list-view p {
- margin: 0!important;
-}
-
-@media (min-width: 768px) {
- .grid-view {
- grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
- }
- .grid-view .item .item-actions {
- bottom: unset;
- top: 0;
- }
-}
-.bulk-controls {
- margin: 1rem 0;
-}
-.bulk-controls .selected-count {
- font-weight: normal;
- font-size: var(--small);
- text-transform: none;
- font-style: italic;
- display: flex;
- gap: .25rem;
- margin-left: 2rem;
-}
-.selected-count::before {
- content: '{';
-}
-.selected-count::after {
- content: '}';
-}
-
-.bulk-edit-form .selected {
- display: grid;
- grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
- gap: 4px;
-}
-.selected label {
- padding: .5rem;
- opacity: .6;
- filter: var(--filter);
- border: 2px solid transparent;
- transition: filter var(--transition-base), opacity var(--transition-base), border var(--transition-base), padding var(--transition-base);
-}
-.selected label:has(:checked) {
- border-color: var(--action-0);
- padding: 0;
- opacity: 1;
- filter: none;
- transition: filter var(--transition-base), opacity var(--transition-base), border var(--transition-base), padding var(--transition-base);
-}
-/******************************************************
-TABLE VIEW
-******************************************************/
-form.table img {
- max-height: 4rem;
-}
-
-/******************************************************
-FILTERS
-******************************************************/
-.all-filters {
- margin: 2rem 0;
- padding: 1rem 0;
- border-top: 1px solid var(--base-200);
- border-bottom: 1px solid var(--base-200);
-}
-details.uploader + .items-list .all-filters {
- border-top: none;
-}
-.all-filters .filters{
- width: 100%;
-}
-.filters.row.start,
-.controls .radio-options {
- --align: center;
- --justify: flex-start;
- --gap: .5rem;
-}
-.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(--small);
- font-weight: 900;
- width: 15vw;
- display: inline-flex;
- align-items: center;
- padding-right: 2rem;
}
-.controls .icon {
- --w: 1.4rem;
+.all-filters > .row > .label {
+ width: 20%;
}
-.all-filters .btn + label,
-.all-filters button {
- height: fit-content;
- padding: .5rem!important;
- min-width: 0;
- min-height: 0;
+.all-filters > .row > .row > .label {
+ white-space: nowrap;
}
-.all-filters .btn + label:hover,
-.all-filters .btn + label:focus,
-.all-filters button:hover,
-.all-filters button:focus {
- background-color: transparent;
- color: var(--action-0);
- border-color: var(--action-0);
+
+.all-filters button,
+.all-filters .btn + label {
+ width: var(--chipchip);
+ min-height: var(--chipchip);
+ padding: 0;
}
-/******************************************************
+.all-filters button,
+.all-filters .btn + label {
+ position: unset;
+}
+.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 {
@@ -203,7 +223,7 @@
transform-origin: left;
width: 0;
padding: 0;
- transition: transform var(--transition-base), width var(--transition-base), padding var(--transition-base);
+ transition: transform var(--trans-base), width var(--trans-base), padding var(--trans-base);
}
.search-container button {
padding: .5rem;
@@ -215,7 +235,7 @@
.search-container.open .clear-search {
transform: scaleX(1);
transform-origin: left;
- transition: transform var(--transition-base), width var(--transition-base), padding var(--transition-base);
+ transition: transform var(--trans-base), width var(--trans-base), padding var(--trans-base);
}
.all-filters > .search,
input[type=search],
@@ -223,381 +243,22 @@
width: 100%;
}
-/***********************************************************
-TABLE FIELDS
-***********************************************************/
-form.table textarea {
- width: 250px;
- padding: .5rem;
-}
-.multi-select summary {
- --gap: 2rem;
- padding-right: 2.5rem;
-}
-
-/************************************************************
-TABS
-************************************************************/
-dialog.edit[open],
-dialog.bulk-edit[open],
-dialog.create[open] {
- height: 85vh;
- top: 5vh;
-}
-.tab-content h2 {
- display: none;
-}
-
-/**********************************************************
-HOURS
-**********************************************************/
-.group-fields.hours .group-fields,
-.group-fields.hours .group-fields .field {
- display: flex;
- justify-content: space-between;
- align-items: center;
-}
-.group-fields.hours .group-fields {
- padding: 1rem .5rem;
- gap: 1rem;
-}
-.group-fields.hours .group-fields:nth-of-type(2n+1) {
- background-color: var(--base);
-}
-.group-fields.hours .group-fields .field {
- margin: 0;
-}
-
-.group-fields.hours .true-false {
- flex: 1;
-}
-.group-fields.hours .time {
- position: relative;
-}
-.group-fields.hours .time label {
- margin: 0;
- font-size: var(--small);
- position: absolute;
- top: -1rem;
- left: 0;
- color: var(--contrast-200);
-}
-/************************************************************
-TODAY HOURS, specific to North'eh
-************************************************************/
-.today_hours {
- width: min(500px, 90vw);
-}
-.today_hours .group-fields {
- width: 100%;
+section.main-actions.main-actions {
padding: 0;
- display: flex;
- justify-content: center;
- gap: .5rem;
+ position:absolute;
+ left: var(--offScreen);
}
-@media (min-width: 768px) {
- .today_hours .group-fields {
- padding: 2rem;
- }
-}
-.today_hours .field {
+
+.dashboard main>footer {
+ padding: 0;
margin: 0;
-}
-.dash .true-false {
- margin: 0;
-}
-.dash [type=submit] {
- width: 90%;
-}
-.dashboard.dash h2 {
- text-transform: none;
- font-size: var(--large);
-}
- .dashboard.dash .replace > ul {
- display: flex;
- list-style: none;
- align-items: flex-start;
- justify-content: flex-start;
- flex-wrap: wrap;
- gap: .5rem;
- }
-.dashboard.settings nav.tabs {
- --height: 3.5rem;
- --x: var(--offHeight);
- position: fixed;
- bottom: var(--height);
- left: var(--x);
- right: var(--x);
- z-index:99;
- width: calc(100% - var(--x) - var(--x));
- background-color: var(--base);
-}
-nav.integrations ul,
-nav.integrations li,
-nav.integrations a,
-nav.integrations {
- height: auto;
-}
-
-/***************************************
-
-***************************************/
-.replace {
- overflow: hidden;
-}
-body.dash form#options {
- display: flex;
- flex-flow: column nowrap;
- justify-content: center;
- align-items: center;
-}
-
-/***************************************
- INTEGRATIONS
-***************************************/
-.item-grid.integrations {
- grid-template-columns: repeat(2, 1fr);
- gap: 2rem;
-}
-.integration {
- background: var(--base);
- border: 2px solid var(--base-200);
- border-radius: var(--outerRadius);
- padding: 1rem;
- position: relative;
- transition: all var(--transition-base);
- box-shadow: var(--shadow);
-}
-.integration.connected {
- border-color: var(--success);
-}
-.integration.error,
-.integration.disconnected {
- border-color: var(--error);
-}
-.integration.hasChanges {
- border-color: var(--warning);
-}
-.integration .header {
- margin-bottom: .75rem;
- padding-bottom: .75rem;
- border-bottom: 2px solid var(--base-200);
-}
-.integration h3 {
- letter-spacing: 1px;
- font-size: var(--medium);
- margin: 0;
-}
-.integration .meta {
- margin-bottom: 1rem;
- text-align: right;
- color: var(--contrast-200);
- font-size: var(--small);
-}
-
-.integration .setup {
- font-size: var(--small);
- font-weight: bold;
- text-transform: uppercase;
-}
-.integration .setup .indicator {
- font-size: var(--medium);
-}
-.integration .connected .indicator,
-.integration .setup .connected {
- color: var(--success);
-}
-.integration .disconnected .indicator,
-.integration .setup .disconnected {
- color: var(--error);
-}
-.integration.hasChanges .disconnected {
- color: var(--warning);
-}
-
-.connection-status.connected {
- background-color: var(--successBack);
- color: var(--successText);
-}
-.connection-status.disconnected {
- background-color: var(--errorBack);
- color: var(--errorText);
-}
-
-.integration code {
- display: inline-block;
- width: 90%;
- margin: 0 .5rem;
- user-select: all;
- padding: .75rem;
- border: 2px solid var(--base);
- background-color: var(--base-200);
- word-break: break-all;
-}
-.integration details + details {
- margin-top: 1rem;
-}
-.integration .actions {
- margin-top: 1rem;
-}
-
-.hint {
- line-height: 1.2;
- font-style: italic;
- font-size: var(--small);
-}
-
-.hasChanges button[data-action=save_credentials] {
- border-color: var(--warning);
- animation: pulse-color 1s infinite;
- animation-delay: 1s;
-}
-
-.flash {
- animation: flash .5s;
-}
-.flash.connected {
- --b: var(--success);
-}
-.flash.disconnected {
- --b: var(--error);
-}
-.flash.syncing {
- --b: var(--success);
-}
-.flash.hasChanges,
-.flash.error {
- --b: var(--warning);
-}
-
-@keyframes flash {
- 0%, 100% {border-color: inherit}
- 50% {border-color: var(--b)}
-}
-
-.location.field {
- width: 80vw;
-}
-.location.field > p {
- text-align: center;
-}
-.location.field > p + p {
- margin: 0 .5rem 0 0;
-}
-.location.field .location-map {
- height: 20vh;
-}
-.location.field .location-links {
- padding: .5rem 0;
- display: flex;
- justify-content: space-evenly;
-}
-
-.item-grid .item,
-.field.upload [data-upload-id] {
- touch-action: none;
-}
-
-.empty-state {
- grid-column: 1/-1;
- padding: 1rem 10vw;
- margin: 0 10vw;
- border-radius: var(--outerRadius);
- background-color: var(--base-100);
-}
-
-/****************** TEST ***/
-.jvb-oauth-connect {
- position: relative;
- transition: opacity 0.2s;
-}
-
-.jvb-oauth-connect.loading {
- opacity: 0.6;
- pointer-events: none;
-}
-
-.jvb-oauth-connect.loading::after {
- content: '';
position: absolute;
- right: -30px;
- top: 50%;
- transform: translateY(-50%);
- width: 16px;
- height: 16px;
- border: 2px solid #ccc;
- border-top-color: #0073aa;
- border-radius: 50%;
- animation: oauth-spin 0.8s linear infinite;
+ left: var(--offScreen);
}
-@keyframes oauth-spin {
- to { transform: translateY(-50%) rotate(360deg); }
-}
-
-/* Status Messages */
-.integration-status-message {
- padding: 12px 16px;
- margin: 16px 0;
- border-radius: 4px;
- display: none;
- font-size: 14px;
- line-height: 1.5;
-}
-
-.integration-status-message.success {
- display: block;
- background: #d4edda;
- color: #155724;
- border-left: 4px solid #28a745;
-}
-
-.integration-status-message.error {
- display: block;
- background: #f8d7da;
- color: #721c24;
- border-left: 4px solid #dc3545;
-}
-
-.integration-status-message.info {
- display: block;
- background: #d1ecf1;
- color: #0c5460;
- border-left: 4px solid #17a2b8;
-}
-
-/* Connection Status Indicator */
-.connection-status {
- display: inline-flex;
- align-items: center;
- gap: 8px;
- padding: 6px 12px;
- border-radius: 4px;
- font-size: 13px;
- font-weight: 500;
-}
-
-.connection-status.connected {
- background: #d4edda;
- color: #155724;
-}
-
-.connection-status.disconnected {
- background: #f8d7da;
- color: #721c24;
-}
-
-.status-indicator {
- font-size: 10px;
- line-height: 1;
-}
-
-.connection-status.connected .status-indicator {
- color: #28a745;
-}
-
-.connection-status.disconnected .status-indicator {
- color: #dc3545;
-}
-
+.item .select-item-label {
+ width: 100%;
+ height: 100%;
+ aspect-ratio: 1;
+}
\ No newline at end of file
--
Gitblit v1.10.0