=gitblit setup

Jake Vanderwerf

4 hours ago 748c931c827c09bc59b776e41d27643af9cac332

 all.css

@@ -76,6 +76,8 @@
    Colours
    *****************************/
    --filter: grayscale(.3) sepia(.4);
    --filterNone: grayscale(0) sepia(0);

    --mix-blend-mode: darken;
    --coverBlend: overlay;
    --coverIndex: 2;
@@ -375,6 +377,7 @@
        inline-size: fit-content;
        margin-inline: auto;
    }
    a > img,
    figure img {
        width: 100%;
        height: 100%;
@@ -628,7 +631,7 @@
*************************************************************/
html {
    scroll-behavior: smooth;
    overflow-x: hidden;
    overflow-x: clip;
}

@media(prefers-reduced-motion){
@@ -952,7 +955,7 @@
    }

    :is(p, li, h1,h2,h3,h4,h5,h6, small) a:hover {
        color: var(--action-contrast);
        color: rgb(var(--action-contrast));
        background-color: rgb(var(--action-0));
    }

@@ -1035,7 +1038,7 @@
    }
        .term-list.cloud a:hover,
        .term-list.cloud a:focus {
            color: var(--action-contrast);
            color: rgb(var(--action-contrast));
            background-color: rgb(var(--action-0));
        }
        .term-list a:has(.count) {
@@ -1049,7 +1052,7 @@
            /*aspect-ratio: 1;*/
            font-size: var(--txt-small);
            /*background-color: rgb(var(--action-0));*/
            /*color: var(--action-contrast);*/
            /*color: rgb(var(--action-contrast));*/
        }

.term-list li {
@@ -1480,10 +1483,10 @@
.abs { position: absolute; }
*:has(>.abs) { position: relative; }

.top { top: 0; right: 0; left: 0; }
.abs.top { top: 0; right: 0; left: 0; }
.top-right { top: 0; right: 0; }
.top-left { top: 0; left: 0; }
.btm { bottom: 0; left: 0; right: 0; }
.abs.btm { bottom: 0; left: 0; right: 0; }
.btm-right { bottom: 0; right: 0; }
.btm-left { bottom: 0; left: 0; }
.edges { inset: 0; }
@@ -1901,7 +1904,7 @@
.buttons a:visited:hover,
.buttons a:focus {
    background-color: rgb(var(--action-0));
    color: var(--action-contrast);
    color: rgb(var(--action-contrast));
    box-shadow: var(--shdw-none);
}

@@ -1918,7 +1921,7 @@
    .buttons .outline a:visited:hover,
    .buttons .outline a:focus {
        background-color: rgb(var(--action-0));
        color: var(--action-contrast);
        color: rgb(var(--action-contrast));
        border-color: rgb(var(--action-0));
    }

@@ -2011,7 +2014,7 @@
    button.sticky:hover,
    button.sticky:focus {
        background-color: rgba(var(--action-0),var(--op-6));
        color: var(--action-contrast);
        color: rgb(var(--action-contrast));
    }
        .main-actions .buttons button:disabled,
        .main-actions .buttons button:disabled:hover,
@@ -2037,7 +2040,7 @@
        .main .m-actions .refresh:hover,
        .main .m-actions .refresh:focus {
            background-color: rgb(var(--action-0));
            color: var(--action-contrast);
            color: rgb(var(--action-contrast));
        }
        .main .refresh .indicator {
            background-color: rgba(var(--base), var(--op-3));
@@ -2076,6 +2079,17 @@
body:has(.on-this-page).scroll-up.scroll-up #back-to-top {
    bottom: calc(var(--btn) + var(--chip_));
}
body:has(.fixed.bottom):has(nav.index.on-this-page).scroll-up.scroll-up #back-to-top {
    bottom: calc(var(--btn) + var(--chipchip));
}

button[data-action=refresh],
button.clear-filters {
    width: max-content;
    min-height: var(--chip_);
    --w: var(--txt-small);
    padding: .25rem .5rem;
}
/******************************************************************
ACCESSIBILITY
******************************************************************/
@@ -2136,6 +2150,8 @@
[type=radio] + label,
[type=checkbox] + label {
    cursor: pointer;
    position: relative;
    padding-left: 1.5rem;
}
.field:is(.radio,.checkbox) fieldset {
    display: grid;
@@ -2164,6 +2180,11 @@
        color: rgb(var(--action-0));
    }

    [type=radio].btn + label:hover,
    [type=radio].btn:checked + label:hover {
        color: rgb(var(--action-contrast));
    }

    [type=radio] + label::before,
    [type=radio] + label::after,
    [type=checkbox] + label::before,
