0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-02-12 18:18:24 -05:00

fix group styles

This commit is contained in:
Juan de la Cruz 2016-01-17 11:02:59 +01:00
parent 6c0d61278a
commit ee3ed22e2c
2 changed files with 104 additions and 89 deletions

View file

@ -195,10 +195,16 @@
width: 100%; width: 100%;
li { li {
box-sizing: border-box;
cursor: pointer;
display: flex;
flex-direction: column;
width: 100%;
.element-list-body {
align-items: center; align-items: center;
border-bottom: 1px solid $color-gray-darker; border-bottom: 1px solid $color-gray-darker;
box-sizing: border-box; box-sizing: border-box;
cursor: pointer;
display: flex; display: flex;
padding: $small; padding: $small;
width: 100%; width: 100%;
@ -310,4 +316,6 @@
} }
}
} }

View file

@ -134,6 +134,7 @@
[:li {:key (str (:id item)) [:li {:key (str (:id item))
:on-click select :on-click select
:class (when selected? "selected")} :class (when selected? "selected")}
[:div.element-list-body
[:div.element-actions [:div.element-actions
[:div.toggle-element {:class (when-not (:hidden item) "selected") [:div.toggle-element {:class (when-not (:hidden item) "selected")
:on-click toggle-visibility} :on-click toggle-visibility}
@ -143,7 +144,7 @@
i/lock]] i/lock]]
[:div.element-icon (shapes/render item)] [:div.element-icon (shapes/render item)]
[:span (or (:name item) [:span (or (:name item)
(:id item))]]))) (:id item))]]])))
(def ^:static ^:private layer-element (def ^:static ^:private layer-element
(mx/component (mx/component
@ -173,29 +174,35 @@
(rum/with-key component (:id shape))) (rum/with-key component (:id shape)))
[:li.group.open [:li.group.open
[:div.element-list-body
[:div.element-actions [:div.element-actions
[:div.toggle-element i/eye] [:div.toggle-element i/eye]
[:div.block-element i/lock] [:div.block-element i/lock]
[:div.chain-element i/chain]] [:div.chain-element i/chain]]
[:div.element-icon i/folder] [:div.element-icon i/folder]
[:span "Opened group"] [:span "Opened group"]
[:span.toggle-content i/arrow-slide] [:span.toggle-content i/arrow-slide]]
[:ul [:ul
[:li
[:div.element-actions
[:div.toggle-element i/eye]
[:div.block-element i/lock]]
[:div.sublevel-element i/sublevel]
[:div.element-icon i/box]
[:span "Sub layer"]]
[:li [:li
[:div.element-list-body
[:div.element-actions [:div.element-actions
[:div.toggle-element i/eye] [:div.toggle-element i/eye]
[:div.block-element i/lock]] [:div.block-element i/lock]]
[:div.sublevel-element i/sublevel] [:div.sublevel-element i/sublevel]
[:div.element-icon i/box] [:div.element-icon i/box]
[:span "Sub layer"]]]]]] [:span "Sub layer"]]]
[:li
[:div.element-list-body
[:div.element-actions
[:div.toggle-element i/eye]
[:div.block-element i/lock]]
[:div.sublevel-element i/sublevel]
[:div.element-icon i/box]
[:span "Sub layer"]]]]]]]
[:div.layers-tools [:div.layers-tools
[:ul.layers-tools-content [:ul.layers-tools-content
[:li.clone-layer {:on-click copy} [:li.clone-layer {:on-click copy}