From 6329ac33d133664464099d80a1460ef39ca88488 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Mateusz=20Gruszczy=C5=84ski?= <gru@macbook.net.r.local>
Date: Sun, 20 Sep 2026 16:21:52 +0200
Subject: [PATCH] fixed buttons

---
 static/css/styles.css   | 20 +++++++++++++++-----
 static/editor.html      |  2 +-
 static/js/note-files.js | 30 +++++++++++++++---------------
 3 files changed, 31 insertions(+), 21 deletions(-)

diff --git a/static/css/styles.css b/static/css/styles.css
index 018753c..114d555 100644
--- a/static/css/styles.css
+++ b/static/css/styles.css
@@ -2854,7 +2854,9 @@ dialog::backdrop {
   flex: 0 0 auto;
 }
 
-.files-head-actions .action-button {
+.files-head-actions .primary-button,
+.files-head-actions .secondary-button,
+.files-head-actions .danger-button {
   width: auto;
 }
 
@@ -2959,6 +2961,10 @@ dialog::backdrop {
   gap: 7px;
 }
 
+.file-actions .primary-button {
+  width: auto;
+}
+
 .file-actions button,
 .file-secondary-actions__buttons button {
   white-space: nowrap;
@@ -3074,7 +3080,9 @@ dialog::backdrop {
   line-height: 1.5;
 }
 
-.files-state .action-button {
+.files-state .primary-button,
+.files-state .secondary-button,
+.files-state .danger-button {
   margin-top: 14px;
 }
 
@@ -3177,7 +3185,9 @@ dialog::backdrop {
     gap: 6px;
   }
 
-  .files-head-actions .action-button {
+  .files-head-actions .primary-button,
+  .files-head-actions .secondary-button,
+  .files-head-actions .danger-button {
     padding-inline: 9px;
   }
 
@@ -3264,11 +3274,11 @@ dialog::backdrop {
   line-height: 1.4;
 }
 
-.video-choice-actions>.action-button--primary span {
+.video-choice-actions>.primary-button span {
   color: var(--on-accent);
 }
 
-.video-choice-actions>.action-button--secondary span {
+.video-choice-actions>.secondary-button span {
   color: var(--text-secondary);
 }
 
diff --git a/static/editor.html b/static/editor.html
index 3144c5f..458f159 100644
--- a/static/editor.html
+++ b/static/editor.html
@@ -332,7 +332,7 @@
                     <p>Copy a direct link or ready Markdown/Alias code.</p>
                 </div>
                 <div class="files-head-actions">
-                    <button id="files-upload-button" class="action-button action-button--primary compact-button"
+                    <button id="files-upload-button" class="primary-button"
                         type="button">Upload file</button>
                     <button id="close-files" class="icon-button" type="button" aria-label="Close files">×</button>
                 </div>
diff --git a/static/js/note-files.js b/static/js/note-files.js
index 114620a..a0e18ba 100644
--- a/static/js/note-files.js
+++ b/static/js/note-files.js
@@ -103,10 +103,10 @@ function createVideoInsertDialog() {
       </div>
       <p class="dialog-copy" data-video-file-name></p>
       <div class="video-choice-actions">
-        <button type="button" class="action-button action-button--primary" data-video-choice="player">
+        <button type="button" class="primary-button" data-video-choice="player">
           <strong>Embedded player</strong><span>Play the video directly in the note.</span>
         </button>
-        <button type="button" class="action-button action-button--secondary" data-video-choice="download">
+        <button type="button" class="secondary-button" data-video-choice="download">
           <strong>Download link</strong><span>Insert a link that downloads the original file.</span>
         </button>
       </div>
@@ -156,23 +156,23 @@ export function bindNoteFiles({ editor, endpoints, getAccessToken, getUploadMaxS
   function fileActionButtons(file) {
     const attributes = `data-url="${escapeHtml(file.url)}" data-name="${escapeHtml(file.filename)}" data-mime="${escapeHtml(file.mime_type)}"`;
     const primaryInsert = isVideo(file.mime_type)
-      ? `<button class="action-button action-button--primary compact-button file-primary-action" data-add-file-to-note data-insert-mode="player" ${attributes}>${escapeHtml(t("files.addPlayer", {}, "Add player"))}</button>`
-      : `<button class="action-button action-button--primary compact-button file-primary-action" data-add-file-to-note data-insert-mode="auto" ${attributes}>${escapeHtml(t("files.addToNote", {}, "Add to note"))}</button>`;
+      ? `<button class="primary-button file-primary-action" data-add-file-to-note data-insert-mode="player" ${attributes}>${escapeHtml(t("files.addPlayer", {}, "Add player"))}</button>`
+      : `<button class="primary-button file-primary-action" data-add-file-to-note data-insert-mode="auto" ${attributes}>${escapeHtml(t("files.addToNote", {}, "Add to note"))}</button>`;
     const secondaryInsert = isVideo(file.mime_type)
-      ? `<button class="action-button action-button--secondary compact-button" data-add-file-to-note data-insert-mode="download" ${attributes}>${escapeHtml(t("files.addDownload", {}, "Add download"))}</button>`
+      ? `<button class="secondary-button" data-add-file-to-note data-insert-mode="download" ${attributes}>${escapeHtml(t("files.addDownload", {}, "Add download"))}</button>`
       : "";
     const codeButtons = isVideo(file.mime_type)
-      ? `<button class="action-button action-button--secondary compact-button" data-show-file-code="link" aria-pressed="false" ${attributes}>${escapeHtml(t("files.link", {}, "Link"))}</button>
-         <button class="action-button action-button--secondary compact-button" data-show-file-code="player" aria-pressed="false" ${attributes}>${escapeHtml(t("files.playerCode", {}, "Player code"))}</button>
-         <button class="action-button action-button--secondary compact-button" data-show-file-code="download" aria-pressed="false" ${attributes}>${escapeHtml(t("files.downloadCode", {}, "Download code"))}</button>`
-      : `<button class="action-button action-button--secondary compact-button" data-show-file-code="link" aria-pressed="false" ${attributes}>${escapeHtml(t("files.link", {}, "Link"))}</button>
-         <button class="action-button action-button--secondary compact-button" data-show-file-code="alias" aria-pressed="false" ${attributes}>${escapeHtml(t("files.alias", {}, "Alias"))}</button>
-         <button class="action-button action-button--secondary compact-button" data-show-file-code="markdown" aria-pressed="false" ${attributes}>${escapeHtml(t("files.markdown", {}, "Markdown"))}</button>`;
+      ? `<button class="secondary-button" data-show-file-code="link" aria-pressed="false" ${attributes}>${escapeHtml(t("files.link", {}, "Link"))}</button>
+         <button class="secondary-button" data-show-file-code="player" aria-pressed="false" ${attributes}>${escapeHtml(t("files.playerCode", {}, "Player code"))}</button>
+         <button class="secondary-button" data-show-file-code="download" aria-pressed="false" ${attributes}>${escapeHtml(t("files.downloadCode", {}, "Download code"))}</button>`
+      : `<button class="secondary-button" data-show-file-code="link" aria-pressed="false" ${attributes}>${escapeHtml(t("files.link", {}, "Link"))}</button>
+         <button class="secondary-button" data-show-file-code="alias" aria-pressed="false" ${attributes}>${escapeHtml(t("files.alias", {}, "Alias"))}</button>
+         <button class="secondary-button" data-show-file-code="markdown" aria-pressed="false" ${attributes}>${escapeHtml(t("files.markdown", {}, "Markdown"))}</button>`;
     const deleteButton = canDelete()
-      ? `<button class="action-button action-button--danger compact-button" data-delete-file="${file.id}" data-file-name="${escapeHtml(file.filename)}">${escapeHtml(t("files.delete", {}, "Delete file"))}</button>`
+      ? `<button class="danger-button" data-delete-file="${file.id}" data-file-name="${escapeHtml(file.filename)}">${escapeHtml(t("files.delete", {}, "Delete file"))}</button>`
       : "";
     return {
-      primary: `${primaryInsert}<button class="action-button action-button--secondary compact-button file-more-button" type="button" data-toggle-file-actions aria-expanded="false">${escapeHtml(t("common.more", {}, "More"))}</button>`,
+      primary: `${primaryInsert}<button class="secondary-button file-more-button" type="button" data-toggle-file-actions aria-expanded="false">${escapeHtml(t("common.more", {}, "More"))}</button>`,
       secondary: `${secondaryInsert}${codeButtons}${deleteButton}`,
     };
   }
@@ -218,7 +218,7 @@ export function bindNoteFiles({ editor, endpoints, getAccessToken, getUploadMaxS
           <div class="file-secondary-actions__buttons">${actions.secondary}</div>
           <div class="file-code" hidden>
             <input class="file-code-value" type="text" readonly aria-label="${escapeHtml(generatedCodeLabel)}" spellcheck="false">
-            <button class="action-button action-button--secondary file-code-copy" data-copy-generated>${escapeHtml(t("share.copy", {}, "Copy"))}</button>
+            <button class="secondary-button file-code-copy" data-copy-generated>${escapeHtml(t("share.copy", {}, "Copy"))}</button>
           </div>
         </div>
       </article>`;
@@ -263,7 +263,7 @@ export function bindNoteFiles({ editor, endpoints, getAccessToken, getUploadMaxS
     if (search && !filesLoaded) search.disabled = true;
     if (summary) summary.textContent = t("files.loadFailed", {}, "Could not load files");
     if (filesLoaded) return;
-    list.innerHTML = `<div class="files-state files-state--error"><div class="files-state-mark" aria-hidden="true">!</div><strong>${escapeHtml(t("files.loadFailed", {}, "Could not load files"))}</strong><span>${escapeHtml(error?.message || "")}</span><button class="action-button action-button--secondary compact-button" type="button" data-files-retry>${escapeHtml(t("files.retry", {}, "Try again"))}</button></div>`;
+    list.innerHTML = `<div class="files-state files-state--error"><div class="files-state-mark" aria-hidden="true">!</div><strong>${escapeHtml(t("files.loadFailed", {}, "Could not load files"))}</strong><span>${escapeHtml(error?.message || "")}</span><button class="secondary-button" type="button" data-files-retry>${escapeHtml(t("files.retry", {}, "Try again"))}</button></div>`;
   }
 
   async function loadFiles({ open = false } = {}) {