new card style

This commit is contained in:
Torsten 2023-01-04 17:12:34 +02:00
parent 01e424caa8
commit 7a31f53835
6 changed files with 35 additions and 8 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 361 KiB

View File

@ -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

View File

@ -1,7 +1,8 @@
.m-4.md:m-8.lg:m-12{background_option(card)}
%div{ order_option(card)}
= image_for( card , "h-96 w-full object-cover")
.m-6{options(card , :text_align , :color)}
.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)

View File

@ -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)

View File

@ -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

View File

@ -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