new card style
This commit is contained in:
parent
01e424caa8
commit
7a31f53835
BIN
app/assets/images/merged/card_preview/card_wide_square.png
Normal file
BIN
app/assets/images/merged/card_preview/card_wide_square.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 361 KiB |
@ -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
|
||||
|
||||
|
@ -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)
|
||||
|
7
app/views/merged/view/cards/_card_wide_square.haml
Normal file
7
app/views/merged/view/cards/_card_wide_square.haml
Normal 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)
|
@ -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
|
||||
|
@ -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
|
||||
|
Loading…
Reference in New Issue
Block a user