diff options
| -rw-r--r-- | static/note.css | 14 | ||||
| -rw-r--r-- | templates/note.php | 16 | ||||
| -rw-r--r-- | templates/note_attachment.php | 17 |
3 files changed, 29 insertions, 18 deletions
diff --git a/static/note.css b/static/note.css index bc9b2d8..fd281b0 100644 --- a/static/note.css +++ b/static/note.css @@ -164,17 +164,20 @@ article.note { box-sizing: border-box; gap: var(--spacing-single); - &:has(:nth-child(2)) { + &:has(> :nth-child(2)) { grid-template-columns: auto auto; + a.file { + width: 100%; + } } - &:has(:nth-child(3)) { + &:has(> :nth-child(3)) { grid-template-columns: auto auto auto; } - &:has(:nth-child(4)) { + &:has(> :nth-child(4)) { grid-template-columns: auto auto; grid-template-rows: auto auto; } - &:has(:nth-child(5)) { + &:has(> :nth-child(5)) { grid-template-columns: unset; grid-template-rows: auto; grid-auto-flow: column; @@ -203,8 +206,9 @@ article.note { color: var(--clr-foreground); text-decoration: none; padding: var(--spacing-single); + padding-right: var(--spacing-double); display: grid; - width: 100%; + width: min(max-content, 100%); box-sizing: border-box; grid-auto-flow: column; align-items: center; diff --git a/templates/note.php b/templates/note.php index b5b07df..736d5f9 100644 --- a/templates/note.php +++ b/templates/note.php @@ -78,19 +78,9 @@ if ($user != null) { <?php if (count($note->attachments) > 0): ?> <div class="attachments"> - <?php foreach ($note->attachments as $attachment): ?> - <div> - <?php if ($attachment->isImage()): ?> - <img src="<?= $attachment->href ?>" alt="<?= htmlspecialchars($attachment->description ?? '') ?>" - title="<?= htmlspecialchars($attachment->description ?? '') ?>"> - <?php else: ?> - <a class="file" href="<?= $attachment->href ?>" target="_blank" download> - <span class="material-symbols attach-file"></span> - <span><?= htmlspecialchars($attachment->description ?? basename($attachment->href)) ?></span> - </a> - <?php endif; ?> - </div> - <?php endforeach; ?> + <?php foreach ($note->attachments as $attachment) { + call_template('note_attachment', ['attachment' => $attachment]); + } ?> </div> <?php endif; ?> diff --git a/templates/note_attachment.php b/templates/note_attachment.php new file mode 100644 index 0000000..c139a00 --- /dev/null +++ b/templates/note_attachment.php @@ -0,0 +1,17 @@ +<?php +$filename = basename($attachment->href); +if (!$attachment->isImage() && $attachment->description) { + $filename = $attachment->description; +} +?> +<div> + <?php if ($attachment->isImage()): ?> + <img src="<?= $attachment->href ?>" alt="<?= htmlspecialchars($attachment->description ?? '') ?>" + title="<?= htmlspecialchars($attachment->description ?? '') ?>"> + <?php else: ?> + <a class="file" href="<?= $attachment->href ?>" target="_blank" download="<?= htmlspecialchars($filename) ?>"> + <span class="material-symbols attach-file"></span> + <span><?= htmlspecialchars($filename) ?></span> + </a> + <?php endif; ?> +</div>
\ No newline at end of file |