make test sectio multi column

This commit is contained in:
Torsten 2022-12-29 13:47:42 +02:00
parent 547d750034
commit 137a768a6d
7 changed files with 36 additions and 15 deletions

View File

@ -18,6 +18,14 @@ module Merged
self.renderer.render(text).html_safe
end
def split_section(section)
return [""] if section.text.blank?
words = self.renderer.render(section.text).split
bins = (words.length + 3) / section.option("columns").to_i
parts = words.each_slice(bins).to_a
parts.collect{|part| part.join(" ").html_safe}
end
def aspect_ratio image
x , y = image.aspect_ratio
"#{x} / #{y}"

View File

@ -2,6 +2,14 @@ module Merged
module ViewHelper
include MergedHelper
def rows( text )
return 5 if text.blank?
text = text.text unless text.is_a?(String)
rows = (text.length / 60).to_i
return 5 if rows < 5
rows
end
# background image as inline style
def bg(section , clazz = "")
attributes = {class: clazz}

View File

@ -1,9 +1,9 @@
module Merged
class Page < ViewBase
fields :name , :type , :options, :redirects
fields :name , :type , :options, :redirects , :section_template
alias :template :type
alias :template :section_template
def change_name
self.name

View File

@ -35,7 +35,7 @@
= text_field_tag( :header , @section.header, class: "w-full rounded-lg border-gray-200 p-4 pr-12 text-sm shadow-sm")
%label.block
%h4.mt-4.text-lg.font-bold Text
= text_area_tag( :text , @section.text, rows: 5 ,class: "w-full rounded-lg border-gray-200 p-4 pr-12 text-sm shadow-sm")
= text_area_tag( :text , @section.text, rows: rows(@section) ,class: "w-full rounded-lg border-gray-200 p-4 pr-12 text-sm shadow-sm")
.mt-4= submit_button("Update")
- if( @section.has_cards? )

View File

@ -1,5 +1,5 @@
%section.m-20{ options(section , :background , :color)}
.flex{ item_align_option( section)}
.flex.text-center
.max-w-prose.px-4.py-16{ options(section , :text_align)}
%h1.text-2xl.font-bold.tracking-tight.sm:text-4xl
= section.header

View File

@ -1,9 +1,14 @@
%section{ options(section , :background , :margin)}
.px-4.py-16.mx-20{options(section , :text_align , :color)}
%h1.text-2xl.font-bold.tracking-tight.sm:text-4xl
= section.header
-if section.has_option?("subheader")
%h4.text-xl.mt-10.md:text-2xl
= section.option("subheader")
.prose.mt-4.text-lg.pt-10
= markdown(section)
.p-20.my-20{ options(section , :background , :color)}
%section
.flex.justify-center
.max-w-prose{ options(section , :text_align)}
- if !section.header.blank?
%h1.mb-10.text-2xl.font-bold.tracking-tight.sm:text-4xl
= section.header
-if section.has_option?("subheader")
%p.prose.text-xl.pb-6
= section.option("subheader")
.mt-4.grid.gap-16{ column_option(section)}
- split_section(section).each do |part|
.prose.text-justify= part

View File

@ -30,16 +30,16 @@
- button_text
- template: section_text
header: Text only section for longer passages of text, mostly news
text: Text may be markdown
text: Text may be markdown. For longer text culumns should be set.
fields:
- header
- text
options:
- columns
- background
- color
- margin
- subheader
- text_align
- template: section_half_image
header: Split section with image left or right
text: Image on one side, header and text on the other.