=switching over

Jake Vanderwerf

4 days ago 4f48b9154270c83324ef6c98f990adbcbe59d073

 formsBackup.css

@@ -213,7 +213,7 @@
.datetime-wrapper input[type=datetime-local]:focus,
.date-wrapper input[type=date]:focus {
    border-color: var(--action-0);
    box-shadow: 0 0 0 2px rgba(var(--action-rgb), .1);
    box-shadow: 0 0 0 2px rgba(var(--action-0), .1);
}

.field-input-wrapper .icon,
@@ -651,7 +651,7 @@
    padding: 2rem;
    text-align: center;
    transition: all .3s ease;
    background: rgba(var(--action-rgb),var(--op-1));
    background: rgba(var(--action-0),var(--op-1));
    position: relative;
    cursor: pointer;
}
@@ -662,7 +662,7 @@
.empty-group,
.file-upload-wrapper:hover,
.dragover {
    background: rgba(var(--action-rgb),var(--op-2));
    background: rgba(var(--action-0),var(--op-2));
    border-color: var(--action-0)!important;
}

@@ -755,7 +755,7 @@
.item-grid.preview:has([type=checkbox]:checked),
.item-grid.group:has([type=checkbox]:checked) {
    padding: 1rem;
    background-color: rgba(var(--contrast-rgb),var(--op-1));
    background-color: rgba(var(--contrast),var(--op-1));
}
.item-grid.restore:has([type=checkbox]:checked) .item,
.item-grid.preview:has([type=checkbox]:checked) .item,
@@ -777,7 +777,7 @@
.item-grid.preview .item:has([type=checkbox]:checked),
.item-grid.group .item:has([type=checkbox]:checked) {
    padding: .5rem;
    background-color: rgba(var(--action-rgb), var(--op-4));
    background-color: rgba(var(--action-0), var(--op-4));
    opacity: 1;
}

@@ -831,7 +831,7 @@
    background-image: var(--dashed-action);
    padding: 5px;
    border-radius: var(--radius);
    background-color: rgba(var(--action-rgb), var(--op-1));
    background-color: rgba(var(--action-0), var(--op-1));
}
.upload-group .selected .field {
    margin: 0;
@@ -846,7 +846,7 @@
    right: var(--btn_);
    z-index: var(--z-6);
    height: var(--btn);
    box-shadow: rgba(var(--base-rgb),var(--op-45)) var(--shdw);
    box-shadow: rgba(var(--base),var(--op-45)) var(--shdw);
    border-radius: var(--radius);
    animation: pulse-color 5s infinite;
    animation-delay: 1s;
@@ -869,7 +869,7 @@
    cursor: pointer;
    transition: all var(--trans-base);
    text-align: center;
    background-color: rgba(var(--action-rgb), var(--op-1));
    background-color: rgba(var(--action-0), var(--op-1));
}

.group-display:not([hidden]) ~ .file-upload-container {
@@ -885,7 +885,7 @@
}

.dragover {
    background: rgba(var(--action-rgb),var(--op-3))!important;
    background: rgba(var(--action-0),var(--op-3))!important;
    border-color: var(--action-0) !important;
    transform: scale(1.05);
    animation: drop-pulse .8s infinite ease-in-out;
@@ -915,7 +915,7 @@
    left: 0;
    background: var(--base);
    border-radius: var(--radius-outer);
    box-shadow: rgba(var(--base-rgb),var(--op-45)) var(--shdw);
    box-shadow: rgba(var(--base),var(--op-45)) var(--shdw);
}

.drag-preview .drag-items .drag-item:nth-child(1) {
@@ -979,7 +979,7 @@
    justify-content: center;
    font-size: 12px;
    font-weight: bold;
    box-shadow: rgba(var(--base-rgb),var(--op-45)) var(--shdw);
    box-shadow: rgba(var(--base),var(--op-45)) var(--shdw);
    z-index: var(--z-3);
}

@@ -998,11 +998,11 @@

