breeze_cms 1.0.2 → 1.1.0

data/app/models/breeze/page.rb

@@ -24,6 +24,12 @@ module Breeze
       sum
     end
 
+    def translate(editor)
+      Breeze.language_strings.each do |lang|
+        sections.each{ |s | s.translate(lang, editor) }
+      end
+    end
+
     def sections
       Section.find_all(:page_id, id).sort_by{|obj| obj.index }
     end

data/app/models/breeze/section.rb

@@ -32,6 +32,11 @@ module Breeze
       sum
     end
 
+    def translate(lang , editor)
+      super
+      cards.each{ |s | s.translate(lang, editor) }
+    end
+
     def cards
       Card.find_all(:section_id, id).sort_by{|obj| obj.index }
     end
@@ -51,6 +56,7 @@ module Breeze
     def set_template(new_template)
       self.template = new_template
       new_style = template_style
+      add_default_options
       if(new_style.has_cards?)
         if card_template.blank?
           self.card_template = CardStyle.first.template
@@ -58,6 +64,10 @@ module Breeze
       end
     end
 
+    def set_card_template(new_template)
+      self.card_template = new_template
+    end
+
     def allowed_fields
       super + [:page_id]
     end

data/app/models/breeze/shared_base.rb

@@ -14,7 +14,7 @@ module Breeze
       breeze_path = Breeze::Engine.root.join("config")
       breeze_res = YAML.load(File.read(File.join(breeze_path , fullname )))
 
-      res + breeze_res
+      breeze_res + res
     end
   end
 end

data/app/models/breeze/translation.rb

@@ -37,6 +37,11 @@ module Breeze
       return object.header
     end
 
+    def is_manual?
+      return false unless data = object.data[language]
+      data[:manual] || false
+    end
+
     def get_text
       return "" unless data = object.data[language]
       data[:text] || ""
@@ -70,17 +75,26 @@ module Breeze
       object.data[language][:updated_at]
     end
 
-    def update(hash , editor)
+    def update(hash , editor , manual )
       return unless hash
       set_text(hash[:text]) if hash.has_key?(:text)
       set_header(hash[:header]) if hash.has_key?(:header)
+      object.data[language] = {} unless object.data[language]
       object.data[language][:updated_by] = editor
       object.data[language][:updated_at] = Time.now
+      object.data[language][:manual] = manual
 
       ChangeSet.current.add(self.class.name , "#{language}:#{object.change_name}", editor)
       object.class.save_all
     end
 
+    def auto_translate(editor)
+      translated = { text: DeepL.translate(self.object.text, 'EN', self.language).text,
+                    header: DeepL.translate(self.object.header, 'EN', self.language).text
+      }
+      self.update(translated, editor , false)
+    end
+
     # find according to id, ie class_num
     def self.find(id)
       clazz , lang , num = id.split("-")

data/app/models/breeze/view_base.rb

@@ -23,10 +23,10 @@ module Breeze
     end
 
     def last_update_for(elements)
-      last = Time.now
+      last = Time.now - 5.years
       last_section = nil
       elements.each do |section|
-        if( section.updated_at < last )
+        if( section.updated_at > last )
           last = section.updated_at
           last_section = section
         end
@@ -58,13 +58,14 @@ module Breeze
         year = value[:year] || Time.new.year
         value = Time.new( year.to_i , value[:month] , value[:day]).to_date
       end
-      safe_options[option] = value
+      safe_options[option] = value.to_s
     end
 
     def add_default_options( definitions = nil )
       definitions = option_definitions if definitions.nil?
       definitions.each do |option|
         next unless option.default
+        next unless option(option.name).blank?
         set_option( option.name , option.default)
       end
     end
@@ -90,6 +91,14 @@ module Breeze
         set_option(option.name,  options[option.name])
       end
     end
+    def update_present_options( options )
+      return unless options
+      option_definitions.each do |option|
+        next unless options.has_key?(option.name)
+        set_option(option.name,  options[option.name])
+      end
+    end
+
     #other may be nil
     def swap_index_with(other)
       return unless other
