fixed last card, flash and options
This commit is contained in:
parent
523c5c97a0
commit
b4f6e6b894
@ -53,7 +53,7 @@ module Merged
|
||||
def set_card_template
|
||||
card_template = params[:card_template]
|
||||
raise "no card template given" if card_template.blank?
|
||||
@section.content["card_template"] = card_template
|
||||
@section.card_template = card_template
|
||||
@section.save
|
||||
redirect_to section_url(@section.id)
|
||||
end
|
||||
|
@ -17,7 +17,7 @@ module Merged
|
||||
end
|
||||
|
||||
# works for with sections and cards that respond to .image
|
||||
def image_for(element , classes)
|
||||
def image_for(element , classes = "")
|
||||
return "" if element.image.blank?
|
||||
image_tag("#{Image.image_root}/#{element.image}" , class: classes)
|
||||
end
|
||||
|
@ -1,11 +1,12 @@
|
||||
#flash
|
||||
-if flash.alert
|
||||
-if flash.alert
|
||||
#flash
|
||||
.m-20.rounded.border-l-4.border-red-500.bg-red-50.p-4{:role => "alert"}
|
||||
%strong.block.font-medium.text-red-700 Oops
|
||||
%p.mt-2.text-sm.text-red-700
|
||||
=flash.alert
|
||||
|
||||
-if flash.notice
|
||||
-if flash.notice
|
||||
#flash
|
||||
.m-20.rounded-xl.border.border-gray-100.p-4.shadow-xl{:role => "alert"}
|
||||
.flex.items-start.gap-4
|
||||
%span.text-green-600
|
||||
@ -21,7 +22,7 @@
|
||||
const notification = document.querySelector('#flash')
|
||||
if (notification) {
|
||||
setInterval(function() {
|
||||
notification.classList.add('collapse');
|
||||
notification.classList.add('hidden');
|
||||
}, 5000);
|
||||
}
|
||||
}
|
||||
|
@ -15,10 +15,10 @@
|
||||
Sections
|
||||
%th.whitespace-nowrap.px-4.py-2.text-left.font-medium.text-gray-900
|
||||
.flex.items-center.gap-2
|
||||
Bytes
|
||||
Updated
|
||||
%th.whitespace-nowrap.px-4.py-2.text-left.font-medium.text-gray-900
|
||||
.flex.items-center.gap-2
|
||||
Updated
|
||||
Edited by
|
||||
%th.whitespace-nowrap.px-4.py-2.text-left.font-medium.text-gray-900
|
||||
.flex.items-center.gap-2
|
||||
Actions
|
||||
@ -29,10 +29,10 @@
|
||||
= link_to merged_page.name , page_sections_path(merged_page.id)
|
||||
%td.whitespace-nowrap.px-4.py-2.text-gray-700
|
||||
= merged_page.sections.length
|
||||
%td.whitespace-nowrap.px-4.py-2.text-gray-700
|
||||
= merged_page.size
|
||||
%td.whitespace-nowrap.px-4.py-2.text-gray-700
|
||||
= distance_of_time_in_words_to_now(merged_page.updated_at)
|
||||
%td.whitespace-nowrap.px-4.py-2.text-gray-700
|
||||
ME
|
||||
%td.whitespace-nowrap.px-4.py-2
|
||||
%strong.rounded.bg-green-100.px-3.text-xs.font-medium.text-green-700{:class => "py-1.5"}
|
||||
= link_to 'Sections', page_sections_path(merged_page.id)
|
||||
|
@ -6,10 +6,10 @@
|
||||
- template = find_template(@section)
|
||||
= render( template , section: @section)
|
||||
|
||||
.flex.gap-2.m-8.flex-wrap
|
||||
.flex.gap-4.m-8.flex-wrap
|
||||
.basis-96
|
||||
%h3.mt-4.text-lg.font-bold Template #{@section.template}
|
||||
= section_preview(@section , class: "w-full object-contain p-3")
|
||||
= section_preview(@section , class: "w-full object-contain my-4")
|
||||
= yellow_button( "Change Template" , section_select_template_url(@section.id))
|
||||
= green_button( "New Section" , new_page_section_url(@section.page.id , template: @section.template) )
|
||||
|
||||
@ -18,7 +18,7 @@
|
||||
-if( @section.image.blank? )
|
||||
%p No image
|
||||
-else
|
||||
= image_tag( "cms/" + @section.image , class: "p-3")
|
||||
= image_tag( "cms/" + @section.image , class: "my-3")
|
||||
= yellow_button("Change Image", section_select_image_url(@section.id))
|
||||
= red_button( "Remove image", section_set_image_path( @section.id , image: ""))
|
||||
|
||||
@ -30,14 +30,14 @@
|
||||
%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")
|
||||
= submit_button("Update")
|
||||
.mt-4= submit_button("Update")
|
||||
|
||||
- if( @section.has_cards? )
|
||||
.basis-full.h-0
|
||||
.basis-96
|
||||
%h3.mt-4.text-lg.font-bold Card Template #{@section.card_template}
|
||||
=card_preview(@section , class: "p-3")
|
||||
%p.p-3
|
||||
.mx-3.text-lg.font-bold Card Template #{@section.card_template}
|
||||
=card_preview(@section , class: "my-3")
|
||||
%p.py-3
|
||||
=yellow_button("Change Card Template", section_select_card_template_url(@section.id))
|
||||
|
||||
.basis-96.grow
|
||||
@ -57,4 +57,4 @@
|
||||
-if @section.option_definitions.empty?
|
||||
%p No options
|
||||
-else
|
||||
= submit_button("Update")
|
||||
.mt-4= submit_button("Update")
|
||||
|
@ -1,53 +1,67 @@
|
||||
- content_for( :merged_menu ) do
|
||||
.text-xl.font-bold.text-gray-900
|
||||
.text-xl.font-bold
|
||||
Section styles
|
||||
|
||||
= render "layouts/merged_header"
|
||||
|
||||
.grid.grid-cols-3.gap-4.m-8
|
||||
-@section_styles.each do | style|
|
||||
%article.overflow-hidden.rounded-lg.border.border-gray-100.shadow-sm
|
||||
=image_tag(style.section_preview , class: "h-56 w-full object-contain lg:h-72")
|
||||
%p.mt-2.text-sm.text-gray-500
|
||||
=style.template
|
||||
%article.overflow-hidden.rounded-lg.border.border-gray-100.shadow-sm
|
||||
.overflow-hidden.rounded-lg.border.border-gray-100.shadow-sm
|
||||
.p-6
|
||||
%h3.text-lg.font-medium.text-gray-900
|
||||
%h3.text-lg.font-medium
|
||||
=style.header
|
||||
%p.mt-2.text-sm.leading-relaxed.text-gray-500.line-clamp-3
|
||||
%p.mt-2.text-sm.leading-relaxed.line-clamp-3
|
||||
= style.text
|
||||
%article.overflow-hidden.rounded-lg.border.border-gray-100.shadow-sm
|
||||
.p-6
|
||||
%h3.text-lg.font-medium.text-gray-900
|
||||
Option
|
||||
%p.mt-2.text-sm.leading-relaxed.text-gray-500.line-clamp-3
|
||||
Following options: none (wip)
|
||||
%h3.text-lg.font-medium.text-gray-900
|
||||
%p.mt-2.text-sm
|
||||
Shorthand:
|
||||
=style.template
|
||||
%h3.text-lg.font-medium.mt-4
|
||||
Cards
|
||||
%p.mt-2.text-sm.leading-relaxed.text-gray-500.line-clamp-3
|
||||
%p.mt-2.text-sm.leading-relaxed.line-clamp-3
|
||||
-if(style.has_cards?)
|
||||
Section may include cards. See card styles below
|
||||
-else
|
||||
Section may not include cards
|
||||
.overflow-hidden.rounded-lg.border.border-gray-100.shadow-sm
|
||||
.p-6
|
||||
.w-full.object-contain.h-72
|
||||
=image_tag(style.section_preview )
|
||||
|
||||
.px-4.py-8.mx-auto.text-center
|
||||
.overflow-hidden.rounded-lg.border.border-gray-100.shadow-sm
|
||||
.p-6
|
||||
%h3.text-lg.font-medium
|
||||
Options
|
||||
%p.mt-2.text-sm.leading-relaxed.line-clamp-3
|
||||
-style.options_definitions.each do | style |
|
||||
%label.block
|
||||
.text-lg.font-bold=style.name
|
||||
=style.description
|
||||
|
||||
.flex.bg-cyan-100
|
||||
.px-4.py-8.mx-auto.text-center
|
||||
%h1.text-4xl.font-bold
|
||||
Card styles
|
||||
.grid.grid-cols-3.gap-4.m-8
|
||||
-@cards_styles.each do |style|
|
||||
%article.overflow-hidden.rounded-lg.border.border-gray-100.shadow-sm
|
||||
=image_tag(style.card_preview , class: "h-56 w-full object-contain lg:h-72")
|
||||
%p.mt-2.text-sm.text-gray-500
|
||||
=style.template
|
||||
%article.overflow-hidden.rounded-lg.border.border-gray-100.shadow-sm
|
||||
.p-6
|
||||
%h3.text-lg.font-medium.text-gray-900
|
||||
%h3.text-lg.font-medium
|
||||
=style.header
|
||||
%p.mt-2.text-sm.leading-relaxed.text-gray-500.line-clamp-3
|
||||
%p.mt-2.text-sm.leading-relaxed.line-clamp-3
|
||||
= style.text
|
||||
%article.overflow-hidden.rounded-lg.border.border-gray-100.shadow-sm
|
||||
%p.mt-2.text-sm
|
||||
Shorthand:
|
||||
=style.template
|
||||
.overflow-hidden.rounded-lg.border.border-gray-100.shadow-sm
|
||||
.p-6
|
||||
%h3.text-lg.font-medium.text-gray-900
|
||||
Option
|
||||
%p.mt-2.text-sm.leading-relaxed.text-gray-500.line-clamp-3
|
||||
Following options: none (wip)
|
||||
.w-full.object-contain.h-72
|
||||
=image_tag(style.card_preview )
|
||||
.overflow-hidden.rounded-lg.border.border-gray-100.shadow-sm
|
||||
.p-6
|
||||
%h3.text-lg.font-medium
|
||||
Options
|
||||
%p.mt-2.text-sm.leading-relaxed.line-clamp-3
|
||||
-style.options_definitions.each do | style |
|
||||
%label.block
|
||||
.text-lg.font-bold=style.name
|
||||
=style.description
|
||||
|
@ -1,16 +1,7 @@
|
||||
%article.overflow-hidden.rounded-lg.border.border-gray-100.shadow-sm
|
||||
%img.h-56.w-full.object-cover{:alt => "Office", :src => "https://images.unsplash.com/photo-1600880292203-757bb62b4baf?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1770&q=80"}/
|
||||
.p-4.sm:p-6
|
||||
%a{:href => "#"}
|
||||
%h3.text-lg.font-medium.text-gray-900
|
||||
Lorem ipsum dolor sit amet consectetur adipisicing elit.
|
||||
%p.mt-2.text-sm.leading-relaxed.text-gray-500.line-clamp-3
|
||||
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Recusandae
|
||||
dolores, possimus pariatur animi temporibus nesciunt praesentium dolore
|
||||
sed nulla ipsum eveniet corporis quidem, mollitia itaque minus soluta,
|
||||
voluptates neque explicabo tempora nisi culpa eius atque dignissimos.
|
||||
Molestias explicabo corporis voluptatem?
|
||||
%a.group.mt-4.inline-flex.items-center.gap-1.text-sm.font-medium.text-blue-600{:href => "#"}
|
||||
Find out more
|
||||
%span.block.transition{"aria-hidden" => "true", :class => "group-hover:translate-x-0.5"}
|
||||
→
|
||||
.fex.flex-col.overflow-hidden.rounded-lg.border.border-gray-100.shadow-sm.m-10
|
||||
= image_for( card , class: "object-fill")
|
||||
%h3.p-5.text-2xl.bg-gray-100.text-black.font-bold{ align_option(card)}= card.header
|
||||
%div.h-full{background_option(card)}
|
||||
.p-5{options(card , :align , :color)}
|
||||
%p.m-2.text-sm.leading-relaxed.line-clamp-3
|
||||
= markdown(card)
|
||||
|
@ -1,6 +1,6 @@
|
||||
%div.m-10{background_option(card)}
|
||||
.m-10{background_option(card)}
|
||||
= image_for( card , "h-96 w-full object-cover")
|
||||
%div.m-6{options(card , :align , :color)}
|
||||
.m-6{options(card , :align , :color)}
|
||||
%h3.p-4.text-2xl.font-bold= card.header
|
||||
-if card.has_option?("subheader")
|
||||
%h4.p-4.text-xl= card.option("subheader")
|
||||
|
@ -39,6 +39,10 @@
|
||||
fields:
|
||||
- header
|
||||
- text
|
||||
options:
|
||||
- background
|
||||
- color
|
||||
- align
|
||||
- template: form_field
|
||||
header: A single field in a form
|
||||
text: The header is the Name of the field, the description
|
||||
|
Loading…
Reference in New Issue
Block a user