diff --git a/app.py b/app.py index aee4bf0..d0bcbae 100755 --- a/app.py +++ b/app.py @@ -1224,7 +1224,9 @@ def create_token(subpath): token_qr_code=img_base64, token_folder=token_item.get('folders'), token_url=url, - token_valid_to=token_item.get('validity', 'Unbekannt') + token_valid_to=token_item.get('validity', 'Unbekannt'), + title_short=auth.return_app_config().get('TITLE_SHORT', ''), + title_long=auth.return_app_config().get('TITLE_LONG', '') ) diff --git a/static/app.css b/static/app.css index c1e5f74..93747dd 100644 --- a/static/app.css +++ b/static/app.css @@ -79,10 +79,6 @@ body { font-size: 17px; } -.container-fluid { - padding: 24px; -} - /* Carded content shell */ main.tab-content, section.tab-content { @@ -275,7 +271,7 @@ div.directory-item a, li.directory-item a, li.file-item a, li.link-item a { /* Grid Layout for Directories */ .directories-grid { display: grid; - grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); + grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); column-gap: 14px; row-gap: 0; text-align: center; @@ -374,7 +370,7 @@ footer .audio-player-container { #transcriptModal .modal-content { background-color: #fff; margin: 5% auto; - padding: 20px; + padding: 15px; border-radius: 5px; width: 90%; max-width: 800px; diff --git a/static/functions.js b/static/functions.js index 7e93716..581d287 100644 --- a/static/functions.js +++ b/static/functions.js @@ -25,4 +25,45 @@ function toClipboard(url) { } document.body.removeChild(textarea); } - } \ No newline at end of file + } + +function printToken() { + const printable = document.getElementById('tokenPrintable'); + if (!printable) { + console.error('Token printable content not found.'); + return; + } + + const clone = printable.cloneNode(true); + clone.querySelectorAll('.token-action-buttons').forEach(el => el.remove()); + + const styles = Array.from(document.querySelectorAll('link[rel="stylesheet"], style')) + .map(node => node.outerHTML) + .join('\n'); + + const popup = window.open('', '_blank', 'width=900,height=1200'); + if (!popup) { + alert('Bitte Popups erlauben, um das PDF zu speichern.'); + return; + } + + popup.document.write(` + + + Token PDF + ${styles} + + + ${clone.outerHTML} + `); + popup.document.close(); + popup.focus(); + popup.onload = () => { + popup.print(); + popup.close(); + }; +} diff --git a/static/token.css b/static/token.css new file mode 100644 index 0000000..c88e2ea --- /dev/null +++ b/static/token.css @@ -0,0 +1,80 @@ +.token-container { + height: 100%; + display: flex; + flex-direction: column; +} + +#tokenPrintable .qr-code { + max-width: 420px; + width: 100%; + display: block; + margin: 0 auto; +} + +#tokenPrintable .token-qr-wrap { + position: relative; + display: inline-block; +} + +#tokenPrintable .token-pdf-logo { + max-width: 120px; + width: 28%; + min-width: 80px; + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + margin: 0; + z-index: 2; + pointer-events: none; + filter: drop-shadow(0 0 8px rgba(0, 0, 0, 0.8)) drop-shadow(0 0 14px rgba(0, 0, 0, 0.6)); +} + +#tokenPrintable .token-folder-title { + text-align: center; + +} + +#tokenPrintable .token-page-title { + text-align: center; + margin-bottom: 3rem; + margin-top: 1rem; +} + +#tokenPrintable .copy-btn { + display: inline-flex; + align-items: center; + padding: 0.5rem 1rem; + font-size: 1rem; + cursor: pointer; + border: 1px solid #007bff; + background-color: #007bff; + color: white; + border-radius: 0.25rem; +} + +#tokenPrintable .copy-btn:active { + background-color: #0056b3; + border-color: #0056b3; +} + +@media print { + .token-action-buttons { + display: none !important; + } + + #tokenPrintable .qr-code { + max-width: 620px; + width: 90% !important; + } + + #tokenPrintable .token-pdf-logo { + max-width: 140px; + width: 24%; + } + + #tokenPrintable .token-qr-wrap { + position: relative; + display: inline-block; + } +} diff --git a/templates/view_token.html b/templates/view_token.html index 30446e4..75197b9 100644 --- a/templates/view_token.html +++ b/templates/view_token.html @@ -1,53 +1,36 @@ - + -
-
- QR Code for token +
+ {% set folder_names = token_folder | map(attribute='foldername') | list %} +
+

{{ title_long }}

+ {% if folder_names %} +

{{ folder_names | join(', ') }}

+ {% endif %} +
+ + QR Code for token +
-

Token-Link:

- Link öffnen - +
+ Link öffnen + + +

Gültig bis:

{{ token_valid_to }}
-
+
- \ No newline at end of file +