@@ -106,6 +115,11 @@ module Breeze
       Image.find_by_name(self.image_name)
     end
 
+    def translate(lang , editor)
+      trans = get_translation(lang)
+      trans.auto_translate(editor) if trans.is_old?
+    end
+
     def get_translation(lang)
       Translation.new( self , lang)
     end

data/app/views/breeze/images/_editor.haml

@@ -1,27 +1,26 @@
-%script{:src => "https://cdn.jsdelivr.net/npm/vue@2.7.14/dist/vue.js"}
+%script{:src => "https://cdn.jsdelivr.net/npm/vue@2.7.16/dist/vue.js"}
 
 %section.image
   .flex.justify-between.mx-20
     .flex.justify-between
       %div.justify-self-start.ml-20.mr-10
-        %b Presets
-        600
-        %input{ name: :pre, type: "radio", value: "600", "v-on:input": "handle_preset($event)" }/
-        800
-        %input{ name: :pre, type: "radio", value: "800", "v-on:input": "handle_preset($event)" }/
-        1800
-        %input{ name: :pre, type: "radio", value: "1800", "v-on:input": "handle_preset($event)" }/
-        %br
         %b Scale {{scaled_x}} x {{scaled_y}}
+        %select.ml-4.mb-2.form-control{ "v-on:input": "handle_preset($event)" }
+          %option{  } Select a preset
+          %option{ value: "600", "v-on:input": "handle_preset($event)" } Card 600
+          %option{ value: "800", "v-on:input": "handle_preset($event)" } Half 800
+          %option{ value: "1200", "v-on:input": "handle_preset($event)" } 2/3  1200
+          %option{ value: "1800", "v-on:input": "handle_preset($event)" } Full 1800
+
         %br/
         %input{":min": 20 , ":max": 100 , ":step": 0.1 , :type => "range",
                 "v-bind:value": "scale" , "v-on:input" => "handle_scale($event)"}/
 
       = form_tag( breeze.image_scale_path(image_id: image.id) ) do
         %input{ hidden: true ,  id: :scale_id , name: :scale , "v-bind:value": "scale" }
-        %button.my-3.button.change Scale  {{scale}} %
+        %button.button.change Scale  {{scale}} %
 
-    %div.mt-2
+    %div
       %b.pr-2 Ratio
       %br/
       %em    {{ratio}} : 1
@@ -31,9 +30,9 @@
       %input{ hidden: true ,  id: :height_id , name: :size_y , "v-bind:value": "size_y" }
       %input{ hidden: true ,  id: :off_x_id , name: :off_x , "v-bind:value": "off_x" }
       %input{ hidden: true ,  id: :off_y_id , name: :off_y , "v-bind:value": "off_y" }
-      %button.my-3.button.change Crop
+      %button.button.change Crop
 
-    %div.mt-2.ml-32
+    %div.ml-32
       %b.pr-2 Fix ratio to
       %select{ "@change": "set_ratio"}
         %option{value: "0" } Any Ratio
@@ -44,11 +43,6 @@
 
   .flex.justify-between.mb-5
     %div.ml-20
