diff --git a/app/assets/images/merged/section_preview/section_feature.png b/app/assets/images/merged/section_preview/section_feature.png new file mode 100644 index 0000000..b548340 Binary files /dev/null and b/app/assets/images/merged/section_preview/section_feature.png differ diff --git a/app/helpers/merged/options_helper.rb b/app/helpers/merged/options_helper.rb index 7ebef5d..44febc9 100644 --- a/app/helpers/merged/options_helper.rb +++ b/app/helpers/merged/options_helper.rb @@ -111,8 +111,9 @@ module Merged def column_option(section) option = section.option('columns') - option = 2 if option.blank? case option + when "1" + columns = "grid-cols-1" when "3" columns = "grid-cols-1 md:grid-cols-2 lg:grid-cols-3" when "4" diff --git a/app/models/merged/active_base.rb b/app/models/merged/active_base.rb index fa413ba..b74ffca 100644 --- a/app/models/merged/active_base.rb +++ b/app/models/merged/active_base.rb @@ -35,7 +35,7 @@ module Merged def self.save_all data = @records.collect {|obj| obj.attributes} File.write( self.full_path , data.to_yaml) - self.reload + self.reload(true) end def self.delete(id) # only works with id's diff --git a/app/views/merged/view/_section_feature.haml b/app/views/merged/view/_section_feature.haml new file mode 100644 index 0000000..80efee0 --- /dev/null +++ b/app/views/merged/view/_section_feature.haml @@ -0,0 +1,14 @@ +%section.m-5.md:m-12.lg:m-20{ options(section , :background , :color)} + .grid.grid-cols-1.md:grid-cols-2 + .flex.flex-col.lg:flex-row + .max-w-xl.pr-16.mx-auto.mb-10 + %h2.my-4.md:my-10.text-4xl.font-extrabold.leading-none + = section.header + .mb-6{ prose_classes } + = markdown(section) + .flex.items-center + %a.inline-flex.items-center.font-semibold.transition-colors.duration-200.text-deep-purple-accent-400.hover:text-deep-purple-800{"aria-label" => "", :href => "/"} Learn more + - template = "merged/view/cards/" + section.card_template + .grid{ column_option(section)} + - section.cards.each do |card| + = render( template , card: card) diff --git a/app/views/merged/view/cards/_card_feature_box.haml b/app/views/merged/view/cards/_card_feature_box.haml index 25f7ad3..4b6a8f1 100644 --- a/app/views/merged/view/cards/_card_feature_box.haml +++ b/app/views/merged/view/cards/_card_feature_box.haml @@ -1,4 +1,4 @@ -.relative.p-px.overflow-hidden.transition.duration-300.transform.border.rounded.shadow-sm.hover:scale-105.group.hover:shadow-xl +.m-3.relative.p-px.overflow-hidden.transition.duration-300.transform.border.rounded.shadow-sm.hover:scale-105.group.hover:shadow-xl .absolute.bottom-0.left-0.w-full.h-1.duration-300.origin-left.transform.scale-x-0.bg-deep-purple-accent-400.group-hover:scale-x-100 .absolute.bottom-0.left-0.w-1.h-full.duration-300.origin-bottom.transform.scale-y-0.bg-deep-purple-accent-400.group-hover:scale-y-100 .absolute.top-0.left-0.w-full.h-1.duration-300.origin-right.transform.scale-x-0.bg-deep-purple-accent-400.group-hover:scale-x-100 @@ -12,4 +12,3 @@ = markdown(card) - if card.has_option?("button_link") %a.inline-flex.items-center.text-sm.font-semibold.transition-colors.duration-200.text-deep-purple-accent-400.hover:text-deep-purple-800{"aria-label" => "", :href => "/"} Learn more - diff --git a/app/views/merged/view/cards/_card_feature_normal.haml b/app/views/merged/view/cards/_card_feature_normal.haml index bbba85f..0ee5688 100644 --- a/app/views/merged/view/cards/_card_feature_normal.haml +++ b/app/views/merged/view/cards/_card_feature_normal.haml @@ -1,7 +1,7 @@ .max-w-md.sm:mx-auto.sm:text-center - .flex.items-center.justify-center.mb-4.rounded-full.mx-auto.w-40.h-40{options(card,:background )} + .mt-4.flex.items-center.justify-center.mb-4.rounded-full.mx-auto.w-40.h-40{options(card,:background )} = image_for( card , "h-20 w-20") - %h6.mb-3.text-xl.font-bold.leading-5{options(card, :color)}= card.header + %h4.mb-3.text-xl.font-bold.leading-5{options(card, :color)}= card.header .mb-3.text-sm.text-gray-900{ prose_classes } = markdown(card) - if card.has_option?("button_link") diff --git a/config/merged/option_definitions.yml b/config/merged/option_definitions.yml index 565d3d5..701a748 100644 --- a/config/merged/option_definitions.yml +++ b/config/merged/option_definitions.yml @@ -6,7 +6,7 @@ :id: 1 - :name: columns :description: Number of columns in a layout that supports cards - :values: 2 3 4 5 6 + :values: 1 2 3 4 5 6 :default: 3 :id: 2 - :name: background diff --git a/config/merged/section_styles.yml b/config/merged/section_styles.yml index 0c22843..b319a4d 100644 --- a/config/merged/section_styles.yml +++ b/config/merged/section_styles.yml @@ -1,8 +1,23 @@ --- - template: section_cards - header: Two or more column layout with header - text: A header with text and two column layout. Columns have a little gap, so - background color comes through. 2,3 or 4 columns. Cards freely choosable + header: Section with Cards, 2-6 columns + text: A header with text and column layout. Columns have a little gap, so + background color comes through. 2 - 6 columns. Cards freely choosable + cards: true + fields: + - header + - text + options: + - background + - columns + - subheader + - color + - text_align +- template: section_feature + header: Feature section with 2 column, + text: A split header with two column layout on the right. + Cards can be choosen freely but columns should be carefully + choosen to fit. cards: true fields: - header