apps/mapix
4
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add fullscreen download action

Browse Source
This commit is contained in:
br0tkasten committed 2026-06-14 11:19:46 +02:00
1 parent 4ae6e09388
commit 99f9f648ba
3 files changed
+60 -4
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

src/server/app-assets.ts
+33 -1
View File
@@ -105,7 +105,7 @@ export const APP_STYLES = ` :root {
--overlay-media-bg: rgba(248, 250, 252, 0.94);
--overlay-media-border: rgba(148, 163, 184, 0.26);
--overlay-media-shadow: 0 10px 24px rgba(15, 23, 42, 0.08);
--overlay-caption-text: rgba(248, 250, 252, 0.95);
--overlay-caption-text: #303030;
--card-border: rgba(15, 23, 42, 0.11);
--timeline-surface: rgba(255, 255, 255, 0.84);
--timeline-surface-soft: rgba(255, 255, 255, 0.94);
@@ -730,6 +730,38 @@ export const APP_STYLES = ` :root {
border-color: var(--timeline-border-strong);
}
.overlay-download {
position: fixed;
top: 16px;
right: 64px;
z-index: 1001;
width: 40px;
height: 40px;
padding: 0;
justify-content: center;
background: var(--timeline-surface-soft);
color: var(--timeline-text);
border: 1px solid var(--timeline-border);
box-shadow: var(--shadow-soft);
backdrop-filter: blur(14px);
text-decoration: none;
}
.overlay-action {
display: inline-flex;
align-items: center;
}
.overlay-download:hover {
background: var(--timeline-surface-strong);
border-color: var(--timeline-border-strong);
}
.overlay-download[aria-disabled="true"] {
opacity: 0.45;
pointer-events: none;
}
.overlay-nav {
position: fixed;
top: 50%;
src/server/page-template.ts
+10 -3
View File
@@ -147,9 +147,16 @@ ${APP_STYLES}
</svg>
</span>
</button>
<button class="close overlay-close" id="close-overlay" type="button" aria-label="Close photo">
x
</button>
<a class="overlay-action overlay-download" id="overlay-download" href="#" download aria-label="Download photo">
<span class="button-icon" aria-hidden="true">
<svg viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M8 2v7" stroke="currentColor" stroke-width="1.6" stroke-linecap="round"/>
<path d="M5 6.5 8 9.5 11 6.5" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M3 12.5h10" stroke="currentColor" stroke-width="1.6" stroke-linecap="round"/>
</svg>
</span>
</a>
<button class="close overlay-close" id="close-overlay" type="button" aria-label="Close photo">x</button>
<div class="overlay-card" id="overlay-card">
<div class="overlay-media" id="overlay-media">
<div class="overlay-loading" id="overlay-loading" aria-live="polite" aria-atomic="true">