deploy: dd35720

Author: NikPiermafrost

.nojekyll

@@ -0,0 +1,80 @@
+@import '_content/SuperSimpleBlazorDropzone/SuperSimpleBlazorDropzone.zpypzmmwo0.bundle.scp.css';
+
+/* /Layout/MainLayout.razor.rz.scp.css */
+.page[b-rjkdr0auvo] {
+    position: relative;
+    display: flex;
+    flex-direction: column;
+}
+
+main[b-rjkdr0auvo] {
+    flex: 1;
+}
+
+.sidebar[b-rjkdr0auvo] {
+    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
+}
+
+.top-row[b-rjkdr0auvo] {
+    background-color: #f7f7f7;
+    border-bottom: 1px solid #d6d5d5;
+    justify-content: flex-end;
+    height: 3.5rem;
+    display: flex;
+    align-items: center;
+}
+
+    .top-row[b-rjkdr0auvo]  a, .top-row[b-rjkdr0auvo]  .btn-link {
+        white-space: nowrap;
+        margin-left: 1.5rem;
+        text-decoration: none;
+    }
+
+    .top-row[b-rjkdr0auvo]  a:hover, .top-row[b-rjkdr0auvo]  .btn-link:hover {
+        text-decoration: underline;
+    }
+
+    .top-row[b-rjkdr0auvo]  a:first-child {
+        overflow: hidden;
+        text-overflow: ellipsis;
+    }
+
+@media (max-width: 640.98px) {
+    .top-row[b-rjkdr0auvo] {
+        justify-content: space-between;
+    }
+
+    .top-row[b-rjkdr0auvo]  a, .top-row[b-rjkdr0auvo]  .btn-link {
+        margin-left: 0;
+    }
+}
+
+@media (min-width: 641px) {
+    .page[b-rjkdr0auvo] {
+        flex-direction: row;
+    }
+
+    .sidebar[b-rjkdr0auvo] {
+        width: 250px;
+        height: 100vh;
+        position: sticky;
+        top: 0;
+    }
+
+    .top-row[b-rjkdr0auvo] {
+        position: sticky;
+        top: 0;
+        z-index: 1;
+    }
+
+    .top-row.auth[b-rjkdr0auvo]  a:first-child {
+        flex: 1;
+        text-align: right;
+        width: 0;
+    }
+
+    .top-row[b-rjkdr0auvo], article[b-rjkdr0auvo] {
+        padding-left: 2rem !important;
+        padding-right: 1.5rem !important;
+    }
+}

SuperSimpleBlazorDropzone.Sample.styles.css

@@ -0,0 +1,52 @@
+const _dropListeners = new Map();
+
+export const setDragActive = (elementId, active, cssClass) => {
+    const dropper = document.getElementById(elementId);
+    if (dropper) {
+        if (active) dropper.classList.add(cssClass);
+        else dropper.classList.remove(cssClass);
+    }
+}
+
+export const handleDrop = async (dotNetRef, event, allowMultiple, maxFileSize, dragActiveCssClass) => {
+    event.preventDefault();
+    const elementId = event.currentTarget.id;
+    setDragActive(elementId, false, dragActiveCssClass);
+    const files = event.dataTransfer.files;
+    if (files.length < 1) return;
+
+    const actualFiles = allowMultiple ? files : [files[0]];
+
+    for (const file of actualFiles) {
+        if (maxFileSize && file.size > maxFileSize) continue;
+        await dotNetRef.invokeMethodAsync('ReceiveData', DotNet.createJSStreamReference(file), file.name, file.type, file.size);
+    }
+}
+
+export const registerDropHandler = (dotNetRef, elementId, allowMultiple, maxFileSize, dragActiveCssClass) => {
+    const dropper = document.getElementById(elementId);
+    if (!dropper) return;
+
+    const listener = (e) => handleDrop(dotNetRef, e, allowMultiple, maxFileSize, dragActiveCssClass);
+    _dropListeners.set(elementId, listener);
+    dropper.addEventListener('drop', listener);
+}
+
+export const removeEventListeners = (dotNetRef, elementId, allowMultiple) => {
+    const dropper = document.getElementById(elementId);
+    if (!dropper) return;
+
+    const listener = _dropListeners.get(elementId);
+    if (listener) {
+        dropper.removeEventListener('drop', listener);
+        _dropListeners.delete(elementId);
+    }
+}
+
+export const clickHiddenFileInput = (fileInputId) => {
+    const input = document.getElementById(fileInputId);
+    if (input) {
+        const evt = new MouseEvent('click', { bubbles: false, cancelable: true, view: window });
+        input.dispatchEvent(evt);
+    }
+}

SuperSimpleBlazorDropzone.Sample.styles.css.br

@@ -0,0 +1,16 @@
+/* _content/SuperSimpleBlazorDropzone/SimpleDropzone.razor.rz.scp.css */
+.file-dropper[b-4txvihedx8] {
+    border: 2px dashed #aaa;
+    border-radius: 8px;
+    padding: 32px;
+    text-align: center;
+    cursor: pointer;
+    transition: border-color 0.2s;
+    position: relative;
+    min-height: 180px;
+    background: #fafafa;
+}
+.file-dropper.drag-active[b-4txvihedx8] {
+    border-color: #0078d7;
+    background: #e6f7ff;
+}