@@ -2182,7 +2203,7 @@
            transform: rotate(45deg);
            width: .25em;
            height: .75em;
            border: solid var(--action-contrast);
            border: solid rgb(var(--action-contrast));
            border-width: 0 2px 2px 0;
            display: none;
        }
@@ -2276,7 +2297,7 @@
    }
.field:not(.radio):not(.checkbox):not(.true-false):not(.taglist):focus-within > label {
    background-color:rgb(var(--action-0));
    color: var(--action-contrast);
    color: rgb(var(--action-contrast));
    border-radius: 4px;
}

@@ -2586,6 +2607,9 @@
    box-shadow: rgba(var(--base),var(--op-45)) var(--shdw);
    z-index: var(--z-5);
}
aside.expanded {
    margin: 0!important;
}
dialog::backdrop {
    backdrop-filter: blur(5px);
    background-color: rgba(var(--base),var(--op-4));
@@ -2599,7 +2623,7 @@
dialog[open] {
    z-index: var(--z-10);
    --padding: 0;
    top: 5vh;
    margin: auto!important;
    width: min(500px, 95vw);
    height: fit-content;
    max-height: 90vh;
@@ -2613,9 +2637,11 @@
        max-height: 98vh;
        top: 1vh;
    }
    dialog > .wrap {
    dialog > .wrap.wrap {
        max-height: var(--maxHeight);
        overflow: hidden auto;
        flex-wrap: nowrap;
        justify-content: flex-start;
        margin: 0 0 0 1.5rem;
        padding-right: 1.5rem;
        padding-bottom: var(--btn);
@@ -2654,7 +2680,7 @@
        box-shadow: none;
        width: 100%;
        background-color: rgb(var(--action-0));
        color: var(--action-contrast);
        color: rgb(var(--action-contrast));
        --gap: .75rem;
        font-size: var(--txt-x-small);
        border-radius: 0;
@@ -2671,14 +2697,98 @@
        .m-actions button:last-of-type {
            border-bottom-right-radius: 1rem;
        }
    dialog ul {
    dialog li {
        list-style: none;
        padding: 0;
    }
    dialog .search-container {
        padding-top: 1rem;
        width: 100%;
        gap: .5rem;
    }
    dialog header {
        width: 100%;
        text-align: center;
        font-size: var(--txt-x-medium);
        height: var(--chipchip);
    }
        dialog header h2 {
            margin: 0;
        }
        /** SELECTOR **/
        .selected-items {
            width: 100%;
            padding: .5rem;
            border-radius: var(--radius);
            background-color: rgb(var(--base));
            --justify: flex-start;
            --gap: .5rem;
            margin-bottom: .5rem;
        }
            .selected-items button {
                width: max-content;
                padding: .125rem .5rem;
                font-size: var(--txt-x-small);
                min-height: var(--chip_);
            }
                .selected-items button .icon-x {
                    --w: var(--txt-small);
                    align-self: flex-start;
                }
            .selected-items.selected-items:empty {
                padding: 0;
                background-color: transparent;
                margin: 0;
            }
            .selected-item.selected-item {
                padding: .25rem .5rem;
                margin: .125em;
                background-color: rgb(var(--base-100));
                border-radius: .25rem;
                font-size: var(--txt-medium);
                border: 1px solid rgb(var(--base-200));
                position: relative;
                width: max-content;
            }
                .selected-item button {
                    min-height: 0;
                    height: var(--chip);
                    width: var(--chip);
                    padding: 0;
                    --w: var(--txt-small);
                }
            .clear-filters {
                margin-left: auto;
                border: 1px solid var(--base-200);
            }
            #jvb-selector .message {
                width: 100%;
                text-align: center;
            }
            #jvb-selector .items-wrap {
                width: 100%;
                padding: 1rem 0;
                border: 1px solid rgb(var(--base-200));
                border-width: 1px 0;
            }
            #jvb-selector .items-container {
                display: grid;
                grid-template-columns: repeat(2, 1fr);
                margin: 0;
            }

            .autocomplete-dropdown {
                width: 100%;
                background-color: var(--base-100);
                padding: .5rem;
                box-shadow: rgba(var(--base), var(--op-45)) var(--shdw);
            }
                li.autocomplete {
                    list-style: none;
                    display: inline-flex;
                    margin: .25rem;
                    min-height: var(--chip);
                }

    /** GALLERY **/
    img[data-gallery] {
@@ -2855,9 +2965,9 @@
ul.gallery {
    display: flex;
    flex-wrap: wrap;
    margin: .2em;
    padding: 0;
    list-style-type: none;
    margin: .2em!important;
    padding: 0!important;
    max-width: 100vw;
}
    ul.gallery::after {
        content: '';
@@ -2867,9 +2977,12 @@

    ul.gallery li {
        flex-grow: 1;
        list-style: none;
        height: 40vh;
        margin: .2em;
        overflow: hidden;
        padding: 0;
        max-width:49%;
    }

    ul.gallery figure {
@@ -2906,6 +3019,35 @@
                height: 80vh;
            }
        }

    ul.gallery.cut {
        --gap: var(--txt-small);
        display: grid;
        max-width: var(--narrow);
        grid: auto-flow 1fr/repeat(3, 1fr);
        gap: var(--gap);
    }
        ul.gallery.cut img {
            filter: var(--filterNone);
        }
        ul.gallery.cut:hover img {
            filter: var(--filter);
        }
        ul.gallery.cut:hover img:hover {
            filter: var(--filterNone);
        }
            ul.gallery.cut li:nth-of-type(4n +2) {
                grid-area: 1/2/span 2/span 2;
                clip-path: polygon(0 0,100% 0,100% 100%,calc(50% + var(--g)/4) 100%,0 calc(50% - var(--g)/4));
            }
            ul.gallery.cut li:nth-of-type(4n +3) {
                grid-area: 2/1/span 2/span 2;
                clip-path: polygon(0 0,calc(50% - var(--g)/4) 0,100% calc(50% + var(--g)/4),100% 100%,0 100%);
            }




/*** POPUPS: notifications, cart, queue ***/
aside.main.main {
    --wrap: nowrap;
@@ -2944,7 +3086,7 @@
        aside.main header {
            --w: 2em;
            background-color: rgb(var(--action-0));
            color: var(--action-contrast);
            color: rgb(var(--action-contrast));
            padding: 1rem;
        }
        .tab-content header {
@@ -2973,7 +3115,7 @@
            }
            nav.share a:hover {
                background-color: rgb(var(--action-0));
                color: var(--action-contrast);
                color: rgb(var(--action-contrast));
            }
        aside.main h4,
        aside.main .hint {
@@ -3157,7 +3299,7 @@

.callout.callout {
    background-color: rgb(var(--action-0));
    color: var(--action-contrast);
    color: rgb(var(--action-contrast));
}

.callalt.callalt {
@@ -3174,7 +3316,7 @@
}

.callout a {
    background-color: var(--action-contrast);
    background-color: rgb(var(--action-contrast));
    padding: 0 .125rem;
    border-radius: 4px;
}
@@ -3376,7 +3518,7 @@
    position: relative;
    padding: var(--btn);
}
    blockquote .icon {
    blockquote .icon-quotes-fi {
        position: absolute;
        top: var(--btn);
        left: calc((10vw + var(--btn)) * -1);
@@ -3424,13 +3566,26 @@
}

.loop li > figure {
    float: left;
    margin-right: var(--chip_);
    margin-top: 0;
    max-width: 30%;
    /*float: left;*/
    /*margin-right: var(--chip_);*/
    /*margin-top: 0;*/
    /*max-width: 30%;*/
    aspect-ratio: 1;
}

.loop.scroll {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    touch-action: pan-x;
    margin:0!important;
}
    a:has(img) {
        display:block;
        padding: .25rem;
    }


.no-results p,
.no-results {
    display: flex;
@@ -3445,6 +3600,7 @@
*********************************************************/
.directory-list > ul {
    max-width: none;
    margin-left: 0!important;
}
.directory-list .image {
    display: flex;