From 000d90171c7fda24dc36f1fb0dc7ce769d8bbf72 Mon Sep 17 00:00:00 2001 From: Torsten Date: Wed, 4 Jan 2023 23:51:13 +0200 Subject: [PATCH] fix the prose / markdown style issue --- app/helpers/merged/merged_helper.rb | 6 ++++++ app/views/merged/view/_blog_header.haml | 2 +- app/views/merged/view/_form_section.haml | 2 +- app/views/merged/view/_section_cards.haml | 2 +- app/views/merged/view/_section_full_image.haml | 2 +- app/views/merged/view/_section_full_up.haml | 2 +- app/views/merged/view/_section_half_image.haml | 2 +- app/views/merged/view/_section_large_image.haml | 3 ++- app/views/merged/view/_section_text.haml | 7 ++++--- app/views/merged/view/cards/_card_feature.haml | 8 ++++++++ app/views/merged/view/cards/_card_full_image.haml | 2 +- app/views/merged/view/cards/_card_gap_square.haml | 5 +++-- app/views/merged/view/cards/_card_normal_round.haml | 2 +- 13 files changed, 31 insertions(+), 14 deletions(-) create mode 100644 app/views/merged/view/cards/_card_feature.haml diff --git a/app/helpers/merged/merged_helper.rb b/app/helpers/merged/merged_helper.rb index 8c84dc5..8f198e6 100644 --- a/app/helpers/merged/merged_helper.rb +++ b/app/helpers/merged/merged_helper.rb @@ -12,6 +12,12 @@ module Merged Redcarpet::Markdown.new(html, options) end + def prose_classes + classes = "prose lg:prose-lg " + classes += "prose-headings:text-inherit" + { class: classes } + end + def markdown_image(section) return "" unless section.text down = self.renderer.render(section.text) diff --git a/app/views/merged/view/_blog_header.haml b/app/views/merged/view/_blog_header.haml index 9348be1..4087882 100644 --- a/app/views/merged/view/_blog_header.haml +++ b/app/views/merged/view/_blog_header.haml @@ -7,5 +7,5 @@ = date_precision(section.page , "published_date") %h2.mt-12.text-2xl.font-bold.md:text-4xl = section.header - .prose.mt-8.md:block + .mt-8.md:block{ prose_classes } = markdown(section) diff --git a/app/views/merged/view/_form_section.haml b/app/views/merged/view/_form_section.haml index dd750af..ce93837 100644 --- a/app/views/merged/view/_form_section.haml +++ b/app/views/merged/view/_form_section.haml @@ -2,7 +2,7 @@ .flex.items-center.justify-center.flex-1 .max-w-prose.px-4.mt-16.mx-auto.text-center %h1.text-4xl.font-medium= section.header - %p.prose.mt-4.text-lg.pt-10 + .mt-4.text-lg.pt-10{ prose_classes } = markdown(section) .flex.items-center.justify-start.m-10.md:m-20 .mx-auto.w-full.max-w-4xl{class: "max-w-[50%]"} diff --git a/app/views/merged/view/_section_cards.haml b/app/views/merged/view/_section_cards.haml index c5c38f2..ebffa3d 100644 --- a/app/views/merged/view/_section_cards.haml +++ b/app/views/merged/view/_section_cards.haml @@ -3,7 +3,7 @@ .max-w-prose.px-4.py-16{ options(section , :text_align)} %h1.text-2xl.font-bold.tracking-tight.sm:text-4xl = section.header - %p.prose.mt-4.text-lg.pt-10 + .mt-4.text-lg.pt-10{ prose_classes } = markdown(section) - template = "merged/view/cards/" + section.card_template .grid{ column_option(section)} diff --git a/app/views/merged/view/_section_full_image.haml b/app/views/merged/view/_section_full_image.haml index fffc519..2f08fa5 100644 --- a/app/views/merged/view/_section_full_image.haml +++ b/app/views/merged/view/_section_full_image.haml @@ -5,7 +5,7 @@ .mx-auto.max-w-xl{ options(section , :color, :text_align)} %h2.text-2xl.font-bold.md:text-5xl = section.header - %p.prose.hidden.sm:mt-4.sm:block.text-2xl + .sm:mt-4.text-2xl{ prose_classes } = markdown(section) .mt-4.md:mt-8 -if section.has_option?("button_text") diff --git a/app/views/merged/view/_section_full_up.haml b/app/views/merged/view/_section_full_up.haml index 65debfb..19a231e 100644 --- a/app/views/merged/view/_section_full_up.haml +++ b/app/views/merged/view/_section_full_up.haml @@ -6,5 +6,5 @@ -if section.has_option?("subheader") %h4.text-xl.mt-10.md:text-2xl = section.option("subheader") - .prose.mt-4.text-lg.pt-10 + .mt-4.text-lg.pt-10{ prose_classes } = markdown(section) diff --git a/app/views/merged/view/_section_half_image.haml b/app/views/merged/view/_section_half_image.haml index 0e8220d..36a51f7 100644 --- a/app/views/merged/view/_section_half_image.haml +++ b/app/views/merged/view/_section_half_image.haml @@ -8,7 +8,7 @@ -if section.has_option?("subheader") %h4.text-xl.mt-10.md:text-2xl = section.option("subheader") - %p.prose.mt-8.md:block + .mt-8{ prose_classes } = markdown(section) -if section.has_option?("button_text") .mt-8.md:mt-8 diff --git a/app/views/merged/view/_section_large_image.haml b/app/views/merged/view/_section_large_image.haml index 8627fe4..e87e1cb 100644 --- a/app/views/merged/view/_section_large_image.haml +++ b/app/views/merged/view/_section_large_image.haml @@ -8,4 +8,5 @@ -if section.has_option?("subheader") %h4.text-xl.mt-4.lg:mt-8.md:text-2xl = section.option("subheader") - %p.prose.mt-3= markdown(section) + .mt-3{ prose_classes } + = markdown(section) diff --git a/app/views/merged/view/_section_text.haml b/app/views/merged/view/_section_text.haml index 425db92..bfbd779 100644 --- a/app/views/merged/view/_section_text.haml +++ b/app/views/merged/view/_section_text.haml @@ -5,8 +5,9 @@ %h1.mb-10.text-2xl.font-bold.tracking-tight.sm:text-4xl = section.header -if section.has_option?("subheader") - %p.prose.text-xl.pb-6 + .text-xl.pb-6{ prose_classes } = section.option("subheader") - .prose.max-w-full.mt-4.gap-16{ text_column_option(section)} - = markdown_image(section) + .max-w-full.mt-4.gap-16{ text_column_option(section)} + %div{ prose_classes } + = markdown_image(section) diff --git a/app/views/merged/view/cards/_card_feature.haml b/app/views/merged/view/cards/_card_feature.haml new file mode 100644 index 0000000..4ad19a7 --- /dev/null +++ b/app/views/merged/view/cards/_card_feature.haml @@ -0,0 +1,8 @@ +.max-w-md.sm:mx-auto.sm:text-center + .flex.items-center.justify-center.w-16.h-16.mb-4.rounded-full.bg-indigo-50.sm:mx-auto.sm:w-24.sm:h-24 + %svg.w-12.h-12.text-deep-purple-accent-400.sm:w-16.sm:h-16{:stroke => "currentColor", :viewbox => "0 0 52 52"} + %polygon{:fill => "none", :points => "29 13 14 29 25 29 23 39 38 23 27 23", "stroke-linecap" => "round", "stroke-linejoin" => "round", "stroke-width" => "3"} + %h6.mb-3.text-xl.font-bold.leading-5 The deep ocean + %p.mb-3.text-sm.text-gray-900 + A flower in my garden, a mystery in my panties. Heart attack never stopped old Big Bear. I didn't even know we were calling him Big Bear. We never had the chance to. + %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 diff --git a/app/views/merged/view/cards/_card_full_image.haml b/app/views/merged/view/cards/_card_full_image.haml index e28c789..192432b 100644 --- a/app/views/merged/view/cards/_card_full_image.haml +++ b/app/views/merged/view/cards/_card_full_image.haml @@ -5,5 +5,5 @@ .relative.w-full.m-2.p-4 %h3.text-lg = card.header - %p.prose.mt-1.text-xs.font-medium + .mt-1.text-xs.font-medium{ prose_classes } = markdown(card) diff --git a/app/views/merged/view/cards/_card_gap_square.haml b/app/views/merged/view/cards/_card_gap_square.haml index 5571d43..fd84f98 100644 --- a/app/views/merged/view/cards/_card_gap_square.haml +++ b/app/views/merged/view/cards/_card_gap_square.haml @@ -5,5 +5,6 @@ %h3.p-4.mt-10.text-3xl.font-bold= card.header -if card.has_option?("subheader") %h4.p-4.text-xl= card.option("subheader") - .prose.m-6{options(card , :background , :color ) } - = markdown(card) + .m-6{options(card , :background , :color ) } + %div{ prose_classes } + = markdown(card) diff --git a/app/views/merged/view/cards/_card_normal_round.haml b/app/views/merged/view/cards/_card_normal_round.haml index 0700d5e..01db8fa 100644 --- a/app/views/merged/view/cards/_card_normal_round.haml +++ b/app/views/merged/view/cards/_card_normal_round.haml @@ -3,5 +3,5 @@ %h3.p-5.text-2xl.bg-gray-100.text-black.font-bold{ text_align_option(card)}= card.header %div.h-full{background_option(card)} .p-5{options(card , :text_align , :color)} - %p.prose.m-2.text-sm.leading-relaxed.line-clamp-3 + .m-2.text-sm.leading-relaxed.line-clamp-3{ prose_classes } = markdown(card)