Merge branch 'master' into TMS-1033

CHANGELOG.MD

@@ -8,6 +8,20 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
 ## [Unreleased]
 
 - TMS-1033: Add new optional hero-museum component
+- TMS-1038: Fix theme-mustavalkoinen lang-menu styles
+
+## [1.54.9] - 2024-04-18
+
+- TMS-1031: Fix event-component recurring manual-event dates
+- TMS-1013: Skip dynamic events in recurring event checking
+
+## [1.54.8] - 2024-04-17
+
+- TMS-1019: Add black & white color theme
+- TMS-1013:
+    - Fix weekly date loop if event has multiple days in entries
+    - Sort entries date-array
+    - Fix checking for recurring event arrays
 
 ## [1.54.7] - 2024-03-26
 

assets/assets_test.html

@@ -17,6 +17,7 @@
     <link rel="stylesheet" href="dist/theme_paahde.css" title="paahde" />
     <link rel="stylesheet" href="dist/theme_kokemus.css" title="kokemus" />
     <link rel="stylesheet" href="dist/theme_neutraali.css" title="neutraali" />
+    <link rel="stylesheet" href="dist/theme_mustavalkoinen.css" title="mustavalkoinen" />
 
     <style>
     #switcher {
@@ -77,6 +78,9 @@ <h2>Theme options</h2>
         <li>
             <button rel="neutraali" class="switcher button is-primary">Neutraali</button>
         </li>
+        <li>
+            <button rel="mustavalkoinen" class="switcher button is-primary">Musta-valkoinen</button>
+        </li>
     </ul>
 
     <hr>

assets/scripts/theme-mustavalkoinen.js

@@ -0,0 +1,2 @@
+import './main.js';
+import 'styles/theme-mustavalkoinen.scss';

assets/styles/theme-mustavalkoinen.scss

@@ -0,0 +1,52 @@
+@import "themes/includes";
+
+$primary: $color-black;
+$primary-invert: $color-white;
+$primary-light: bulmaLighten($primary, 5);
+$primary-light-invert: $color-black;
+$primary-dark: $color-black;
+$primary-dark-invert: $color-black;
+
+$secondary: $color-white;
+$secondary-invert: $color-black;
+$secondary-light: #dcdcdc;
+$secondary-light-invert: $color-black;
+$secondary-dark: $color-black;
+$secondary-dark-invert: $color-white;
+
+$light: $primary-light;
+$light-invert: $primary-light-invert;
+$dark: $primary-dark;
+$dark-invert: $primary-dark-invert;
+$divider: $color-vaalean-harmaa;
+$divider-invert: $color-tumma-harmaa;
+
+$text: $color-black;
+$link: $primary-dark;
+
+$colors-palette-primary: ($primary, $primary-invert, $primary-dark, $primary-light);
+$colors-palette-secondary: ($secondary, $secondary-invert, $secondary-dark, $secondary-light);
+
+$accent: $primary;
+$accent-invert: $primary-invert;
+
+$colors: (
+    "primary": $colors-palette-primary,
+    "secondary": $colors-palette-secondary,
+    "white": ($color-white, $color-black),
+    "black": ($color-black, $color-white),
+    "accent": ($primary, $primary-invert),
+);
+
+$button-text-primary: $color-white;
+$button-text-invert: $primary;
+
+$button-colors: (
+    "primary": ($primary, $primary-invert, $color-black, $button-text-primary),
+    "secondary": ($secondary, $secondary-invert, $color-white, $color-black),
+);
+
+$color-background-primary-light--opaque-light: $secondary;
+
+@import "main";
+@import "themes/theme-mustavalkoinen-overrides";

assets/styles/themes/theme-mustavalkoinen-overrides.scss

