diff --git a/frontend/src/app/main/ui/settings/access_tokens.cljs b/frontend/src/app/main/ui/settings/access_tokens.cljs index 8f8f4e6f4..d7897db5e 100644 --- a/frontend/src/app/main/ui/settings/access_tokens.cljs +++ b/frontend/src/app/main/ui/settings/access_tokens.cljs @@ -25,6 +25,15 @@ [okulary.core :as l] [rumext.v2 :as mf])) +(def ^:private clipboard-icon + (i/icon-xref :clipboard-refactor (stl/css :clipboard-icon))) + +(def ^:private close-icon + (i/icon-xref :close-refactor (stl/css :close-icon))) + +(def ^:private menu-icon + (i/icon-xref :menu-refactor (stl/css :menu-icon))) + (def tokens-ref (l/derived :access-tokens st/state)) @@ -114,7 +123,8 @@ [:h2 {:class (stl/css :modal-title)} (tr "modals.create-access-token.title")] [:button {:class (stl/css :modal-close-btn) - :on-click on-close} i/close-refactor]] + :on-click on-close} + close-icon]] [:div {:class (stl/css :modal-content)} [:div {:class (stl/css :fields-row)} @@ -154,7 +164,7 @@ [:button {:title (tr "modals.create-access-token.copy-token") :class (stl/css :copy-btn) :on-click copy-token} - i/clipboard-refactor]]) + clipboard-icon]]) #_(when @created? [:button {:class (stl/css :copy-btn) :title (tr "modals.create-access-token.copy-token") @@ -226,7 +236,7 @@ :ref menu-ref :on-click on-menu-click :on-key-down on-keydown} - i/actions + menu-icon [:& context-menu-a11y {:on-close on-menu-close :show show? diff --git a/frontend/src/app/main/ui/settings/access_tokens.scss b/frontend/src/app/main/ui/settings/access_tokens.scss index b3273c9c8..92cd33be3 100644 --- a/frontend/src/app/main/ui/settings/access_tokens.scss +++ b/frontend/src/app/main/ui/settings/access_tokens.scss @@ -64,6 +64,8 @@ align-items: center; .icon { + height: 100%; + width: $s-16; padding-left: $s-12; cursor: pointer; } @@ -100,6 +102,11 @@ } } +.menu-icon { + @extend .button-icon; + stroke: var(--icon-foreground); +} + .dashboard-access-tokens { display: flex; flex-direction: column; @@ -232,9 +239,10 @@ @extend .button-secondary; height: $s-28; width: $s-28; - svg { - @extend .button-icon-small; - } +} + +.clipboard-icon { + @extend .button-icon-small; } .token-created-info {