mirror of
https://github.com/penpot/penpot.git
synced 2026-07-31 02:16:13 +00:00
wip3
This commit is contained in:
Eva Marco
parent
ab266ba807
commit
f635f6d464
@ -55,7 +55,7 @@
|
||||
|
||||
[:div {:class (stl/css :dashboard-content)}
|
||||
[:> header*]
|
||||
[:section {:class (stl/css :dashboard-container)}
|
||||
[:div {:class (stl/css :dashboard-container)}
|
||||
(case section
|
||||
:settings-profile
|
||||
[:> profile-page*]
|
||||
|
||||
@ -98,7 +98,8 @@
|
||||
:form form}
|
||||
|
||||
;; --- Feedback section
|
||||
[:h2 {:class (stl/css :field-title :feedback-title)} (tr "feedback.title-contact-us")]
|
||||
[:h2 {:class (stl/css :field-title :feedback-title)
|
||||
:id "feedback-section-title"} (tr "feedback.title-contact-us")]
|
||||
[:p {:class (stl/css :field-text :feedback-title)} (tr "feedback.subtitle")]
|
||||
|
||||
[:div {:class (stl/css :fields-row)}
|
||||
@ -164,6 +165,7 @@
|
||||
(:content errors/last-report))
|
||||
props (mf/spread-props props {:error-report report})]
|
||||
|
||||
[:div {:class (stl/css :dashboard-settings)}
|
||||
[:section {:class (stl/css :dashboard-settings)
|
||||
:aria-labelledby "feedback-section-title"}
|
||||
[:div {:class (stl/css :form-container)}
|
||||
[:> feedback-form* props]]]))
|
||||
|
||||
@ -617,10 +617,12 @@
|
||||
(dom/set-html-title (tr "title.settings.integrations"))
|
||||
(st/emit! (du/fetch-access-tokens)))
|
||||
|
||||
[:div {:class (stl/css :integrations)}
|
||||
[:> heading* {:level 1
|
||||
[:section {:class (stl/css :integrations)
|
||||
:aria-labelledby "integrations-section-title"}
|
||||
[:> heading* {:level 2
|
||||
:typography t/title-large
|
||||
:class (stl/css :color-primary)}
|
||||
:class (stl/css :color-primary)
|
||||
:id "integrations-section-title"}
|
||||
(tr "integrations.title")]
|
||||
|
||||
(when (contains? cf/flags :mcp)
|
||||
|
||||
@ -122,10 +122,15 @@
|
||||
(mf/use-effect
|
||||
#(dom/set-html-title (tr "title.settings.options")))
|
||||
|
||||
[:div {:class (stl/css :dashboard-settings)}
|
||||
[:section {:class (stl/css :dashboard-settings)
|
||||
:aria-labelledby "options-section-title"}
|
||||
[:*
|
||||
[:div {:class (stl/css :form-container) :data-testid "settings-form"}
|
||||
[:h2 (tr "labels.settings")]
|
||||
[:> heading* {:level 2
|
||||
:typography t/title-large
|
||||
:class (stl/css :color-primary)
|
||||
:id "options-section-title"}
|
||||
(tr "labels.settings")]
|
||||
[:> options-form*]]
|
||||
(when (contains? cf/flags :render-switch)
|
||||
[:> webgl-settings* {:renderer renderer}])]]))
|
||||
|
||||
@ -104,7 +104,8 @@
|
||||
(mf/with-effect []
|
||||
(dom/set-html-title (tr "title.settings.password")))
|
||||
|
||||
[:section {:class (stl/css :dashboard-settings)}
|
||||
[:section {:class (stl/css :dashboard-settings)
|
||||
:aria-labelledby "password-section-title"}
|
||||
[:div {:class (stl/css :form-container)}
|
||||
[:h2 (tr "dashboard.password-change")]
|
||||
[:h2 {:id "password-section-title"} (tr "dashboard.password-change")]
|
||||
[:> password-form*]]])
|
||||
|
||||
@ -143,8 +143,9 @@
|
||||
(mf/with-effect []
|
||||
(dom/set-html-title (tr "title.settings.profile")))
|
||||
|
||||
[:div {:class (stl/css :dashboard-settings)}
|
||||
[:section {:class (stl/css :dashboard-settings)
|
||||
:aria-labelledby "profile-section-title"}
|
||||
[:div {:class (stl/css :form-container)}
|
||||
[:h2 (tr "labels.profile")]
|
||||
[:h2 {:id "profile-section-title" }(tr "labels.profile")]
|
||||
[:> profile-photo-form*]
|
||||
[:> profile-form*]]])
|
||||
|
||||
@ -2,6 +2,7 @@
|
||||
(:require-macros [app.main.style :as stl])
|
||||
(:require
|
||||
[app.common.data :as d]
|
||||
[app.common.i18n :refer [tr]]
|
||||
[app.main.data.dashboard.shortcuts]
|
||||
[app.main.data.modal :as modal]
|
||||
[app.main.data.shortcuts :as ds]
|
||||
@ -128,8 +129,6 @@
|
||||
:viewer-sc {}}]
|
||||
[:p "There are no not-assigned shortcuts."])]))
|
||||
|
||||
|
||||
|
||||
(mf/defc shortcuts-page*
|
||||
[{:keys [profile]}]
|
||||
(let [section* (mf/use-state :all)
|
||||
@ -152,28 +151,28 @@
|
||||
(fn [new-section]
|
||||
(reset! section* (keyword new-section))))]
|
||||
|
||||
|
||||
[:section {:class (stl/css :shortcuts-page)
|
||||
:aria-label "Shortcuts page"}
|
||||
[:> heading* {:level 1
|
||||
:typography t/title-large
|
||||
:class (stl/css :color-primary)}
|
||||
"Shortcuts page"]
|
||||
|
||||
[:div {:class (stl/css :shortcuts-content)}
|
||||
[:p "search-bar"]
|
||||
[:button "restore all"]
|
||||
[:p "This is the shortcuts page content."]
|
||||
[:> tab-switcher* {:tabs tabs
|
||||
:selected (name section)
|
||||
:on-change handle-change-tab
|
||||
:class (stl/css :shortcuts-switcher)}
|
||||
(case section
|
||||
:all
|
||||
[:> all-shortcuts-section* {:profile profile}]
|
||||
[:> heading* {:level 1
|
||||
:typography t/title-large
|
||||
:class (stl/css :page-title)}
|
||||
(tr "label.shortcuts")]
|
||||
|
||||
:personalized
|
||||
[:> personalized-shortcuts-section* {:profile profile}]
|
||||
[:div {:class (stl/css :shortcuts-content)}
|
||||
[:p "search-bar"]
|
||||
[:button "restore all"]
|
||||
[:p "This is the shortcuts page content."]
|
||||
[:> tab-switcher* {:tabs tabs
|
||||
:selected (name section)
|
||||
:on-change handle-change-tab
|
||||
:class (stl/css :shortcuts-switcher)}
|
||||
(case section
|
||||
:all
|
||||
[:> all-shortcuts-section* {:profile profile}]
|
||||
|
||||
:not-assigned
|
||||
[:> not-assigned-shortcuts-section* {:profile profile}])]]]))
|
||||
:personalized
|
||||
[:> personalized-shortcuts-section* {:profile profile}]
|
||||
|
||||
:not-assigned
|
||||
[:> not-assigned-shortcuts-section* {:profile profile}])]]]]))
|
||||
@ -4,18 +4,29 @@
|
||||
//
|
||||
// Copyright (c) KALEIDOS INC Sucursal en España SL
|
||||
|
||||
@use "ds/typography.scss" as t;
|
||||
@use "ds/_borders.scss" as *;
|
||||
@use "ds/spacing.scss" as *;
|
||||
@use "ds/_sizes.scss" as *;
|
||||
@use "ds/_utils.scss" as *;
|
||||
|
||||
.shortcuts-page {
|
||||
height: 100%;
|
||||
max-width: 31.25rem;
|
||||
width: 36.25rem;
|
||||
margin: 5rem auto 7.5rem;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.shortcuts-content {
|
||||
padding: var(--sp-xl);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
max-width: $sz-500;
|
||||
width: px2rem(580);
|
||||
padding: var(--sp-xl);
|
||||
}
|
||||
|
||||
.page-title {
|
||||
color: var(--color-foreground-primary);
|
||||
width: 100%;
|
||||
margin: px2rem(80) 0 px2rem(16);
|
||||
}
|
||||
|
||||
.shortcuts-section {
|
||||
|
||||
@ -87,7 +87,8 @@
|
||||
|
||||
[:hr {:class (stl/css :sidebar-separator)}]
|
||||
|
||||
[:div {:class (stl/css :sidebar-content-section)}
|
||||
[:nav {:class (stl/css :sidebar-content-section)
|
||||
:aria-label (tr "labels.settings")}
|
||||
[:ul {:class (stl/css :sidebar-nav-settings)}
|
||||
[:li {:class (stl/css-case :current profile?
|
||||
:settings-item true)
|
||||
@ -146,7 +147,7 @@
|
||||
(mf/defc sidebar*
|
||||
{::mf/wrap [mf/memo]}
|
||||
[{:keys [profile section]}]
|
||||
[:div {:class (stl/css :dashboard-sidebar :settings)}
|
||||
[:aside {:class (stl/css :dashboard-sidebar :settings)}
|
||||
[:> sidebar-content* {:profile profile
|
||||
:section section}]
|
||||
[:> profile-section* {:profile profile}]])
|
||||
|
||||
@ -560,10 +560,10 @@
|
||||
(tr "subscription.settings.enterprise")))}))
|
||||
(rt/nav :settings-subscription {} {::rt/replace true})))))
|
||||
|
||||
[:section {:class (stl/css :dashboard-section)}
|
||||
[:section {:class (stl/css :dashboard-section)
|
||||
:aria-labelledyby "subscription-section-title"}
|
||||
[:div {:class (stl/css :dashboard-content)}
|
||||
[:h2 {:class (stl/css :title-section)} (tr "subscription.labels")]
|
||||
|
||||
[:h2 {:id "subscription-section-title" :class (stl/css :title-section)} (tr "subscription.labels")]
|
||||
|
||||
[:div {:class (stl/css :your-subscription)}
|
||||
[:h3 {:class (stl/css :plan-section-title)} (tr "subscription.settings.section-plan")]
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user