@@ -0,0 +1,224 @@
+.site-header,
+.main-content {
+    // Button styles
+    .button {
+        &.is-secondary {
+            border-color: $black !important;
+        }
+    }
+}
+
+.site-header {
+    background-color: $black !important;
+
+    &__tagline,
+    .secondary-menu li a {
+        color: $white !important;
+    }
+
+    &__end {
+        .button {
+            border-color: $white !important;
+        }
+    }
+
+    .fly-out-nav__trigger .icon {
+        fill: $white !important;
+    }
+}
+
+.has-border-secondary {
+    border-color: $black;
+}
+
+.lang-nav--horizontal {
+    a {
+        color: $white !important;
+        border-color: $white !important;
+
+        &.has-text-primary-invert {
+            &,
+            &:hover,
+            &:focus {
+                color: $black !important;
+                background-color: $white !important;
+            }
+        }
+
+        &:hover,
+        &:focus {
+            color: $white !important;
+            background-color: $black !important;
+            outline-color: $white;
+        }
+    }
+}
+
+.site-header-notice {
+    background-color: $secondary-light !important;
+
+    .notice-banner__text {
+        color: $black !important;
+
+        .icon {
+            fill: $black !important;
+        }
+    }
+
+    .button {
+        background-color: $black !important;
+        color: $white !important;
+        border-color: $black !important;
+
+        .icon {
+            fill: $white !important;
+        }
+
+        &:hover,
+        &:focus {
+            background-color: $white !important;
+            color: $black !important;
+            border-color: $black !important;
+            text-decoration: underline !important;
+            outline-color: $black !important;
+
+            .icon {
+                fill: $black !important;
+            }
+        }
+    }
+}
+
+.duet-date {
+    &__toggle {
+        &:focus {
+            outline: .0558rem solid $black !important;
+        }
+    }
+}
+
+.language-nav {
+    .dropdown {
+        .dropdown-trigger {
+            .button {
+                color: $white !important;
+                border-color: $white !important;
+
+                .icon {
+                    fill: $white !important;
+                }
+            }
+        }
+    }
+}
+
+.quote {
+    background-color: $black !important;
+    color: $white !important;
+}
+
+.subpages {
+    &__items {
+        a {
+            &.has-background-image {
+                color: $white !important;
+            }
+        }
+    }
+}
+
+.search-item {
+    &__title {
+        > a {
+            &:hover,
+            &:focus {
+                color: lighten($black, 25%);
+            }
+        }
+    }
+
+    &__meta-item {
+        > a {
+            &:hover,
+            &:focus {
+                color: $black !important;
+            }
+        }
+    }
+}
+
+.logo-wall {
+    &__link {
+        outline-color: $black !important;
+    }
+}
+
+.layout-articles {
+    &__read-more {
+        color: $black !important;
+
+        .icon {
+            fill: $black !important;
+        }
+
+        &:hover,
+        &:focus {
+            color: $black !important;
+
+            .icon {
+                fill: $black !important;
+            }
+        }
+    }
+}
+
+.key-figures {
+    &__row {
+        .has-colors-white {
+            border: 1px solid $black !important;
+        }
+
+        .has-colors-secondary {
+            background-color: $secondary-light !important;
+        }
+    }
+}
+
+.grid {
+    &__item {
+        &.has-colors-white,
+        &.has-colors-secondary {
+            border: 1px solid $black !important;
+        }
+    }
+}
+
+.gform_wrapper {
+    textarea,
+    input {
+        border-color: $black !important;
+    }
+}
+
+.entry {
+    &__content {
+        > p {
+            > a {
+                color: $black !important;
+
+                &:hover,
+                &:focus {
+                    color: $black !important;
+                }
+            }
+        }
+    }
+}
+
+.events {
+    &__item-inner {
+        .icon {
+            fill: $accent !important;
+        }
+    }
+}

lib/ACF/Fields/Settings/ThemeColorTab.php

@@ -55,6 +55,7 @@ class ThemeColorTab extends \Geniem\ACF\Field\Tab {
         'paahde'          => 'Paahde (Keltaoranssi)',
         'kokemus'         => 'Kokemus (Vaalean vihreä)',
         'neutraali'       => 'Neutraali (Vaalea, neutraali värimalli, jossa korkea kontrasti)',
+        'mustavalkoinen'  => 'Musta-valkoinen',
     ];
 
     /**