back to merged layout (more space)

app/views/merged/cards/index.haml

@@ -1,26 +1,23 @@
-- content_for( :merged_menu ) do
+.mx-20.flex.h-16.items-center.gap-16
   = render "merged/sections/sections_pagination" , section: @section
   .text-xl.text-gray-900
     Cards for Section #{@section.index} -
     = link_to @section.header , merged.section_path( @section.id) , class: "underline"
   = link_to( "New Card" , merged.new_section_card_path(@section.id) , class: "p-2 border border-gray-200 bg-cyan-100 font-bold rounded-lg hover:bg-sky-100")
 
-= render "layouts/merged_header"
-
 - template = find_template(@section)
 = render( template , section: @section)
 
 - @section.cards.each_with_index do |card , index|
-  .flex.gap-10.px-20.py-10{class: (card.index%2)==1 ? 'bg-cyan-50' : 'bg-red-50' , id: "card_#{card.id}"}
+  .flex.gap-8.px-20.py-6.mb-2{class: (card.index%2)==1 ? 'bg-cyan-50' : 'bg-red-50' , id: "card_#{card.id}"}
     .basis-80
-      .p-4
-        %h3.mt-4.text-lg.font-bold Card #{index + 1}:#{card.header}
-        .flex.flex-wrap
-          = blue_button( "Up" , merged.card_move_path(card.id , dir: :up) )
-          = blue_button( "Down" , merged.card_move_path(card.id , dir: :down) )
-          = form_tag( merged.card_path(card.id) , {method: :delete  } ) do
-            =submit_button( "Delete" , true)
-      .p-4
+      %h3.mt-4.text-lg.font-bold Card #{index + 1}:#{card.header}
+      .flex.flex-wrap
+        = blue_button( "Up" , merged.card_move_path(card.id , dir: :up) )
+        = blue_button( "Down" , merged.card_move_path(card.id , dir: :down) )
+        = form_tag( merged.card_path(card.id) , {method: :delete  } ) do
+          =submit_button( "Delete" , true)
+      .mt-6
         = yellow_button("Change Image" , merged.images_path(card_id: card.id) )
         .basis-full.mt-3
           Updated at:

app/views/merged/changes/index.haml

@@ -1,12 +1,10 @@
-- content_for( :merged_menu ) do
+.mx-20.flex.h-16.items-center.gap-16
   .text-xl.font-bold.text-gray-900
     Changes
   .text-xl.text-gray-900
     Branch
     = @git.current_branch
 
-= render "layouts/merged_header"
-
 .overflow-hidden.overflow-x-auto.rounded-lg.border.border-gray-200.m-20
   %table.min-w-full.divide-y.divide-gray-200.text-sm
     %thead.bg-gray-100

app/views/merged/images/index.haml

@@ -1,8 +1,7 @@
-- content_for( :merged_menu ) do
+.mx-20.flex.h-16.items-center.gap-16
   .text-xl.font-bold.text-gray-900
     = text_for_index
 
-= render "layouts/merged_header"
 - if Rails.env.development?
   = javascript_include_tag "merged/vue.js"
 -else

app/views/merged/images/show.haml

@@ -1,4 +1,4 @@
-- content_for( :merged_menu ) do
+.mx-20.flex.h-16.items-center.gap-16
   .text-xl.font-bold.text-gray-900
     Image: #{@image.name}
 
@@ -10,8 +10,6 @@
 -else
   = javascript_include_tag "merged/vue.min.js"
 
-= render "layouts/merged_header"
-
 .flex.m-20
   .left.flex.gap-2.mt-3
     %p

app/views/merged/pages/index.haml

@@ -1,11 +1,10 @@
-- content_for( :merged_menu ) do
+.mx-20.flex.h-16.items-center.gap-16
   .text-xl.font-bold.text-gray-900
     = link_to( "All" , merged.pages_path(type: '') , class: "p-2 px-4 border border-gray-200 font-bold rounded-lg hover:bg-sky-100 #{params[:type].blank? ? 'bg-blue-200':''}")
   - @page_styles.each do |style|
     = link_to( "Only #{style.type.capitalize}s" , merged.pages_path(type: style.type) , class: "p-2 px-4 border border-gray-200 font-bold rounded-lg hover:bg-sky-100 #{(params[:type] == style.type) ? 'bg-blue-200':''}")
 
-= render "layouts/merged_header"
-.overflow-hidden.overflow-x-auto.rounded-lg.border.border-gray-200.m-20
+.overflow-hidden.overflow-x-auto.rounded-lg.border.border-gray-200.mx-20.my-10
   %table.min-w-full.divide-y.divide-gray-200.text-sm
     %thead.bg-gray-100
       %tr

app/views/merged/pages/show.haml

@@ -1,4 +1,4 @@
-- content_for( :merged_menu ) do
+.mx-20.flex.h-16.items-center.gap-16
   .text-xl.font-bold.text-gray-900
     = @page.type.capitalize
   .text-xl.font-bold.text-gray-900
@@ -7,7 +7,6 @@
     = link_to 'Sections', merged.page_sections_path(@page.id)
 
   .text-xl= distance_of_time_in_words_to_now(@page.updated_at)
