kato/warpbox-dev
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
5cd476e7f36390c42421bd156dcecc0625af58c9
warpbox-dev/backend/static/css/20-upload.css

386 lines
6.7 KiB
CSS
Raw Normal View History

fix(auth): reject invalid bearer tokens instead of falling back Modify the authentication handler to return an unauthorized error when an invalid or disabled bearer token is provided, rather than silently falling back to an anonymous request. This ensures that clients attempting to authenticate but failing (due to expired, malformed, or disabled tokens) are explicitly notified of the auth failure instead of proceeding anonymously. True anonymous requests without any Authorization header remain supported.
2026-05-31 13:02:58 +03:00
.upload-view {
feat(ui): redesign upload page into a two-column layout Redesigns the upload interface to use a two-column grid layout on larger screens, separating the file drop-zone (left) from the upload options (right). This improves usability and visual hierarchy. Changes include: - Increasing the upload view max-width to 64rem. - Creating a responsive `.upload-grid` that collapses to a single column on narrow viewports. - Stacking option fields vertically in the narrower options panel. - Adding retro theme support for the new options title.
2026-05-31 16:41:04 +03:00
width: min(64rem, calc(100% - 2rem));
fix(auth): reject invalid bearer tokens instead of falling back Modify the authentication handler to return an unauthorized error when an invalid or disabled bearer token is provided, rather than silently falling back to an anonymous request. This ensures that clients attempting to authenticate but failing (due to expired, malformed, or disabled tokens) are explicitly notified of the auth failure instead of proceeding anonymously. True anonymous requests without any Authorization header remain supported.
2026-05-31 13:02:58 +03:00
min-height: calc(100vh - 7.25rem);
margin: 0 auto;
padding: 2.5rem 0;
display: flex;
flex-direction: column;
justify-content: center;
gap: 1.5rem;
}
feat(ui): redesign upload page into a two-column layout Redesigns the upload interface to use a two-column grid layout on larger screens, separating the file drop-zone (left) from the upload options (right). This improves usability and visual hierarchy. Changes include: - Increasing the upload view max-width to 64rem. - Creating a responsive `.upload-grid` that collapses to a single column on narrow viewports. - Stacking option fields vertically in the narrower options panel. - Adding retro theme support for the new options title.
2026-05-31 16:41:04 +03:00
/* Two-column upload layout: drop-zone window on the left, options on the
right. Collapses to a single column on narrow screens (see 90-responsive). */
.upload-grid {
display: grid;
grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
gap: 1.25rem;
align-items: start;
}
.upload-main,
.upload-options {
margin: 0;
}
.options-title {
margin: 0 0 1.1rem;
font-size: 1.05rem;
font-weight: 650;
line-height: 1.2;
}
/* Stack the option fields vertically in the narrower right-hand window. */
.upload-options .option-grid {
grid-template-columns: 1fr;
margin-top: 0;
}
/* Summary + upload button sit at the bottom of the options window. */
.upload-options .form-footer {
flex-direction: column;
align-items: stretch;
gap: 0.75rem;
margin-top: 1.25rem;
}
.upload-options .form-footer .button {
width: 100%;
}
fix(auth): reject invalid bearer tokens instead of falling back Modify the authentication handler to return an unauthorized error when an invalid or disabled bearer token is provided, rather than silently falling back to an anonymous request. This ensures that clients attempting to authenticate but failing (due to expired, malformed, or disabled tokens) are explicitly notified of the auth failure instead of proceeding anonymously. True anonymous requests without any Authorization header remain supported.
2026-05-31 13:02:58 +03:00
.hero-copy {
text-align: center;
}
feat(upload): add dynamic expiry options and modern UI theme - Implement dynamic expiry options on the upload page based on user roles and retention policies. - Add helper functions to build and format expiry options into human-readable labels. - Introduce a new modern theme featuring glassmorphism, gradients, and frosted glass cards.
2026-05-31 15:30:53 +03:00
.hero-eyebrow {
margin: 0 0 2.5rem 0;
display: inline-flex;
align-items: center;
gap: 0.4rem;
border-radius: 999px;
padding: 0.3rem 0.85rem;
background: var(--surface-1);
border: 1px solid var(--border);
color: var(--muted-foreground);
font-size: 0.76rem;
font-weight: 600;
letter-spacing: 0.01em;
}
fix(auth): reject invalid bearer tokens instead of falling back Modify the authentication handler to return an unauthorized error when an invalid or disabled bearer token is provided, rather than silently falling back to an anonymous request. This ensures that clients attempting to authenticate but failing (due to expired, malformed, or disabled tokens) are explicitly notified of the auth failure instead of proceeding anonymously. True anonymous requests without any Authorization header remain supported.
2026-05-31 13:02:58 +03:00
feat(theme): introduce retro Windows 98-inspired theme Add a new "retro" theme option that mimics the classic Windows 98 aesthetic, providing a nostalgic alternative to the modern and classic dark themes. Changes include: - Defining CSS variables for the retro theme in `00-base.css` (pixel fonts, silver/gray colors, and classic window shadows). - Adding custom styling for cards, headers, buttons, and title bars to replicate classic OS windows. - Adding a star background GIF (`stars1.gif`). - Excluding the retro theme from modern "revamp" styles in `15-revamp.css`. - Updating `CLAUDE.md` with instructions on screenshot verification.
2026-05-31 16:17:20 +03:00
.upload-subtitle {
margin: 0.35rem 0 1.25rem;
color: var(--muted-foreground);
font-size: 0.95rem;
line-height: 1.5;
}
fix(auth): reject invalid bearer tokens instead of falling back Modify the authentication handler to return an unauthorized error when an invalid or disabled bearer token is provided, rather than silently falling back to an anonymous request. This ensures that clients attempting to authenticate but failing (due to expired, malformed, or disabled tokens) are explicitly notified of the auth failure instead of proceeding anonymously. True anonymous requests without any Authorization header remain supported.
2026-05-31 13:02:58 +03:00
.drop-zone {
min-height: 19rem;
display: grid;
place-items: center;
align-content: center;
gap: 0.65rem;
padding: 2rem;
border: 2px dashed var(--border);
border-radius: var(--radius);
feat(upload): add dynamic expiry options and modern UI theme - Implement dynamic expiry options on the upload page based on user roles and retention policies. - Add helper functions to build and format expiry options into human-readable labels. - Introduce a new modern theme featuring glassmorphism, gradients, and frosted glass cards.
2026-05-31 15:30:53 +03:00
background: var(--surface-1);
fix(auth): reject invalid bearer tokens instead of falling back Modify the authentication handler to return an unauthorized error when an invalid or disabled bearer token is provided, rather than silently falling back to an anonymous request. This ensures that clients attempting to authenticate but failing (due to expired, malformed, or disabled tokens) are explicitly notified of the auth failure instead of proceeding anonymously. True anonymous requests without any Authorization header remain supported.
2026-05-31 13:02:58 +03:00
text-align: center;
cursor: pointer;
transition: border-color 160ms ease, background 160ms ease;
}
.drop-zone:hover,
.drop-zone.is-dragging {
border-color: var(--primary);
feat(upload): add dynamic expiry options and modern UI theme - Implement dynamic expiry options on the upload page based on user roles and retention policies. - Add helper functions to build and format expiry options into human-readable labels. - Introduce a new modern theme featuring glassmorphism, gradients, and frosted glass cards.
2026-05-31 15:30:53 +03:00
background: var(--surface-1-hover);
fix(auth): reject invalid bearer tokens instead of falling back Modify the authentication handler to return an unauthorized error when an invalid or disabled bearer token is provided, rather than silently falling back to an anonymous request. This ensures that clients attempting to authenticate but failing (due to expired, malformed, or disabled tokens) are explicitly notified of the auth failure instead of proceeding anonymously. True anonymous requests without any Authorization header remain supported.
2026-05-31 13:02:58 +03:00
}
.drop-zone input {
position: absolute;
inline-size: 1px;
block-size: 1px;
opacity: 0;
pointer-events: none;
}
.drop-icon {
width: 2.75rem;
height: 2.75rem;
display: grid;
place-items: center;
color: var(--muted-foreground);
}
.drop-icon svg {
width: 2.5rem;
height: 2.5rem;
}
.drop-title {
font-size: 1rem;
font-weight: 650;
}
.drop-copy,
.drop-meta {
color: var(--muted-foreground);
font-size: 0.9rem;
}
.drop-meta {
margin-top: 0.75rem;
font-size: 0.78rem;
}
.advanced-options {
margin-top: 1rem;
border: 1px solid var(--border);
border-radius: var(--radius);
feat(upload): add dynamic expiry options and modern UI theme - Implement dynamic expiry options on the upload page based on user roles and retention policies. - Add helper functions to build and format expiry options into human-readable labels. - Introduce a new modern theme featuring glassmorphism, gradients, and frosted glass cards.
2026-05-31 15:30:53 +03:00
background: var(--surface-2);
fix(auth): reject invalid bearer tokens instead of falling back Modify the authentication handler to return an unauthorized error when an invalid or disabled bearer token is provided, rather than silently falling back to an anonymous request. This ensures that clients attempting to authenticate but failing (due to expired, malformed, or disabled tokens) are explicitly notified of the auth failure instead of proceeding anonymously. True anonymous requests without any Authorization header remain supported.
2026-05-31 13:02:58 +03:00
padding: 0.75rem 0.9rem;
}
.advanced-options summary {
display: inline-flex;
align-items: center;
gap: 0.35rem;
color: var(--foreground);
cursor: pointer;
font-size: 0.875rem;
font-weight: 600;
}
.option-grid {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 0.9rem;
margin-top: 1rem;
}
.form-footer,
.result-header {
margin-top: 1rem;
display: flex;
align-items: center;
justify-content: space-between;
gap: 1rem;
}
.form-footer p,
#result-meta {
margin: 0;
color: var(--muted-foreground);
font-size: 0.82rem;
}
.button,
button {
min-height: 2.25rem;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.45rem;
border: 1px solid transparent;
border-radius: calc(var(--radius) - 0.125rem);
padding: 0.45rem 0.85rem;
color: var(--foreground);
background: transparent;
font: inherit;
font-size: 0.875rem;
font-weight: 600;
line-height: 1;
text-decoration: none;
cursor: pointer;
}
.button-primary {
background: var(--primary);
color: var(--primary-foreground);
}
.button-primary:hover {
feat(upload): add dynamic expiry options and modern UI theme - Implement dynamic expiry options on the upload page based on user roles and retention policies. - Add helper functions to build and format expiry options into human-readable labels. - Introduce a new modern theme featuring glassmorphism, gradients, and frosted glass cards.
2026-05-31 15:30:53 +03:00
background: var(--primary-hover);
fix(auth): reject invalid bearer tokens instead of falling back Modify the authentication handler to return an unauthorized error when an invalid or disabled bearer token is provided, rather than silently falling back to an anonymous request. This ensures that clients attempting to authenticate but failing (due to expired, malformed, or disabled tokens) are explicitly notified of the auth failure instead of proceeding anonymously. True anonymous requests without any Authorization header remain supported.
2026-05-31 13:02:58 +03:00
}
.button-outline {
border-color: var(--border);
background: var(--background);
}
.button-outline:hover,
.button-ghost:hover {
background: var(--accent);
}
.button-danger {
border-color: rgba(248, 113, 113, 0.28);
background: rgba(127, 29, 29, 0.3);
color: #fecaca;
}
.button-danger:hover {
background: rgba(127, 29, 29, 0.55);
}
.button-wide {
width: 100%;
min-height: 2.75rem;
margin-top: 1.25rem;
}
.upload-progress {
margin-top: 1rem;
}
.progress-row {
display: flex;
justify-content: space-between;
color: var(--muted-foreground);
font-size: 0.8rem;
}
.progress {
height: 0.4rem;
margin-top: 0.55rem;
overflow: hidden;
border-radius: 999px;
background: var(--muted);
}
.progress span {
display: block;
width: 100%;
height: 100%;
background: var(--primary);
transform-origin: left center;
transform: scaleX(0);
transition: transform 180ms ease;
}
.upload-result {
border-color: rgba(244, 244, 245, 0.24);
background: rgba(244, 244, 245, 0.06);
}
.result-title {
display: inline-flex;
align-items: center;
gap: 0.5rem;
font-weight: 650;
}
.result-title svg {
color: var(--success);
}
.result-actions {
display: flex;
gap: 0.5rem;
}
.manage-link {
margin: 0.9rem 0 0;
color: var(--muted-foreground);
font-size: 0.78rem;
text-align: left;
}
.manage-link a {
color: var(--foreground);
font-weight: 600;
}
.result-list,
.download-list {
display: grid;
gap: 0.6rem;
margin-top: 1rem;
}
.upload-queue {
margin-top: 1rem;
}
.result-item,
.download-item {
min-width: 0;
display: flex;
align-items: center;
gap: 0.8rem;
border: 1px solid var(--border);
border-radius: calc(var(--radius) - 0.125rem);
background: var(--background);
padding: 0.75rem;
}
.result-item > span,
.download-item > span {
min-width: 0;
max-width: 100%;
flex: 1;
}
.result-item strong,
.download-item strong,
.result-item code,
.download-item code {
display: block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.file-progress-side {
width: min(10rem, 32vw);
display: grid;
feat(uploads): add native resumable upload support Implement a native chunked resumable upload API and frontend integration to support reliable large file uploads. Changes include: - Added a 3-step resumable upload API flow (create session, upload chunks, complete session). - Introduced configuration options for chunk size, retention hours, and toggling the feature. - Updated the frontend to utilize resumable uploads with progress tracking. - Configured temporary chunk storage under `data/tmp/uploads` with automatic cleanup. - Documented the API flow and configuration in the README.
2026-06-02 17:41:41 +03:00
grid-template-columns: minmax(0, 1fr) auto;
fix(auth): reject invalid bearer tokens instead of falling back Modify the authentication handler to return an unauthorized error when an invalid or disabled bearer token is provided, rather than silently falling back to an anonymous request. This ensures that clients attempting to authenticate but failing (due to expired, malformed, or disabled tokens) are explicitly notified of the auth failure instead of proceeding anonymously. True anonymous requests without any Authorization header remain supported.
2026-05-31 13:02:58 +03:00
gap: 0.35rem;
feat(uploads): add native resumable upload support Implement a native chunked resumable upload API and frontend integration to support reliable large file uploads. Changes include: - Added a 3-step resumable upload API flow (create session, upload chunks, complete session). - Introduced configuration options for chunk size, retention hours, and toggling the feature. - Updated the frontend to utilize resumable uploads with progress tracking. - Configured temporary chunk storage under `data/tmp/uploads` with automatic cleanup. - Documented the API flow and configuration in the README.
2026-06-02 17:41:41 +03:00
align-items: center;
fix(auth): reject invalid bearer tokens instead of falling back Modify the authentication handler to return an unauthorized error when an invalid or disabled bearer token is provided, rather than silently falling back to an anonymous request. This ensures that clients attempting to authenticate but failing (due to expired, malformed, or disabled tokens) are explicitly notified of the auth failure instead of proceeding anonymously. True anonymous requests without any Authorization header remain supported.
2026-05-31 13:02:58 +03:00
}
.file-progress-percent {
feat(uploads): add native resumable upload support Implement a native chunked resumable upload API and frontend integration to support reliable large file uploads. Changes include: - Added a 3-step resumable upload API flow (create session, upload chunks, complete session). - Introduced configuration options for chunk size, retention hours, and toggling the feature. - Updated the frontend to utilize resumable uploads with progress tracking. - Configured temporary chunk storage under `data/tmp/uploads` with automatic cleanup. - Documented the API flow and configuration in the README.
2026-06-02 17:41:41 +03:00
grid-column: 1 / -1;
fix(auth): reject invalid bearer tokens instead of falling back Modify the authentication handler to return an unauthorized error when an invalid or disabled bearer token is provided, rather than silently falling back to an anonymous request. This ensures that clients attempting to authenticate but failing (due to expired, malformed, or disabled tokens) are explicitly notified of the auth failure instead of proceeding anonymously. True anonymous requests without any Authorization header remain supported.
2026-05-31 13:02:58 +03:00
color: var(--muted-foreground);
font-size: 0.75rem;
text-align: right;
}
.file-progress {
height: 0.35rem;
margin-top: 0;
}
feat(uploads): add native resumable upload support Implement a native chunked resumable upload API and frontend integration to support reliable large file uploads. Changes include: - Added a 3-step resumable upload API flow (create session, upload chunks, complete session). - Introduced configuration options for chunk size, retention hours, and toggling the feature. - Updated the frontend to utilize resumable uploads with progress tracking. - Configured temporary chunk storage under `data/tmp/uploads` with automatic cleanup. - Documented the API flow and configuration in the README.
2026-06-02 17:41:41 +03:00
.upload-file-remove {
width: 1.65rem;
height: 1.65rem;
min-height: 1.65rem;
padding: 0;
border-color: var(--border);
border-radius: 999px;
color: var(--muted-foreground);
background: var(--surface-1);
font-size: 1rem;
line-height: 1;
}
.upload-file-remove:hover {
color: var(--foreground);
border-color: var(--primary);
background: var(--surface-1-hover);
}
fix(auth): reject invalid bearer tokens instead of falling back Modify the authentication handler to return an unauthorized error when an invalid or disabled bearer token is provided, rather than silently falling back to an anonymous request. This ensures that clients attempting to authenticate but failing (due to expired, malformed, or disabled tokens) are explicitly notified of the auth failure instead of proceeding anonymously. True anonymous requests without any Authorization header remain supported.
2026-05-31 13:02:58 +03:00
.result-item small,
.download-item small,
.result-item code,
.download-item code {
display: block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
margin-top: 0.25rem;
color: var(--muted-foreground);
font-size: 0.78rem;
}
Reference in New Issue Copy Permalink