gent_styleguide 6.0.0-beta21 → 6.0.0-beta22

package/build/styleguide/sass/31-molecules/breadcrumbs/_breadcrumbs.scss

@@ -47,8 +47,14 @@
 
         line-height: initial;
 
-        &::after {
-          content: none;
+        &,
+        &[href^="http://"],
+        &[href^="https://"] {
+          &:not(.no-icon):not(.tag) {
+            &::after {
+              content: '';
+            }
+          }
         }
       }
 

package/build/styleguide/sass/41-organisms/timeline/_timeline.scss

@@ -286,7 +286,6 @@ dl.timeline {
             @include desktop {
               padding-right: calc(#{$timeline-dt-left-padding} + #{$timeline-dt-right-padding});
               padding-left: calc(#{$gutter-width*.5});
-              text-align: right;
               grid-area: left;
 
               .timeline-slot-title {
@@ -310,6 +309,11 @@ dl.timeline {
                 }
               }
 
+              .timeline-slot-title button,
+              .timeline-slot-date {
+                text-align: right;
+              }
+
               &::after {
                 display: none;
               }
@@ -367,7 +371,6 @@ dl.timeline {
             @include desktop {
               padding-right: calc(#{$timeline-dt-left-padding} + #{$timeline-dt-right-padding});
               padding-left: calc(#{$gutter-width*.5});
-              text-align: right;
               grid-area: left;
 
               .timeline-slot-title {
@@ -391,6 +394,11 @@ dl.timeline {
                 }
               }
 
+              .timeline-slot-title button,
+              .timeline-slot-date {
+                text-align: right;
+              }
+
               &::after {
                 display: none;
               }
@@ -409,6 +417,24 @@ dl.timeline {
           &::after {
             bottom: calc(100% - $gutter-width*.5);
           }
+
+          .timeline-slot-title {
+            &::after {
+              @include theme('border-color', 'color-tertiary-pastel', 'timeline-line-color');
+
+              position: absolute;
+              top: 0;
+              right: calc(100% + 24px);
+              bottom: 50%;
+              border-left: $timeline-border solid;
+              content: '';
+              z-index: 0;
+
+              @include desktop {
+                right: calc(100% + $timeline-dt-right-padding - $timeline-border/2);
+              }
+            }
+          }
         }
 
         &:first-of-type {

package/build/styleguide/sass/61-layouts/detail-layout/_detail-layout.scss

@@ -7,7 +7,7 @@
   // Give each direct child a specific width.
   // This is a fallback width given to all children of the detail layout.
   .w7-o2,
-  > * {
+  > *:not(.timeline-wrapper):not(.roadmap-wrapper):not(.programme-wrapper) {
     @include desktop {
       @include col(7);
       @include col-offset(2);
@@ -174,10 +174,7 @@
     @include col(12);
   }
 
-  .w12,
-  > .timeline-wrapper,
-  > .programme-wrapper,
-  > .roadmap-wrapper {
+  .w12 {
     @include col(12);
     @include extra-wide;
   }

package/build/styleguide/sass/molecules.scss

@@ -10,8 +10,8 @@
 @import "31-molecules/feature-block/_feature-block.scss";
 @import "31-molecules/file-download/_file-download.scss";
 @import "31-molecules/file-upload/_file-upload.scss";
-@import "31-molecules/form-item/_form-item.scss";
 @import "31-molecules/form-actions/_form-actions.scss";
+@import "31-molecules/form-item/_form-item.scss";
 @import "31-molecules/form-row/_form-row.scss";
 @import "31-molecules/form-steps/_form-steps.scss";
 @import "31-molecules/gentinfo/_gentinfo.scss";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gent_styleguide",
-  "version": "6.0.0-beta21",
+  "version": "6.0.0-beta22",
   "description": "Styleguide Stad.Gent",
   "devDependencies": {
     "@babel/core": "^7.20.12",