-      %b Y Offset {{off_y}}
-      %br/
-      %input.horizontal{":min": 0 , ":max": "#{image.height}", ":step": 1 , :type => "range",
-              "v-bind:value": "off_y" , "v-on:input" => "handle_off_y($event)"}
-    %div
       %b X Offset {{off_x}}
       %br/
       %input{":min": 0 , ":max": "#{image.width}", ":step": 1 , :type => "range",
@@ -58,16 +52,21 @@
       %br/
       %input{":min": 0 , ":max": "#{image.width}", ":step": 1 , :type => "range",
               "v-bind:value": "size_x" , "v-on:input" => "handle_size_x($event)"}
-    %div.mr-20
+    %div
       %b Y Size {{size_y.toFixed(0)}}
       %br
       %input.horizontal{":min": 0 , ":max": "#{image.height}", ":step": 1 , :type => "range",
               "v-bind:value": "size_y" , "v-on:input" => "handle_size_y($event)"}
+    %div.mr-20
+      %b Y Offset {{off_y}}
+      %br/
+      %input.horizontal{":min": 0 , ":max": "#{image.height}", ":step": 1 , :type => "range",
+              "v-bind:value": "off_y" , "v-on:input" => "handle_off_y($event)"}
 
   .flex.justify-center
-    .image-container.overflow-hidden.relative{ "v-bind:style": "{height: scaled_y + 'px' , width: scaled_x + 'px'} " }
-      = image_tag(image.asset_name , class: "")
-      .absolute.bg-transparent.border-4.border-black{ "v-bind:style": "{height: size_y + 'px' , width: size_x + 'px' , top: off_y + 'px', left: off_x + 'px' }" }
+    .image-container.overflow-hidden.relative{ "v-bind:style": "{height: (scaled_y/global_scale) + 'px' , width: (scaled_x/global_scale) + 'px'} " }
+      = image_tag(image.asset_name , class: "" , width: (@image.width / @global_scale).to_i , height: (@image.height/@global_scale).to_i)
+      .absolute.bg-transparent.border-4.border-black{ "v-bind:style": "{height: (size_y/global_scale).toFixed() + 'px' , width: (size_x/global_scale).toFixed() + 'px' , top: (off_y/global_scale).toFixed() + 'px', left: (off_x/global_scale).toFixed() + 'px' }" }
 
 :ruby2js
   class Images < Vue
@@ -76,6 +75,7 @@
       @image_data = #{@image_data.to_json.html_safe}
       @off_x = 0
       @off_y = 0
+      @global_scale = "#{@global_scale}"
       @scale = 100
       @size_x = @image_data[:width]
       @size_y = @image_data[:height]

data/app/views/breeze/images/index.haml

@@ -1,4 +1,4 @@
-%script{:src => "https://cdn.jsdelivr.net/npm/vue@2.7.14/dist/vue.js"}
+%script{:src => "https://cdn.jsdelivr.net/npm/vue@2.7.16/dist/vue.js"}
 
 .mx-6.md:mx-12.mx-20.flex.h-16.items-center.gap-16.justify-between
   .flex.gap-20
@@ -7,8 +7,10 @@
 
     = link_to(breeze.new_image_path(new_link_params) ) do
       .button.action New Image
-  = link_to(breeze.images_path(unused: true) ) do
-    .button.action Show unused Images
+    = link_to(breeze.images_path(unused: false) ) do
+      .button.bg-cyan-100 Show used
+    = link_to(breeze.images_path(unused: true) ) do
+      .button.bg-orange-100 Show unused
 
 .images
   .flex.justify-center.gap-4
@@ -45,7 +47,7 @@
         %strong.inline-block.rounded.bg-orange-50.px-3.py-1.text-md.font-medium
           {{image.updated_at}}
         %strong.rounded.h-10.bg-orange-50.px-5.py-2.font-medium
-          {{image.tags}}
+          {{image.type}}
 
 .hidden.list
   -@images.each do |image|

data/app/views/breeze/images/show.haml

@@ -1,11 +1,13 @@
-%script{:src => "https://cdn.jsdelivr.net/npm/vue@2.7.14/dist/vue.js"}
+%script{:src => "https://cdn.jsdelivr.net/npm/vue@2.7.16/dist/vue.js"}
 
 .mx-6.md:mx-12.mx-20.flex.h-16.items-center.gap-16
   .text-xl.font-bold.text-gray-900
     Image: #{@image.name}
-
+    = @global_scale
   = form_tag( breeze.image_copy_path(@image.id)  , method: :post) do
-    %button.mx-40.button.change Copy
+    %button.mx-10.button.change Copy
+  %button.mx-10.button.change
+    = link_to "Download" , asset_path( @image.asset_name ) , download: :file
 
   .grid.grid-cols-3.gap-10
     %p
@@ -25,7 +27,10 @@
     %p.align-center Not used
     = form_tag( breeze.image_path(@image.id) , {method: :delete  } ) do
       %button.button.remove{type: :submit} Delete
-
+  .py-2.px-4.bg-orange-100.rounded-md
+    - if(@global_scale > 1)
+      Downscaled by
+      = @global_scale
 
 .flex.m-20
   .left.flex.gap-2.mt-3

data/app/views/breeze/pages/index.haml

@@ -23,7 +23,11 @@
           %td.whitespace-nowrap.px-4.py-2.text-gray-700
             = page.sections.length
           %td.whitespace-nowrap.px-4.py-2.text-gray-700
-            = link_to page.missing_translations , breeze.translation_path(page.id)
+            .flex.justify-between
+              = link_to page.missing_translations , breeze.translation_path(page.id)
+              = form_tag( breeze.page_translate_path(page_id: page.id)) do
+                %button.ml-2.rounded.bg-amber-100.px-3.text-xs.font-medium.text-amber-700{:class => "py-1.5"}
+                  Auto
           %td.whitespace-nowrap.px-4.py-2.text-gray-700
             =page.updated_by
             - s = page.sections_update

data/app/views/breeze/pages/show.haml

@@ -1,83 +1,73 @@
 - @page.sections.each do |section|
   = render_section( section )
 
-.mx-6.md:mx-12.mx-20.flex.h-16.items-center.gap-16
+.grid.grid-cols-4.mx-20.md:mx-12.gap-8.mt-8
   .text-xl.font-bold.text-gray-900
     = @page.type.capitalize
     = ":"
-  .text-xl.font-bold.text-gray-900
     =@page.name
-  %strong.rounded.bg-green-100.px-4.py-2.text-lg.font-medium.text-green-700{:class => "py-1.5"}
-    = link_to 'Section details', breeze.page_sections_path(@page.id)
+    -unless @page.redirects.blank?
+      .mt-4
+        Page redirects from
+        = @page.redirects
+  %div
+    %button.button.change
+      = link_to 'Section details', breeze.page_sections_path(@page.id)
 
   = form_tag( breeze.section_new_path(@page.id), method: :post ) do
-    %button.button.change.mr-3{type: :submit} New Section
+    %button.button.action{type: :submit} New Section
 
   .text-xl
     Edited
     = distance_of_time_in_words_to_now(@page.updated_at)
     ago
-.flex.gap-4.justify-center.m-20
-  .grid.grid-cols-5
-    .text.font-bold Section
-    .text.font-bold Cards
-    .text.font-bold Translations
-    .text.font-bold Updated
-    .text.font-bold Actions
-    - @page.sections.each do |section |
-      .span
-        =link_to( breeze.section_path(section.id)) do
-          #{section.index} : #{section.header}
-      .text
-        =link_to breeze.section_cards_path(section.id) do
-          #{section.cards.length} Cards
-      .text
-        = link_to breeze.translation_path(@page.id) do
-          %button.button.action
-            =section.missing_translations
-            missing
-      .text
-        = updated_by(section)
-      .flex
-        = form_tag( breeze.section_new_path(@page.id), method: :post ) do
-          %button.button.change.mr-3{type: :submit} New
-        = link_to breeze.section_path(section.id) do
-          %button.button.action Edit
-        .p-2
-          =link_to(breeze.section_move_path(section.id , dir: :down)) do
-            %svg.w-6.h-6{:fill => "none", :stroke => "currentColor", "stroke-width" => "1.5", :viewbox => "0 0 24 24", :xmlns => "http://www.w3.org/2000/svg"}
-              %path{:d => "M15.75 17.25L12 21m0 0l-3.75-3.75M12 21V3", "stroke-linecap" => "round", "stroke-linejoin" => "round"}
-        .p-2
-          =link_to(breeze.section_move_path(section.id , dir: :up)) do
-            %svg.w-6.h-6{:fill => "none", :stroke => "currentColor", "stroke-width" => "1.5", :viewbox => "0 0 24 24", :xmlns => "http://www.w3.org/2000/svg"}
-              %path{:d => "M8.25 6.75L12 3m0 0l3.75 3.75M12 3v18", "stroke-linecap" => "round", "stroke-linejoin" => "round"}
 
-  .flex.flex-col
-    .basis-80
-      = form_tag( breeze.page_path(@page.id) , {method: :patch  , class: "mx-auto mt-8 mb-0 max-w space-y-4" } ) do
-        %label.block
-          %h4.text-lg.font-bold Name
-          = text_field_tag( :name , @page.name, class: "w-full rounded-lg border-gray-200 p-4 pr-12 text-sm shadow-sm")
-        %button.button.change.mt-4{type: :submit} Update name
+  = form_tag( breeze.page_path(@page.id) , {method: :patch  , class: "mx-auto mt-8 mb-0 max-w space-y-4" } ) do
+    %h4.text-lg.font-bold Name
+    = text_field_tag( :name , @page.name, class: "w-full rounded-lg border-gray-200 p-4 text-sm shadow-sm")
+    %button.button.change.mt-4{type: :submit} Update name
 
-      -unless @page.redirects.blank?
-        .mt-4
-          Page redirects from
-          = @page.redirects
+  - @page.option_definitions.each do |option|
+    = form_tag( breeze.page_path(@page.id) , {method: :patch  , class: "mx-auto mt-8 mb-0 max-w space-y-4" } ) do
+      =render "/breeze/sections/option_form_#{option.type}" , section: @page , option: option
+      %button.button.change.mt-4{type: :submit} Update #{option.name.camelcase}
 
-      .relative.block.delete_page.mt-8
-        = form_tag( breeze.page_path(@page.id) , {method: :delete  } ) do
-          %button.button.remove{type: :submit} Delete Page
+  = form_tag( breeze.page_path(@page.id) , {method: :delete  } ) do
+    %button.button.mt-40.ml-10.remove{type: :submit} Delete Page
 
-    .basis-80.grow.options
-      %h3.mt-4.text-lg.font-bold Options
-      = form_tag( breeze.page_path(@page.id) , {method: :patch  , class: "mx-auto mt-8 mb-0 max-w space-y-4" } ) do
-        - @page.option_definitions.each do |option|
-          =render "/breeze/sections/option_form_#{option.type}" , section: @page , option: option
-        -if @page.option_definitions.empty?
-          %p No options
-        -else
-          %button.button.change.mt-4{type: :submit} Update Options
+.grid.grid-cols-5.gap-8.m-20
+  .text.font-bold Section
+  .text.font-bold Actions
+  .text.font-bold Translations
+  .text.font-bold Cards
+  .text.font-bold Updated
+  - @page.sections.each do |section |
+    .span
+      =link_to( breeze.section_path(section.id)) do
+        #{section.index} : #{section.header}
+    .flex
+      = form_tag( breeze.section_new_path(@page.id), method: :post ) do
+        %button.button.change.mr-3{type: :submit} New
+      = link_to breeze.section_path(section.id) do
+        %button.button.action Edit
+      .p-2
+        =link_to(breeze.section_move_path(section.id , dir: :down)) do
+          %svg.w-6.h-6{:fill => "none", :stroke => "currentColor", "stroke-width" => "1.5", :viewbox => "0 0 24 24", :xmlns => "http://www.w3.org/2000/svg"}
+            %path{:d => "M15.75 17.25L12 21m0 0l-3.75-3.75M12 21V3", "stroke-linecap" => "round", "stroke-linejoin" => "round"}
+      .p-2
+        =link_to(breeze.section_move_path(section.id , dir: :up)) do
+          %svg.w-6.h-6{:fill => "none", :stroke => "currentColor", "stroke-width" => "1.5", :viewbox => "0 0 24 24", :xmlns => "http://www.w3.org/2000/svg"}
+            %path{:d => "M8.25 6.75L12 3m0 0l3.75 3.75M12 3v18", "stroke-linecap" => "round", "stroke-linejoin" => "round"}
+    .text
+      = link_to breeze.translation_path(@page.id) do
+        %button.button.action
+          =section.missing_translations
+          missing
+    .text
+      =link_to breeze.section_cards_path(section.id) do
+        #{section.cards.length} Cards
+    .text
+      = updated_by(section)
 
 :javascript
   var sections = #{ render( partial: "sections" , formats: :json).html_safe }

data/app/views/breeze/translations/_row.haml

@@ -5,14 +5,22 @@
       %button{onclick: "button_ok(event)" , id: "#{trans.id}_idbutton"}
         = trans.object.index_name
         = trans.language
+        - if trans.is_manual?
+          .bg-orange-500.py-1.px-2.rounded-md
+            manual
   .grow
     .text{id: "#{trans.id}_headerfield" , onclick: "text_to_form(event)"}
       = trans.header
+    = form_tag( breeze.translation_auto_path(translation_id: trans.id)) do
+      %button.button.change.mt-4
+        Auto
   .grow
     .text{id: "#{trans.id}_textfield" , onclick: "text_to_form(event)" }
       = trans.text
     .hidden.form{id: "#{trans.id}_form"}
+      = trans.object.header
       %input.mt-1.w-full.rounded-md.border-gray-200.bg-white.text-sm.text-gray-800.shadow-sm{ id: "#{trans.id}_header", type: "text" , value: trans.header}
+      = trans.object.text
       %textarea.mt-2.w-full.rounded-lg.border-gray-200.align-top.shadow-sm.sm:text-sm{ cols: 100 ,
               id: "#{trans.id}_text" , rows: rows(trans.text) }
         = trans.text

data/app/views/breeze/translations/show.haml

@@ -1,13 +1,13 @@
 .mx-6.md:mx-12.mx-20.flex.h-16.items-center.gap-16
   .text-xl.font-bold.text-gray-900
-    - previous = @page.previous_page
-    = link_to( "<< previous (#{previous.name})" , breeze.translation_path(id: previous.id) )
+    - if previous = @page.previous_page
+      = link_to( "<< previous (#{previous&.name})" , breeze.translation_path(id: previous&.id) )
   .text-xl.font-bold.text-gray-900
     Page
     = @page.name
   .text-xl.font-bold.text-gray-900
-    - next_page = @page.next_page
-    = link_to( "(#{next_page.name}) next >> " , breeze.translation_path(id: next_page.id) )
+    - if next_page = @page.next_page
+      = link_to( "(#{next_page.name}) next >> " , breeze.translation_path(id: next_page.id) )
 
 -Breeze.language_strings.each do |lang|
   -@page.sections.each do |section|

data/app/views/breeze/view/_form_section.haml

@@ -1,11 +1,13 @@
-.flex.flex-col.m-5.md:m-12.lg:m-20{ options(section , :background , :text_color)}
-  .flex.items-center.justify-center.flex-1
-    .max-w-prose.px-4.mt-16.mx-auto.text-center
-      %h1.text-4xl.font-medium= section.header_text(current_lang)
-      .mt-4.text-lg.pt-10{ prose_classes }
-        = markdown(section,current_lang)
-  .flex.items-center.justify-start.m-10.md:m-20
-    .mx-auto.w-full.max-w-4xl{class: "max-w-[50%]"}
+%section{ options(section , :background , :margin) , id: section.type_id}
+  .flex{ options(section , :item_align )}
+    .px-4.py-4.md:py-10.lg:py-16.mx-5.md:mx-12.lg:mx-20{options(section , :text_align , :text_color)}
+      %h1.section_header.text-2xl.font-bold.tracking-tight.sm:text-4xl
+        = section.header_text(current_lang)
+      -unless( section.text_text(current_lang).blank?)
+        .section_text.mt-4.text-lg.pt-10{ prose_classes }
+          = markdown(section,current_lang)
+  .flex.items-center.justify-start.mx-10.md:mx-20.mb-20
+    .mx-auto.w-full.max-w-4xl{class: "max-w-[90%]"}
       = form_tag( main_app.post_form_path , {class: "mt-10" }) do
         - challenge = rand(8)
         = hidden_field_tag :section_id , section.id
@@ -16,8 +18,8 @@
             = render( template , card: card)
         .grid.gap-6.md:grid-cols-2
           .relative.z-0.mt-10
-            %input.peer.block.w-full.appearance-none.border-0.border-b.border-gray-500.bg-transparent.px-0.text-sm.text-gray-900.focus:border-blue-600.focus:outline-none.focus:ring-0{:class => "py-2.5", :name => "challenge", :placeholder => " ", :type => "text"}
-            %label.absolute.top-3.-z-10.-translate-y-6.scale-75.transform.text-sm.text-gray-500.duration-300.peer-placeholder-shown:translate-y-0.peer-placeholder-shown:scale-100.peer-focus:left-0.peer-focus:-translate-y-6.peer-focus:scale-75.peer-focus:text-blue-600.peer-focus:dark:text-blue-500{:class => "origin-[0]"}
+            %input.peer.block.w-full.appearance-none.border-0.border-b.border-gray-500.bg-transparent.px-0.text-gray-900.focus:border-blue-600.focus:outline-none.focus:ring-0{:class => "py-2.5", :name => "challenge", :placeholder => " ", :type => "text"}
+            %label.absolute.top-3.-z-10.-translate-y-6.scale-75.transform.text-gray-500.duration-300.peer-placeholder-shown:translate-y-0.peer-placeholder-shown:scale-100.peer-focus:left-0.peer-focus:-translate-y-6.peer-focus:scale-75.peer-focus:text-blue-600.peer-focus:dark:text-blue-500{:class => "origin-[0]"}
               = I18n.t("anti_bot")
               = challenge
               +

data/app/views/breeze/view/_section_faq.haml

@@ -0,0 +1,32 @@
+%section.m-6.md:m-12.lg:m-20{ options(section , :background , :text_color ), id: section.type_id}
+  .flex.justify-center
+    .px-4.py-4.md:py-10.lg:py-16{ options(section , :text_align , :margin)}
+      %h1.section_header.text-2xl.font-bold.tracking-tight.sm:text-4xl
+        = section.header_text(current_lang)
+      - unless section.text.blank?
+        .section_text.text-lg.pt-10{ prose_classes }
+          = markdown(section , current_lang)
+  - template = "breeze/view/cards/" + section.card_template
+  .flex.justify-center
+    .mt-8.space-y-4.md:mt-16{ options(section , :margin)}
+      - section.cards.each do |card|
+        = render( template , card: card )
+
+:javascript
+  var section_id = "question#{section.id}" ;
+  // JavaScript to toggle the answers and rotate the arrows
+  document.querySelectorAll('[id^="question#{section.id}"]').forEach(function(button, index) {
+      button.addEventListener('click', function() {
+          var ind = button.id.split("_")[1];
+          var answer = document.getElementById('answer#{section.id}_' + ind);
+          var arrow = document.getElementById('arrow#{section.id}_' + ind);
+
+          if (answer.style.display === 'none' || answer.style.display === '') {
+              answer.style.display = 'block';
+              arrow.style.transform = 'rotate(0deg)';
+          } else {
+              answer.style.display = 'none';
+              arrow.style.transform = 'rotate(-180deg)';
+          }
+      });
+  });

data/app/views/breeze/view/_section_full_image.haml

@@ -7,4 +7,4 @@
             = section.header_text(current_lang)
           .section_text.sm:mt-4.text-2xl{ prose_classes }
             = markdown(section,current_lang)
-          =view_button(section , "my-2")
+          =view_button(section , "my-4")

data/app/views/breeze/view/_section_full_up.haml

@@ -3,6 +3,7 @@
     .px-4.py-4.md:py-10.lg:py-16.mx-5.md:mx-12.lg:mx-20{options(section , :text_align , :text_color)}
       %h1.section_header.text-2xl.font-bold.tracking-tight.sm:text-4xl
         = section.header_text(current_lang)
-      .section_text.mt-4.text-lg.pt-10{ prose_classes }
-        = markdown(section,current_lang)
-      =view_button(section , "my-2")
+      -unless( section.text_text(current_lang).blank?)
+        .section_text.mt-4.text-lg.pt-10{ prose_classes }
+          = markdown(section,current_lang)
+      =view_button(section , "my-4")

data/app/views/breeze/view/_section_half_image.haml

@@ -7,4 +7,4 @@
         = section.header_text(current_lang)
       .section_text.mt-8{ prose_classes }
         = markdown(section,current_lang)
-      =view_button(section , "my-2")
+      =view_button(section , "my-4")