mirror of
https://github.com/penpot/penpot.git
synced 2025-04-02 18:11:20 -05:00
⚡ Improve css handling performance on title-bar component
This commit is contained in:
parent
e8de8c2401
commit
00f4abbad9
1 changed files with 15 additions and 17 deletions
|
@ -5,14 +5,14 @@
|
|||
;; Copyright (c) KALEIDOS INC
|
||||
|
||||
(ns app.main.ui.components.title-bar
|
||||
(:require-macros [app.main.style :refer [css]])
|
||||
(:require-macros [app.main.style :as stl])
|
||||
(:require
|
||||
[app.common.data.macros :as dm]
|
||||
[app.main.ui.icons :as i]
|
||||
[app.util.dom :as dom]
|
||||
[rumext.v2 :as mf]))
|
||||
|
||||
(mf/defc title-bar
|
||||
{::mf/wrap-props false}
|
||||
{::mf/wrap-props false}
|
||||
[props]
|
||||
(let [collapsable? (unchecked-get props "collapsable?")
|
||||
collapsed? (unchecked-get props "collapsed?")
|
||||
|
@ -21,22 +21,20 @@
|
|||
children (unchecked-get props "children")
|
||||
on-btn-click (unchecked-get props "on-btn-click")
|
||||
btn-children (unchecked-get props "btn-children")
|
||||
klass (unchecked-get props "klass")]
|
||||
|
||||
[:div {:class (dom/classnames (css :title-bar) true
|
||||
klass true)}
|
||||
klass (dm/str (stl/css :title-bar) " "
|
||||
(unchecked-get props "klass"))]
|
||||
|
||||
[:div {:class klass}
|
||||
(if collapsable?
|
||||
[:button {:class (dom/classnames (css :toggle-btn) true)
|
||||
:on-click on-collapsed}
|
||||
[:span {:class (dom/classnames (css :collased-icon) true
|
||||
(css :rotated) collapsed?)}
|
||||
[:button {:class (stl/css :toggle-btn) :on-click on-collapsed}
|
||||
[:span {:class (stl/css-case
|
||||
:collased-icon true
|
||||
:rotated collapsed?)}
|
||||
i/arrow-refactor]
|
||||
[:div {:class (dom/classnames (css :title) true)}
|
||||
title]]
|
||||
[:div {:class (dom/classnames (css :title-only) true)}
|
||||
title])
|
||||
[:div {:class (stl/css :title)} title]]
|
||||
[:div {:class (stl/css :title-only)} title])
|
||||
children
|
||||
(when (some? on-btn-click)
|
||||
[:button {:class (dom/classnames (css :title-button) true)
|
||||
[:button {:class (stl/css :title-button)
|
||||
:on-click on-btn-click}
|
||||
btn-children])]))
|
||||
btn-children])]))
|
||||
|
|
Loading…
Add table
Reference in a new issue