@keyframes drop-pulse {
    0%, 100% {
        background-color: rgba(var(--action-rgb),var(--op-3));
        background-color: rgba(var(--action-0),var(--op-3));
        transform: scale(1.02);
    }
    50% {
        background-color: var(rgba(var(--action-rgb),var(--op-4)));
        background-color: var(rgba(var(--action-0),var(--op-4)));
        transform: scale(1.04);
    }
}
@@ -1047,7 +1047,7 @@
        left: -.5rem;
        right: -.5rem;
        position: absolute;
        background-color: rgba(var(--base-rgb), var(--op-6));
        background-color: rgba(var(--base), var(--op-6));
        filter: blur(5px);
    }

@@ -1097,9 +1097,9 @@
        position: absolute;
        left: 0;
        right: 0;
        background-color: rgba(var(--base-rgb), var(--op-6));
        background-color: rgba(var(--base), var(--op-6));
        z-index: var(--z-3);
        box-shadow: rgba(var(--base-rgb),var(--op-45)) var(--shdw);
        box-shadow: rgba(var(--base),var(--op-45)) var(--shdw);
    }
    .group-display .item-grid {
        height: 100%;
@@ -1118,7 +1118,7 @@
        height: fit-content;
        top: 0;
        z-index: var(--z-3);
        background-color: rgba(var(--action-rgb), var(--op-6));
        background-color: rgba(var(--action-0), var(--op-6));
    }
    .group-display .sidebar .upload-group {
        order: 1;
@@ -1182,7 +1182,7 @@
    .preview-wrap .hint {
        position: sticky;
        z-index: var(--z-3);
        box-shadow: rgba(var(--base-rgb),var(--op-45)) var(--shdw);
        box-shadow: rgba(var(--base),var(--op-45)) var(--shdw);
        background-color: var(--base);
        width: 100%;
    }
@@ -1218,7 +1218,7 @@
    top: 0;
    background-color: var(--base-50);
    z-index: var(--z-6);
    box-shadow: rgba(var(--base-rgb),var(--op-45)) var(--shdw-down);
    box-shadow: rgba(var(--base),var(--op-45)) var(--shdw-down);
    margin-bottom: 2rem;
}

@@ -1274,7 +1274,7 @@
    transform: translateY(10px);
    background-color: var(--base-100);
    border: 1px solid var(--base);
    box-shadow: 0px 0px 5px rgba(var(--base-rgb),var(--op-6));
    box-shadow: 0px 0px 5px rgba(var(--base),var(--op-6));
    color: var(--contrast);
    padding: 5px 12px;
    white-space: nowrap;
@@ -1327,8 +1327,8 @@
/*.group-actions button {*/
/*    padding: 0.5rem 0.75rem;*/
/*    border-radius: var(--radius);*/
/*    background: rgba(var(--action-rgb), 0.1);*/
/*    border: 1px solid rgba(var(--action-rgb), 0.3);*/
/*    background: rgba(var(--action-0), 0.1);*/
/*    border: 1px solid rgba(var(--action-0), 0.3);*/
/*    color: var(--action-0);*/
/*    font-size: var(--txt-small);*/
/*    transition: all var(--trans-base);*/
@@ -1336,7 +1336,7 @@
/*}*/

/*.group-actions button:hover {*/
/*    background: rgba(var(--action-rgb), 0.2);*/
/*    background: rgba(var(--action-0), 0.2);*/
/*    border-color: var(--action-0);*/
/*    transform: translateY(-1px);*/
/*}*/
@@ -1344,7 +1344,7 @@
/*!* Group item grid - distinct from preview grid *!*/
/*.item-grid.group {*/
/*    background: rgba(255, 255, 255, 0.5);*/
/*    border: 1px solid rgba(var(--action-rgb), 0.15);*/
/*    border: 1px solid rgba(var(--action-0), 0.15);*/
/*    border-radius: var(--radius);*/
/*    padding: 0.75rem;*/
/*    min-height: 100px;*/
@@ -1422,8 +1422,8 @@
/*    flex-direction: column;*/
/*    gap: 0.5rem;*/
/*    padding: 1rem;*/
/*    background: rgba(var(--action-rgb), 0.05);*/
/*    border: 1px solid rgba(var(--action-rgb), 0.2);*/
/*    background: rgba(var(--action-0), 0.05);*/
/*    border: 1px solid rgba(var(--action-0), 0.2);*/
/*    border-radius: var(--radius);*/
/*    margin: 1rem 0;*/
/*    animation: slideDown var(--trans-base);*/
@@ -1437,7 +1437,7 @@
/*.progress .bar {*/
/*    width: 100%;*/
/*    height: 8px;*/
/*    background: rgba(var(--action-rgb), 0.15);*/
/*    background: rgba(var(--action-0), 0.15);*/
/*    border-radius: 4px;*/
/*    overflow: hidden;*/
/*    position: relative;*/
@@ -1451,7 +1451,7 @@
/*    var(--action-200) 100%);*/
/*    border-radius: 4px;*/
/*    transition: width 0.3s ease;*/
/*    box-shadow: 0 0 8px rgba(var(--action-rgb), 0.4);*/
/*    box-shadow: 0 0 8px rgba(var(--action-0), 0.4);*/
/*}*/

