Tweak styles on ticket page (WIP)

This commit is contained in:
Ben Visness
2024-11-01 21:01:59 -05:00
parent 2ed255e770
commit e23b5e94af
2 changed files with 19 additions and 9 deletions

View File

@@ -7,7 +7,7 @@ layout: "tickets"
features: features:
- title: "Tickets" - title: "Tickets"
title_class: "text-center text-white mt-16" title_class: "text-center text-white mt-8"
side: "center" side: "center"
content_class: "mt-16 pt-0 pb-0 text-white" content_class: "mt-16 pt-0 pb-0 text-white"
image: "/images/hmc/cities-light-mode.svg" image: "/images/hmc/cities-light-mode.svg"
@@ -19,7 +19,7 @@ features:
tickets: tickets:
- title: "Physical Track" - title: "Physical Track"
title_class: "text-white" title_class: "text-white"
subtitle: "Status: Early Bird" subtitle: "Available now"
subtitle_class: "text-white" subtitle_class: "text-white"
section_class: "text-white" section_class: "text-white"
options: options:
@@ -114,7 +114,7 @@ features:
tickets: tickets:
- title: "Online Track" - title: "Online Track"
title_class: "text-black dark:text-white" title_class: "text-black dark:text-white"
subtitle: "Status: Early Bird" subtitle: "Available now"
subtitle_class: "text-black dark:text-white" subtitle_class: "text-black dark:text-white"
section_class: "text-black dark:text-white" section_class: "text-black dark:text-white"
options: options:

View File

@@ -3,7 +3,7 @@
<div class="w-full"> <div class="w-full">
{{ $tickets := .tickets }} {{ $tickets := .tickets }}
{{ range $index, $ticket := $tickets }} {{ range $index, $ticket := $tickets }}
<h2 class="text-3xl font-bold mb-8 {{ $ticket.title_class }}">{{ $ticket.title }}</h2> <h2 class="text-3xl font-bold {{ $ticket.title_class }}">{{ $ticket.title }}</h2>
<h4 class="text-xl {{ $ticket.subtitle_class }}">{{ $ticket.subtitle }}</h2> <h4 class="text-xl {{ $ticket.subtitle_class }}">{{ $ticket.subtitle }}</h2>
{{/* <div class="columns-3s"> */}} {{/* <div class="columns-3s"> */}}
<div id="pricing" <div id="pricing"
@@ -41,17 +41,27 @@
<h3 class="m-0 text-2xl font-semibold leading-tight tracking-tight border-0 border-gray-200 sm:text-3xl md:text-4xl {{ $option.title_class }}"> <h3 class="m-0 text-2xl font-semibold leading-tight tracking-tight border-0 border-gray-200 sm:text-3xl md:text-4xl {{ $option.title_class }}">
{{ $option.title | markdownify }} {{ $option.title | markdownify }}
</h3> </h3>
<div class="flex items-center mt-4 leading-7 border-0 border-gray-200"> <div class="flex gap-2 items-center mt-4 leading-7 border-0 border-gray-200">
{{ $original_styles := "box-border text-light line-through text-2xl font-semibold leading-none border-solid" }}
{{ if $option.original_price }} {{ if $option.original_price }}
<p class="box-border m-0 -ml-8 mr-2 text-light line-through text-2xl font-semibold leading-none border-solid"> <p class="{{ $original_styles }}">
{{ $option.original_price | markdownify }} {{ $option.original_price | markdownify }}
</p> </p>
{{ end }} {{ end }}
<p class="text-3xl">$</p> <div class="flex items-center">
<p class="box-border m-0 text-6xl font-semibold leading-none border-solid {{ $option.price_class }}"> <p class="text-3xl">$</p>
{{ $option.price | markdownify }} <p class="box-border m-0 text-6xl font-semibold leading-none border-solid {{ $option.price_class }}">
{{ $option.price | markdownify }}
</p>
</div>
{{/* to center the overall content */}}
{{ if $option.original_price }}
<p class="{{ $original_styles }} invisible">
{{ $option.original_price | markdownify }}
</p> </p>
{{ end }}
</div> </div>
<ul class="flex-1 p-0 mt-4 leading-7 text-gray-900 border-0 border-gray-200 {{ $option.features_class }}"> <ul class="flex-1 p-0 mt-4 leading-7 text-gray-900 border-0 border-gray-200 {{ $option.features_class }}">
{{ range $feature_index, $feature := $option.features }} {{ range $feature_index, $feature := $option.features }}