diff --git a/app/assets/images/merged/card_preview/card_wide_square.png b/app/assets/images/merged/card_preview/card_wide_square.png new file mode 100644 index 0000000..9ccc5b9 Binary files /dev/null and b/app/assets/images/merged/card_preview/card_wide_square.png differ diff --git a/app/helpers/merged/options_helper.rb b/app/helpers/merged/options_helper.rb index 52c0f20..a71e8bb 100644 --- a/app/helpers/merged/options_helper.rb +++ b/app/helpers/merged/options_helper.rb @@ -4,10 +4,13 @@ module Merged # use options with as many option names as neccessary def options(section, *args ) all = {} + extra_class = "" + extra_class = args.pop if args.last.is_a?(String) args.each do |option_name| hash = send "#{option_name}_option".to_sym , section all.merge!(hash) { |key, one, two| one.to_s + " " + two.to_s } end + all[:class] = all[:class] + " #{extra_class}" all end diff --git a/app/views/merged/view/cards/_card_normal_square.haml b/app/views/merged/view/cards/_card_normal_square.haml index 326eb25..81fb6c2 100644 --- a/app/views/merged/view/cards/_card_normal_square.haml +++ b/app/views/merged/view/cards/_card_normal_square.haml @@ -1,7 +1,8 @@ .m-4.md:m-8.lg:m-12{background_option(card)} - = image_for( card , "h-96 w-full object-cover") - .m-6{options(card , :text_align , :color)} + %div{ order_option(card)} + = image_for( card , "h-96 w-full object-cover") + .m-6{options(card , :text_align , :color , :order)} %h3.p-4.text-2xl.font-bold= card.header -if card.has_option?("subheader") %h4.p-4.text-xl= card.option("subheader") - %p.pose.mt-2.p-4= markdown(card) + .pose.mt-2.p-4= markdown(card) diff --git a/app/views/merged/view/cards/_card_wide_square.haml b/app/views/merged/view/cards/_card_wide_square.haml new file mode 100644 index 0000000..c2e4564 --- /dev/null +++ b/app/views/merged/view/cards/_card_wide_square.haml @@ -0,0 +1,7 @@ +.flex.m-2.md:flex-row.md:m-4.lg:m-6{background_option(card)} + = image_for( card , "object-cover w-3/5") + .mx-6{options(card , :text_align , :color , :order , "w-2/5")} + %h3.px-4.mt-2.text-2xl.font-bold= card.header + -if card.has_option?("subheader") + %h4.p-4.text-xl= card.option("subheader") + .pose.mt-2.p-4= markdown(card) diff --git a/config/merged/card_styles.yml b/config/merged/card_styles.yml index 074fa9d..74864df 100644 --- a/config/merged/card_styles.yml +++ b/config/merged/card_styles.yml @@ -1,7 +1,8 @@ --- - template: card_full_image header: Full background - text: With text in bottom right corner, offset with solid color + text: Text in box on top of the imag. Adjustable background + and text color to mix/match with images. fields: - header - text @@ -24,7 +25,9 @@ - subheader - template: card_normal_square header: Standard card with square image - text: Image, header, text, normal stuff + text: Image, header, text, normal stuff. No margin between image and text. + Possible subheader. Text alignment option. Also option to turn upside + down with order. fields: - header - text @@ -33,9 +36,22 @@ - color - text_align - subheader + - order +- template: card_wide_square + header: Sideway card with square image + text: Much like standard square card, just turned sideways. + fields: + - header + - text + options: + - background + - color + - text_align + - subheader + - order - template: card_normal_round - header: Standard card with square image - text: Image, header, text, normal stuff + header: Standard card with rounded look + text: Otherwise quite similar to standard. But there is gap under the image. fields: - header - text diff --git a/test/models/card_style_test.rb b/test/models/card_style_test.rb index b6cb4d5..35dca9a 100644 --- a/test/models/card_style_test.rb +++ b/test/models/card_style_test.rb @@ -7,7 +7,7 @@ module Merged end def test_has_all - assert_equal CardStyle.all.length , 5 + assert_equal CardStyle.all.length , 6 end def test_has_fields