From b447adb3899139e14bf24147b4c81b81e132077a Mon Sep 17 00:00:00 2001 From: Arne Schauf Date: Wed, 30 Apr 2025 19:47:36 +0200 Subject: [PATCH] "Enhance partner event styling and adjust newsletter text Updated the partner event card with a new ribbon design, left border highlight, and improved layout for better visibility. Simplified newsletter subscription text for conciseness. These changes enhance visual clarity and streamline user communication." --- core/static/css/theme/events.css | 43 ++++++++++++++++--- core/templates/core/event_index_page.html | 3 +- .../core/tags/newsletter_minimal_form.html | 2 +- 3 files changed, 40 insertions(+), 8 deletions(-) diff --git a/core/static/css/theme/events.css b/core/static/css/theme/events.css index ea53251..511bf1f 100644 --- a/core/static/css/theme/events.css +++ b/core/static/css/theme/events.css @@ -40,18 +40,51 @@ /* Partner event ribbon */ .partner-event-ribbon { position: absolute; - top: 10px; - right: 10px; - background: linear-gradient(135deg, #ff9800, #ff5722); + top: 30px; + right: -20px; + background: linear-gradient(135deg, rgba(132, 0, 75, 0.6), #84004b); color: white; - padding: 0.3rem 1rem; + padding: 0.3rem 0; font-size: 0.8rem; font-weight: var(--font-weight-medium); box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); z-index: 10; - border-radius: 3px; + transform: rotate(45deg); text-transform: uppercase; letter-spacing: 0.5px; + width: 160px; + text-align: center; + overflow: hidden; + clip-path: polygon(20px 0, 100% 0, 100% calc(100% - 20px), calc(100% - 20px) 100%, 0 100%, 0 20px); +} + +/* Partner event card left border */ +.timeline-panel.partner-event-card { + border: none; + border-left: 4px solid #84004b; + transition: all 0.3s ease; +} + +.partner-event-ribbon::before { + content: ''; + position: absolute; + top: 0; + left: 0; + width: 25px; + height: 25px; + background: linear-gradient(90deg, rgba(0,0,0,0), rgba(0, 0, 0, 0.15)); + clip-path: polygon(0 0, 100% 0, 0 100%); +} + +.partner-event-ribbon::after { + content: ''; + position: absolute; + bottom: 0; + right: 0; + width: 20px; + height: 20px; + background: rgba(0, 0, 0, 0.15); + clip-path: polygon(0 0, 100% 0, 0 100%); } .event-item:hover { diff --git a/core/templates/core/event_index_page.html b/core/templates/core/event_index_page.html index 2eeb6b7..b81c875 100644 --- a/core/templates/core/event_index_page.html +++ b/core/templates/core/event_index_page.html @@ -19,7 +19,7 @@ {{ event.start_date|date:"d" }} {{ event.start_date|date:"b" }} -
+
{% if event.is_partner_event %}
Partner Event
{% endif %} @@ -29,7 +29,6 @@ {{ event.start_date|date:"SHORT_DATE_FORMAT" }}{% if event.end_date %} - {{ event.end_date|date:"SHORT_DATE_FORMAT" }}{% endif %}
- {{ event.start_date|date:"F Y" }}
diff --git a/core/templates/core/tags/newsletter_minimal_form.html b/core/templates/core/tags/newsletter_minimal_form.html index e7f0ad0..efdb856 100644 --- a/core/templates/core/tags/newsletter_minimal_form.html +++ b/core/templates/core/tags/newsletter_minimal_form.html @@ -1,6 +1,6 @@
- +