/*!* Progress details - styled for row layout with text and count *!*/
@@ -1540,7 +1540,7 @@
/*.upload.item:has(.upload-select:checked) {*/
/*    outline: 3px solid var(--action-0);*/
/*    outline-offset: -3px;*/
/*    box-shadow: 0 0 0 3px rgba(var(--action-rgb), 0.2);*/
/*    box-shadow: 0 0 0 3px rgba(var(--action-0), 0.2);*/
/*}*/

/*!* Selection checkbox - always visible on hover or when checked *!*/
@@ -1560,8 +1560,8 @@
/*    display: flex;*/
/*    gap: 1rem;*/
/*    padding: 1rem;*/
/*    background: rgba(var(--action-rgb), 0.1);*/
/*    border: 2px solid rgba(var(--action-rgb), 0.3);*/
/*    background: rgba(var(--action-0), 0.1);*/
/*    border: 2px solid rgba(var(--action-0), 0.3);*/
/*    border-radius: var(--radius);*/
/*    margin: 1rem 0;*/
/*    align-items: center;*/
@@ -1605,11 +1605,11 @@
/*!* Smooth dragover animation *!*/
/*@keyframes drop-pulse {*/
/*    0%, 100% {*/
/*        background-color: rgba(var(--action-rgb), 0.15);*/
/*        background-color: rgba(var(--action-0), 0.15);*/
/*        transform: scale(1.02);*/
/*    }*/
/*    50% {*/
/*        background-color: rgba(var(--action-rgb), 0.25);*/
/*        background-color: rgba(var(--action-0), 0.25);*/
/*        transform: scale(1.04);*/
/*    }*/
/*}*/
@@ -1738,13 +1738,13 @@

/*.restore-item:hover {*/
/*    border-color: var(--action-0);*/
/*    box-shadow: 0 2px 8px rgba(var(--action-rgb), 0.2);*/
/*    box-shadow: 0 2px 8px rgba(var(--action-0), 0.2);*/
/*}*/

/*!* Checked state *!*/
/*.restore-item:has(.restore-checkbox:checked) {*/
/*    border-color: var(--action-0);*/
/*    background: rgba(var(--action-rgb), 0.05);*/
/*    background: rgba(var(--action-0), 0.05);*/
/*}*/

/*!* Preview section *!*/
@@ -1872,7 +1872,7 @@
/*.restore-selected:hover {*/
/*    background: var(--action-200);*/
/*    transform: translateY(-1px);*/
/*    box-shadow: 0 4px 12px rgba(var(--action-rgb), 0.3);*/
/*    box-shadow: 0 4px 12px rgba(var(--action-0), 0.3);*/
/*}*/

/*!* Scrap cache button - destructive action *!*/
@@ -2454,7 +2454,7 @@
    margin-right: 1rem;
    padding: 1rem;
    border-radius: var(--radius);
    background-color: rgba(var(--base-rgb),var(--op-6));
    background-color: rgba(var(--base),var(--op-6));
    z-index: var(--z-6);
    width: 50vw;
    animation: fadeInSlideUp 0.5s ease-out forwards;