mirror of
https://github.com/penpot/penpot.git
synced 2025-03-19 11:11:21 -05:00
Merge pull request #5181 from penpot/luis-replace-icon-buttons-workspace
♻️ Replace buttons on workspace
This commit is contained in:
commit
c7308ce634
53 changed files with 495 additions and 560 deletions
|
@ -17,6 +17,7 @@
|
|||
[app.main.refs :as refs]
|
||||
[app.main.store :as st]
|
||||
[app.main.ui.components.dropdown :refer [dropdown]]
|
||||
[app.main.ui.ds.buttons.icon-button :refer [icon-button*]]
|
||||
[app.main.ui.icons :as i]
|
||||
[app.util.dom :as dom]
|
||||
[app.util.i18n :as i18n :refer [tr]]
|
||||
|
@ -335,9 +336,10 @@
|
|||
:global/checked (:is-resolved thread))} i/tick]])
|
||||
|
||||
(when (= (:id profile) (:id owner))
|
||||
[:div {:class (stl/css :options)
|
||||
:on-click on-toggle-options}
|
||||
i/menu])]
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "labels.options")
|
||||
:on-click on-toggle-options
|
||||
:icon "menu"}])]
|
||||
|
||||
[:div {:class (stl/css :content)}
|
||||
(if @edition?
|
||||
|
|
|
@ -206,14 +206,6 @@
|
|||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
.options {
|
||||
@extend .button-tertiary;
|
||||
height: $s-32;
|
||||
width: $s-28;
|
||||
svg {
|
||||
@extend .button-icon;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.comment-options-dropdown {
|
||||
|
|
|
@ -18,7 +18,7 @@
|
|||
(def ^:private schema:icon-button
|
||||
[:map
|
||||
[:class {:optional true} :string]
|
||||
[:icon {:optional true}
|
||||
[:icon
|
||||
[:and :string [:fn #(contains? icon-list %)]]]
|
||||
[:aria-label :string]
|
||||
[:variant {:optional true}
|
||||
|
@ -27,7 +27,7 @@
|
|||
(mf/defc icon-button*
|
||||
{::mf/props :obj
|
||||
::mf/schema schema:icon-button}
|
||||
[{:keys [class icon variant aria-label] :rest props}]
|
||||
[{:keys [class icon variant aria-label children] :rest props}]
|
||||
(let [variant (or variant "primary")
|
||||
class (dm/str class " " (stl/css-case :icon-button true
|
||||
:icon-button-primary (= variant "primary")
|
||||
|
@ -35,4 +35,4 @@
|
|||
:icon-button-ghost (= variant "ghost")
|
||||
:icon-button-destructive (= variant "destructive")))
|
||||
props (mf/spread-props props {:class class :title aria-label})]
|
||||
[:> "button" props [:> icon* {:id icon :aria-label aria-label}]]))
|
||||
[:> "button" props [:> icon* {:id icon :aria-label aria-label}] children]))
|
||||
|
|
|
@ -16,6 +16,7 @@
|
|||
[app.main.ui.comments :as cmt]
|
||||
[app.main.ui.components.dropdown :refer [dropdown]]
|
||||
[app.main.ui.context :as ctx]
|
||||
[app.main.ui.ds.buttons.icon-button :refer [icon-button*]]
|
||||
[app.main.ui.icons :as i]
|
||||
[app.util.dom :as dom]
|
||||
[app.util.i18n :as i18n :refer [tr]]
|
||||
|
@ -124,9 +125,10 @@
|
|||
[:div {:class (stl/css-case :comments-section-title true
|
||||
:viewer-title from-viewer)}
|
||||
[:span (tr "labels.comments")]
|
||||
[:button {:class (stl/css :close-button)
|
||||
:on-click close-section}
|
||||
i/close]]
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "labels.close")
|
||||
:on-click close-section
|
||||
:icon "close"}]]
|
||||
|
||||
[:button {:class (stl/css :mode-dropdown-wrapper)
|
||||
:on-click toggle-mode-selector}
|
||||
|
|
|
@ -38,20 +38,6 @@
|
|||
margin-block-start: $s-8;
|
||||
}
|
||||
|
||||
.close-button {
|
||||
@extend .button-tertiary;
|
||||
position: absolute;
|
||||
right: $s-2;
|
||||
top: $s-2;
|
||||
height: $s-28;
|
||||
width: $s-28;
|
||||
border-radius: $br-6;
|
||||
svg {
|
||||
@extend .button-icon;
|
||||
stroke: var(--icon-foreground);
|
||||
}
|
||||
}
|
||||
|
||||
.mode-dropdown-wrapper {
|
||||
@include buttonStyle;
|
||||
@extend .asset-element;
|
||||
|
|
|
@ -29,6 +29,7 @@
|
|||
[app.main.store :as st]
|
||||
[app.main.ui.components.dropdown-menu :refer [dropdown-menu dropdown-menu-item*]]
|
||||
[app.main.ui.context :as ctx]
|
||||
[app.main.ui.ds.buttons.icon-button :refer [icon-button*]]
|
||||
[app.main.ui.hooks.resize :as r]
|
||||
[app.main.ui.icons :as i]
|
||||
[app.plugins.register :as preg]
|
||||
|
@ -745,8 +746,10 @@
|
|||
|
||||
|
||||
[:*
|
||||
[:div {:on-click open-menu
|
||||
:class (stl/css :menu-btn)} i/menu]
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "shortcut-subsection.main-menu")
|
||||
:on-click open-menu
|
||||
:icon "menu"}]
|
||||
|
||||
[:& dropdown-menu {:show show-menu?
|
||||
:on-close close-menu
|
||||
|
|
|
@ -6,18 +6,6 @@
|
|||
|
||||
@import "refactor/common-refactor.scss";
|
||||
|
||||
.menu-btn {
|
||||
@extend .button-tertiary;
|
||||
height: $s-32;
|
||||
width: calc($s-24 + $s-4);
|
||||
padding: 0;
|
||||
border-radius: $br-8;
|
||||
svg {
|
||||
@extend .button-icon;
|
||||
stroke: var(--icon-foreground);
|
||||
}
|
||||
}
|
||||
|
||||
.menu {
|
||||
@extend .menu-dropdown;
|
||||
top: $s-48;
|
||||
|
|
|
@ -16,6 +16,7 @@
|
|||
[app.main.store :as st]
|
||||
[app.main.ui.components.search-bar :refer [search-bar]]
|
||||
[app.main.ui.components.title-bar :refer [title-bar]]
|
||||
[app.main.ui.ds.buttons.icon-button :refer [icon-button*]]
|
||||
[app.main.ui.icons :as i]
|
||||
[app.plugins.register :as preg]
|
||||
[app.util.avatars :as avatars]
|
||||
|
@ -65,8 +66,10 @@
|
|||
[:div {:class (stl/css :plugin-summary)} (d/nilv description "")]]
|
||||
[:button {:class (stl/css :open-button)
|
||||
:on-click handle-open-click} (tr "workspace.plugins.button-open")]
|
||||
[:button {:class (stl/css :trash-button)
|
||||
:on-click handle-delete-click} i/delete]]))
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "workspace.plugins.remove-plugin")
|
||||
:on-click handle-delete-click
|
||||
:icon "delete"}]]))
|
||||
|
||||
(mf/defc plugin-management-dialog
|
||||
{::mf/register modal/components
|
||||
|
|
|
@ -121,17 +121,6 @@
|
|||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.trash-button {
|
||||
@extend .button-tertiary;
|
||||
width: $s-32;
|
||||
height: $s-32;
|
||||
|
||||
svg {
|
||||
@extend .button-icon;
|
||||
stroke: var(--icon-foreground);
|
||||
}
|
||||
}
|
||||
|
||||
.plugins-list {
|
||||
padding-top: $s-20;
|
||||
overflow-x: hidden;
|
||||
|
|
|
@ -16,6 +16,7 @@
|
|||
[app.main.store :as st]
|
||||
[app.main.ui.components.dropdown :refer [dropdown]]
|
||||
[app.main.ui.context :as ctx]
|
||||
[app.main.ui.ds.buttons.icon-button :refer [icon-button*]]
|
||||
[app.main.ui.exports.assets :refer [export-progress-widget]]
|
||||
[app.main.ui.formats :as fmt]
|
||||
[app.main.ui.icons :as i]
|
||||
|
@ -108,15 +109,15 @@
|
|||
[:ul {:class (stl/css :dropdown)}
|
||||
[:li {:class (stl/css :basic-zoom-bar)}
|
||||
[:span {:class (stl/css :zoom-btns)}
|
||||
[:button {:class (stl/css :zoom-btn)
|
||||
:on-click on-decrease}
|
||||
[:span {:class (stl/css :zoom-icon)}
|
||||
i/remove-icon]]
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "shortcuts.decrease-zoom")
|
||||
:on-click on-decrease
|
||||
:icon "remove"}]
|
||||
[:p {:class (stl/css :zoom-text)} zoom]
|
||||
[:button {:class (stl/css :zoom-btn)
|
||||
:on-click on-increase}
|
||||
[:span {:class (stl/css :zoom-icon)}
|
||||
i/add]]]
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "shortcuts.increase-zoom")
|
||||
:on-click on-increase
|
||||
:icon "add"}]]
|
||||
[:button {:class (stl/css :reset-btn)
|
||||
:on-click on-zoom-reset}
|
||||
(tr "workspace.header.reset-zoom")]]
|
||||
|
|
|
@ -72,25 +72,6 @@
|
|||
display: flex;
|
||||
}
|
||||
|
||||
.zoom-btn {
|
||||
@extend .button-tertiary;
|
||||
height: $s-28;
|
||||
width: $s-28;
|
||||
border-radius: $br-8;
|
||||
.zoom-icon {
|
||||
@include flexCenter;
|
||||
svg {
|
||||
@extend .button-icon;
|
||||
stroke: var(--icon-foreground);
|
||||
}
|
||||
}
|
||||
&:hover {
|
||||
.zoom-icon svg {
|
||||
stroke: var(--button-tertiary-foreground-color-hover);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.zoom-text {
|
||||
@include flexCenter;
|
||||
height: 100%;
|
||||
|
|
|
@ -16,6 +16,7 @@
|
|||
[app.main.ui.components.context-menu-a11y :refer [context-menu*]]
|
||||
[app.main.ui.components.search-bar :refer [search-bar]]
|
||||
[app.main.ui.context :as ctx]
|
||||
[app.main.ui.ds.buttons.icon-button :refer [icon-button*]]
|
||||
[app.main.ui.icons :as i]
|
||||
[app.main.ui.workspace.sidebar.assets.common :as cmm]
|
||||
[app.main.ui.workspace.sidebar.assets.file-library :refer [file-library]]
|
||||
|
@ -182,12 +183,10 @@
|
|||
:top 158
|
||||
:left 18
|
||||
:options options}]
|
||||
[:button {:class (stl/css :sort-button)
|
||||
:title (tr "workspace.assets.sort")
|
||||
:on-click toggle-ordering}
|
||||
(if reverse-sort?
|
||||
i/asc-sort
|
||||
i/desc-sort)]]]
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "workspace.assets.sort")
|
||||
:on-click toggle-ordering
|
||||
:icon (if reverse-sort? "asc-sort" "desc-sort")}]]]
|
||||
|
||||
[:& (mf/provider cmm/assets-filters) {:value filters}
|
||||
[:& (mf/provider cmm/assets-toggle-ordering) {:value toggle-ordering}
|
||||
|
|
|
@ -134,13 +134,3 @@
|
|||
display: flex;
|
||||
gap: $s-4;
|
||||
}
|
||||
|
||||
.sort-button {
|
||||
@extend .button-tertiary;
|
||||
width: $s-32;
|
||||
border-radius: $br-8;
|
||||
svg {
|
||||
@extend .button-icon-small;
|
||||
stroke: var(--icon-foreground);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -20,7 +20,7 @@
|
|||
[app.main.store :as st]
|
||||
[app.main.ui.components.color-bullet :as cb]
|
||||
[app.main.ui.context :as ctx]
|
||||
[app.main.ui.icons :as i]
|
||||
[app.main.ui.ds.buttons.icon-button :refer [icon-button*]]
|
||||
[app.main.ui.workspace.sidebar.assets.common :as cmm]
|
||||
[app.main.ui.workspace.sidebar.assets.groups :as grp]
|
||||
[app.util.color :as uc]
|
||||
|
@ -491,9 +491,10 @@
|
|||
(when local?
|
||||
[:& cmm/asset-section-block {:role :title-button}
|
||||
(when-not read-only?
|
||||
[:button {:class (stl/css :assets-btn)
|
||||
:on-click add-color-clicked}
|
||||
i/add])])
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "workspace.assets.colors.add-color")
|
||||
:on-click add-color-clicked
|
||||
:icon "add"}])])
|
||||
|
||||
|
||||
[:& cmm/asset-section-block {:role :content}
|
||||
|
|
|
@ -11,18 +11,6 @@
|
|||
// the elements are not part of the same cascade).
|
||||
$assets-button-width: $s-28;
|
||||
|
||||
.assets-btn {
|
||||
@extend .button-tertiary;
|
||||
height: $s-32;
|
||||
width: $assets-button-width;
|
||||
padding: 0;
|
||||
border-radius: $br-8;
|
||||
svg {
|
||||
@extend .button-icon;
|
||||
stroke: var(--icon-foreground);
|
||||
}
|
||||
}
|
||||
|
||||
.colors-group {
|
||||
margin-top: $s-4;
|
||||
}
|
||||
|
|
|
@ -24,6 +24,7 @@
|
|||
[app.main.ui.components.file-uploader :refer [file-uploader]]
|
||||
[app.main.ui.components.radio-buttons :refer [radio-button radio-buttons]]
|
||||
[app.main.ui.context :as ctx]
|
||||
[app.main.ui.ds.buttons.icon-button :refer [icon-button*]]
|
||||
[app.main.ui.hooks :as h]
|
||||
[app.main.ui.icons :as i]
|
||||
[app.main.ui.workspace.sidebar.assets.common :as cmm]
|
||||
|
@ -527,9 +528,10 @@
|
|||
:id "opt-grid"}]]])
|
||||
|
||||
(when (and components-v2 (not read-only?) local?)
|
||||
[:div {:on-click add-component
|
||||
:class (stl/css :add-component)}
|
||||
i/add
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "workspace.assets.components.add-component")
|
||||
:on-click add-component
|
||||
:icon "add"}
|
||||
[:& file-uploader {:accept cm/str-image-types
|
||||
:multi true
|
||||
:ref input-ref
|
||||
|
|
|
@ -209,19 +209,6 @@
|
|||
align-items: center;
|
||||
}
|
||||
|
||||
.add-component {
|
||||
@extend .button-tertiary;
|
||||
height: $s-32;
|
||||
width: $s-28;
|
||||
margin-left: $s-2;
|
||||
border-radius: $br-8;
|
||||
|
||||
svg {
|
||||
@extend .button-icon;
|
||||
stroke: var(--icon-foreground);
|
||||
}
|
||||
}
|
||||
|
||||
.dragging {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
|
|
|
@ -18,7 +18,7 @@
|
|||
[app.main.refs :as refs]
|
||||
[app.main.store :as st]
|
||||
[app.main.ui.context :as ctx]
|
||||
[app.main.ui.icons :as i]
|
||||
[app.main.ui.ds.buttons.icon-button :refer [icon-button*]]
|
||||
[app.main.ui.workspace.sidebar.assets.common :as cmm]
|
||||
[app.main.ui.workspace.sidebar.assets.groups :as grp]
|
||||
[app.main.ui.workspace.sidebar.options.menus.typography :refer [typography-entry]]
|
||||
|
@ -404,9 +404,10 @@
|
|||
(when local?
|
||||
[:& cmm/asset-section-block {:role :title-button}
|
||||
(when-not read-only?
|
||||
[:button {:class (stl/css :assets-btn)
|
||||
:on-click add-typography}
|
||||
i/add])])
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "workspace.assets.typography.add-typography")
|
||||
:on-click add-typography
|
||||
:icon "add"}])])
|
||||
|
||||
[:& cmm/asset-section-block {:role :content}
|
||||
[:& typographies-group {:file-id file-id
|
||||
|
|
|
@ -6,18 +6,6 @@
|
|||
|
||||
@import "refactor/common-refactor.scss";
|
||||
|
||||
.assets-btn {
|
||||
@extend .button-tertiary;
|
||||
height: $s-32;
|
||||
width: calc($s-24 + $s-4);
|
||||
padding: 0;
|
||||
border-radius: $br-8;
|
||||
svg {
|
||||
@extend .button-icon;
|
||||
stroke: var(--icon-foreground);
|
||||
}
|
||||
}
|
||||
|
||||
.assets-list {
|
||||
padding: 0 0 0 $s-4;
|
||||
}
|
||||
|
|
|
@ -11,9 +11,11 @@
|
|||
[app.common.data.macros :as dm]
|
||||
[app.main.data.workspace :as dw]
|
||||
[app.main.store :as st]
|
||||
[app.main.ui.ds.buttons.icon-button :refer [icon-button*]]
|
||||
[app.main.ui.icons :as i]
|
||||
[app.util.debug :as dbg]
|
||||
[app.util.dom :as dom]
|
||||
[app.util.i18n :as i18n :refer [tr]]
|
||||
[rumext.v2 :as mf]))
|
||||
|
||||
(mf/defc debug-panel
|
||||
|
@ -34,8 +36,10 @@
|
|||
[:div {:class (dm/str class " " (stl/css :debug-panel))}
|
||||
[:div {:class (stl/css :panel-title)}
|
||||
[:span "Debugging tools"]
|
||||
[:div {:class (stl/css :close-button) :on-click handle-close}
|
||||
i/close]]
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "labels.close")
|
||||
:on-click handle-close
|
||||
:icon "close"}]]
|
||||
|
||||
[:div {:class (stl/css :debug-panel-inner)}
|
||||
(for [option (sort-by d/name dbg/options)]
|
||||
|
|
|
@ -29,20 +29,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
.close-button {
|
||||
@extend .button-tertiary;
|
||||
position: absolute;
|
||||
right: $s-2;
|
||||
top: $s-2;
|
||||
height: $s-28;
|
||||
width: $s-28;
|
||||
border-radius: $br-6;
|
||||
svg {
|
||||
@extend .button-icon;
|
||||
stroke: var(--icon-foreground);
|
||||
}
|
||||
}
|
||||
|
||||
.checkbox-wrapper {
|
||||
@extend .input-checkbox;
|
||||
height: $s-32;
|
||||
|
|
|
@ -14,6 +14,7 @@
|
|||
[app.main.data.workspace.undo :as dwu]
|
||||
[app.main.refs :as refs]
|
||||
[app.main.store :as st]
|
||||
[app.main.ui.ds.buttons.icon-button :refer [icon-button*]]
|
||||
[app.main.ui.icons :as i]
|
||||
[app.util.dom :as dom]
|
||||
[app.util.i18n :refer [tr] :as i18n]
|
||||
|
@ -333,9 +334,10 @@
|
|||
[:div {:class (stl/css :history-toolbox)}
|
||||
[:div {:class (stl/css :history-toolbox-title)}
|
||||
[:span (tr "workspace.undo.title")]
|
||||
[:div {:class (stl/css :close-button)
|
||||
:on-click toggle-history}
|
||||
i/close]]
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "labels.close")
|
||||
:on-click toggle-history
|
||||
:icon "close"}]]
|
||||
(if (empty? entries)
|
||||
[:div {:class (stl/css :history-entry-empty)}
|
||||
[:div {:class (stl/css :history-entry-empty-icon)} i/history]
|
||||
|
|
|
@ -29,20 +29,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
.close-button {
|
||||
@extend .button-tertiary;
|
||||
position: absolute;
|
||||
right: $s-2;
|
||||
top: $s-2;
|
||||
height: $s-28;
|
||||
width: $s-28;
|
||||
border-radius: $br-6;
|
||||
svg {
|
||||
@extend .button-icon;
|
||||
stroke: var(--icon-foreground);
|
||||
}
|
||||
}
|
||||
|
||||
.history-entry-empty {
|
||||
@include flexCenter;
|
||||
flex-direction: column;
|
||||
|
|
|
@ -18,6 +18,7 @@
|
|||
[app.main.ui.components.search-bar :refer [search-bar]]
|
||||
[app.main.ui.components.shape-icon :as sic]
|
||||
[app.main.ui.components.title-bar :refer [title-bar]]
|
||||
[app.main.ui.ds.buttons.icon-button :refer [icon-button*]]
|
||||
[app.main.ui.hooks :as hooks]
|
||||
[app.main.ui.icons :as i]
|
||||
[app.main.ui.notifications.badge :refer [badge-notification]]
|
||||
|
@ -294,9 +295,10 @@
|
|||
:active active?)}
|
||||
i/filter-icon]]
|
||||
|
||||
[:button {:class (stl/css :close-search)
|
||||
:on-click toggle-search}
|
||||
i/close]]
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "labels.close")
|
||||
:on-click toggle-search
|
||||
:icon "close"}]]
|
||||
|
||||
[:div {:class (stl/css :active-filters)}
|
||||
(for [fkey current-filters]
|
||||
|
|
|
@ -53,18 +53,6 @@
|
|||
@extend .button-icon-selected;
|
||||
}
|
||||
}
|
||||
.close-search {
|
||||
@extend .button-tertiary;
|
||||
height: $s-32;
|
||||
width: $s-28;
|
||||
min-width: $s-28;
|
||||
padding: 0;
|
||||
border-radius: $br-8;
|
||||
svg {
|
||||
@extend .button-icon-small;
|
||||
stroke: var(--icon-foreground);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -40,6 +40,10 @@
|
|||
scrollbar-gutter: stable;
|
||||
}
|
||||
|
||||
.design-options {
|
||||
padding-inline-end: $s-12;
|
||||
}
|
||||
|
||||
.inspect {
|
||||
scrollbar-gutter: unset;
|
||||
}
|
||||
|
|
|
@ -12,6 +12,7 @@
|
|||
[app.main.store :as st]
|
||||
[app.main.ui.components.numeric-input :refer [numeric-input*]]
|
||||
[app.main.ui.components.title-bar :refer [title-bar]]
|
||||
[app.main.ui.ds.buttons.icon-button :refer [icon-button*]]
|
||||
[app.main.ui.icons :as i]
|
||||
[app.util.i18n :as i18n :refer [tr]]
|
||||
[rumext.v2 :as mf]))
|
||||
|
@ -86,9 +87,11 @@
|
|||
(tr "workspace.options.blur-options.title"))
|
||||
:class (stl/css-case :title-spacing-blur (not has-value?))}
|
||||
(when-not has-value?
|
||||
[:button {:class (stl/css :add-blur)
|
||||
:data-testid "add-blur"
|
||||
:on-click handle-add} i/add])]]
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "workspace.options.blur-options.add-blur")
|
||||
:on-click handle-add
|
||||
:icon "add"
|
||||
:data-testid "add-blur"}])]]
|
||||
(when (and open? has-value?)
|
||||
[:div {:class (stl/css :element-set-content)}
|
||||
[:div {:class (stl/css-case :first-row true
|
||||
|
@ -101,13 +104,14 @@
|
|||
[:span {:class (stl/css :label)}
|
||||
(tr "workspace.options.blur-options.title")]]
|
||||
[:div {:class (stl/css :actions)}
|
||||
[:button {:class (stl/css :action-btn)
|
||||
:on-click handle-toggle-visibility}
|
||||
(if hidden?
|
||||
i/hide
|
||||
i/shown)]
|
||||
[:button {:class (stl/css :action-btn)
|
||||
:on-click handle-delete} i/remove-icon]]]
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "workspace.options.blur-options.toggle-blur")
|
||||
:on-click handle-toggle-visibility
|
||||
:icon (if hidden? "hide" "shown")}]
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "workspace.options.blur-options.remove-blur")
|
||||
:on-click handle-delete
|
||||
:icon "remove"}]]]
|
||||
(when more-options?
|
||||
[:div {:class (stl/css :second-row)}
|
||||
[:label {:class (stl/css :label)
|
||||
|
|
|
@ -15,15 +15,6 @@
|
|||
margin: 0;
|
||||
}
|
||||
|
||||
.add-blur {
|
||||
@extend .button-tertiary;
|
||||
height: $s-32;
|
||||
width: $s-28;
|
||||
svg {
|
||||
@extend .button-icon;
|
||||
}
|
||||
}
|
||||
|
||||
.element-set-content {
|
||||
@include flexColumn;
|
||||
margin-bottom: $s-8;
|
||||
|
@ -72,15 +63,6 @@
|
|||
}
|
||||
.actions {
|
||||
@include flexRow;
|
||||
.action-btn {
|
||||
@extend .button-tertiary;
|
||||
box-sizing: border-box;
|
||||
height: $s-32;
|
||||
width: $s-28;
|
||||
svg {
|
||||
@extend .button-icon;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.hidden {
|
||||
|
|
|
@ -16,8 +16,8 @@
|
|||
[app.main.store :as st]
|
||||
[app.main.ui.components.select :refer [select]]
|
||||
[app.main.ui.components.title-bar :refer [title-bar]]
|
||||
[app.main.ui.ds.buttons.icon-button :refer [icon-button*]]
|
||||
[app.main.ui.exports.assets]
|
||||
[app.main.ui.icons :as i]
|
||||
[app.util.dom :as dom]
|
||||
[app.util.i18n :refer [tr c]]
|
||||
[app.util.keyboard :as kbd]
|
||||
|
@ -116,12 +116,15 @@
|
|||
delete-export
|
||||
(mf/use-fn
|
||||
(mf/deps ids)
|
||||
(fn [position]
|
||||
(let [remove-fill-by-index (fn [values index] (->> (d/enumerate values)
|
||||
(fn [event]
|
||||
(let [value (-> (dom/get-current-target event)
|
||||
(dom/get-data "value")
|
||||
(d/parse-integer))
|
||||
remove-fill-by-index (fn [values index] (->> (d/enumerate values)
|
||||
(filterv (fn [[idx _]] (not= idx index)))
|
||||
(mapv second)))
|
||||
|
||||
remove (fn [shape] (update shape :exports remove-fill-by-index position))]
|
||||
remove (fn [shape] (update shape :exports remove-fill-by-index value))]
|
||||
(st/emit! (dwsh/update-shapes ids remove)))))
|
||||
|
||||
on-scale-change
|
||||
|
@ -188,9 +191,10 @@
|
|||
:on-collapsed toggle-content
|
||||
:title (tr (if (> (count ids) 1) "workspace.options.export-multiple" "workspace.options.export"))
|
||||
:class (stl/css-case :title-spacing-export (not has-exports?))}
|
||||
[:button {:class (stl/css :add-export)
|
||||
:on-click add-export}
|
||||
i/add]]]
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "workspace.options.export.add-export")
|
||||
:on-click add-export
|
||||
:icon "add"}]]]
|
||||
(when open?
|
||||
[:div {:class (stl/css :element-set-content)}
|
||||
|
||||
|
@ -199,9 +203,10 @@
|
|||
[:div {:class (stl/css :multiple-exports)}
|
||||
[:div {:class (stl/css :label)} (tr "settings.multiple")]
|
||||
[:div {:class (stl/css :actions)}
|
||||
[:button {:class (stl/css :action-btn)
|
||||
:on-click on-remove-all}
|
||||
i/remove-icon]]]
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "workspace.options.export.remove-export")
|
||||
:on-click on-remove-all
|
||||
:icon "remove"}]]]
|
||||
|
||||
(seq exports)
|
||||
[:*
|
||||
|
@ -233,9 +238,11 @@
|
|||
:on-change on-suffix-change
|
||||
:on-key-down manage-key-down}]]]
|
||||
|
||||
[:button {:class (stl/css :action-btn)
|
||||
:on-click (partial delete-export index)}
|
||||
i/remove-icon]])])
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "workspace.options.export.remove-export")
|
||||
:on-click delete-export
|
||||
:data-value index
|
||||
:icon "remove"}]])])
|
||||
|
||||
(when (or (= :multiple exports) (seq exports))
|
||||
[:button
|
||||
|
|
|
@ -15,15 +15,6 @@
|
|||
margin: 0;
|
||||
}
|
||||
|
||||
.add-export {
|
||||
@extend .button-tertiary;
|
||||
height: $s-32;
|
||||
width: $s-28;
|
||||
svg {
|
||||
@extend .button-icon;
|
||||
}
|
||||
}
|
||||
|
||||
.element-set-content {
|
||||
@include flexColumn;
|
||||
margin: $s-4 0 $s-8 0;
|
||||
|
@ -36,14 +27,6 @@
|
|||
}
|
||||
.actions {
|
||||
@include flexRow;
|
||||
.action-btn {
|
||||
@extend .button-tertiary;
|
||||
height: $s-32;
|
||||
width: $s-28;
|
||||
svg {
|
||||
@extend .button-icon;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -51,15 +34,6 @@
|
|||
display: grid;
|
||||
grid-template-columns: repeat(8, 1fr);
|
||||
column-gap: $s-4;
|
||||
|
||||
.action-btn {
|
||||
@extend .button-tertiary;
|
||||
height: $s-32;
|
||||
width: $s-28;
|
||||
svg {
|
||||
@extend .button-icon;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.input-wrapper {
|
||||
|
|
|
@ -13,6 +13,7 @@
|
|||
[app.main.data.workspace.colors :as dc]
|
||||
[app.main.store :as st]
|
||||
[app.main.ui.components.title-bar :refer [title-bar]]
|
||||
[app.main.ui.ds.buttons.icon-button :refer [icon-button*]]
|
||||
[app.main.ui.hooks :as h]
|
||||
[app.main.ui.icons :as i]
|
||||
[app.main.ui.workspace.sidebar.options.rows.color-row :refer [color-row]]
|
||||
|
@ -145,9 +146,11 @@
|
|||
:class (stl/css-case :title-spacing-fill (not has-fills?))}
|
||||
|
||||
(when (and (not disable-remove?) (not (= :multiple fills)))
|
||||
[:button {:class (stl/css :add-fill)
|
||||
:data-testid "add-fill"
|
||||
:on-click on-add} i/add])]]
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "workspace.options.fill.add-fill")
|
||||
:on-click on-add
|
||||
:data-testid "add-fill"
|
||||
:icon "add"}])]]
|
||||
|
||||
(when open?
|
||||
[:div {:class (stl/css :element-content)}
|
||||
|
@ -156,9 +159,10 @@
|
|||
[:div {:class (stl/css :element-set-options-group)}
|
||||
[:div {:class (stl/css :group-label)}
|
||||
(tr "settings.multiple")]
|
||||
[:button {:on-click on-remove-all
|
||||
:class (stl/css :remove-btn)}
|
||||
i/remove-icon]]
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "workspace.options.fill.remove-fill")
|
||||
:on-click on-remove-all
|
||||
:icon "remove"}]]
|
||||
|
||||
(seq fills)
|
||||
[:& h/sortable-container {}
|
||||
|
|
|
@ -19,15 +19,6 @@
|
|||
margin: 0;
|
||||
}
|
||||
|
||||
.add-fill {
|
||||
@extend .button-tertiary;
|
||||
height: $s-32;
|
||||
width: $s-28;
|
||||
svg {
|
||||
@extend .button-icon;
|
||||
}
|
||||
}
|
||||
|
||||
.element-content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
@ -43,15 +34,6 @@
|
|||
@extend .mixed-bar;
|
||||
}
|
||||
|
||||
.remove-btn {
|
||||
@extend .button-tertiary;
|
||||
height: $s-32;
|
||||
width: $s-28;
|
||||
svg {
|
||||
@extend .button-icon;
|
||||
}
|
||||
}
|
||||
|
||||
.checkbox {
|
||||
@extend .input-checkbox;
|
||||
padding-left: $s-8;
|
||||
|
|
|
@ -16,6 +16,7 @@
|
|||
[app.main.ui.components.numeric-input :refer [numeric-input*]]
|
||||
[app.main.ui.components.select :refer [select]]
|
||||
[app.main.ui.components.title-bar :refer [title-bar]]
|
||||
[app.main.ui.ds.buttons.icon-button :refer [icon-button*]]
|
||||
[app.main.ui.icons :as i]
|
||||
[app.main.ui.workspace.sidebar.options.common :refer [advanced-options]]
|
||||
[app.main.ui.workspace.sidebar.options.rows.color-row :refer [color-row]]
|
||||
|
@ -178,12 +179,14 @@
|
|||
:on-change handle-change-size}]])]
|
||||
|
||||
[:div {:class (stl/css :actions)}
|
||||
[:button {:class (stl/css :action-btn)
|
||||
:on-click handle-toggle-visibility}
|
||||
(if display i/shown i/hide)]
|
||||
[:button {:class (stl/css :action-btn)
|
||||
:on-click on-remove}
|
||||
i/remove-icon]]]
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "workspace.options.guides.toggle-guide")
|
||||
:on-click handle-toggle-visibility
|
||||
:icon (if display "shown" "hide")}]
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "workspace.options.guides.remove-guide")
|
||||
:on-click on-remove
|
||||
:icon "remove"}]]]
|
||||
|
||||
(when (:display grid)
|
||||
[:& advanced-options {:class (stl/css :grid-advanced-options)
|
||||
|
@ -316,9 +319,10 @@
|
|||
:class (stl/css-case :title-spacing-board-grid (not has-frame-grids?))
|
||||
:title (tr "workspace.options.guides.title")}
|
||||
|
||||
[:button {:on-click handle-create-grid
|
||||
:class (stl/css :add-grid)}
|
||||
i/add]]
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "workspace.options.guides.add-guide")
|
||||
:on-click handle-create-grid
|
||||
:icon "add"}]]
|
||||
|
||||
(when (and open? (seq frame-grids))
|
||||
[:div {:class (stl/css :element-set-content)}
|
||||
|
|
|
@ -15,15 +15,6 @@
|
|||
margin: 0;
|
||||
}
|
||||
|
||||
.add-grid {
|
||||
@extend .button-tertiary;
|
||||
height: $s-32;
|
||||
width: $s-28;
|
||||
svg {
|
||||
@extend .button-icon;
|
||||
}
|
||||
}
|
||||
|
||||
.element-set-content {
|
||||
@include flexColumn;
|
||||
margin: $s-4 0 $s-8 0;
|
||||
|
@ -154,15 +145,6 @@
|
|||
@include flexRow;
|
||||
}
|
||||
|
||||
.action-btn {
|
||||
@extend .button-tertiary;
|
||||
height: $s-32;
|
||||
width: $s-28;
|
||||
svg {
|
||||
@extend .button-icon;
|
||||
}
|
||||
}
|
||||
|
||||
.grid-advanced-options {
|
||||
@include flexColumn;
|
||||
margin-top: $s-4;
|
||||
|
|
|
@ -22,6 +22,7 @@
|
|||
[app.main.ui.components.radio-buttons :refer [radio-buttons radio-button]]
|
||||
[app.main.ui.components.select :refer [select]]
|
||||
[app.main.ui.components.title-bar :refer [title-bar]]
|
||||
[app.main.ui.ds.buttons.icon-button :refer [icon-button*]]
|
||||
[app.main.ui.icons :as i]
|
||||
[app.util.dom :as dom]
|
||||
[app.util.i18n :as i18n :refer [tr]]
|
||||
|
@ -149,9 +150,10 @@
|
|||
:on-key-down on-key-down
|
||||
:default-value (:name flow "")}]]]]
|
||||
|
||||
[:button {:class (stl/css :remove-flow-btn)
|
||||
:on-click remove-flow}
|
||||
i/remove-icon]]))
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "workspace.options.flows.remove-flow")
|
||||
:on-click remove-flow
|
||||
:icon "remove"}]]))
|
||||
|
||||
(mf/defc page-flows
|
||||
{::mf/props :obj}
|
||||
|
@ -176,10 +178,10 @@
|
|||
:title (tr "workspace.options.flows.flow")
|
||||
:class (stl/css :title-spacing-layout-flow)}
|
||||
(when (nil? flow)
|
||||
[:button {:class (stl/css :add-flow-btn)
|
||||
:title (tr "workspace.options.flows.add-flow-start")
|
||||
:on-click add-flow}
|
||||
i/add])]
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "workspace.options.flows.add-flow-start")
|
||||
:on-click add-flow
|
||||
:icon "add"}])]
|
||||
|
||||
(when (some? flow)
|
||||
[:& flow-item {:flow flow :key (dm/str (:id flow))}])])))
|
||||
|
@ -727,9 +729,10 @@
|
|||
:title (tr "workspace.options.interactions")
|
||||
:class (stl/css :title-spacing-layout-interactions)}
|
||||
|
||||
[:button {:class (stl/css :add-interaction-btn)
|
||||
:on-click add-interaction}
|
||||
i/add]]])
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "workspace.options.interactions.add-interaction")
|
||||
:on-click add-interaction
|
||||
:icon "add"}]]])
|
||||
|
||||
(when (= (count interactions) 0)
|
||||
[:div {:class (stl/css :help-content)}
|
||||
|
|
|
@ -16,16 +16,6 @@
|
|||
@include flexColumn;
|
||||
}
|
||||
|
||||
.add-interaction-btn {
|
||||
@extend .button-tertiary;
|
||||
height: $s-32;
|
||||
width: $s-28;
|
||||
svg {
|
||||
@extend .button-icon;
|
||||
stroke: var(--icon-foreground);
|
||||
}
|
||||
}
|
||||
|
||||
.help-content {
|
||||
padding: $s-32 0;
|
||||
width: $s-200;
|
||||
|
@ -69,15 +59,6 @@
|
|||
@include flexColumn;
|
||||
}
|
||||
|
||||
.add-flow-btn {
|
||||
@extend .button-tertiary;
|
||||
height: $s-32;
|
||||
width: $s-28;
|
||||
svg {
|
||||
@extend .button-icon;
|
||||
}
|
||||
}
|
||||
|
||||
.interactions-info {
|
||||
flex-grow: 1;
|
||||
display: grid;
|
||||
|
@ -364,13 +345,3 @@
|
|||
border: $s-1 solid var(--input-border-color-active);
|
||||
}
|
||||
}
|
||||
|
||||
.remove-flow-btn {
|
||||
@extend .button-tertiary;
|
||||
height: $s-32;
|
||||
width: $s-28;
|
||||
min-width: $s-28;
|
||||
svg {
|
||||
@extend .button-icon;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -14,7 +14,7 @@
|
|||
[app.main.store :as st]
|
||||
[app.main.ui.components.numeric-input :refer [numeric-input*]]
|
||||
[app.main.ui.components.select :refer [select]]
|
||||
[app.main.ui.icons :as i]
|
||||
[app.main.ui.ds.buttons.icon-button :refer [icon-button*]]
|
||||
[app.util.i18n :as i18n :refer [tr]]
|
||||
[rumext.v2 :as mf]))
|
||||
|
||||
|
@ -172,19 +172,26 @@
|
|||
[:div {:class (stl/css :actions)}
|
||||
(cond
|
||||
(or (= :multiple hidden?) (not hidden?))
|
||||
[:button {:on-click handle-set-hidden
|
||||
:class (stl/css :hidden-btn)} i/shown]
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "workspace.options.layer-options.toggle-layer")
|
||||
:on-click handle-set-hidden
|
||||
:icon "shown"}]
|
||||
|
||||
:else
|
||||
[:button {:on-click handle-set-visible
|
||||
:class (stl/css :hidden-btn)} i/hide])
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "workspace.options.layer-options.toggle-layer")
|
||||
:on-click handle-set-visible
|
||||
:icon "hide"}])
|
||||
|
||||
(cond
|
||||
(or (= :multiple blocked?) (not blocked?))
|
||||
[:button {:on-click handle-set-blocked
|
||||
:class (stl/css :lock-btn)} i/unlock]
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "workspace.shape.menu.lock")
|
||||
:on-click handle-set-blocked
|
||||
:icon "unlock"}]
|
||||
|
||||
:else
|
||||
[:button {:on-click handle-set-unblocked
|
||||
:class (stl/css-case :lock-btn true
|
||||
:locked blocked?)} i/lock])]]]))
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "workspace.shape.menu.unlock")
|
||||
:on-click handle-set-unblocked
|
||||
:icon "lock"}])]]]))
|
||||
|
|
|
@ -25,17 +25,6 @@
|
|||
.actions {
|
||||
display: flex;
|
||||
gap: $s-4;
|
||||
.hidden-btn,
|
||||
.lock-btn {
|
||||
@extend .button-tertiary;
|
||||
border-radius: $br-8;
|
||||
height: $s-32;
|
||||
width: $s-28;
|
||||
svg {
|
||||
@extend .button-icon;
|
||||
stroke: var(--icon-foreground);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.hidden {
|
||||
|
|
|
@ -24,6 +24,7 @@
|
|||
[app.main.ui.components.radio-buttons :refer [radio-button radio-buttons]]
|
||||
[app.main.ui.components.select :refer [select]]
|
||||
[app.main.ui.components.title-bar :refer [title-bar]]
|
||||
[app.main.ui.ds.buttons.icon-button :refer [icon-button*]]
|
||||
[app.main.ui.formats :as fmt]
|
||||
[app.main.ui.hooks :as h]
|
||||
[app.main.ui.icons :as i]
|
||||
|
@ -759,9 +760,12 @@
|
|||
{:value :percent :label "%"}]
|
||||
:on-change #(set-column-type type index %)}]]]
|
||||
|
||||
[:button {:class (stl/css :remove-track-btn)
|
||||
:on-click #(remove-element type index)}
|
||||
i/remove-icon]]))
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "workspace.shape.menu.delete")
|
||||
:on-click remove-element
|
||||
:data-type type
|
||||
:data-index index
|
||||
:icon "remove"}]]))
|
||||
|
||||
(mf/defc grid-columns-row
|
||||
{::mf/props :obj}
|
||||
|
@ -996,10 +1000,10 @@
|
|||
[:div {:class (stl/css :title-actions)}
|
||||
(when ^boolean grid-enabled?
|
||||
[:*
|
||||
[:button {:class (stl/css :add-layout)
|
||||
:aria-label "Add"
|
||||
:on-click on-toggle-dropdown-visibility}
|
||||
i/menu]
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "workspace.shape.menu.add-layout")
|
||||
:on-click on-toggle-dropdown-visibility
|
||||
:icon "menu"}]
|
||||
|
||||
[:& dropdown {:show show-dropdown?
|
||||
:on-close on-hide-dropdown}
|
||||
|
@ -1014,16 +1018,18 @@
|
|||
"Grid layout"]]]])
|
||||
|
||||
(when has-layout?
|
||||
[:button {:class (stl/css :remove-layout)
|
||||
:on-click on-remove-layout}
|
||||
i/remove-icon])]
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "workspace.shape.menu.remove-layout")
|
||||
:on-click on-remove-layout
|
||||
:icon "remove"}])]
|
||||
|
||||
[:div {:class (stl/css :title-actions)}
|
||||
(if ^boolean grid-enabled?
|
||||
[:*
|
||||
[:button {:class (stl/css :add-layout)
|
||||
:on-click on-toggle-dropdown-visibility}
|
||||
i/add]
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "workspace.shape.menu.add-layout")
|
||||
:on-click on-toggle-dropdown-visibility
|
||||
:icon "add"}]
|
||||
|
||||
[:& dropdown {:show show-dropdown?
|
||||
:on-close on-hide-dropdown}
|
||||
|
@ -1042,9 +1048,10 @@
|
|||
:on-click on-add-layout}
|
||||
i/add])
|
||||
(when has-layout?
|
||||
[:button {:class (stl/css :remove-layout)
|
||||
:on-click on-remove-layout}
|
||||
i/remove-icon])])]]
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "workspace.shape.menu.delete")
|
||||
:on-click on-remove-layout
|
||||
:icon "remove"}])])]]
|
||||
|
||||
(when (and ^boolean open?
|
||||
^boolean has-layout?
|
||||
|
@ -1068,9 +1075,10 @@
|
|||
:justify-content justify-content
|
||||
:on-change set-justify-content}]
|
||||
|
||||
[:button {:on-click open-flex-help
|
||||
:class (stl/css :help-button)}
|
||||
i/help]]
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "labels.help-center")
|
||||
:on-click open-flex-help
|
||||
:icon "help"}]]
|
||||
(when (= :wrap wrap-type)
|
||||
[:div {:class (stl/css :third-row)}
|
||||
[:& align-content-row {:is-column is-column
|
||||
|
@ -1092,8 +1100,10 @@
|
|||
(when (= 1 (count ids))
|
||||
[:div {:class (stl/css :edit-grid-wrapper)}
|
||||
[:& grid-edit-mode {:id (first ids)}]
|
||||
[:button {:on-click open-grid-help
|
||||
:class (stl/css :help-button)} i/help]])
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "labels.help-center")
|
||||
:on-click open-grid-help
|
||||
:icon "help"}]])
|
||||
|
||||
[:div {:class (stl/css :row :first-row)}
|
||||
[:div {:class (stl/css :direction-edit)}
|
||||
|
@ -1222,8 +1232,14 @@
|
|||
remove-element
|
||||
(mf/use-fn
|
||||
(mf/deps ids)
|
||||
(fn [type index]
|
||||
(st/emit! (dwsl/remove-layout-track ids type index))))
|
||||
(fn [event]
|
||||
(let [type (-> (dom/get-current-target event)
|
||||
(dom/get-data "type")
|
||||
(d/read-string))
|
||||
index (-> (dom/get-current-target event)
|
||||
(dom/get-data "index")
|
||||
(d/parse-integer))]
|
||||
(st/emit! (dwsl/remove-layout-track ids type index)))))
|
||||
|
||||
reorder-track
|
||||
(mf/use-fn
|
||||
|
@ -1269,8 +1285,11 @@
|
|||
[:div {:class (stl/css :grid-layout-menu)}
|
||||
[:div {:class (stl/css :row)}
|
||||
[:div {:class (stl/css :grid-layout-menu-title)} "GRID LAYOUT"]
|
||||
[:button {:on-click open-grid-help
|
||||
:class (stl/css :help-button)} i/help]
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:class (stl/css :help-button)
|
||||
:aria-label (tr "labels.help-center")
|
||||
:on-click open-grid-help
|
||||
:icon "help"}]
|
||||
[:button {:class (stl/css :exit-btn)
|
||||
:on-click #(st/emit! (udw/clear-edition-mode))}
|
||||
(tr "workspace.layout_grid.editor.options.exit")]]
|
||||
|
@ -1297,10 +1316,11 @@
|
|||
:value grid-justify-content-row
|
||||
:on-change on-row-justify-change}]
|
||||
|
||||
[:button {:on-click handle-locate-grid
|
||||
:class (stl/css :locate-button)
|
||||
:title (tr "workspace.layout_grid.editor.top-bar.locate.tooltip")}
|
||||
i/locate]]
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:class (stl/css :locate-button)
|
||||
:aria-label (tr "workspace.layout_grid.editor.top-bar.locate.tooltip")
|
||||
:on-click handle-locate-grid
|
||||
:icon "locate"}]]
|
||||
|
||||
[:div {:class (stl/css :row)}
|
||||
[:& gap-section {:on-change on-gap-change
|
||||
|
|
|
@ -27,17 +27,6 @@
|
|||
.layout-option {
|
||||
white-space: nowrap;
|
||||
}
|
||||
.remove-layout,
|
||||
.add-layout {
|
||||
@extend .button-tertiary;
|
||||
border-radius: $br-8;
|
||||
height: $s-32;
|
||||
width: $s-28;
|
||||
svg {
|
||||
@extend .button-icon;
|
||||
stroke: var(--icon-foreground);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.flex-layout-menu {
|
||||
|
@ -69,12 +58,9 @@
|
|||
@include flexColumn;
|
||||
}
|
||||
.help-button-wrapper {
|
||||
position: relative;
|
||||
.help-button {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
}
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -252,19 +238,6 @@
|
|||
border-radius: 0 $br-8 $br-8 0;
|
||||
width: $s-96;
|
||||
}
|
||||
|
||||
.remove-track-btn {
|
||||
@extend .button-tertiary;
|
||||
padding: $s-8;
|
||||
|
||||
svg {
|
||||
@extend .button-icon;
|
||||
width: $s-12;
|
||||
height: $s-12;
|
||||
stroke: var(--icon-foreground);
|
||||
fill: var(--icon-foreground);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.grid-tracks {
|
||||
|
@ -320,9 +293,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
.columns-info {
|
||||
}
|
||||
|
||||
.add-column {
|
||||
@extend .button-tertiary;
|
||||
height: $s-52;
|
||||
|
@ -337,17 +307,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
.locate-button,
|
||||
.help-button {
|
||||
@extend .button-tertiary;
|
||||
padding: $s-8;
|
||||
svg {
|
||||
fill: none;
|
||||
width: $s-16;
|
||||
height: $s-16;
|
||||
}
|
||||
}
|
||||
|
||||
.layout-options {
|
||||
@extend .dropdown-wrapper;
|
||||
@include flexColumn;
|
||||
|
|
|
@ -19,6 +19,7 @@
|
|||
[app.main.ui.components.numeric-input :refer [numeric-input*]]
|
||||
[app.main.ui.components.select :refer [select]]
|
||||
[app.main.ui.components.title-bar :refer [title-bar]]
|
||||
[app.main.ui.ds.buttons.icon-button :refer [icon-button*]]
|
||||
[app.main.ui.hooks :as h]
|
||||
[app.main.ui.icons :as i]
|
||||
[app.main.ui.workspace.sidebar.options.common :refer [advanced-options]]
|
||||
|
@ -168,14 +169,14 @@
|
|||
:options type-options
|
||||
:on-change on-type-change}]]]
|
||||
[:div {:class (stl/css :actions)}
|
||||
[:button {:class (stl/css :action-btn)
|
||||
:on-click toggle-visibility}
|
||||
(if hidden?
|
||||
i/hide
|
||||
i/shown)]
|
||||
[:button {:class (stl/css :action-btn)
|
||||
:on-click on-remove-shadow}
|
||||
i/remove-icon]]]
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "workspace.options.shadow-options.toggle-shadow")
|
||||
:on-click toggle-visibility
|
||||
:icon (if hidden? "hide" "shown")}]
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "workspace.options.shadow-options.remove-shadow")
|
||||
:on-click on-remove-shadow
|
||||
:icon "remove"}]]]
|
||||
(when open-shadow
|
||||
[:& advanced-options {:class (stl/css :shadow-advanced-options)
|
||||
:visible? open-shadow
|
||||
|
@ -297,9 +298,11 @@
|
|||
:class (stl/css-case :title-spacing-shadow (not has-shadows?))}
|
||||
|
||||
(when-not (= :multiple shadows)
|
||||
[:button {:class (stl/css :add-shadow)
|
||||
:data-testid "add-shadow"
|
||||
:on-click on-add-shadow} i/add])]]
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "workspace.options.shadow-options.add-shadow")
|
||||
:on-click on-add-shadow
|
||||
:icon "add"
|
||||
:data-testid "add-shadow"}])]]
|
||||
|
||||
(when open?
|
||||
(cond
|
||||
|
@ -308,9 +311,10 @@
|
|||
[:div {:class (stl/css :multiple-shadows)}
|
||||
[:div {:class (stl/css :label)} (tr "settings.multiple")]
|
||||
[:div {:class (stl/css :actions)}
|
||||
[:button {:class (stl/css :action-btn)
|
||||
:on-click on-remove-all}
|
||||
i/remove-icon]]]]
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "workspace.options.shadow-options.remove-shadow")
|
||||
:on-click on-remove-all
|
||||
:icon "remove"}]]]]
|
||||
|
||||
(seq shadows)
|
||||
[:& h/sortable-container {}
|
||||
|
|
|
@ -14,14 +14,6 @@
|
|||
margin: 0;
|
||||
padding-left: $s-2;
|
||||
}
|
||||
.add-shadow {
|
||||
@extend .button-tertiary;
|
||||
height: $s-32;
|
||||
width: $s-28;
|
||||
svg {
|
||||
@extend .button-icon;
|
||||
}
|
||||
}
|
||||
|
||||
.element-set-content {
|
||||
margin-top: $s-4;
|
||||
|
@ -40,15 +32,6 @@
|
|||
@include flexRow;
|
||||
}
|
||||
|
||||
.action-btn {
|
||||
@extend .button-tertiary;
|
||||
height: $s-32;
|
||||
width: $s-28;
|
||||
svg {
|
||||
@extend .button-icon;
|
||||
}
|
||||
}
|
||||
|
||||
.shadow-element {
|
||||
@include flexColumn;
|
||||
}
|
||||
|
|
|
@ -13,8 +13,8 @@
|
|||
[app.main.data.workspace.colors :as dc]
|
||||
[app.main.store :as st]
|
||||
[app.main.ui.components.title-bar :refer [title-bar]]
|
||||
[app.main.ui.ds.buttons.icon-button :refer [icon-button*]]
|
||||
[app.main.ui.hooks :as h]
|
||||
[app.main.ui.icons :as i]
|
||||
[app.main.ui.workspace.sidebar.options.rows.stroke-row :refer [stroke-row]]
|
||||
[app.util.dom :as dom]
|
||||
[app.util.i18n :as i18n :refer [tr]]
|
||||
|
@ -167,9 +167,11 @@
|
|||
:title label
|
||||
:class (stl/css-case :title-spacing-stroke (not has-strokes?))}
|
||||
(when (not (= :multiple strokes))
|
||||
[:button {:class (stl/css :add-stroke)
|
||||
:data-testid "add-stroke"
|
||||
:on-click on-add-stroke} i/add])]]
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "workspace.options.stroke.add-stroke")
|
||||
:on-click on-add-stroke
|
||||
:icon "add"
|
||||
:data-testid "add-stroke"}])]]
|
||||
(when open?
|
||||
[:div {:class (stl/css-case :element-content true
|
||||
:empty-content (not has-strokes?))}
|
||||
|
@ -178,9 +180,10 @@
|
|||
[:div {:class (stl/css :element-set-options-group)}
|
||||
[:div {:class (stl/css :group-label)}
|
||||
(tr "settings.multiple")]
|
||||
[:button {:on-click handle-remove-all
|
||||
:class (stl/css :remove-btn)}
|
||||
i/remove-icon]]
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "workspace.options.stroke.remove-stroke")
|
||||
:on-click handle-remove-all
|
||||
:icon "remove"}]]
|
||||
(seq strokes)
|
||||
[:& h/sortable-container {}
|
||||
(for [[index value] (d/enumerate (:strokes values []))]
|
||||
|
|
|
@ -18,14 +18,6 @@
|
|||
padding-left: $s-2;
|
||||
margin: 0;
|
||||
}
|
||||
.add-stroke {
|
||||
@extend .button-tertiary;
|
||||
height: $s-32;
|
||||
width: $s-28;
|
||||
svg {
|
||||
@extend .button-icon;
|
||||
}
|
||||
}
|
||||
|
||||
.element-content {
|
||||
display: flex;
|
||||
|
@ -44,12 +36,3 @@
|
|||
.group-label {
|
||||
@extend .mixed-bar;
|
||||
}
|
||||
|
||||
.remove-btn {
|
||||
@extend .button-tertiary;
|
||||
height: $s-32;
|
||||
width: $s-28;
|
||||
svg {
|
||||
@extend .button-icon;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -20,6 +20,7 @@
|
|||
[app.main.ui.components.radio-buttons :refer [radio-button radio-buttons]]
|
||||
[app.main.ui.components.title-bar :refer [title-bar]]
|
||||
[app.main.ui.context :as ctx]
|
||||
[app.main.ui.ds.buttons.icon-button :refer [icon-button*]]
|
||||
[app.main.ui.icons :as i]
|
||||
[app.main.ui.workspace.sidebar.options.menus.typography :refer [typography-entry text-options]]
|
||||
[app.util.dom :as dom]
|
||||
|
@ -290,9 +291,10 @@
|
|||
:title label
|
||||
:class (stl/css :title-spacing-text)}
|
||||
(when (and (not typography) (not multiple?))
|
||||
[:button {:class (stl/css :add-typography)
|
||||
:on-click on-convert-to-typography}
|
||||
i/add])]]
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "labels.options")
|
||||
:on-click on-convert-to-typography
|
||||
:icon "add"}])]]
|
||||
|
||||
(when main-menu-open?
|
||||
[:div {:class (stl/css :element-content)}
|
||||
|
@ -318,9 +320,10 @@
|
|||
[:div {:class (stl/css :text-align-options)}
|
||||
[:> text-align-options opts]
|
||||
[:> grow-options opts]
|
||||
[:button {:class (stl/css :more-options)
|
||||
:on-click toggle-more-options}
|
||||
i/menu]]
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "labels.options")
|
||||
:on-click toggle-more-options
|
||||
:icon "menu"}]]
|
||||
|
||||
(when more-options-open?
|
||||
[:div {:class (stl/css :text-decoration-options)}
|
||||
|
|
|
@ -14,15 +14,6 @@
|
|||
margin: 0;
|
||||
}
|
||||
|
||||
.add-typography {
|
||||
@extend .button-tertiary;
|
||||
height: $s-32;
|
||||
width: $s-28;
|
||||
svg {
|
||||
@extend .button-icon;
|
||||
}
|
||||
}
|
||||
|
||||
.element-content {
|
||||
@include flexColumn;
|
||||
margin-top: $s-4;
|
||||
|
@ -60,15 +51,6 @@
|
|||
height: $s-32;
|
||||
}
|
||||
|
||||
.more-options {
|
||||
@extend .button-tertiary;
|
||||
height: $s-32;
|
||||
width: $s-28;
|
||||
svg {
|
||||
@extend .button-icon;
|
||||
}
|
||||
}
|
||||
|
||||
.text-decoration-options {
|
||||
display: flex;
|
||||
gap: $s-4;
|
||||
|
|
|
@ -19,6 +19,7 @@
|
|||
[app.main.ui.components.color-input :refer [color-input*]]
|
||||
[app.main.ui.components.numeric-input :refer [numeric-input*]]
|
||||
[app.main.ui.context :as ctx]
|
||||
[app.main.ui.ds.buttons.icon-button :refer [icon-button*]]
|
||||
[app.main.ui.formats :as fmt]
|
||||
[app.main.ui.hooks :as h]
|
||||
[app.main.ui.icons :as i]
|
||||
|
@ -266,11 +267,13 @@
|
|||
:max 100}]])]
|
||||
|
||||
(when (some? on-remove)
|
||||
[:button {:class (stl/css :remove-btn)
|
||||
:on-click on-remove} i/remove-icon])
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "settings.remove-color")
|
||||
:on-click on-remove
|
||||
:icon "remove"}])
|
||||
(when select-only
|
||||
[:button {:class (stl/css :select-btn)
|
||||
:title (tr "settings.select-this-color")
|
||||
:on-click handle-select}
|
||||
i/move])]))
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "settings.select-this-color")
|
||||
:on-click handle-select
|
||||
:icon "move"}])]))
|
||||
|
||||
|
|
|
@ -182,13 +182,3 @@
|
|||
margin-block-start: $s-2;
|
||||
}
|
||||
}
|
||||
|
||||
.remove-btn,
|
||||
.select-btn {
|
||||
@extend .button-tertiary;
|
||||
height: $s-32;
|
||||
width: $s-28;
|
||||
svg {
|
||||
@extend .button-icon;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -15,6 +15,7 @@
|
|||
[app.main.store :as st]
|
||||
[app.main.ui.components.title-bar :refer [title-bar]]
|
||||
[app.main.ui.context :as ctx]
|
||||
[app.main.ui.ds.buttons.icon-button :refer [icon-button*]]
|
||||
[app.main.ui.hooks :as hooks]
|
||||
[app.main.ui.icons :as i]
|
||||
[app.main.ui.notifications.badge :refer [badge-notification]]
|
||||
|
@ -223,9 +224,11 @@
|
|||
[:& badge-notification {:is-focus true
|
||||
:size :small
|
||||
:content (tr "labels.view-only")}])
|
||||
[:button {:class (stl/css :add-page)
|
||||
:on-click on-create}
|
||||
i/add])]
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:class (stl/css :add-page)
|
||||
:aria-label (tr "workspace.sidebar.sitemap.add-page")
|
||||
:on-click on-create
|
||||
:icon "add"}])]
|
||||
|
||||
[:div {:class (stl/css :tool-window-content)}
|
||||
[:& pages-list {:file file :key (:id file)}]]]))
|
||||
|
|
|
@ -20,19 +20,6 @@
|
|||
color: var(--title-foreground-color-hover);
|
||||
}
|
||||
|
||||
.add-page {
|
||||
@extend .button-tertiary;
|
||||
height: $s-32;
|
||||
width: $s-28;
|
||||
padding: 0;
|
||||
margin-right: $s-12;
|
||||
svg {
|
||||
@extend .button-icon;
|
||||
stroke: var(--icon-foreground);
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
}
|
||||
|
||||
.resize-area {
|
||||
position: absolute;
|
||||
bottom: calc(-1 * $s-8);
|
||||
|
|
|
@ -218,4 +218,3 @@
|
|||
:title (tr "workspace.path.actions.snap-nodes" (sc/get-tooltip :snap-nodes))
|
||||
:on-click on-toggle-snap}
|
||||
snap-nodes-icon]]]))
|
||||
|
||||
|
|
|
@ -1903,6 +1903,10 @@ msgstr "Ok"
|
|||
msgid "labels.old-password"
|
||||
msgstr "Old password"
|
||||
|
||||
#: src/app/main/ui/comments.cljs:331
|
||||
msgid "labels.options"
|
||||
msgstr "Options"
|
||||
|
||||
#: src/app/main/ui/workspace/comments.cljs
|
||||
#, unused
|
||||
msgid "labels.only-yours"
|
||||
|
@ -2130,6 +2134,10 @@ msgstr "Your account"
|
|||
msgid "labels.youtube"
|
||||
msgstr "YouTube"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs:1051
|
||||
msgid "labels.add"
|
||||
msgstr "Add"
|
||||
|
||||
#: src/app/main/ui/workspace/colorpicker.cljs:341, src/app/main/ui/workspace/colorpicker.cljs:342, src/app/main/ui/workspace/colorpicker.cljs:344
|
||||
msgid "media.choose-image"
|
||||
msgstr "Choose image"
|
||||
|
@ -3127,6 +3135,10 @@ msgstr "Mixed"
|
|||
msgid "settings.select-this-color"
|
||||
msgstr "Select items using this style"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/rows/color_row.cljs:271
|
||||
msgid "settings.remove-color"
|
||||
msgstr "Remove color"
|
||||
|
||||
# SECTIONS
|
||||
#: src/app/main/ui/workspace/sidebar/shortcuts.cljs:414
|
||||
msgid "shortcut-section.basics"
|
||||
|
@ -3969,10 +3981,18 @@ msgstr "All assets"
|
|||
msgid "workspace.assets.colors"
|
||||
msgstr "Colors"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/assets/colors.cljs:495
|
||||
msgid "workspace.assets.colors.add-color"
|
||||
msgstr "Add color"
|
||||
|
||||
#: src/app/main/ui/dashboard/grid.cljs:132, src/app/main/ui/dashboard/grid.cljs:147, src/app/main/ui/workspace/sidebar/assets/components.cljs:509, src/app/main/ui/workspace/sidebar/assets.cljs:139
|
||||
msgid "workspace.assets.components"
|
||||
msgstr "Components"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/assets/components.cljs:531
|
||||
msgid "workspace.assets.components.add-component"
|
||||
msgstr "Add component"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/assets/groups.cljs:127
|
||||
msgid "workspace.assets.create-group"
|
||||
msgstr "Create a group"
|
||||
|
@ -4075,6 +4095,10 @@ msgstr "Sort"
|
|||
msgid "workspace.assets.typography"
|
||||
msgstr "Typographies"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/assets/typographies.cljs:407
|
||||
msgid "workspace.assets.typography.add-typography"
|
||||
msgstr "Add typography"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs
|
||||
#, unused
|
||||
msgid "workspace.assets.typography.font-id"
|
||||
|
@ -4552,6 +4576,18 @@ msgstr "Group blur"
|
|||
msgid "workspace.options.blur-options.title.multiple"
|
||||
msgstr "Selection blur"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/blur.cljs:91
|
||||
msgid "workspace.options.blur-options.add-blur"
|
||||
msgstr "Add blur"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/blur.cljs:112
|
||||
msgid "workspace.options.blur-options.remove-blur"
|
||||
msgstr "Remove blur"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/blur.cljs:108
|
||||
msgid "workspace.options.blur-options.toggle-blur"
|
||||
msgstr "Toggle blur"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/page.cljs:32, src/app/main/ui/workspace/sidebar/options/page.cljs:39
|
||||
msgid "workspace.options.canvas-background"
|
||||
msgstr "Canvas background"
|
||||
|
@ -4671,10 +4707,26 @@ msgstr "Export failed"
|
|||
msgid "workspace.options.exporting-object-slow"
|
||||
msgstr "Export unexpectedly slow"
|
||||
|
||||
#: src/app/main/ui/export.cljs:194
|
||||
msgid "workspace.options.export.add-export"
|
||||
msgstr "Add export"
|
||||
|
||||
#: src/app/main/ui/export.cljs:240
|
||||
msgid "workspace.options.export.remove-export"
|
||||
msgstr "Remove export"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/fill.cljs:49, src/app/main/ui/workspace/sidebar/options/menus/fill.cljs:174
|
||||
msgid "workspace.options.fill"
|
||||
msgstr "Fill"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/fill.cljs:150
|
||||
msgid "workspace.options.fill.add-fill"
|
||||
msgstr "Add fill color"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/fill.cljs:150
|
||||
msgid "workspace.options.fill.remove-fill"
|
||||
msgstr "Remove fill"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/interactions.cljs:178
|
||||
msgid "workspace.options.flows.add-flow-start"
|
||||
msgstr "Add flow start"
|
||||
|
@ -4683,6 +4735,10 @@ msgstr "Add flow start"
|
|||
msgid "workspace.options.flows.flow"
|
||||
msgstr "Flow"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/interactions.cljs
|
||||
msgid "workspace.options.flows.remove-flow"
|
||||
msgstr "Remove flow"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/interactions.cljs
|
||||
#, unused
|
||||
msgid "workspace.options.flows.flow-start"
|
||||
|
@ -4797,6 +4853,18 @@ msgstr "Group stroke"
|
|||
msgid "workspace.options.guides.title"
|
||||
msgstr "Guides"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/frame_grid.cljs:323
|
||||
msgid "workspace.options.guides.add-guide"
|
||||
msgstr "Add guide"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/frame_grid.cljs:187
|
||||
msgid "workspace.options.guides.remove-guide"
|
||||
msgstr "Remove guide"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/frame_grid.cljs:183
|
||||
msgid "workspace.options.guides.toggle-guide"
|
||||
msgstr "Toggle guide"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:406
|
||||
msgid "workspace.options.height"
|
||||
msgstr "Height"
|
||||
|
@ -5019,6 +5087,14 @@ msgstr "While Hovering"
|
|||
msgid "workspace.options.interaction-while-pressing"
|
||||
msgstr "While Pressing"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/interactions.cljs
|
||||
msgid "workspace.options.interactions.add-interaction"
|
||||
msgstr "Add interaction"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/interactions.cljs
|
||||
msgid "workspace.options.interactions.remove-interaction"
|
||||
msgstr "Remove interaction"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/interactions.cljs:724
|
||||
msgid "workspace.options.interactions"
|
||||
msgstr "Interactions"
|
||||
|
@ -5102,6 +5178,10 @@ msgstr "Group layers"
|
|||
msgid "workspace.options.layer-options.title.multiple"
|
||||
msgstr "Selected layers"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/layer.cljs
|
||||
msgid "workspace.options.layer-options.toggle-layer"
|
||||
msgstr "Toggle layer visibility"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/layout_item.cljs
|
||||
#, unused
|
||||
msgid "workspace.options.layout-item.advanced-ops"
|
||||
|
@ -5354,6 +5434,18 @@ msgstr "Group shadow"
|
|||
msgid "workspace.options.shadow-options.title.multiple"
|
||||
msgstr "Selection shadows"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:302
|
||||
msgid "workspace.options.shadow-options.add-shadow"
|
||||
msgstr "Add shadow"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:178
|
||||
msgid "workspace.options.shadow-options.remove-shadow"
|
||||
msgstr "Remove shadow"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:173
|
||||
msgid "workspace.options.shadow-options.toggle-shadow"
|
||||
msgstr "Toggle shadow"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/fill.cljs:193
|
||||
msgid "workspace.options.show-fill-on-export"
|
||||
msgstr "Show in exports"
|
||||
|
@ -5374,6 +5466,14 @@ msgstr "Size presets"
|
|||
msgid "workspace.options.stroke"
|
||||
msgstr "Stroke"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/stroke.cljs:172
|
||||
msgid "workspace.options.stroke.add-stroke"
|
||||
msgstr "Add stroke color"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/stroke.cljs:172
|
||||
msgid "workspace.options.stroke.remove-stroke"
|
||||
msgstr "Remove stroke"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/stroke.cljs
|
||||
#, unused
|
||||
msgid "workspace.options.stroke-cap.circle-marker"
|
||||
|
@ -5725,6 +5825,18 @@ msgstr "Plugin correctly loaded."
|
|||
msgid "workspace.plugins.title"
|
||||
msgstr "Plugins"
|
||||
|
||||
#: src/app/main/ui/workspace/plugins.cljs:64
|
||||
msgid "workspace.plugins.remove-plugin"
|
||||
msgstr "Remove plugin"
|
||||
|
||||
#: /src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs:1005
|
||||
msgid "workspace.shape.menu.add-layout"
|
||||
msgstr "Add layout"
|
||||
|
||||
#: /src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs:1024
|
||||
msgid "workspace.shape.menu.remove-layout"
|
||||
msgstr "Remove layout"
|
||||
|
||||
#: src/app/main/ui/workspace/context_menu.cljs:441
|
||||
msgid "workspace.shape.menu.add-flex"
|
||||
msgstr "Add flex layout"
|
||||
|
@ -5983,6 +6095,10 @@ msgstr "Imported SVG Attributes"
|
|||
msgid "workspace.sidebar.sitemap"
|
||||
msgstr "Pages"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/sitemap.cljs:217
|
||||
msgid "workspace.sidebar.sitemap.add-page"
|
||||
msgstr "Add page"
|
||||
|
||||
#: src/app/main/ui/workspace/left_header.cljs:91
|
||||
msgid "workspace.sitemap"
|
||||
msgstr "Sitemap"
|
||||
|
|
|
@ -1243,6 +1243,10 @@ msgstr "El email o la contraseña son incorrectos."
|
|||
msgid "errors.wrong-old-password"
|
||||
msgstr "La contraseña anterior no es correcta"
|
||||
|
||||
#: src/app/main/ui/comments.cljs:331
|
||||
msgid "labels.options"
|
||||
msgstr "Opciones"
|
||||
|
||||
#: src/app/main/ui/settings/feedback.cljs:74
|
||||
msgid "feedback.description"
|
||||
msgstr "Descripción"
|
||||
|
@ -2118,6 +2122,10 @@ msgstr "(tú)"
|
|||
msgid "labels.your-account"
|
||||
msgstr "Tu cuenta"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs:1051
|
||||
msgid "labels.add"
|
||||
msgstr "Añadir"
|
||||
|
||||
#: src/app/main/ui/workspace/colorpicker.cljs:341, src/app/main/ui/workspace/colorpicker.cljs:342, src/app/main/ui/workspace/colorpicker.cljs:344
|
||||
msgid "media.choose-image"
|
||||
msgstr "Elegir imagen"
|
||||
|
@ -3106,6 +3114,10 @@ msgstr "Varios"
|
|||
msgid "settings.select-this-color"
|
||||
msgstr "Seleccionar elementos que usan este estilo"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/rows/color_row.cljs:271
|
||||
msgid "settings.remove-color"
|
||||
msgstr "Eliminar color"
|
||||
|
||||
# SECTIONS
|
||||
#: src/app/main/ui/workspace/sidebar/shortcuts.cljs:414
|
||||
msgid "shortcut-section.basics"
|
||||
|
@ -3943,10 +3955,18 @@ msgstr "Todos"
|
|||
msgid "workspace.assets.colors"
|
||||
msgstr "Colores"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/assets/colors.cljs:495
|
||||
msgid "workspace.assets.colors.add-color"
|
||||
msgstr "Añadir color"
|
||||
|
||||
#: src/app/main/ui/dashboard/grid.cljs:132, src/app/main/ui/dashboard/grid.cljs:147, src/app/main/ui/workspace/sidebar/assets/components.cljs:509, src/app/main/ui/workspace/sidebar/assets.cljs:139
|
||||
msgid "workspace.assets.components"
|
||||
msgstr "Componentes"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/assets/components.cljs:531
|
||||
msgid "workspace.assets.components.add-component"
|
||||
msgstr "Añadir componente"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/assets/groups.cljs:127
|
||||
msgid "workspace.assets.create-group"
|
||||
msgstr "Crear un grupo"
|
||||
|
@ -4051,6 +4071,10 @@ msgstr "Ordenar"
|
|||
msgid "workspace.assets.typography"
|
||||
msgstr "Tipografías"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/assets/typographies.cljs:407
|
||||
msgid "workspace.assets.typography.add-typography"
|
||||
msgstr "Añadir tipografía"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs
|
||||
#, unused
|
||||
msgid "workspace.assets.typography.font-id"
|
||||
|
@ -4528,6 +4552,18 @@ msgstr "Desenfoque del grupo"
|
|||
msgid "workspace.options.blur-options.title.multiple"
|
||||
msgstr "Desenfoque de la selección"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/blur.cljs:91
|
||||
msgid "workspace.options.blur-options.add-blur"
|
||||
msgstr "Añadir desenfoque"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/blur.cljs:112
|
||||
msgid "workspace.options.blur-options.remove-blur"
|
||||
msgstr "Eliminar desenfoque"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/blur.cljs:108
|
||||
msgid "workspace.options.blur-options.toggle-blur"
|
||||
msgstr "Mostrar/ocultar desenfoque"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/page.cljs:32, src/app/main/ui/workspace/sidebar/options/page.cljs:39
|
||||
msgid "workspace.options.canvas-background"
|
||||
msgstr "Color de fondo"
|
||||
|
@ -4647,10 +4683,26 @@ msgstr "Exportación fallida"
|
|||
msgid "workspace.options.exporting-object-slow"
|
||||
msgstr "Exportación lenta"
|
||||
|
||||
#: src/app/main/ui/export.cljs:194
|
||||
msgid "workspace.options.export.add-export"
|
||||
msgstr "Añadir exportación"
|
||||
|
||||
#: src/app/main/ui/export.cljs:240
|
||||
msgid "workspace.options.export.remove-export"
|
||||
msgstr "Eliminar exportación"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/fill.cljs:49, src/app/main/ui/workspace/sidebar/options/menus/fill.cljs:174
|
||||
msgid "workspace.options.fill"
|
||||
msgstr "Relleno"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/fill.cljs:150
|
||||
msgid "workspace.options.fill.add-fill"
|
||||
msgstr "Añadir color de relleno"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/fill.cljs:150
|
||||
msgid "workspace.options.fill.remove-fill"
|
||||
msgstr "Eliminar relleno"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/interactions.cljs:178
|
||||
msgid "workspace.options.flows.add-flow-start"
|
||||
msgstr "Añadir inicio de flujo"
|
||||
|
@ -4659,6 +4711,10 @@ msgstr "Añadir inicio de flujo"
|
|||
msgid "workspace.options.flows.flow"
|
||||
msgstr "Flujo"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/interactions.cljs
|
||||
msgid "workspace.options.flows.remove-flow"
|
||||
msgstr "Eliminar flujo"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/interactions.cljs
|
||||
#, unused
|
||||
msgid "workspace.options.flows.flow-start"
|
||||
|
@ -4773,6 +4829,18 @@ msgstr "Borde de grupo"
|
|||
msgid "workspace.options.guides.title"
|
||||
msgstr "Guías"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/frame_grid.cljs:323
|
||||
msgid "workspace.options.guides.add-guide"
|
||||
msgstr "Añadir guía"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/frame_grid.cljs:187
|
||||
msgid "workspace.options.guides.remove-guide"
|
||||
msgstr "Eliminar guía"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/frame_grid.cljs:183
|
||||
msgid "workspace.options.guides.toggle-guide"
|
||||
msgstr "Mostrar/ocultar guía"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:406
|
||||
msgid "workspace.options.height"
|
||||
msgstr "Altura"
|
||||
|
@ -4999,6 +5067,14 @@ msgstr "Mientras pulsa"
|
|||
msgid "workspace.options.interactions"
|
||||
msgstr "Interacciones"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/interactions.cljs
|
||||
msgid "workspace.options.interactions.add-interaction"
|
||||
msgstr "Añadir interacción"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/interactions.cljs
|
||||
msgid "workspace.options.interactions.remove-interaction"
|
||||
msgstr "Eliminar interacción"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/layer.cljs:137
|
||||
msgid "workspace.options.layer-options.blend-mode.color"
|
||||
msgstr "Color"
|
||||
|
@ -5078,6 +5154,10 @@ msgstr "Capas de grupo"
|
|||
msgid "workspace.options.layer-options.title.multiple"
|
||||
msgstr "Capas seleccionadas"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/layer.cljs
|
||||
msgid "workspace.options.layer-options.toggle-layer"
|
||||
msgstr "Mostrar/ocultar capa"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/layout_item.cljs
|
||||
#, unused
|
||||
msgid "workspace.options.layout-item.advanced-ops"
|
||||
|
@ -5332,6 +5412,18 @@ msgstr "Sombra del grupo"
|
|||
msgid "workspace.options.shadow-options.title.multiple"
|
||||
msgstr "Sombras de la seleccíón"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:302
|
||||
msgid "workspace.options.shadow-options.add-shadow"
|
||||
msgstr "Añadir sombra"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:178
|
||||
msgid "workspace.options.shadow-options.remove-shadow"
|
||||
msgstr "Eliminar sombra"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:173
|
||||
msgid "workspace.options.shadow-options.toggle-shadow"
|
||||
msgstr "Mostrar/ocultar sombra"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/fill.cljs:193
|
||||
msgid "workspace.options.show-fill-on-export"
|
||||
msgstr "Mostrar al exportar"
|
||||
|
@ -5352,6 +5444,14 @@ msgstr "Tamaños predefinidos"
|
|||
msgid "workspace.options.stroke"
|
||||
msgstr "Borde"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/stroke.cljs:172
|
||||
msgid "workspace.options.stroke.add-stroke"
|
||||
msgstr "Añadir color de borde"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/stroke.cljs:172
|
||||
msgid "workspace.options.stroke.remove-stroke"
|
||||
msgstr "Eliminar borde"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/options/menus/stroke.cljs
|
||||
#, unused
|
||||
msgid "workspace.options.stroke-cap.circle-marker"
|
||||
|
@ -5703,6 +5803,18 @@ msgstr "Extensión cargada correctamente."
|
|||
msgid "workspace.plugins.title"
|
||||
msgstr "Extensiones"
|
||||
|
||||
#: src/app/main/ui/workspace/plugins.cljs:64
|
||||
msgid "workspace.plugins.remove-plugin"
|
||||
msgstr "Eliminar extensión"
|
||||
|
||||
#: /src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs:1005
|
||||
msgid "workspace.shape.menu.add-layout"
|
||||
msgstr "Añadir layout"
|
||||
|
||||
#: /src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs:1024
|
||||
msgid "workspace.shape.menu.remove-layout"
|
||||
msgstr "Eliminar layout"
|
||||
|
||||
#: src/app/main/ui/workspace/context_menu.cljs:441
|
||||
msgid "workspace.shape.menu.add-flex"
|
||||
msgstr "Añadir flex layout"
|
||||
|
@ -5961,6 +6073,10 @@ msgstr "Atributos del SVG Importado"
|
|||
msgid "workspace.sidebar.sitemap"
|
||||
msgstr "Páginas"
|
||||
|
||||
#: src/app/main/ui/workspace/sidebar/sitemap.cljs:217
|
||||
msgid "workspace.sidebar.sitemap.add-page"
|
||||
msgstr "Añadir página"
|
||||
|
||||
#: src/app/main/ui/workspace/left_header.cljs:91
|
||||
msgid "workspace.sitemap"
|
||||
msgstr "Mapa del sitio"
|
||||
|
|
Loading…
Add table
Reference in a new issue