-= render "layouts/merged_header"
 
 .flex.gap-4.justify-center.m-20
   .flex.flex-col

app/views/merged/sections/index.haml

@@ -1,4 +1,4 @@
-- content_for( :merged_menu ) do
+.mx-20.flex.h-16.items-center.gap-16.mb-10
   .text-xl.font-bold.text-gray-900
     = @page.type.capitalize
     = link_to @page.name , merged.page_path(@page)
@@ -6,11 +6,9 @@
     =link_to "View live" , "/#{@page.name}" , target: @page.name
   = link_to( "New Section" , merged.new_page_section_path(@page.id) , class: "p-2 border border-gray-200 bg-cyan-100 font-bold rounded-lg hover:bg-sky-100")
 
-= render "layouts/merged_header"
-
 -@page.sections.each do |section |
-  .flex.gap-10.p-4{class: (section.index%2)==1 ? 'bg-cyan-50' : 'bg-red-50' , id: "section_#{section.id}"}
-    .basis-72
+  .flex.gap-10.mt-2{class: (section.index%2)==1 ? 'bg-cyan-50' : 'bg-red-50' , id: "section_#{section.id}"}
+    .basis-72.mx-20
       %h3.mt-4.text-lg.font-bold Section #{section.index} : #{section.header}
       .flex.flex-wrap
         = yellow_button("Edit" , merged.section_path(section.id) )

app/views/merged/sections/new.haml

@@ -1,4 +1,4 @@
-- content_for( :merged_menu ) do
+.mx-20.flex.h-16.items-center.gap-16
   .text-xl.font-bold.text-gray-900
     Changes
   .text-xl.text-gray-900

app/views/merged/sections/select_card_template.haml

@@ -1,4 +1,4 @@
-- content_for( :merged_menu ) do
+.mx-20.flex.h-16.items-center.gap-16
   .text-xl.font-bold.text-gray-900
     Page #{link_to @section.page.name, merged.page_sections_path(@section.page.id), class: "underline"}
   .text-xl.text-gray-900

app/views/merged/sections/select_template.haml

@@ -1,12 +1,10 @@
-- content_for( :merged_menu ) do
+.mx-20.flex.h-16.items-center.gap-16
   .text-xl.font-bold.text-gray-900
     Page #{link_to @section.page.name, merged.page_sections_path(@section.page.id), class: "underline"}
   .text-xl.text-gray-900
     Select Style for Section #{@section.index} - #{@section.header}
 
-= render "layouts/merged_header"
-
-.grid.grid-cols-4.gap-6.m-8
+.grid.grid-cols-4.gap-6.my-10.mx-20
   - @sections.each do |style|
     .border.border-gray-300.rounded-lg.p-2
       = link_to( merged.section_set_template_path( template: style.template )) do

app/views/merged/sections/show.haml

@@ -1,13 +1,11 @@
-- content_for( :merged_menu ) do
+.mx-20.flex.h-16.items-center.gap-16
   = render "sections_pagination" , section: @section
 
-= render "layouts/merged_header"
-
 - template = find_template(@section)
 = render( template , section: @section)
 
-.flex.gap-4.m-8.flex-wrap
-  .basis-96
+.flex.gap-8.my-10.flex-wrap
+  .basis-80.ml-20
     %h3.mt-4.text-lg.font-bold= @section.template_style.header
     = section_preview(@section , class: "w-full object-contain my-4")
     = yellow_button( "Change Style" , merged.section_select_template_path(@section.id))
@@ -19,7 +17,7 @@
       Updated by:
       = @section.updated_by
 
-  .basis-96.image
+  .basis-80.image
     = link_to(merged.images_path(section_id: @section.id)) do
       -if @section.image
         %h3.mt-4.text-lg.font-bold Image #{@section.image.name}
@@ -62,11 +60,12 @@
         = yellow_button( "View and Edit Cards" , merged.section_cards_path(@section.id))
         = green_button( "New Card" , merged.new_section_card_path(@section.id) )
 
-  .basis-80.grow
+  .basis-80.grow.mr-20
     %h3.mt-4.text-lg.font-bold Options
     = section_form( class: "mx-auto mt-8 mb-0 max-w space-y-4") do
       - @section.option_definitions.each do |option|
-        =render "option_form_#{option.type}" , section: @section , option: option
+        .grid.grid-cols-3
+          =render "option_form_#{option.type}" , section: @section , option: option
       -if @section.option_definitions.empty?
         %p No options
       -else

app/views/merged/styles/index.haml

@@ -1,4 +1,4 @@
-- content_for( :merged_menu ) do
+.mx-20.flex.h-16.items-center.gap-16
   .text-xl.font-bold
     Page styles
   .text-xl.font-bold
@@ -6,8 +6,6 @@
   .text-xl.font-bold
     =link_to "Card styles" , "#cards_styles"
 
-= render "layouts/merged_header"
-
 .flex.bg-cyan-100
   .px-4.py-8.mx-auto.text-center
     %h1.text-4xl.font-bold