diff --git a/frontend/src/app/main/ui/settings/subscription.cljs b/frontend/src/app/main/ui/settings/subscription.cljs index e693da8f33..b1bbad4342 100644 --- a/frontend/src/app/main/ui/settings/subscription.cljs +++ b/frontend/src/app/main/ui/settings/subscription.cljs @@ -150,7 +150,16 @@ :class (stl/css :input-field)}]] [:div {:class (stl/css :editors-cost)} [:span {:class (stl/css :modal-text-small)} - (tr "subscription.settings.management.dialog.price-month" (or (get-in @form [:clean-data :min-members]) 0))] + (when (> (get-in @form [:clean-data :min-members]) 25) + [:> i18n/tr-html* + {:class (stl/css :modal-text-cap) + :tag-name "span" + :content (tr "subscription.settings.management.dialog.price-month" "175")}]) + [:> i18n/tr-html* + {:class (stl/css-case :text-strikethrough (> (get-in @form [:clean-data :min-members]) 25)) + :tag-name "span" + :content (tr "subscription.settings.management.dialog.price-month" + (* 7 (or (get-in @form [:clean-data :min-members]) 0)))}]] [:span {:class (stl/css :modal-text-small)} (tr "subscription.settings.management.dialog.payment-explanation")]]] diff --git a/frontend/src/app/main/ui/settings/subscription.scss b/frontend/src/app/main/ui/settings/subscription.scss index b69ea7a115..43b8df9804 100644 --- a/frontend/src/app/main/ui/settings/subscription.scss +++ b/frontend/src/app/main/ui/settings/subscription.scss @@ -199,6 +199,20 @@ @include t.use-typography("body-small"); } +.modal-text-cap { + margin-inline-end: var(--sp-s); +} + +.text-strikethrough { + text-decoration: line-through; +} + +.modal-text-small strong, +.text-strikethrough strong, +.modal-text-cap strong { + font-weight: $fw700; +} + .modal-content, .modal-end { color: var(--color-foreground-secondary); diff --git a/frontend/translations/en.po b/frontend/translations/en.po index c3328ae363..c1e2ff5347 100644 --- a/frontend/translations/en.po +++ b/frontend/translations/en.po @@ -4441,8 +4441,10 @@ msgid "subscription.settings.management.dialog.payment-explanation" msgstr "(No payment will be made now)" #: src/app/main/ui/settings/subscription.cljs:124 +#, markdown msgid "subscription.settings.management.dialog.price-month" -msgstr "$7 per editor/month x %s" +msgstr "" +"**$%s** per month" #: src/app/main/ui/settings/subscription.cljs:112 msgid "subscription.settings.management.dialog.select-editors" diff --git a/frontend/translations/es.po b/frontend/translations/es.po index 562c8e1752..6b38dbc10e 100644 --- a/frontend/translations/es.po +++ b/frontend/translations/es.po @@ -4474,8 +4474,10 @@ msgid "subscription.settings.management.dialog.payment-explanation" msgstr "(Ahora no se efectuarĂĄ ningĂșn pago)" #: src/app/main/ui/settings/subscription.cljs:124 +#, markdown msgid "subscription.settings.management.dialog.price-month" -msgstr "$7 por editor/mes x %s" +msgstr "" +"**$%s** por mes" #: src/app/main/ui/settings/subscription.cljs:112 msgid "subscription.settings.management.dialog.select-editors"