Add new toggle and translations

This commit is contained in:
elhombretecla 2025-03-11 15:19:31 +01:00 committed by Marina López
parent fd753fb262
commit 60a20b6984
4 changed files with 93 additions and 12 deletions

View file

@ -81,16 +81,21 @@
[:span {:class (stl/css :title-text)}
(tr "dashboard.libraries-and-templates")]
(if ^boolean is-collapsed
[:span {:class (stl/css :title-icon :title-icon-collapsed)}
arrow-icon]
[:span {:class (stl/css :title-icon)}
arrow-icon])]]))
[:span {:class (stl/css :title-icon-container)}
[:span {:class (stl/css :title-icon-text)} (tr "labels.show")]
[:span {:class (stl/css :title-icon :title-icon-collapsed)}
arrow-icon]]
[:span {:class (stl/css :title-icon-container)}
[:span {:class (stl/css :title-icon-text)} (tr "labels.hide")]
[:span {:class (stl/css :title-icon)}
arrow-icon]])]]))
(mf/defc card-item
{::mf/wrap-props false}
[{:keys [item index is-visible collapsed on-import]}]
(let [id (dm/str "card-container-" index)
thb (assoc cf/public-uri :path (dm/str "/images/thumbnails/template-" (:id item) ".jpg"))
hover? (mf/use-state false)
on-click
(mf/use-fn
@ -112,6 +117,8 @@
:data-index index
:on-click on-click
:on-mouse-down dom/prevent-default
:on-mouse-enter #(reset! hover? true)
:on-mouse-leave #(reset! hover? false)
:on-key-down on-key-down}
[:div {:class (stl/css :template-card)}
[:div {:class (stl/css :img-container)}
@ -120,7 +127,10 @@
:loading "lazy"
:decoding "async"}]]
[:div {:class (stl/css :card-name)}
[:span {:class (stl/css :card-text)} (:name item)]
[:span {:class (stl/css :card-text)}
(if @hover?
(tr "dashboard.template.add-to-project")
(:name item))]
download-icon]]]))
(mf/defc card-item-link
@ -243,7 +253,7 @@
:is-collapsed collapsed}]
[:p {:class (stl/css :content-description)}
"Here you have some Libraries and templates you can add to your project"]
(tr "dashboard.libraries-and-templates.description")]
[:div {:class (stl/css :content)
:on-scroll on-scroll

View file

@ -71,24 +71,33 @@
font-weight: $fw400;
}
.title-icon-container {
display: inline-block;
vertical-align: middle;
margin-left: auto;
margin-right: $s-8;
color: var(--color-foreground-primary);
}
.title-icon {
display: inline-block;
vertical-align: middle;
margin-left: $s-16;
margin-left: auto;
margin-right: $s-8;
color: var(--color-foreground-primary);
margin-left: $s-16;
margin-right: $s-16;
transform: rotate(90deg);
}
.title-icon-text {
margin-right: $s-8;
}
.title-icon-collapsed {
transform: rotate(-90deg);
}
.arrow-icon {
@extend .button-icon;
stroke: var(--color-foreground-primary);
stroke: var(--color-foreground-secondary);
}
.move-button {
@ -129,7 +138,8 @@
.content-description {
font-size: $fs-14;
color: var(--color-foreground-primary);
margin-bottom: -12px;
margin-bottom: -8px;
margin-top: -4px;
margin-left: $s-16;
visibility: visible;
}

View file

@ -1713,6 +1713,22 @@ msgstr "Access tokens"
msgid "labels.active"
msgstr "Active"
#: src/app/main/ui/dashboard/templates.cljs
msgid "labels.show"
msgstr "Show"
#: src/app/main/ui/dashboard/templates.cljs
msgid "labels.hide"
msgstr "Hide"
#: src/app/main/ui/dashboard/templates.cljs
msgid "dashboard.libraries-and-templates.description"
msgstr "Here you have some Libraries and templates you can add to your project"
#: src/app/main/ui/dashboard/templates.cljs
msgid "dashboard.template.add-to-project"
msgstr "Add to your project"
#: src/app/main/ui/workspace/libraries.cljs:173
msgid "labels.add"
msgstr "Add"

View file

@ -3197,6 +3197,51 @@ msgstr "Estoy echando un vistazo"
#: src/app/main/ui/onboarding/questions.cljs:91
msgid "onboarding.questions.reasons.fit"
msgstr "Estoy buscando una herramienta que se ajuste a mis necesidades"
#: src/app/main/ui/onboarding/questions.cljs:113
msgid "onboarding.questions.lets-get-started"
msgstr "¡Empecemos!"
#: src/app/main/ui/dashboard/templates.cljs
msgid "labels.show"
msgstr "Mostrar"
#: src/app/main/ui/dashboard/templates.cljs
msgid "labels.hide"
msgstr "Ocultar"
#: src/app/main/ui/dashboard/templates.cljs
msgid "dashboard.libraries-and-templates.description"
msgstr "Aquí tienes algunas Bibliotecas y plantillas que puedes añadir a tu proyecto"
#: src/app/main/ui/dashboard/templates.cljs
msgid "dashboard.template.add-to-project"
msgstr "Añadir a tu proyecto"
#: src/app/main/ui/dashboard/templates.cljs
msgid "labels.add"
msgstr "Añadir"
#: src/app/main/ui/dashboard/templates.cljs
msgid "labels.add-to-your-project"
msgstr "Añadir a tu proyecto"
#: src/app/main/ui/dashboard/templates.cljs
msgid "labels.show-hide"
msgstr "Mostrar/Ocultar"
#: src/app/main/ui/dashboard/templates.cljs
msgid "labels.show"
msgstr "Mostrar"
#: src/app/main/ui/dashboard/templates.cljs
msgid "labels.hide"
msgstr "Ocultar"
#: src/app/main/ui/dashboard/templates.cljs
msgid "dashboard.libraries-and-templates.description"
msgstr "Aquí tienes algunas Bibliotecas y plantillas que puedes añadir a tu proyecto"
msgstr "Averiguar si Penpot es una buena opción para mi equipo"
#: src/app/main/ui/onboarding/questions.cljs:97