From 7728767b3de69db3ee18a1d21ff174b7716aa251 Mon Sep 17 00:00:00 2001
From: Torsten <torsten@rubydesign.fi>
Date: Mon, 5 Dec 2022 12:38:57 +0200
Subject: [PATCH] background color for two col

---
 app/controllers/merged/sections_controller.rb |  2 +-
 app/helpers/merged/merged_helper.rb           | 20 ++++++++++++++++---
 app/views/merged/sections/index.html.haml     |  3 +++
 .../merged/view/_section_half_image.haml      |  7 ++++---
 config/styles.yaml                            |  6 ++++++
 5 files changed, 31 insertions(+), 7 deletions(-)

diff --git a/app/controllers/merged/sections_controller.rb b/app/controllers/merged/sections_controller.rb
index dc9654f..51394d1 100644
--- a/app/controllers/merged/sections_controller.rb
+++ b/app/controllers/merged/sections_controller.rb
@@ -78,7 +78,7 @@ module Merged
       options = params[:option]
       @section.option_definitions.each do |option|
         @section.set_option(option.name,  options[option.name])
-      end
+      end if options
       @section.save
       redirect_to :section
     end
diff --git a/app/helpers/merged/merged_helper.rb b/app/helpers/merged/merged_helper.rb
index 57ca1ca..080f1fa 100644
--- a/app/helpers/merged/merged_helper.rb
+++ b/app/helpers/merged/merged_helper.rb
@@ -23,9 +23,23 @@ module Merged
 
     def order_option(section)
       return {} unless section.has_option?("order")
-      puts "Option #{section.option('order')}"
-      return {} if section.option("order") == "left"
-      {class: "order-first"}
+      puts "Order #{section.option('order')}"
+      return {} if section.option("order") == "right"
+      {class: "order-last"}
+    end
+
+    def background_option(section)
+      return {} unless section.has_option?("background")
+      option = section.option('background')
+      puts "Background #{option}"
+      return {} if option == "white"
+      case option
+      when "blue"
+        background = "bg-cyan-100"
+      else
+        background = "white"
+      end
+      {class: background}
     end
 
     def button(text , url , color)
diff --git a/app/views/merged/sections/index.html.haml b/app/views/merged/sections/index.html.haml
index 2e420de..65e1633 100644
--- a/app/views/merged/sections/index.html.haml
+++ b/app/views/merged/sections/index.html.haml
@@ -4,6 +4,9 @@
       %h1.text-2xl.font-bold.tracking-tight.text-gray-900.sm:text-4xl
         Page
         = @page.name
+  .flex.items-center.justify-center.flex-1
+    %h3.text-xl.font-bold.tracking-tight.text-gray-900
+      =link_to "View live" , "/#{@page.name}" , target: @page.name
 
 -@page.sections.each do |section |
   .grid.grid-cols-5.gap-2.m-8{class: (section.index%2)==1 ? 'bg-cyan-50' : 'bg-red-50' }
diff --git a/app/views/merged/view/_section_half_image.haml b/app/views/merged/view/_section_half_image.haml
index a2131f4..2c31660 100644
--- a/app/views/merged/view/_section_half_image.haml
+++ b/app/views/merged/view/_section_half_image.haml
@@ -1,10 +1,11 @@
 %section.overflow-hidden.sm:grid.sm:grid-cols-2
-  = image_for( section , "p-5 h-56 w-full object-cover sm:h-full")
-  .p-8.m-5.bg-cyan-100.md:p-12.lg:px-16.lg:py-24{ order_option(section)}
+  %div{ order_option(section)}
+    = image_for( section , "p-5 h-56 w-full object-cover sm:h-full")
+  .p-8.m-5.md:p-12.lg:px-16.lg:py-24{ background_option(section)}
     .mx-auto.max-w-xl.text-center.sm:text-left
       %h2.text-2xl.font-bold.text-gray-900.md:text-3xl
         = section.header
-      %p.hidden.text-gray-500.md:mt-4.md:block
+      %p.text-gray-500.mt-4.md:block
         = section.text
       .mt-4.md:mt-8
         -if section.has_option?("button_text")
diff --git a/config/styles.yaml b/config/styles.yaml
index fa82c60..03906fa 100644
--- a/config/styles.yaml
+++ b/config/styles.yaml
@@ -25,6 +25,7 @@ sections:
     - button_link
     - button_text
     - order
+    - background
 - template: section_full_left
   header: Full image header, text left
   text: Large picture background with Header and text towards the left.
@@ -52,6 +53,11 @@ options:
       during scrolling
     values: on off
     default: off
+  - name: background
+    desciption:
+      Slight background color
+    values: white blue
+    default: white
   - name: order
     desciption:
       For two column layout determine order of sub-cards