Merge branch 'main' into 75-add-page-to-describe-the-hotnat-process

Author: lenderom

.pre-commit-config.yaml

@@ -21,7 +21,7 @@ repos:
       - id: check-toml
       - id: check-vcs-permalinks
       - id: check-xml
-        exclude: "^layouts/_default/rss.xml$"
+        exclude: "^layouts/.*rss\\.xml$"
       - id: check-yaml
         exclude: "validity.yaml$"
       - id: debug-statements

assets/content-not-available-yet.json

@@ -14,24 +14,9 @@
     "EN": "Hungary",
     "FR": "Hongrie"
   },
-  {
-    "DE": "Kosovo",
-    "EN": "Kosovo",
-    "FR": "Kosovo"
-  },
   {
     "DE": "Nord-Mazedonien",
     "EN": "North Macedonia",
     "FR": "Macédoine du Nord"
-  },
-  {
-    "DE": "Serbien",
-    "EN": "Serbia",
-    "FR": "Serbie"
-  },
-  {
-    "DE": "Slowenien",
-    "EN": "Slovakia",
-    "FR": "Slovaquie"
   }
 ]

assets/images/logos/sv.svg

@@ -1,11 +1,22 @@
 function expandTargetedExpander() {
+  // By default, the browser will only open the dialog
+  // if the targeted element is within the dialog content,
+  // not the summary. This extends the behavior to open the dialog
+  // if the targeted element is within the summary.
+
   const hash = window.location.hash;
   if (!hash) return;
 
   const targetElement = document.getElementById(hash.substring(1));
+  if (!targetElement) return;
+
+  const summary = targetElement.closest("summary");
+  if (!summary) return;
+
+  const details = summary.closest("details");
 
-  if (targetElement && targetElement.tagName === "DETAILS") {
-    targetElement.open = true;
+  if (details && !details.open) {
+    details.open = true;
   }
 }
 

assets/js/expander.js

@@ -57,6 +57,7 @@ $highlight-colors-dark: (
 );
 
 :root {
+  color-scheme: light;
   --font-family: "Roboto", Arial, Helvetica, sans-serif;
 
   --link-default: #{$link-default};
@@ -138,6 +139,7 @@ $highlight-colors-dark: (
 
 :root[data-theme="dark"] {
   @media screen {
+    color-scheme: dark;
     --link-default: #ff6b3d;
     --link-hovered: #ff8a5b;
     --link-special: #ffffff;

assets/sass/_variables.scss

@@ -46,10 +46,6 @@
   font-weight: 600;
 }
 
-.o-booking__title-text {
-  line-height: 1.1;
-}
-
 .o-booking__subtitle {
   font-weight: 400;
   font-size: 1.4rem;
@@ -61,6 +57,10 @@
   gap: 0.6rem;
   margin-top: 0.4rem;
 
+  &:empty {
+    margin-top: 0;
+  }
+
   @media (max-width: #{$breakpoint-md}) {
     &:empty {
       display: none;
@@ -86,18 +86,24 @@
   }
 }
 
-@mixin booking_section($name) {
-  &-#{$name}--hidden &-#{$name} {
-    display: none;
-  }
+.o-booking__info {
+  margin-bottom: 1.5rem;
 }
 
-.o-booking__section {
-  @include booking_section("fip_50");
-  @include booking_section("fip_global_fare");
-  @include booking_section("reservations");
+.o-booking__sections > .o-booking__section:not(:first-child) {
+  margin-top: 1rem;
 }
 
-.o-booking__info {
-  margin-bottom: 1.5rem;
+.o-booking__content {
+  h4 {
+    @extend %h3;
+  }
+
+  h5 {
+    @extend %h4;
+  }
+
+  h6 {
+    @extend %h5;
+  }
 }

assets/sass/booking.scss

@@ -1,3 +1,12 @@
+button {
+  border-radius: var(--border-radius-s);
+  @include focus-indicator(0.2rem);
+
+  &:not(:disabled) {
+    cursor: pointer;
+  }
+}
+
 .a-button {
   padding: 1rem;
   display: inline-flex;
@@ -13,6 +22,7 @@
   background: transparent;
   color: var(--body-color);
   width: fit-content;
+  border: 0.2rem solid var(--link-default);
 
   &:hover,
   &:focus {
@@ -26,10 +36,6 @@
     display: block;
   }
 
-  &__external {
-    border: 0.2rem solid var(--link-default);
-  }
-
   &__internal {
     border: none;
   }

assets/sass/button.scss

@@ -189,8 +189,8 @@
     &__header {
       display: flex;
       align-items: center;
+      justify-content: space-between;
       flex-direction: column;
-      gap: 1.5rem;
       width: 100%;
       border-top: var(--border);
       border-bottom: 1px solid #3d444d;

assets/sass/contentNavigation.scss

@@ -66,5 +66,9 @@
     > *:last-child {
       margin-bottom: 0;
     }
+
+    > :first-child {
+      margin-top: 0;
+    }
   }
 }

assets/sass/dialog.scss

@@ -20,6 +20,11 @@
   }
 }
 
+@position-try --dropdown-align-right {
+  left: auto;
+  right: 1rem;
+}
+
 .o-dropdown {
   position: relative;
 
@@ -112,7 +117,8 @@
   &__menu {
     z-index: 20;
     display: none;
-    position: absolute;
+    position: fixed;
+    position-try-fallbacks: --dropdown-align-right;
     background: var(--bg-default);
     border-radius: var(--border-radius-m);
     list-style: none;
@@ -123,23 +129,29 @@
     border: var(--border-visible);
     animation-duration: 0.2s;
     animation-timing-function: ease;
+    max-height: 20rem;
+    overflow-y: auto;
 
     &--above {
-      bottom: 100%;
-      top: auto;
+      bottom: anchor(top);
       animation-name: dropdown-open-above;
       margin-bottom: 0.5rem;
     }
 
     &--below {
-      top: 100%;
-      bottom: auto;
+      top: anchor(bottom);
       animation-name: dropdown-open-below;
       margin-top: 0.5rem;
     }
 
     &--right {
-      right: 0;
+      right: anchor(right);
+      left: auto;
+    }
+
+    &--left {
+      left: anchor(left);
+      right: auto;
     }
   }
 }