Browse Source

fix: styles of make a template form

Konstantinos Kaloutas 3 years ago
parent
commit
550682a1aa
2 changed files with 26 additions and 23 deletions
  1. 25 23
      src/main/frontend/components/content.cljs
  2. 1 0
      src/main/frontend/components/content.css

+ 25 - 23
src/main/frontend/components/content.cljs

@@ -97,8 +97,8 @@
 
 
 (rum/defc template-checkbox
 (rum/defc template-checkbox
   [template-including-parent?]
   [template-including-parent?]
-  [:div.flex.flex-row
-   [:span.text-medium.mr-2 "Including the parent block in the template?"]
+  [:div.flex.flex-row.w-auto.items-center
+   [:p.text-medium.mr-2 "Including the parent block in the template?"]
    (ui/toggle template-including-parent?
    (ui/toggle template-including-parent?
               #(swap! *template-including-parent? not))])
               #(swap! *template-including-parent? not))])
 
 
@@ -121,27 +121,29 @@
     (if @edit?
     (if @edit?
       (do
       (do
         (state/clear-edit!)
         (state/clear-edit!)
-        [:div.px-4.py-2 {:on-click (fn [e] (util/stop e))}
-         [:p "What's the template's name?"]
-         [:input#new-template.form-input.block.w-full.sm:text-sm.sm:leading-5.my-2
-          {:auto-focus true
-           :on-change (fn [e]
-                        (reset! input (util/evalue e)))}]
-         (when has-children?
-           (template-checkbox template-including-parent?))
-         (ui/button "Submit"
-                    :on-click (fn []
-                                (let [title (string/trim @input)]
-                                  (when (not (string/blank? title))
-                                    (if (page-handler/template-exists? title)
-                                      (notification/show!
-                                       [:p "Template already exists!"]
-                                       :error)
-                                      (do
-                                        (editor-handler/set-block-property! block-id :template title)
-                                        (when (false? template-including-parent?)
-                                          (editor-handler/set-block-property! block-id :template-including-parent false))
-                                        (state/hide-custom-context-menu!)))))))])
+        [:<>
+         [:div.px-4.py-2.text-sm {:on-click (fn [e] (util/stop e))}
+          [:p "What's the template's name?"]
+          [:input#new-template.form-input.block.w-full.sm:text-sm.sm:leading-5.my-2
+           {:auto-focus true
+            :on-change (fn [e]
+                         (reset! input (util/evalue e)))}]
+          (when has-children?
+            (template-checkbox template-including-parent?))
+          (ui/button "Submit"
+                     :on-click (fn []
+                                 (let [title (string/trim @input)]
+                                   (when (not (string/blank? title))
+                                     (if (page-handler/template-exists? title)
+                                       (notification/show!
+                                        [:p "Template already exists!"]
+                                        :error)
+                                       (do
+                                         (editor-handler/set-block-property! block-id :template title)
+                                         (when (false? template-including-parent?)
+                                           (editor-handler/set-block-property! block-id :template-including-parent false))
+                                         (state/hide-custom-context-menu!)))))))]
+         [:hr.menu-separator]])
       (ui/menu-link
       (ui/menu-link
        {:key "Make a Template"
        {:key "Make a Template"
         :on-click (fn [e]
         :on-click (fn [e]

+ 1 - 0
src/main/frontend/components/content.css

@@ -16,6 +16,7 @@
   opacity-100 scale-100 absolute;
   opacity-100 scale-100 absolute;
 
 
   z-index: calc(var(--ls-z-index-level-1) + 1);
   z-index: calc(var(--ls-z-index-level-1) + 1);
+  width: 270px;
 
 
   a:hover {
   a:hover {
     color: var(--ls-primary-text-color);
     color: var(--ls-primary-text-color);