Browse Source

fix: css class .embed not working

Tienson Qin 4 years ago
parent
commit
ee0576b543
2 changed files with 15 additions and 6 deletions
  1. 3 3
      src/main/frontend/components/block.cljs
  2. 12 3
      src/main/frontend/components/block.css

+ 3 - 3
src/main/frontend/components/block.cljs

@@ -313,7 +313,7 @@
 (rum/defc block-embed < rum/reactive db-mixins/query
   [config id]
   (let [blocks (db/get-block-and-children (state/get-current-repo) id)]
-    [:div.color-level.embed.embed-block.bg-base-2 {:style {:z-index 2}}
+    [:div.ls-embed-block.bg-base-2
      [:div.px-3.pt-1.pb-2
       (blocks-container blocks (assoc config
                                       :embed? true
@@ -324,7 +324,7 @@
   (let [page-name (string/lower-case page-name)
         page-original-name (:page/original-name (db/entity [:page/name page-name]))
         current-page (state/get-current-page)]
-    [:div.color-level.embed.embed-page.py-2.my-2.px-3.bg-base-2
+    [:div.ls-embed-page.bg-base-2
      [:div.flex.items-center.p-1.embed-header
       [:div.mr-3 svg/page]
       (page-cp config {:page/name page-name})]
@@ -1831,7 +1831,7 @@
                (block-container config item)
                (:block/uuid item)))))
        ;; (add-button config ref? custom-query? blocks)
-       ])))
+])))
 
 ;; headers to hiccup
 (defn ->hiccup

+ 12 - 3
src/main/frontend/components/block.css

@@ -46,8 +46,17 @@
   font-weight: 600;
 }
 
+.ls-embed-page {
+    @apply color-level embed py-2 my-2 px-3;
+}
+
+.ls-embed-block {
+    @apply color-level embed;
+    z-index: 2;
+}
+
 .dark-theme {
-  --color-level-1: var(--ls-secondary-background-color); 
+  --color-level-1: var(--ls-secondary-background-color);
   --color-level-2: var(--ls-tertiary-background-color);
   --color-level-3: var(--ls-quaternary-background-color);
   --color-level-4: #195D6C;
@@ -56,7 +65,7 @@
 }
 
 .white-theme {
-  --color-level-1: var(--ls-secondary-background-color); 
+  --color-level-1: var(--ls-secondary-background-color);
   --color-level-2: var(--ls-tertiary-background-color);
   --color-level-3: var(--ls-quaternary-background-color);
   --color-level-4: #d0e6fa;
@@ -149,4 +158,4 @@ margin-left: auto;
 
 .ls-block h1, .ls-block h2, .ls-block h3, .ls-block h4, .ls-block h5, .ls-block h6 {
   font-weight: 600
-}
+}