FeenixMakers/merged
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

resposivness fixes, bg image alignment

Browse Source
This commit is contained in:
Torsten
2023-01-01 14:33:12 +02:00
parent 93f6a1924b
commit fb43a75817
14 changed files with 44 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
app/views/merged/view/_form_section.haml
View File

@ -1,16 +1,16 @@
.flex.flex-col.m-20{ options(section , :background , :color)}
.flex.flex-col.m-10.md:m-20{ options(section , :background , :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
%p.prose.mt-4.text-lg.pt-10
= markdown(section)
.flex.items-center.justify-start.m-20
.flex.items-center.justify-start.m-10.md:m-20
.mx-auto.w-full.max-w-4xl{class: "max-w-[50%]"}
= form_tag( merged.form_sendit_path , {class: "mt-10" }) do
- challenge = rand(8)
= hidden_field_tag :section_id , section.id
= hidden_field_tag :bot_fudder , "#{challenge*2}"
.grid.gap-6.md:grid-cols-2
.md:grid.gap-6.grid-cols-2
- template = "merged/view/cards/" + section.card_template
- section.cards.each do |card|
= render( template , card: card)

2
app/views/merged/view/_section_cards.haml
View File

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

2
app/views/merged/view/_section_full_image.haml
View File

@ -1,4 +1,4 @@
%section.overflow-hidden.bg-cover.bg-center.bg-no-repeat{bg(section , "h-full")}
%section.overflow-hidden.bg-cover.bg-no-repeat{bg(section , "h-full")}
.px-4.py-24.sm:px-6.lg:px-8
.flex{ item_align_option( section)}
.p-8.md:p-12.lg:px-16.lg:py-24{options(section , :shade )}

2
app/views/merged/view/_section_half_image.haml
View File

@ -1,4 +1,4 @@
%section.overflow-hidden.grid.grid-cols-2.m-20
%section.overflow-hidden.grid.grid-cols-1.m-20.md:grid-cols-2
%div{ order_option(section)}
= image_for( section , "h-56 w-full object-cover sm:h-full")
.p-8.md:p-12.lg:px-16.lg:py-24{ background_option(section)}

10
app/views/merged/view/_section_large_image.haml
View File

@ -1,11 +1,11 @@
.flex.justify-center.h-96.p-8{options(section , :margin , :background )}
.flex.items-center.w-full.overflow-hidden{order_option(section, "w-2/3")}
.flex.justify-center.p-8.flex-col.md:flex-row{options(section , :margin , :background )}
.flex.items-center.h-40.md:h-60.lg:h-96.w-full.overflow-hidden{order_option(section, "lg:w-2/3")}
= image_for(section ,"")
.flex.items-center.w-full.max-w-md.px-6.mx-auto{:class => "w-1/3"}
.flex.items-center.w-full.max-w.px-6.mt-6.mx-auto{:class => "lg:w-1/3"}
.flex-1{color_option(section)}
.text-center
%h2.text-4xl.font-bold.text-center.mb-8= section.header
%h2.text-4xl.font-bold.text-center.mb-4.lg:mb-8= section.header
-if section.has_option?("subheader")
%h4.text-xl.mt-10.md:text-2xl
%h4.text-xl.mt-4.lg:mt-8.md:text-2xl
= section.option("subheader")
%p.prose.mt-3= markdown(section)

7
app/views/merged/view/cards/_card_gap_square.haml
View File

@ -1,8 +1,9 @@
.grid.grid-cols-1.gap-16.m-16
.grid.grid-cols-1.gap-12.m-12.md:gap-8.md:m-8.lg:gap-12.lg:m-12
%div{ order_option(card)}
= image_for( card , "h-70 w-full object-cover grid")
%div.grid.h-70{options(card , :text_align , :color , :background )}
.grid.h-70{options(card , :text_align , :color , :background )}
%h3.p-4.mt-10.text-3xl.font-bold= card.header
-if card.has_option?("subheader")
%h4.p-4.text-xl= card.option("subheader")
%p.prose.m-10= markdown(card)
.prose.m-6{options(card , :background , :color ) }
= markdown(card)

4
app/views/merged/view/cards/_form_field.haml
View File

@ -1,8 +1,8 @@
-if card.option("form_type") == "message"
.relative.z-0.col-span-2
.relative.z-0.col-span-2.mt-3
%textarea.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 => card.header , :placeholder => " ", :rows => "5"}=params[card.header]
%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]"}= card.header
-else
.relative.z-0
.relative.z-0.mt-3
%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 => card.header, :placeholder => " " , "value" => params[card.header], :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]"}= field_name(card)