Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-04-02 18:11:20 -05:00
Code Issues Activity

💄 Change shadow options css

Browse source
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
Show stats Download patch file Download diff file Expand all files Collapse all files

22
frontend/resources/styles/main/partials/sidebar-element-options.scss
View file

@ -816,13 +816,13 @@
.advanced-options-wrapper {
width: 100%;
padding-left: 0.25rem;
}
.advanced-options {
background-color: #303236;
border: 1px solid $color-gray-60;
background-color: $color-gray-50;
border-radius: 4px;
padding: 0.5rem;
padding: 8px 3px;
position: relative;
top: 2px;
width: 100%;
@ -897,6 +897,22 @@
.download-button {
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 {

39
frontend/src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs
View file

@ -104,19 +104,27 @@
{:on-click #(reset! open-shadow true)}
i/actions]
[:> numeric-input {:ref basic-offset-x-ref
:on-change (update-attr index :offset-x valid-number?)
:on-click (select-text basic-offset-x-ref)
:value (:offset-x value)}]
[:> numeric-input {:ref basic-offset-y-ref
:on-change (update-attr index :offset-y valid-number?)
:on-click (select-text basic-offset-y-ref)
:value (:offset-y value)}]
[:> numeric-input {:ref basic-blur-ref
:on-click (select-text basic-blur-ref)
:on-change (update-attr index :blur valid-number?)
:min 0
:value (:blur value)}]
;; [:> numeric-input {:ref basic-offset-x-ref
;; :on-change (update-attr index :offset-x valid-number?)
;; :on-click (select-text basic-offset-x-ref)
;; :value (:offset-x value)}]
;; [:> numeric-input {:ref basic-offset-y-ref
;; :on-change (update-attr index :offset-y valid-number?)
;; :on-click (select-text basic-offset-y-ref)
;; :value (:offset-y value)}]
;; [:> numeric-input {:ref basic-blur-ref
;; :on-click (select-text basic-blur-ref)
;; :on-change (update-attr index :blur valid-number?)
;; :min 0
;; :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-button {:on-click (toggle-visibility index)}
@ -126,7 +134,10 @@
[:& advanced-options {:visible? @open-shadow
: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
{:default-value (str (:style value))
:on-change (fn [event]