Merge pull request #77 from commonknowledge/maciej/feature/updatecss

Update teaser CSS, menu CSS

Author: MaciekBaron

banmarchive/static/css/website.css

@@ -105,6 +105,14 @@ p {
 .header__menu-item a {
   text-decoration: none;
   color: var(--text-color);
+  padding: 1em;
+  display: block;
+  transition: background 0.125s;
+}
+
+.header__menu-item .header__submenu a:hover {
+  text-decoration: none;
+  background: white;
 }
 
 .header__menu a:hover {
@@ -176,8 +184,9 @@ p {
 .header__submenu {
   list-style-type: none;
   background: #ecf0f1;
-  padding: 1rem;
+  padding: 0;
   display: none;
+  border: 1px solid #ccc;
 }
 
 .nav {
@@ -419,7 +428,12 @@ p {
   background-color: var(--eastern-blue);
 }
 
-.home-page-teaser:hover {
+.home-page-teaser--highlighted::after {
+  background-color: var(--brown);
+}
+
+.home-page-teaser:hover,
+.home-page-teaser--highlighted {
   color: white;
   background-color: var(--burgundy);
 }
@@ -437,7 +451,8 @@ p {
   text-transform: uppercase;
 }
 
-.home-page-teaser:hover .home-page-teaser__label {
+.home-page-teaser:hover .home-page-teaser__label,
+.home-page-teaser--highlighted .home-page-teaser__label {
   color: white;
 }
 

website_home/blocks.py

@@ -8,6 +8,7 @@ class HomePageTeaserBlock(blocks.StructBlock):
     page = blocks.PageChooserBlock(required=False)
     external_link = blocks.URLBlock(required=False)
     call_to_action = blocks.CharBlock()
+    highlighted = blocks.BooleanBlock(required=False, default=False)
 
     class Meta:
         icon = "pick"

website_home/migrations/0006_alter_websitehomepage_teasers.py

@@ -0,0 +1,20 @@
+# Generated by Django 3.2.11 on 2025-03-18 08:44
+
+from django.db import migrations
+import wagtail.core.blocks
+import wagtail.core.fields
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('website_home', '0005_alter_websitehomepage_teasers'),
+    ]
+
+    operations = [
+        migrations.AlterField(
+            model_name='websitehomepage',
+            name='teasers',
+            field=wagtail.core.fields.StreamField([('teaser', wagtail.core.blocks.StructBlock([('label', wagtail.core.blocks.CharBlock()), ('title', wagtail.core.blocks.CharBlock()), ('description', wagtail.core.blocks.CharBlock()), ('page', wagtail.core.blocks.PageChooserBlock(required=False)), ('external_link', wagtail.core.blocks.URLBlock(required=False)), ('call_to_action', wagtail.core.blocks.CharBlock()), ('highlighted', wagtail.core.blocks.BooleanBlock(default=False, required=False))]))], blank=True),
+        ),
+    ]

website_home/templates/blocks/home_page_teaser_block.html

@@ -1,5 +1,5 @@
 {% load wagtailcore_tags %}
-<div class="home-page-teaser">
+<div class="home-page-teaser{% if self.highlighted %} home-page-teaser--highlighted{% endif %}">
   <div class="home-page-teaser__label">{{ self.label }}</div>
   <h3 class="home-page-teaser__title">{{ self.title }}</h3>
   <div class="home-page-teaser__description">{{ self.description }}</div>