💄 Change shadow options css

This commit is contained in:
elhombretecla 2021-06-03 18:35:01 +02:00 committed by alonso.torres
parent 71c4145ea2
commit d4b02e36a7
2 changed files with 44 additions and 17 deletions

View file

@ -816,13 +816,13 @@
.advanced-options-wrapper { .advanced-options-wrapper {
width: 100%; width: 100%;
padding-left: 0.25rem;
} }
.advanced-options { .advanced-options {
background-color: #303236; border: 1px solid $color-gray-60;
background-color: $color-gray-50;
border-radius: 4px; border-radius: 4px;
padding: 0.5rem; padding: 8px 3px;
position: relative; position: relative;
top: 2px; top: 2px;
width: 100%; width: 100%;
@ -897,6 +897,22 @@
.download-button { .download-button {
margin-top: 10px; margin-top: 10px;
} }
.input-element {
width: 100%;
flex-shrink: initial;
}
.row-grid-2 {
grid-column-gap: 1em;
}
.color-info {
input {
margin-right: 1em;
width: 74px;
}
}
} }
.shadow-options .color-row-wrap { .shadow-options .color-row-wrap {

View file

@ -104,19 +104,27 @@
{:on-click #(reset! open-shadow true)} {:on-click #(reset! open-shadow true)}
i/actions] i/actions]
[:> numeric-input {:ref basic-offset-x-ref ;; [:> numeric-input {:ref basic-offset-x-ref
:on-change (update-attr index :offset-x valid-number?) ;; :on-change (update-attr index :offset-x valid-number?)
:on-click (select-text basic-offset-x-ref) ;; :on-click (select-text basic-offset-x-ref)
:value (:offset-x value)}] ;; :value (:offset-x value)}]
[:> numeric-input {:ref basic-offset-y-ref ;; [:> numeric-input {:ref basic-offset-y-ref
:on-change (update-attr index :offset-y valid-number?) ;; :on-change (update-attr index :offset-y valid-number?)
:on-click (select-text basic-offset-y-ref) ;; :on-click (select-text basic-offset-y-ref)
:value (:offset-y value)}] ;; :value (:offset-y value)}]
[:> numeric-input {:ref basic-blur-ref ;; [:> numeric-input {:ref basic-blur-ref
:on-click (select-text basic-blur-ref) ;; :on-click (select-text basic-blur-ref)
:on-change (update-attr index :blur valid-number?) ;; :on-change (update-attr index :blur valid-number?)
:min 0 ;; :min 0
:value (:blur value)}] ;; :value (:blur value)}]
[:select.input-select
{:default-value (str (:style value))
:on-change (fn [event]
(let [value (-> event dom/get-target dom/get-value d/read-string)]
(st/emit! (dch/update-shapes ids #(assoc-in % [:shadow index :style] value)))))}
[:option {:value ":drop-shadow"} (t locale "workspace.options.shadow-options.drop-shadow")]
[:option {:value ":inner-shadow"} (t locale "workspace.options.shadow-options.inner-shadow")]]
[:div.element-set-actions [:div.element-set-actions
[:div.element-set-actions-button {:on-click (toggle-visibility index)} [:div.element-set-actions-button {:on-click (toggle-visibility index)}
@ -126,7 +134,10 @@
[:& advanced-options {:visible? @open-shadow [:& advanced-options {:visible? @open-shadow
:on-close #(reset! open-shadow false)} :on-close #(reset! open-shadow false)}
[:div.row-grid-2 [:div.color-data
[:div.element-set-actions-button
{:on-click #(reset! open-shadow false)}
i/actions]
[:select.input-select [:select.input-select
{:default-value (str (:style value)) {:default-value (str (:style value))
:on-change (fn [event] :on-change (fn [event]