Skip to content

Commit

Permalink
8813 - MozFest tickets block (#11537)
Browse files Browse the repository at this point in the history
* change mozfest base to a single column layout

* add tickets block streamfield

* remove extra var bracket

* update use of child combinator as a rich text div will stop it from working
  • Loading branch information
chris-lawton authored Dec 14, 2023
1 parent 7a1f08e commit a43cff2
Showing 3 changed files with 40 additions and 20 deletions.
Original file line number Diff line number Diff line change
@@ -0,0 +1,31 @@
{% load wagtailcore_tags wagtailimages_tags %}

{% block block_content %}
<div class="tw-bg-black tw-dark tw-py-16">
<div class="tw-container">
<h2 class="tw-mb-14">{{ title }}</h2>
<div class="tw-row">
{% for tier in self.tickets %}
{% with count=self.tickets|length %}
<div class="tw-mb-12 tw-w-full{% if count > 2 %} large:tw-w-1/3{% else %} large:tw-w-1/2{% endif %} tw-px-8{% if tier.sticker_text %} tw-relative{% endif %}">
<div class="tw-bg-festival-black-100 tw-p-8 tw-h-full tw-flex tw-flex-col tw-items-start">
<h3 class="tw-h2-heading">{{ tier.price }}</h3>
<p class="tw-mt-0">{{ tier.group }}</p>
<div class="[&_*]:tw-text-sm">
{{ tier.description|richtext }}
</div>
<a class="tw-btn-primary mt-auto" href="{{ tier.link_url }}">{{ tier.link_text }}</a>
</div>

{% if tier.sticker_text %}
<div class="tw-bg-festival-purple-300 tw-absolute tw-right-2 tw-w-40 tw-h-40 tw-rounded-full -tw-top-14 tw-flex tw-items-center tw-justify-center tw-text-center tw-p-4">
<p class="tw-body-small tw-text-black tw-m-0 tw-rotate-[15deg]"><b>{{ tier.sticker_text }}</b></p>
</div>
{% endif %}
</div>
{% endwith %}
{% endfor %}
</div>
</div>
</div>
{% endblock block_content %}
23 changes: 4 additions & 19 deletions network-api/networkapi/mozfest/templates/mozfest/mozfest-base.html
Original file line number Diff line number Diff line change
@@ -52,25 +52,10 @@
{% block content %}
{% block secondary_nav %}{% endblock %}

{% if page.signup != None %}

{# Use a two-column layout #}
<div class="container">
<div class="row">
<div class="cms mozfest-content two-col mb-5">
{% include "partials/streamfield.html" with twocolumn=True %}
</div>
{% block cta %}{% include "partials/signup.html" %}{% endblock %}
</div>
</div>
{% else %}

{# Single column layout #}
<div class="cms mozfest-content mb-3 {% if page.use_wide_template %} wide {% endif %}">
{% include "partials/streamfield.html" %}
</div>

{% endif %}
{# Single column layout #}
<div class="cms mozfest-content mb-3 {% if page.use_wide_template %} wide {% endif %}">
{% include "partials/streamfield.html" %}
</div>

{% endblock %}

6 changes: 5 additions & 1 deletion tailwind.config.js
Original file line number Diff line number Diff line change
@@ -230,8 +230,12 @@ module.exports = {
},
purple: {
100: "#fa00ff",
200: "#8e769d"
200: "#8e769d",
300: "#a0a2f8"
},
black: {
100: "#202020",
}
},
"dear-internet": {
lilac: "#d3d5fc",

0 comments on commit a43cff2

Please sign in to comment.