kibi/f0ckm
1
0
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects Releases Wiki Activity

hgfhfd

Browse Source
This commit is contained in:
kibi
2026-09-28 23:24:50 +02:00
parent 2cc768f1fd
commit 73c0659d4a
29 changed files with 820 additions and 117 deletions
Download Patch File Download Diff File Expand all files Collapse all files
views/snippets/page-modal.html
+44
View File
@@ -0,0 +1,44 @@
{{-- Fullscreen modal for info pages opened from the sidebar footer (see /s/js/page-modal.js) --}}
<div id="page-modal" style="display: none;" role="dialog" aria-modal="true">
<div class="pgm-header">
<h3 class="pgm-title"></h3>
<div class="pgm-actions">
<button type="button" class="pgm-close" title="Close" aria-label="Close">&times;</button>
</div>
</div>
<div class="pgm-body"></div>
</div>
<style>
#page-modal {
/* Covers only the content area: below the navbar, between the sidebars (page-modal.js sets the insets).
Just below the sidebar drag handles (899) and sidebars (900) so they keep working while it's open. */
position: fixed; z-index: 895;
top: var(--pgm-top, 0px); right: var(--pgm-right, 0px); bottom: 0; left: var(--pgm-left, 0px);
flex-direction: column;
background: var(--bg); color: var(--text-color, #fff);
}
#page-modal .pgm-header {
flex-shrink: 0; display: flex; align-items: center; justify-content: space-between; gap: 12px;
padding: 12px 20px; border-bottom: 1px solid var(--accent);
}
#page-modal .pgm-title {
margin: 0; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
font-size: 1em; font-weight: 800; text-transform: uppercase; letter-spacing: 0.08em;
}
#page-modal .pgm-actions { display: flex; align-items: center; gap: 4px; flex-shrink: 0; }
#page-modal .pgm-close {
display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px;
margin: 0; padding: 0; background: none; border: 1px solid transparent; border-radius: 0;
color: var(--text-color, #fff); font-size: 1em; line-height: 1; cursor: pointer; text-decoration: none;
transition: color 0.15s, border-color 0.15s;
}
#page-modal .pgm-close { font-size: 1.6em; border-color: rgba(255, 255, 255, 0.25); }
#page-modal .pgm-close:hover { color: var(--accent); border-color: var(--accent); }
#page-modal .pgm-body {
flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain;
padding-bottom: env(safe-area-inset-bottom, 0px);
}
#page-modal .pgm-loading { padding: 60px 20px; text-align: center; color: var(--text-muted, #aaa); }
#page-modal .pgm-loading a { color: var(--accent); }
</style>
<script src="/s/js/page-modal.js?v={{ ts }}"></script>