N°4628 - Upgrade bulma lib to v0.9.4 to avoid hack from N°4481

css/backoffice/_shame.scss

@@ -43,23 +43,3 @@
 .ibo-svg-illustration--container > svg *[fill="#6c63ff"]{
 	fill: $ibo-svg-illustration--fill;
 }
-
-// N°4481 - Restore HTML tables style identical between edition and visualization
-// This is a hack to compensate missing variables in the bulma lib, PR has been made here: https://github.com/jgthms/bulma/pull/3455
-// The following can't be reset to it's original value (from the browser stylesheet), so we have to hardcode it even though it might change in future browser versions...
-.ibo-is-html-content table {
-  &:not(:last-child) {
-    margin-bottom: 0;
-  }
-
-  tbody {
-    tr {
-      &:last-child {
-        td,
-        th {
-          border-bottom-width: 1px;
-        }
-      }
-    }
-  }
-}

css/backoffice/vendors/_bulma-variables-overload.scss

@@ -17,8 +17,11 @@ $body-overflow-y: auto !default;
  * customize Bulma content variables
  * See https://bulma.io/documentation/elements/content/
  */
+$content-block-margin-bottom: 0 !default;
+
 /* Table: Reset style as much as possible to match rich text editor preview, which is the browser's default stylesheet.
  * As there is no way to avoid bulma rules, we simply make them invalid by setting an invalid variable value, the rules will then be ignored by the browser.
+ * "!default" has been omitted on purpose as we want to overload the variables no matter what.
  * See N°4481 for more information
  */
 $content-table-cell-border: 'invalid on purpose';
@@ -27,5 +30,6 @@ $content-table-cell-padding: 'invalid on purpose';
 $content-table-cell-heading-color: 'invalid on purpose';
 $content-table-head-cell-border-width: 'invalid on purpose';
 $content-table-head-cell-color: 'invalid on purpose';
+$content-table-body-last-row-cell-border-bottom-width: 1px !default;
 $content-table-foot-cell-border-width: 'invalid on purpose';
 $content-table-foot-cell-color: 'invalid on purpose';

node_modules/.package-lock.json

@@ -17,8 +17,9 @@
       }
     },
     "node_modules/bulma-scss": {
-      "version": "0.9.0-1",
-      "license": "MIT"
+      "version": "0.9.4",
+      "resolved": "https://registry.npmjs.org/bulma-scss/-/bulma-scss-0.9.4.tgz",
+      "integrity": "sha512-iMrNFlR6yEMutYEAi1VseAmsadmmWnb8A2DghUR7jZKJLaw6AibmHOkqwlEPjsXkqJ7Pp1z/bEJ6gFMG0WNdJw=="
     },
     "node_modules/datatables.net": {
       "version": "1.11.3",

node_modules/bulma-scss/LICENSE

@@ -1,7 +1,7 @@
 The MIT License (MIT)
 
-Copyright (c) 2020 Jeremy Thomas
-Copyright (c) 2020 Jim Campbell
+Copyright (c) 2021 Jeremy Thomas
+Copyright (c) 2021 Jim Campbell
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

node_modules/bulma-scss/README.md

@@ -3,7 +3,7 @@
 This is a port of the [Bulma](https://bulma.io/) project SASS files to the
 SCSS syntax.
 
-Currently, these files are based on Bulma version 0.9.0, and will be updated
+Currently, these files are based on Bulma version 0.9.4, and will be updated
 with later releases. The files are converted to SCSS with
 [this script](https://gist.github.com/j1mc/ff1ff83e277b1e221761fc0c0ee3b164).
 

node_modules/bulma-scss/base/_all.scss

@@ -1,2 +1,4 @@
+/* Bulma Base */
 @import "minireset";
 @import "generic";
+@import "animations";

node_modules/bulma-scss/base/_animations.scss

@@ -0,0 +1,9 @@
+@keyframes spinAround {
+  from {
+    transform: rotate(0deg);
+  }
+
+  to {
+    transform: rotate(359deg);
+  }
+}

node_modules/bulma-scss/base/_generic.scss

@@ -1,3 +1,5 @@
+@import "../utilities/mixins";
+
 $body-background-color: $scheme-main !default;
 $body-size: 16px !default;
 $body-min-width: 300px !default;
@@ -54,6 +56,7 @@ section {
 body,
 button,
 input,
+optgroup,
 select,
 textarea {
   font-family: $body-family;

node_modules/bulma-scss/bulma.scss

@@ -1,4 +1,4 @@
-/*! bulma.io v0.9.0 | MIT License | github.com/jgthms/bulma */
+/*! bulma.io v0.9.4 | MIT License | github.com/jgthms/bulma */
 @import "utilities/_all";
 @import "base/_all";
 @import "elements/_all";

node_modules/bulma-scss/components/_all.scss

@@ -1,3 +1,4 @@
+/* Bulma Components */
 @import "breadcrumb";
 @import "card";
 @import "dropdown";

node_modules/bulma-scss/components/_breadcrumb.scss

@@ -1,3 +1,5 @@
+@import "../utilities/mixins";
+
 $breadcrumb-item-color: $link !default;
 $breadcrumb-item-hover-color: $link-hover !default;
 $breadcrumb-item-active-color: $text-strong !default;

node_modules/bulma-scss/components/_card.scss

@@ -1,6 +1,9 @@
+@import "../utilities/mixins";
+
 $card-color: $text !default;
 $card-background-color: $scheme-main !default;
-$card-shadow: 0 0.5em 1em -0.125em rgba($scheme-invert, 0.1), 0 0px 0 1px rgba($scheme-invert, 0.02) !default;
+$card-shadow: $shadow !default;
+$card-radius: 0.25rem !default;
 
 $card-header-background-color: transparent !default;
 $card-header-color: $text-strong !default;
@@ -19,13 +22,28 @@ $card-media-margin: $block-spacing !default;
 
 .card {
   background-color: $card-background-color;
+  border-radius: $card-radius;
   box-shadow: $card-shadow;
   color: $card-color;
   max-width: 100%;
   position: relative;
 }
 
+%card-item {
+  &:first-child {
+    border-top-left-radius: $card-radius;
+    border-top-right-radius: $card-radius;
+  }
+
+  &:last-child {
+    border-bottom-left-radius: $card-radius;
+    border-bottom-right-radius: $card-radius;
+  }
+}
+
 .card-header {
+  @extend %card-item;
+
   background-color: $card-header-background-color;
   align-items: stretch;
   box-shadow: $card-header-shadow;
@@ -46,6 +64,8 @@ $card-media-margin: $block-spacing !default;
 }
 
 .card-header-icon {
+  @include reset;
+
   align-items: center;
   cursor: pointer;
   display: flex;
@@ -56,14 +76,32 @@ $card-media-margin: $block-spacing !default;
 .card-image {
   display: block;
   position: relative;
+
+  &:first-child {
+    img {
+      border-top-left-radius: $card-radius;
+      border-top-right-radius: $card-radius;
+    }
+  }
+
+  &:last-child {
+    img {
+      border-bottom-left-radius: $card-radius;
+      border-bottom-right-radius: $card-radius;
+    }
+  }
 }
 
 .card-content {
+  @extend %card-item;
+
   background-color: $card-content-background-color;
   padding: $card-content-padding;
 }
 
 .card-footer {
+  @extend %card-item;
+
   background-color: $card-footer-background-color;
   border-top: $card-footer-border-top;
   align-items: stretch;

node_modules/bulma-scss/components/_dropdown.scss

@@ -1,3 +1,5 @@
+@import "../utilities/mixins";
+
 $dropdown-menu-min-width: 12rem !default;
 
 $dropdown-content-background-color: $scheme-main !default;
@@ -6,7 +8,7 @@ $dropdown-content-offset: 4px !default;
 $dropdown-content-padding-bottom: 0.5rem !default;
 $dropdown-content-padding-top: 0.5rem !default;
 $dropdown-content-radius: $radius !default;
-$dropdown-content-shadow: 0 0.5em 1em -0.125em rgba($scheme-invert, 0.1), 0 0px 0 1px rgba($scheme-invert, 0.02) !default;
+$dropdown-content-shadow: $shadow !default;
 $dropdown-content-z: 20 !default;
 
 $dropdown-item-color: $text !default;

node_modules/bulma-scss/components/_level.scss

@@ -1,4 +1,6 @@
-$level-item-spacing: $block-spacing / 2 !default;
+@import "../utilities/mixins";
+
+$level-item-spacing: $block-spacing * 0.5 !default;
 
 .level {
   @extend %block;

node_modules/bulma-scss/components/_list.scss

@@ -1,54 +0,0 @@
-$list-background-color: $scheme-main !default;
-$list-shadow: 0 2px 3px rgba($scheme-invert, 0.1), 0 0 0 1px rgba($scheme-invert, 0.1) !default;
-$list-radius: $radius !default;
-
-$list-item-border: 1px solid $border !default;
-$list-item-color: $text !default;
-$list-item-active-background-color: $link !default;
-$list-item-active-color: $link-invert !default;
-$list-item-hover-background-color: $background !default;
-
-.list {
-  @extend %block;
-
-  background-color: $list-background-color;
-  border-radius: $list-radius;
-  box-shadow: $list-shadow;
-
-  // &.is-hoverable > .list-item:hover:not(.is-active)
-  //   background-color: $list-item-hover-background-color
-  //   cursor: pointer
-}
-
-.list-item {
-  display: block;
-  padding: 0.5em 1em;
-
-  &:not(a) {
-    color: $list-item-color;
-  }
-
-  &:first-child {
-    border-top-left-radius: $list-radius;
-    border-top-right-radius: $list-radius;
-  }
-
-  &:last-child {
-    border-bottom-left-radius: $list-radius;
-    border-bottom-right-radius: $list-radius;
-  }
-
-  &:not(:last-child) {
-    border-bottom: $list-item-border;
-  }
-
-  &.is-active {
-    background-color: $list-item-active-background-color;
-    color: $list-item-active-color;
-  }
-}
-
-a.list-item {
-  background-color: $list-item-hover-background-color;
-  cursor: pointer;
-}

node_modules/bulma-scss/components/_media.scss

@@ -1,6 +1,13 @@
+@import "../utilities/mixins";
+
 $media-border-color: bulmaRgba($border, 0.5) !default;
-$media-spacing: 1rem;
-$media-spacing-large: 1.5rem;
+$media-border-size: 1px !default;
+$media-spacing: 1rem !default;
+$media-spacing-large: 1.5rem !default;
+$media-content-spacing: 0.75rem !default;
+$media-level-1-spacing: 0.75rem !default;
+$media-level-1-content-spacing: 0.5rem !default;
+$media-level-2-spacing: 0.5rem !default;
 
 .media {
   align-items: flex-start;
@@ -8,30 +15,30 @@ $media-spacing-large: 1.5rem;
   text-align: inherit;
 
   .content:not(:last-child) {
-    margin-bottom: 0.75rem;
+    margin-bottom: $media-content-spacing;
   }
 
   .media {
-    border-top: 1px solid $media-border-color;
+    border-top: $media-border-size solid $media-border-color;
     display: flex;
-    padding-top: 0.75rem;
+    padding-top: $media-level-1-spacing;
 
     .content:not(:last-child),
     .control:not(:last-child) {
-      margin-bottom: 0.5rem;
+      margin-bottom: $media-level-1-content-spacing;
     }
 
     .media {
-      padding-top: 0.5rem;
+      padding-top: $media-level-2-spacing;
 
       & + .media {
-        margin-top: 0.5rem;
+        margin-top: $media-level-2-spacing;
       }
     }
   }
 
   & + .media {
-    border-top: 1px solid $media-border-color;
+    border-top: $media-border-size solid $media-border-color;
     margin-top: $media-spacing;
     padding-top: $media-spacing;
   }

node_modules/bulma-scss/components/_menu.scss

@@ -1,3 +1,5 @@
+@import "../utilities/mixins";
+
 $menu-item-color: $text !default;
 $menu-item-radius: $radius-small !default;
 $menu-item-hover-color: $text-strong !default;

node_modules/bulma-scss/components/_message.scss

@@ -1,3 +1,5 @@
+@import "../utilities/mixins";
+
 $message-background-color: $background !default;
 $message-radius: $radius !default;
 

node_modules/bulma-scss/components/_modal.scss

@@ -1,3 +1,5 @@
+@import "../utilities/mixins";
+
 $modal-z: 40 !default;
 
 $modal-background-background-color: bulmaRgba($scheme-invert, 0.86) !default;
@@ -28,6 +30,8 @@ $modal-card-foot-border-top: 1px solid $border !default;
 $modal-card-body-background-color: $scheme-main !default;
 $modal-card-body-padding: 20px !default;
 
+$modal-breakpoint: $tablet !default;
+
 .modal {
   @extend %overlay;
 
@@ -60,7 +64,7 @@ $modal-card-body-padding: 20px !default;
   width: 100%;
 
   // Responsiveness
-  @include tablet {
+  @include from($modal-breakpoint) {
     margin: 0 auto;
     max-height: calc(100vh - #{$modal-content-spacing-tablet});
     width: $modal-content-width;

node_modules/bulma-scss/components/_navbar.scss

@@ -1,3 +1,5 @@
+@import "../utilities/mixins";
+
 $navbar-background-color: $scheme-main !default;
 $navbar-box-shadow-size: 0 2px 0 0 !default;
 $navbar-box-shadow-color: $background !default;
@@ -46,6 +48,8 @@ $navbar-bottom-box-shadow-size: 0 -2px 0 0 !default;
 
 $navbar-breakpoint: $desktop !default;
 
+$navbar-colors: $colors !default;
+
 @mixin navbar-fixed {
   left: 0;
   position: fixed;
@@ -59,7 +63,7 @@ $navbar-breakpoint: $desktop !default;
   position: relative;
   z-index: $navbar-z;
 
-  @each $name, $pair in $colors {
+  @each $name, $pair in $navbar-colors {
     $color: nth($pair, 1);
     $color-invert: nth($pair, 2);
 
@@ -204,6 +208,8 @@ body {
 }
 
 .navbar-burger {
+  @extend %reset;
+
   color: $navbar-burger-color;
 
   @include hamburger($navbar-height);

node_modules/bulma-scss/components/_pagination.scss

@@ -1,3 +1,6 @@
+@import "../utilities/controls";
+@import "../utilities/mixins";
+
 $pagination-color: $text-strong !default;
 $pagination-border-color: $border !default;
 $pagination-margin: -0.25rem !default;
@@ -8,6 +11,9 @@ $pagination-item-margin: 0.25rem !default;
 $pagination-item-padding-left: 0.5em !default;
 $pagination-item-padding-right: 0.5em !default;
 
+$pagination-nav-padding-left: 0.75em !default;
+$pagination-nav-padding-right: 0.75em !default;
+
 $pagination-hover-color: $link-hover !default;
 $pagination-hover-border-color: $link-hover-border !default;
 
@@ -27,7 +33,7 @@ $pagination-current-border-color: $link !default;
 
 $pagination-ellipsis-color: $grey-light !default;
 
-$pagination-shadow-inset: inset 0 1px 2px rgba($scheme-invert, 0.2);
+$pagination-shadow-inset: inset 0 1px 2px rgba($scheme-invert, 0.2) !default;
 
 .pagination {
   @extend %block;
@@ -106,7 +112,8 @@ $pagination-shadow-inset: inset 0 1px 2px rgba($scheme-invert, 0.2);
     box-shadow: $pagination-shadow-inset;
   }
 
-  &[disabled] {
+  &[disabled],
+  &.is-disabled {
     background-color: $pagination-disabled-background-color;
     border-color: $pagination-disabled-border-color;
     box-shadow: none;
@@ -117,8 +124,8 @@ $pagination-shadow-inset: inset 0 1px 2px rgba($scheme-invert, 0.2);
 
 .pagination-previous,
 .pagination-next {
-  padding-left: 0.75em;
-  padding-right: 0.75em;
+  padding-left: $pagination-nav-padding-left;
+  padding-right: $pagination-nav-padding-right;
   white-space: nowrap;
 }
 
@@ -137,6 +144,10 @@ $pagination-shadow-inset: inset 0 1px 2px rgba($scheme-invert, 0.2);
 
 .pagination-list {
   flex-wrap: wrap;
+
+  li {
+    list-style: none;
+  }
 }
 
 @include mobile {
@@ -167,6 +178,14 @@ $pagination-shadow-inset: inset 0 1px 2px rgba($scheme-invert, 0.2);
     order: 1;
   }
 
+  .pagination-previous,
+  .pagination-next,
+  .pagination-link,
+  .pagination-ellipsis {
+    margin-bottom: 0;
+    margin-top: 0;
+  }
+
   .pagination-previous {
     order: 2;
   }
@@ -177,6 +196,8 @@ $pagination-shadow-inset: inset 0 1px 2px rgba($scheme-invert, 0.2);
 
   .pagination {
     justify-content: space-between;
+    margin-bottom: 0;
+    margin-top: 0;
 
     &.is-centered {
       .pagination-previous {

node_modules/bulma-scss/components/_panel.scss

@@ -1,7 +1,9 @@
+@import "../utilities/mixins";
+
 $panel-margin: $block-spacing !default;
 $panel-item-border: 1px solid $border-light !default;
 $panel-radius: $radius-large !default;
-$panel-shadow: 0 0.5em 1em -0.125em rgba($scheme-invert, 0.1), 0 0px 0 1px rgba($scheme-invert, 0.02) !default;
+$panel-shadow: $shadow !default;
 
 $panel-heading-background-color: $border-light !default;
 $panel-heading-color: $text-strong !default;

node_modules/bulma-scss/components/_tabs.scss

@@ -1,3 +1,5 @@
+@import "../utilities/mixins";
+
 $tabs-border-bottom-color: $border !default;
 $tabs-border-bottom-style: solid !default;
 $tabs-border-bottom-width: 1px !default;

node_modules/bulma-scss/elements/_all.scss

@@ -1,3 +1,4 @@
+/* Bulma Elements */
 @import "box";
 @import "button";
 @import "container";

node_modules/bulma-scss/elements/_box.scss

@@ -1,7 +1,9 @@
+@import "../utilities/mixins";
+
 $box-color: $text !default;
 $box-background-color: $scheme-main !default;
 $box-radius: $radius-large !default;
-$box-shadow: 0 0.5em 1em -0.125em rgba($scheme-invert, 0.1), 0 0px 0 1px rgba($scheme-invert, 0.02) !default;
+$box-shadow: $shadow !default;
 $box-padding: 1.25rem !default;
 
 $box-link-hover-shadow: 0 0.5em 1em -0.125em rgba($scheme-invert, 0.1), 0 0 0 1px $link !default;

node_modules/bulma-scss/elements/_button.scss

@@ -1,3 +1,6 @@
+@import "../utilities/controls";
+@import "../utilities/mixins";
+
 $button-color: $text-strong !default;
 $button-background-color: $scheme-main !default;
 $button-family: false !default;
@@ -24,6 +27,13 @@ $button-text-decoration: underline !default;
 $button-text-hover-background-color: $background !default;
 $button-text-hover-color: $text-strong !default;
 
+$button-ghost-background: none !default;
+$button-ghost-border-color: transparent !default;
+$button-ghost-color: $link !default;
+$button-ghost-decoration: none !default;
+$button-ghost-hover-color: $link !default;
+$button-ghost-hover-decoration: underline !default;
+
 $button-disabled-background-color: $scheme-main !default;
 $button-disabled-border-color: $border !default;
 $button-disabled-shadow: none !default;
@@ -33,9 +43,15 @@ $button-static-color: $text-light !default;
 $button-static-background-color: $scheme-main-ter !default;
 $button-static-border-color: $border !default;
 
+$button-colors: $colors !default;
+$button-responsive-sizes: ("mobile": ("small": $size-small * 0.75, "normal": $size-small * 0.875, "medium": $size-small, "large": $size-normal), "tablet-only": ("small": $size-small * 0.875, "normal": $size-small, "medium": $size-normal, "large": $size-medium)) !default;
+
 // The button sizes use mixins so they can be used at different breakpoints
 @mixin button-small {
-  border-radius: $radius-small;
+  &:not(.is-rounded) {
+    border-radius: $radius-small;
+  }
+
   font-size: $size-small;
 }
 
@@ -88,18 +104,18 @@ $button-static-border-color: $border !default;
     }
 
     &:first-child:not(:last-child) {
-      @include ltr-property("margin", calc(#{-1 / 2 * $button-padding-horizontal} - #{$button-border-width}), false);
-      @include ltr-property("margin", $button-padding-horizontal / 4);
+      @include ltr-property("margin", calc(#{-0.5 * $button-padding-horizontal} - #{$button-border-width}), false);
+      @include ltr-property("margin", $button-padding-horizontal * 0.25);
     }
 
     &:last-child:not(:first-child) {
-      @include ltr-property("margin", $button-padding-horizontal / 4, false);
-      @include ltr-property("margin", calc(#{-1 / 2 * $button-padding-horizontal} - #{$button-border-width}));
+      @include ltr-property("margin", $button-padding-horizontal * 0.25, false);
+      @include ltr-property("margin", calc(#{-0.5 * $button-padding-horizontal} - #{$button-border-width}));
     }
 
     &:first-child:last-child {
-      margin-left: calc(#{-1 / 2 * $button-padding-horizontal} - #{$button-border-width});
-      margin-right: calc(#{-1 / 2 * $button-padding-horizontal} - #{$button-border-width});
+      margin-left: calc(#{-0.5 * $button-padding-horizontal} - #{$button-border-width});
+      margin-right: calc(#{-0.5 * $button-padding-horizontal} - #{$button-border-width});
     }
   }
 
@@ -155,7 +171,20 @@ $button-static-border-color: $border !default;
     }
   }
 
-  @each $name, $pair in $colors {
+  &.is-ghost {
+    background: $button-ghost-background;
+    border-color: $button-ghost-border-color;
+    color: $button-ghost-color;
+    text-decoration: $button-ghost-decoration;
+
+    &:hover,
+    &.is-hovered {
+      color: $button-ghost-hover-color;
+      text-decoration: $button-ghost-hover-decoration;
+    }
+  }
+
+  @each $name, $pair in $button-colors {
     $color: nth($pair, 1);
     $color-invert: nth($pair, 2);
 
@@ -191,7 +220,7 @@ $button-static-border-color: $border !default;
       &[disabled],
       fieldset[disabled] & {
         background-color: $color;
-        border-color: transparent;
+        border-color: $color;
         box-shadow: none;
       }
 
@@ -481,3 +510,21 @@ $button-static-border-color: $border !default;
     }
   }
 }
+
+@each $bp-name, $bp-sizes in $button-responsive-sizes {
+  @include breakpoint($bp-name) {
+    @each $size, $value in $bp-sizes {
+      @if $size != "normal" {
+        .button.is-responsive.is-#{$size} {
+          font-size: $value;
+        }
+      }
+      @else {
+        .button.is-responsive,
+        .button.is-responsive.is-normal {
+          font-size: $value;
+        }
+      }
+    }
+  }
+}

node_modules/bulma-scss/elements/_container.scss

@@ -1,4 +1,7 @@
+@import "../utilities/mixins";
+
 $container-offset: 2 * $gap !default;
+$container-max-width: $fullhd !default;
 
 .container {
   flex-grow: 1;
@@ -7,7 +10,7 @@ $container-offset: 2 * $gap !default;
   width: auto;
 
   &.is-fluid {
-    max-width: none;
+    max-width: none !important;
     padding-left: $gap;
     padding-right: $gap;
     width: 100%;
@@ -19,25 +22,29 @@ $container-offset: 2 * $gap !default;
 
 
   @include until-widescreen {
-    &.is-widescreen {
-      max-width: $widescreen - $container-offset;
+    &.is-widescreen:not(.is-max-desktop) {
+      max-width: min($widescreen, $container-max-width) - $container-offset;
     }
   }
 
 
   @include until-fullhd {
-    &.is-fullhd {
-      max-width: $fullhd - $container-offset;
+    &.is-fullhd:not(.is-max-desktop):not(.is-max-widescreen) {
+      max-width: min($fullhd, $container-max-width) - $container-offset;
     }
   }
 
 
   @include widescreen {
-    max-width: $widescreen - $container-offset;
+    &:not(.is-max-desktop) {
+      max-width: min($widescreen, $container-max-width) - $container-offset;
+    }
   }
 
 
   @include fullhd {
-    max-width: $fullhd - $container-offset;
+    &:not(.is-max-desktop):not(.is-max-widescreen) {
+      max-width: min($fullhd, $container-max-width) - $container-offset;
+    }
   }
 }

node_modules/bulma-scss/elements/_content.scss

@@ -1,7 +1,11 @@
+@import "../utilities/mixins";
+
 $content-heading-color: $text-strong !default;
 $content-heading-weight: $weight-semibold !default;
 $content-heading-line-height: 1.125 !default;
 
+$content-block-margin-bottom: 1em !default;
+
 $content-blockquote-background-color: $background !default;
 $content-blockquote-border-left: 5px solid $border !default;
 $content-blockquote-padding: 1.25em 1.5em !default;
@@ -14,6 +18,7 @@ $content-table-cell-padding: 0.5em 0.75em !default;
 $content-table-cell-heading-color: $text-strong !default;
 $content-table-head-cell-border-width: 0 0 2px !default;
 $content-table-head-cell-color: $text-strong !default;
+$content-table-body-last-row-cell-border-bottom-width: 0 !default;
 $content-table-foot-cell-border-width: 2px 0 0 !default;
 $content-table-foot-cell-color: $text-strong !default;
 
@@ -34,7 +39,7 @@ $content-table-foot-cell-color: $text-strong !default;
   pre,
   table {
     &:not(:last-child) {
-      margin-bottom: 1em;
+      margin-bottom: $content-block-margin-bottom;
     }
   }
 
@@ -224,7 +229,7 @@ $content-table-foot-cell-color: $text-strong !default;
         &:last-child {
           td,
           th {
-            border-bottom-width: 0;
+            border-bottom-width: $content-table-body-last-row-cell-border-bottom-width;
           }
         }
       }
@@ -242,6 +247,10 @@ $content-table-foot-cell-color: $text-strong !default;
     font-size: $size-small;
   }
 
+  &.is-normal {
+    font-size: $size-normal;
+  }
+
   &.is-medium {
     font-size: $size-medium;
   }

node_modules/bulma-scss/elements/_icon.scss

@@ -2,6 +2,7 @@ $icon-dimensions: 1.5rem !default;
 $icon-dimensions-small: 1rem !default;
 $icon-dimensions-medium: 2rem !default;
 $icon-dimensions-large: 3rem !default;
+$icon-text-spacing: 0.25em !default;
 
 .icon {
   align-items: center;
@@ -26,3 +27,43 @@ $icon-dimensions-large: 3rem !default;
     width: $icon-dimensions-large;
   }
 }
+
+.icon-text {
+  align-items: flex-start;
+  color: inherit;
+  display: inline-flex;
+  flex-wrap: wrap;
+  line-height: $icon-dimensions;
+  vertical-align: top;
+
+  .icon {
+    flex-grow: 0;
+    flex-shrink: 0;
+
+    &:not(:last-child) {
+      @include ltr {
+        margin-right: $icon-text-spacing;
+      }
+
+
+      @include rtl {
+        margin-left: $icon-text-spacing;
+      }
+    }
+
+    &:not(:first-child) {
+      @include ltr {
+        margin-left: $icon-text-spacing;
+      }
+
+
+      @include rtl {
+        margin-right: $icon-text-spacing;
+      }
+    }
+  }
+}
+
+div.icon-text {
+  display: flex;
+}

node_modules/bulma-scss/elements/_image.scss

@@ -1,3 +1,5 @@
+@import "../utilities/mixins";
+
 $dimensions: 16 24 32 48 64 96 128 !default;
 
 .image {

node_modules/bulma-scss/elements/_notification.scss

@@ -1,3 +1,5 @@
+@import "../utilities/mixins";
+
 $notification-background-color: $background !default;
 $notification-code-background-color: $scheme-main !default;
 $notification-radius: $radius !default;
@@ -5,6 +7,8 @@ $notification-padding: 1.25rem 2.5rem 1.25rem 1.5rem !default;
 $notification-padding-ltr: 1.25rem 2.5rem 1.25rem 1.5rem !default;
 $notification-padding-rtl: 1.25rem 1.5rem 1.25rem 2.5rem !default;
 
+$notification-colors: $colors !default;
+
 .notification {
   @extend %block;
 
@@ -54,7 +58,7 @@ $notification-padding-rtl: 1.25rem 1.5rem 1.25rem 2.5rem !default;
   }
 
   // Colors
-  @each $name, $pair in $colors {
+  @each $name, $pair in $notification-colors {
     $color: nth($pair, 1);
     $color-invert: nth($pair, 2);
 

node_modules/bulma-scss/elements/_other.scss

@@ -1,3 +1,5 @@
+@import "../utilities/mixins";
+
 .block {
   @extend %block;
 }
@@ -14,20 +16,6 @@
   text-transform: uppercase;
 }
 
-.highlight {
-  @extend %block;
-
-  font-weight: $weight-normal;
-  max-width: 100%;
-  overflow: hidden;
-  padding: 0;
-
-  pre {
-    overflow: auto;
-    max-width: 100%;
-  }
-}
-
 .loader {
   @extend %loader;
 }

node_modules/bulma-scss/elements/_progress.scss

@@ -1,9 +1,13 @@
+@import "../utilities/mixins";
+
 $progress-bar-background-color: $border-light !default;
 $progress-value-background-color: $text !default;
 $progress-border-radius: $radius-rounded !default;
 
 $progress-indeterminate-duration: 1.5s !default;
 
+$progress-colors: $colors !default;
+
 .progress {
   @extend %block;
 
@@ -35,7 +39,7 @@ $progress-indeterminate-duration: 1.5s !default;
   }
 
   // Colors
-  @each $name, $pair in $colors {
+  @each $name, $pair in $progress-colors {
     $color: nth($pair, 1);
 
     &.is-#{$name} {
@@ -75,6 +79,10 @@ $progress-indeterminate-duration: 1.5s !default;
     &::-moz-progress-bar {
       background-color: transparent;
     }
+
+    &::-ms-fill {
+      animation-name: none;
+    }
   }
 
   // Sizes

node_modules/bulma-scss/elements/_table.scss

@@ -1,3 +1,5 @@
+@import "../utilities/mixins";
+
 $table-color: $text-strong !default;
 $table-background-color: $scheme-main !default;
 
@@ -5,6 +7,7 @@ $table-cell-border: 1px solid $border !default;
 $table-cell-border-width: 0 0 1px !default;
 $table-cell-padding: 0.5em 0.75em !default;
 $table-cell-heading-color: $text-strong !default;
+$table-cell-text-align: left !default;
 
 $table-head-cell-border-width: 0 0 2px !default;
 $table-head-cell-color: $text-strong !default;
@@ -23,6 +26,8 @@ $table-row-active-color: $primary-invert !default;
 $table-striped-row-even-background-color: $scheme-main-bis !default;
 $table-striped-row-even-hover-background-color: $scheme-main-ter !default;
 
+$table-colors: $colors !default;
+
 .table {
   @extend %block;
 
@@ -37,7 +42,7 @@ $table-striped-row-even-hover-background-color: $scheme-main-ter !default;
     vertical-align: top;
 
     // Colors
-    @each $name, $pair in $colors {
+    @each $name, $pair in $table-colors {
       $color: nth($pair, 1);
       $color-invert: nth($pair, 2);
 
@@ -73,7 +78,7 @@ $table-striped-row-even-hover-background-color: $scheme-main-ter !default;
     color: $table-cell-heading-color;
 
     &:not([align]) {
-      text-align: inherit;
+      text-align: $table-cell-text-align;
     }
   }
 

node_modules/bulma-scss/elements/_tag.scss

@@ -1,8 +1,12 @@
+@import "../utilities/mixins";
+
 $tag-background-color: $background !default;
 $tag-color: $text !default;
 $tag-radius: $radius !default;
 $tag-delete-margin: 1px !default;
 
+$tag-colors: $colors !default;
+
 .tags {
   align-items: center;
   display: flex;
@@ -115,7 +119,7 @@ $tag-delete-margin: 1px !default;
   }
 
   // Colors
-  @each $name, $pair in $colors {
+  @each $name, $pair in $tag-colors {
     $color: nth($pair, 1);
     $color-invert: nth($pair, 2);
 

node_modules/bulma-scss/elements/_title.scss

@@ -1,3 +1,5 @@
+@import "../utilities/mixins";
+
 $title-color: $text-strong !default;
 $title-family: false !default;
 $title-size: $size-3 !default;
@@ -57,10 +59,6 @@ $subtitle-negative-margin: -1.25rem !default;
     font-weight: $title-strong-weight;
   }
 
-  & + .highlight {
-    margin-top: -0.75rem;
-  }
-
   &:not(.is-spaced) + .subtitle {
     margin-top: $subtitle-negative-margin;
   }

node_modules/bulma-scss/form/_all.scss

@@ -1,3 +1,4 @@
+/* Bulma Form */
 @import "shared";
 @import "input-textarea";
 @import "checkbox-radio";

node_modules/bulma-scss/form/_checkbox-radio.scss

@@ -13,7 +13,8 @@
   }
 
   &[disabled],
-  fieldset[disabled] & {
+  fieldset[disabled] &,
+  input[disabled] {
     color: $input-disabled-color;
     cursor: not-allowed;
   }

node_modules/bulma-scss/form/_file.scss

@@ -11,6 +11,8 @@ $file-name-border-style: solid !default;
 $file-name-border-width: 1px 1px 1px 0 !default;
 $file-name-max-width: 16em !default;
 
+$file-colors: $form-colors !default;
+
 .file {
   @extend %unselectable;
 
@@ -20,7 +22,7 @@ $file-name-max-width: 16em !default;
   position: relative;
 
   // Colors
-  @each $name, $pair in $colors {
+  @each $name, $pair in $file-colors {
     $color: nth($pair, 1);
     $color-invert: nth($pair, 2);
 
@@ -65,6 +67,10 @@ $file-name-max-width: 16em !default;
     font-size: $size-small;
   }
 
+  &.is-normal {
+    font-size: $size-normal;
+  }
+
   &.is-medium {
     font-size: $size-medium;
 

node_modules/bulma-scss/form/_input-textarea.scss

@@ -2,6 +2,8 @@ $textarea-padding: $control-padding-horizontal !default;
 $textarea-max-height: 40em !default;
 $textarea-min-height: 8em !default;
 
+$textarea-colors: $form-colors !default;
+
 %input-textarea {
   @extend %input;
 
@@ -14,7 +16,7 @@ $textarea-min-height: 8em !default;
   }
 
   // Colors
-  @each $name, $pair in $colors {
+  @each $name, $pair in $textarea-colors {
     $color: nth($pair, 1);
 
     &.is-#{$name} {

node_modules/bulma-scss/form/_select.scss

@@ -1,3 +1,5 @@
+$select-colors: $form-colors !default;
+
 .select {
   display: inline-block;
   max-width: 100%;
@@ -68,7 +70,7 @@
   }
 
   // Colors
-  @each $name, $pair in $colors {
+  @each $name, $pair in $select-colors {
     $color: nth($pair, 1);
 
     &.is-#{$name} {
@@ -110,7 +112,8 @@
   // Modifiers
   &.is-disabled {
     &::after {
-      border-color: $input-disabled-color;
+      border-color: $input-disabled-color !important;
+      opacity: 0.5;
     }
   }
 

node_modules/bulma-scss/form/_shared.scss

@@ -1,3 +1,8 @@
+@import "../utilities/controls";
+@import "../utilities/mixins";
+
+$form-colors: $colors !default;
+
 $input-color: $text-strong !default;
 $input-background-color: $scheme-main !default;
 $input-border-color: $border !default;

node_modules/bulma-scss/form/_tools.scss

@@ -3,6 +3,8 @@ $label-weight: $weight-bold !default;
 
 $help-size: $size-small !default;
 
+$label-colors: $form-colors !default;
+
 .label {
   color: $label-color;
   display: block;
@@ -32,7 +34,7 @@ $help-size: $size-small !default;
   font-size: $help-size;
   margin-top: 0.25rem;
 
-  @each $name, $pair in $colors {
+  @each $name, $pair in $label-colors {
     $color: nth($pair, 1);
 
     &.is-#{$name} {

node_modules/bulma-scss/grid/_all.scss

@@ -1,2 +1,3 @@
+/* Bulma Grid */
 @import "columns";
 @import "tiles";

node_modules/bulma-scss/grid/_columns.scss

@@ -1,3 +1,5 @@
+@import "../utilities/mixins";
+
 $column-gap: 0.75rem !default;
 
 .column {
@@ -9,6 +11,7 @@ $column-gap: 0.75rem !default;
 
   .columns.is-mobile > &.is-narrow {
     flex: none;
+    width: unset;
   }
 
   .columns.is-mobile > &.is-full {
@@ -62,55 +65,56 @@ $column-gap: 0.75rem !default;
   }
 
   .columns.is-mobile > &.is-offset-three-quarters {
-    margin-left: 75%;
+    @include ltr-property("margin", 75%, false);
   }
 
   .columns.is-mobile > &.is-offset-two-thirds {
-    margin-left: 66.6666%;
+    @include ltr-property("margin", 66.6666%, false);
   }
 
   .columns.is-mobile > &.is-offset-half {
-    margin-left: 50%;
+    @include ltr-property("margin", 50%, false);
   }
 
   .columns.is-mobile > &.is-offset-one-third {
-    margin-left: 33.3333%;
+    @include ltr-property("margin", 33.3333%, false);
   }
 
   .columns.is-mobile > &.is-offset-one-quarter {
-    margin-left: 25%;
+    @include ltr-property("margin", 25%, false);
   }
 
   .columns.is-mobile > &.is-offset-one-fifth {
-    margin-left: 20%;
+    @include ltr-property("margin", 20%, false);
   }
 
   .columns.is-mobile > &.is-offset-two-fifths {
-    margin-left: 40%;
+    @include ltr-property("margin", 40%, false);
   }
 
   .columns.is-mobile > &.is-offset-three-fifths {
-    margin-left: 60%;
+    @include ltr-property("margin", 60%, false);
   }
 
   .columns.is-mobile > &.is-offset-four-fifths {
-    margin-left: 80%;
+    @include ltr-property("margin", 80%, false);
   }
 
   @for $i from 0 through 12 {
     .columns.is-mobile > &.is-#{$i} {
       flex: none;
-      width: percentage($i / 12);
+      width: percentage(divide($i, 12));
     }
 
     .columns.is-mobile > &.is-offset-#{$i} {
-      margin-left: percentage($i / 12);
+      @include ltr-property("margin", percentage(divide($i, 12)), false);
     }
   }
 
   @include mobile {
     &.is-narrow-mobile {
       flex: none;
+      width: unset;
     }
 
     &.is-full-mobile {
@@ -164,49 +168,49 @@ $column-gap: 0.75rem !default;
     }
 
     &.is-offset-three-quarters-mobile {
-      margin-left: 75%;
+      @include ltr-property("margin", 75%, false);
     }
 
     &.is-offset-two-thirds-mobile {
-      margin-left: 66.6666%;
+      @include ltr-property("margin", 66.6666%, false);
     }
 
     &.is-offset-half-mobile {
-      margin-left: 50%;
+      @include ltr-property("margin", 50%, false);
     }
 
     &.is-offset-one-third-mobile {
-      margin-left: 33.3333%;
+      @include ltr-property("margin", 33.3333%, false);
     }
 
     &.is-offset-one-quarter-mobile {
-      margin-left: 25%;
+      @include ltr-property("margin", 25%, false);
     }
 
     &.is-offset-one-fifth-mobile {
-      margin-left: 20%;
+      @include ltr-property("margin", 20%, false);
     }
 
     &.is-offset-two-fifths-mobile {
-      margin-left: 40%;
+      @include ltr-property("margin", 40%, false);
     }
 
     &.is-offset-three-fifths-mobile {
-      margin-left: 60%;
+      @include ltr-property("margin", 60%, false);
     }
 
     &.is-offset-four-fifths-mobile {
-      margin-left: 80%;
+      @include ltr-property("margin", 80%, false);
     }
 
     @for $i from 0 through 12 {
       &.is-#{$i}-mobile {
         flex: none;
-        width: percentage($i / 12);
+        width: percentage(divide($i, 12));
       }
 
       &.is-offset-#{$i}-mobile {
-        margin-left: percentage($i / 12);
+        @include ltr-property("margin", percentage(divide($i, 12)), false);
       }
     }
   }
@@ -216,6 +220,7 @@ $column-gap: 0.75rem !default;
     &.is-narrow,
     &.is-narrow-tablet {
       flex: none;
+      width: unset;
     }
 
     &.is-full,
@@ -280,59 +285,59 @@ $column-gap: 0.75rem !default;
 
     &.is-offset-three-quarters,
     &.is-offset-three-quarters-tablet {
-      margin-left: 75%;
+      @include ltr-property("margin", 75%, false);
     }
 
     &.is-offset-two-thirds,
     &.is-offset-two-thirds-tablet {
-      margin-left: 66.6666%;
+      @include ltr-property("margin", 66.6666%, false);
     }
 
     &.is-offset-half,
     &.is-offset-half-tablet {
-      margin-left: 50%;
+      @include ltr-property("margin", 50%, false);
     }
 
     &.is-offset-one-third,
     &.is-offset-one-third-tablet {
-      margin-left: 33.3333%;
+      @include ltr-property("margin", 33.3333%, false);
     }
 
     &.is-offset-one-quarter,
     &.is-offset-one-quarter-tablet {
-      margin-left: 25%;
+      @include ltr-property("margin", 25%, false);
     }
 
     &.is-offset-one-fifth,
     &.is-offset-one-fifth-tablet {
-      margin-left: 20%;
+      @include ltr-property("margin", 20%, false);
     }
 
     &.is-offset-two-fifths,
     &.is-offset-two-fifths-tablet {
-      margin-left: 40%;
+      @include ltr-property("margin", 40%, false);
     }
 
     &.is-offset-three-fifths,
     &.is-offset-three-fifths-tablet {
-      margin-left: 60%;
+      @include ltr-property("margin", 60%, false);
     }
 
     &.is-offset-four-fifths,
     &.is-offset-four-fifths-tablet {
-      margin-left: 80%;
+      @include ltr-property("margin", 80%, false);
     }
 
     @for $i from 0 through 12 {
       &.is-#{$i},
       &.is-#{$i}-tablet {
         flex: none;
-        width: percentage($i / 12);
+        width: percentage(divide($i, 12));
       }
 
       &.is-offset-#{$i},
       &.is-offset-#{$i}-tablet {
-        margin-left: percentage($i / 12);
+        @include ltr-property("margin", percentage(divide($i, 12)), false);
       }
     }
   }
@@ -341,6 +346,7 @@ $column-gap: 0.75rem !default;
   @include touch {
     &.is-narrow-touch {
       flex: none;
+      width: unset;
     }
 
     &.is-full-touch {
@@ -394,49 +400,49 @@ $column-gap: 0.75rem !default;
     }
 
     &.is-offset-three-quarters-touch {
-      margin-left: 75%;
+      @include ltr-property("margin", 75%, false);
     }
 
     &.is-offset-two-thirds-touch {
-      margin-left: 66.6666%;
+      @include ltr-property("margin", 66.6666%, false);
     }
 
     &.is-offset-half-touch {
-      margin-left: 50%;
+      @include ltr-property("margin", 50%, false);
     }
 
     &.is-offset-one-third-touch {
-      margin-left: 33.3333%;
+      @include ltr-property("margin", 33.3333%, false);
     }
 
     &.is-offset-one-quarter-touch {
-      margin-left: 25%;
+      @include ltr-property("margin", 25%, false);
     }
 
     &.is-offset-one-fifth-touch {
-      margin-left: 20%;
+      @include ltr-property("margin", 20%, false);
     }
 
     &.is-offset-two-fifths-touch {
-      margin-left: 40%;
+      @include ltr-property("margin", 40%, false);
     }
 
     &.is-offset-three-fifths-touch {
-      margin-left: 60%;
+      @include ltr-property("margin", 60%, false);
     }
 
     &.is-offset-four-fifths-touch {
-      margin-left: 80%;
+      @include ltr-property("margin", 80%, false);
     }
 
     @for $i from 0 through 12 {
       &.is-#{$i}-touch {
         flex: none;
-        width: percentage($i / 12);
+        width: percentage(divide($i, 12));
       }
 
       &.is-offset-#{$i}-touch {
-        margin-left: percentage($i / 12);
+        @include ltr-property("margin", percentage(divide($i, 12)), false);
       }
     }
   }
@@ -445,6 +451,7 @@ $column-gap: 0.75rem !default;
   @include desktop {
     &.is-narrow-desktop {
       flex: none;
+      width: unset;
     }
 
     &.is-full-desktop {
@@ -498,49 +505,49 @@ $column-gap: 0.75rem !default;
     }
 
     &.is-offset-three-quarters-desktop {
-      margin-left: 75%;
+      @include ltr-property("margin", 75%, false);
     }
 
     &.is-offset-two-thirds-desktop {
-      margin-left: 66.6666%;
+      @include ltr-property("margin", 66.6666%, false);
     }
 
     &.is-offset-half-desktop {
-      margin-left: 50%;
+      @include ltr-property("margin", 50%, false);
     }
 
     &.is-offset-one-third-desktop {
-      margin-left: 33.3333%;
+      @include ltr-property("margin", 33.3333%, false);
     }
 
     &.is-offset-one-quarter-desktop {
-      margin-left: 25%;
+      @include ltr-property("margin", 25%, false);
     }
 
     &.is-offset-one-fifth-desktop {
-      margin-left: 20%;
+      @include ltr-property("margin", 20%, false);
     }
 
     &.is-offset-two-fifths-desktop {
-      margin-left: 40%;
+      @include ltr-property("margin", 40%, false);
     }
 
     &.is-offset-three-fifths-desktop {
-      margin-left: 60%;
+      @include ltr-property("margin", 60%, false);
     }
 
     &.is-offset-four-fifths-desktop {
-      margin-left: 80%;
+      @include ltr-property("margin", 80%, false);
     }
 
     @for $i from 0 through 12 {
       &.is-#{$i}-desktop {
         flex: none;
-        width: percentage($i / 12);
+        width: percentage(divide($i, 12));
       }
 
       &.is-offset-#{$i}-desktop {
-        margin-left: percentage($i / 12);
+        @include ltr-property("margin", percentage(divide($i, 12)), false);
       }
     }
   }
@@ -549,6 +556,7 @@ $column-gap: 0.75rem !default;
   @include widescreen {
     &.is-narrow-widescreen {
       flex: none;
+      width: unset;
     }
 
     &.is-full-widescreen {
@@ -602,49 +610,49 @@ $column-gap: 0.75rem !default;
     }
 
     &.is-offset-three-quarters-widescreen {
-      margin-left: 75%;
+      @include ltr-property("margin", 75%, false);
     }
 
     &.is-offset-two-thirds-widescreen {
-      margin-left: 66.6666%;
+      @include ltr-property("margin", 66.6666%, false);
     }
 
     &.is-offset-half-widescreen {
-      margin-left: 50%;
+      @include ltr-property("margin", 50%, false);
     }
 
     &.is-offset-one-third-widescreen {
-      margin-left: 33.3333%;
+      @include ltr-property("margin", 33.3333%, false);
     }
 
     &.is-offset-one-quarter-widescreen {
-      margin-left: 25%;
+      @include ltr-property("margin", 25%, false);
     }
 
     &.is-offset-one-fifth-widescreen {
-      margin-left: 20%;
+      @include ltr-property("margin", 20%, false);
     }
 
     &.is-offset-two-fifths-widescreen {
-      margin-left: 40%;
+      @include ltr-property("margin", 40%, false);
     }
 
     &.is-offset-three-fifths-widescreen {
-      margin-left: 60%;
+      @include ltr-property("margin", 60%, false);
     }
 
     &.is-offset-four-fifths-widescreen {
-      margin-left: 80%;
+      @include ltr-property("margin", 80%, false);
     }
 
     @for $i from 0 through 12 {
       &.is-#{$i}-widescreen {
         flex: none;
-        width: percentage($i / 12);
+        width: percentage(divide($i, 12));
       }
 
       &.is-offset-#{$i}-widescreen {
-        margin-left: percentage($i / 12);
+        @include ltr-property("margin", percentage(divide($i, 12)), false);
       }
     }
   }
@@ -653,6 +661,7 @@ $column-gap: 0.75rem !default;
   @include fullhd {
     &.is-narrow-fullhd {
       flex: none;
+      width: unset;
     }
 
     &.is-full-fullhd {
@@ -706,57 +715,58 @@ $column-gap: 0.75rem !default;
     }
 
     &.is-offset-three-quarters-fullhd {
-      margin-left: 75%;
+      @include ltr-property("margin", 75%, false);
     }
 
     &.is-offset-two-thirds-fullhd {
-      margin-left: 66.6666%;
+      @include ltr-property("margin", 66.6666%, false);
     }
 
     &.is-offset-half-fullhd {
-      margin-left: 50%;
+      @include ltr-property("margin", 50%, false);
     }
 
     &.is-offset-one-third-fullhd {
-      margin-left: 33.3333%;
+      @include ltr-property("margin", 33.3333%, false);
     }
 
     &.is-offset-one-quarter-fullhd {
-      margin-left: 25%;
+      @include ltr-property("margin", 25%, false);
     }
 
     &.is-offset-one-fifth-fullhd {
-      margin-left: 20%;
+      @include ltr-property("margin", 20%, false);
     }
 
     &.is-offset-two-fifths-fullhd {
-      margin-left: 40%;
+      @include ltr-property("margin", 40%, false);
     }
 
     &.is-offset-three-fifths-fullhd {
-      margin-left: 60%;
+      @include ltr-property("margin", 60%, false);
     }
 
     &.is-offset-four-fifths-fullhd {
-      margin-left: 80%;
+      @include ltr-property("margin", 80%, false);
     }
 
     @for $i from 0 through 12 {
       &.is-#{$i}-fullhd {
         flex: none;
-        width: percentage($i / 12);
+        width: percentage(divide($i, 12));
       }
 
       &.is-offset-#{$i}-fullhd {
-        margin-left: percentage($i / 12);
+        @include ltr-property("margin", percentage(divide($i, 12)), false);
       }
     }
   }
 }
 
 .columns {
-  margin-left: -$column-gap;
-  margin-right: -$column-gap;
+  @include ltr-property("margin", -$column-gap, false);
+  @include ltr-property("margin", -$column-gap);
+
   margin-top: -$column-gap;
 
   &:last-child {
@@ -773,8 +783,9 @@ $column-gap: 0.75rem !default;
   }
 
   &.is-gapless {
-    margin-left: 0;
-    margin-right: 0;
+    @include ltr-property("margin", 0, false);
+    @include ltr-property("margin", 0);
+
     margin-top: 0;
 
     & > .column {
@@ -822,10 +833,11 @@ $column-gap: 0.75rem !default;
 @if $variable-columns {
   .columns.is-variable {
     --columnGap: 0.75rem;
-    margin-left: calc(-1 * var(--columnGap));
-    margin-right: calc(-1 * var(--columnGap));
 
-    .column {
+    @include ltr-property("margin", calc(-1 * var(--columnGap)), false);
+    @include ltr-property("margin", calc(-1 * var(--columnGap)));
+
+    > .column {
       padding-left: var(--columnGap);
       padding-right: var(--columnGap);
     }

node_modules/bulma-scss/grid/_tiles.scss

@@ -1,3 +1,5 @@
+@import "../utilities/mixins";
+
 $tile-spacing: 0.75rem !default;
 
 .tile {
@@ -48,7 +50,7 @@ $tile-spacing: 0.75rem !default;
     @for $i from 1 through 12 {
       &.is-#{$i} {
         flex: none;
-        width: $i / 12 * 100%;
+        width: divide($i, 12) * 100%;
       }
     }
   }

node_modules/bulma-scss/helpers/_all.scss

@@ -1,4 +1,6 @@
+/* Bulma Helpers */
 @import "color";
+@import "flexbox";
 @import "float";
 @import "other";
 @import "overflow";

node_modules/bulma-scss/helpers/_color.scss

@@ -1,3 +1,5 @@
+@import "../utilities/derived-variables";
+
 @each $name, $pair in $colors {
   $color: nth($pair, 1);
 

node_modules/bulma-scss/helpers/_flexbox.scss

@@ -0,0 +1,57 @@
+$flex-direction-values: row, row-reverse, column, column-reverse;
+
+@each $value in $flex-direction-values {
+  .is-flex-direction-#{$value} {
+    flex-direction: $value !important;
+  }
+}
+
+$flex-wrap-values: nowrap, wrap, wrap-reverse;
+
+@each $value in $flex-wrap-values {
+  .is-flex-wrap-#{$value} {
+    flex-wrap: $value !important;
+  }
+}
+
+$justify-content-values: flex-start, flex-end, center, space-between, space-around, space-evenly, start, end, left, right;
+
+@each $value in $justify-content-values {
+  .is-justify-content-#{$value} {
+    justify-content: $value !important;
+  }
+}
+
+$align-content-values: flex-start, flex-end, center, space-between, space-around, space-evenly, stretch, start, end, baseline;
+
+@each $value in $align-content-values {
+  .is-align-content-#{$value} {
+    align-content: $value !important;
+  }
+}
+
+$align-items-values: stretch, flex-start, flex-end, center, baseline, start, end, self-start, self-end;
+
+@each $value in $align-items-values {
+  .is-align-items-#{$value} {
+    align-items: $value !important;
+  }
+}
+
+$align-self-values: auto, flex-start, flex-end, center, baseline, stretch;
+
+@each $value in $align-self-values {
+  .is-align-self-#{$value} {
+    align-self: $value !important;
+  }
+}
+
+$flex-operators: grow, shrink;
+
+@each $operator in $flex-operators {
+  @for $i from 0 through 5 {
+    .is-flex-#{$operator}-#{$i} {
+      flex-#{$operator}: $i !important;
+    }
+  }
+}

node_modules/bulma-scss/helpers/_float.scss

@@ -1,3 +1,5 @@
+@import "../utilities/mixins";
+
 .is-clearfix {
   @include clearfix;
 }

node_modules/bulma-scss/helpers/_other.scss

@@ -1,3 +1,5 @@
+@import "../utilities/mixins";
+
 .is-radiusless {
   border-radius: 0 !important;
 }
@@ -6,6 +8,11 @@
   box-shadow: none !important;
 }
 
+.is-clickable {
+  cursor: pointer !important;
+  pointer-events: all !important;
+}
+
 .is-unselectable {
   @extend %unselectable;
 }

node_modules/bulma-scss/helpers/_position.scss

@@ -1,3 +1,5 @@
+@import "../utilities/mixins";
+
 .is-overlay {
   @extend %overlay;
 }

node_modules/bulma-scss/helpers/_spacing.scss

@@ -10,10 +10,15 @@ $spacing-shortcuts: ("margin": "m", "padding": "p") !default;
 $spacing-directions: ("top": "t", "right": "r", "bottom": "b", "left": "l") !default;
 $spacing-horizontal: "x" !default;
 $spacing-vertical: "y" !default;
-$spacing-values: ("0": 0, "1": 0.25rem, "2": 0.5rem, "3": 0.75rem, "4": 1rem, "5": 1.5rem, "6": 3rem) !default;
+$spacing-values: ("0": 0, "1": 0.25rem, "2": 0.5rem, "3": 0.75rem, "4": 1rem, "5": 1.5rem, "6": 3rem, "auto": auto) !default;
 
 @each $property, $shortcut in $spacing-shortcuts {
   @each $name, $value in $spacing-values {
+    // All directions
+    .#{$shortcut}-#{$name} {
+      #{$property}: $value !important;
+    }
+
     // Cardinal directions
     @each $direction, $suffix in $spacing-directions {
       .#{$shortcut}#{$suffix}-#{$name} {

node_modules/bulma-scss/helpers/_typography.scss

@@ -1,3 +1,5 @@
+@import "../utilities/mixins";
+
 @mixin typography-size($target: "") {
   @each $size in $sizes {
     $i: index($sizes, $size);
@@ -128,6 +130,10 @@ $alignments: ("centered": "center", "justified": "justify", "left": "left", "rig
   font-style: italic !important;
 }
 
+.is-underlined {
+  text-decoration: underline !important;
+}
+
 .has-text-weight-light {
   font-weight: $weight-light !important;
 }

node_modules/bulma-scss/helpers/_visibility.scss

@@ -1,3 +1,5 @@
+@import "../utilities/mixins";
+
 $displays: "block" "flex" "inline" "inline-block" "inline-flex";
 
 @each $display in $displays {

node_modules/bulma-scss/layout/_all.scss

@@ -1,3 +1,4 @@
+/* Bulma Layout */
 @import "hero";
 @import "section";
 @import "footer";

node_modules/bulma-scss/layout/_footer.scss

@@ -1,3 +1,5 @@
+@import "../utilities/derived-variables";
+
 $footer-background-color: $scheme-main-bis !default;
 $footer-color: false !default;
 $footer-padding: 3rem 1.5rem 6rem !default;

node_modules/bulma-scss/layout/_hero.scss

@@ -1,7 +1,12 @@
+@import "../utilities/mixins";
+
 $hero-body-padding: 3rem 1.5rem !default;
+$hero-body-padding-tablet: 3rem 3rem !default;
 $hero-body-padding-small: 1.5rem !default;
-$hero-body-padding-medium: 9rem 1.5rem !default;
-$hero-body-padding-large: 18rem 1.5rem !default;
+$hero-body-padding-medium: 9rem 4.5rem !default;
+$hero-body-padding-large: 18rem 6rem !default;
+
+$hero-colors: $colors !default;
 
 // Main container
 .hero {
@@ -21,7 +26,7 @@ $hero-body-padding-large: 18rem 1.5rem !default;
   }
 
   // Colors
-  @each $name, $pair in $colors {
+  @each $name, $pair in $hero-colors {
     $color: nth($pair, 1);
     $color-invert: nth($pair, 2);
 
@@ -79,6 +84,7 @@ $hero-body-padding-large: 18rem 1.5rem !default;
 
         li {
           &.is-active a {
+            color: $color !important;
             opacity: 1;
           }
         }
@@ -232,4 +238,8 @@ $hero-body-padding-large: 18rem 1.5rem !default;
   flex-grow: 1;
   flex-shrink: 0;
   padding: $hero-body-padding;
+
+  @include tablet {
+    padding: $hero-body-padding-tablet;
+  }
 }

node_modules/bulma-scss/layout/_section.scss

@@ -1,12 +1,17 @@
+@import "../utilities/mixins";
+
 $section-padding: 3rem 1.5rem !default;
-$section-padding-medium: 9rem 1.5rem !default;
-$section-padding-large: 18rem 1.5rem !default;
+$section-padding-desktop: 3rem 3rem !default;
+$section-padding-medium: 9rem 4.5rem !default;
+$section-padding-large: 18rem 6rem !default;
 
 .section {
   padding: $section-padding;
 
   // Responsiveness
   @include desktop {
+    padding: $section-padding-desktop;
+
     // Sizes
     &.is-medium {
       padding: $section-padding-medium;

node_modules/bulma-scss/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bulma-scss",
-  "version": "0.9.0-1",
+  "version": "0.9.4",
   "description": "The Bulma CSS Framework files converted to SCSS syntax",
   "main": "bulma.scss",
   "scripts": {

node_modules/bulma-scss/utilities/_all.scss

@@ -1,6 +1,7 @@
+/* Bulma Utilities */
 @import "initial-variables";
 @import "functions";
-@import "derived-variables.scss";
-@import "animations";
+@import "derived-variables";
 @import "mixins";
 @import "controls";
+@import "extends";

node_modules/bulma-scss/utilities/_animations.scss

@@ -1,9 +1 @@
-@keyframes spinAround {
-  from {
-    transform: rotate(0deg);
-  }
-
-  to {
-    transform: rotate(359deg);
-  }
-}
+@warn "The animations.sass file has MOVED. It is now in the /base folder. Please import sass/base/animations instead.";

node_modules/bulma-scss/utilities/_controls.scss

@@ -1,3 +1,5 @@
+@import "derived-variables";
+
 $control-radius: $radius !default;
 $control-radius-small: $radius-small !default;
 
@@ -42,10 +44,6 @@ $control-padding-horizontal: calc(0.75em - #{$control-border-width}) !default;
   }
 }
 
-%control {
-  @include control;
-}
-
 // The controls sizes use mixins so they can be used at different breakpoints
 @mixin control-small {
   border-radius: $control-radius-small;

node_modules/bulma-scss/utilities/_derived-variables.scss

@@ -1,132 +1,114 @@
+@import "initial-variables";
+@import "functions";
+
 $primary: $turquoise !default;
 
-$info   : $cyan !default;
+$info: $cyan !default;
 $success: $green !default;
 $warning: $yellow !default;
-$danger : $red !default;
+$danger: $red !default;
 
-$light  : $white-ter !default;
-$dark   : $grey-darker !default;
+$light: $white-ter !default;
+$dark: $grey-darker !default;
 
 // Invert colors
 
-$orange-invert   : findColorInvert($orange) !default;
-$yellow-invert   : findColorInvert($yellow) !default;
-$green-invert    : findColorInvert($green) !default;
+$orange-invert: findColorInvert($orange) !default;
+$yellow-invert: findColorInvert($yellow) !default;
+$green-invert: findColorInvert($green) !default;
 $turquoise-invert: findColorInvert($turquoise) !default;
-$cyan-invert     : findColorInvert($cyan) !default;
-$blue-invert     : findColorInvert($blue) !default;
-$purple-invert   : findColorInvert($purple) !default;
-$red-invert      : findColorInvert($red) !default;
+$cyan-invert: findColorInvert($cyan) !default;
+$blue-invert: findColorInvert($blue) !default;
+$purple-invert: findColorInvert($purple) !default;
+$red-invert: findColorInvert($red) !default;
 
-$primary-invert  : findColorInvert($primary) !default;
-$primary-light   : findLightColor($primary) !default;
-$primary-dark    : findDarkColor($primary) !default;
-$info-invert     : findColorInvert($info) !default;
-$info-light      : findLightColor($info) !default;
-$info-dark       : findDarkColor($info) !default;
-$success-invert  : findColorInvert($success) !default;
-$success-light   : findLightColor($success) !default;
-$success-dark    : findDarkColor($success) !default;
-$warning-invert  : findColorInvert($warning) !default;
-$warning-light   : findLightColor($warning) !default;
-$warning-dark    : findDarkColor($warning) !default;
-$danger-invert   : findColorInvert($danger) !default;
-$danger-light    : findLightColor($danger) !default;
-$danger-dark     : findDarkColor($danger) !default;
-$light-invert    : findColorInvert($light) !default;
-$dark-invert     : findColorInvert($dark) !default;
+$primary-invert: findColorInvert($primary) !default;
+$primary-light: findLightColor($primary) !default;
+$primary-dark: findDarkColor($primary) !default;
+$info-invert: findColorInvert($info) !default;
+$info-light: findLightColor($info) !default;
+$info-dark: findDarkColor($info) !default;
+$success-invert: findColorInvert($success) !default;
+$success-light: findLightColor($success) !default;
+$success-dark: findDarkColor($success) !default;
+$warning-invert: findColorInvert($warning) !default;
+$warning-light: findLightColor($warning) !default;
+$warning-dark: findDarkColor($warning) !default;
+$danger-invert: findColorInvert($danger) !default;
+$danger-light: findLightColor($danger) !default;
+$danger-dark: findDarkColor($danger) !default;
+$light-invert: findColorInvert($light) !default;
+$dark-invert: findColorInvert($dark) !default;
 
 // General colors
 
-$scheme-main       : $white !default;
-$scheme-main-bis   : $white-bis !default;
-$scheme-main-ter   : $white-ter !default;
-$scheme-invert     : $black !default;
-$scheme-invert-bis : $black-bis !default;
-$scheme-invert-ter : $black-ter !default;
+$scheme-main: $white !default;
+$scheme-main-bis: $white-bis !default;
+$scheme-main-ter: $white-ter !default;
+$scheme-invert: $black !default;
+$scheme-invert-bis: $black-bis !default;
+$scheme-invert-ter: $black-ter !default;
 
-$background        : $white-ter !default;
+$background: $white-ter !default;
 
-$border            : $grey-lighter !default;
-$border-hover      : $grey-light !default;
-$border-light      : $grey-lightest !default;
+$border: $grey-lighter !default;
+$border-hover: $grey-light !default;
+$border-light: $grey-lightest !default;
 $border-light-hover: $grey-light !default;
 
 // Text colors
 
-$text       : $grey-dark !default;
+$text: $grey-dark !default;
 $text-invert: findColorInvert($text) !default;
-$text-light : $grey !default;
+$text-light: $grey !default;
 $text-strong: $grey-darker !default;
 
 // Code colors
 
-$code           : $red !default;
+$code: darken($red, 15%) !default;
 $code-background: $background !default;
 
-$pre            : $text !default;
-$pre-background : $background !default;
+$pre: $text !default;
+$pre-background: $background !default;
 
 // Link colors
 
-$link              : $blue !default;
-$link-invert       : findColorInvert($link) !default;
-$link-light        : findLightColor($link) !default;
-$link-dark         : findDarkColor($link) !default;
-$link-visited      : $purple !default;
+$link: $blue !default;
+$link-invert: findColorInvert($link) !default;
+$link-light: findLightColor($link) !default;
+$link-dark: findDarkColor($link) !default;
+$link-visited: $purple !default;
 
-$link-hover        : $grey-darker !default;
-$link-hover-border : $grey-light !default;
+$link-hover: $grey-darker !default;
+$link-hover-border: $grey-light !default;
 
-$link-focus        : $grey-darker !default;
-$link-focus-border : $blue !default;
+$link-focus: $grey-darker !default;
+$link-focus-border: $blue !default;
 
-$link-active       : $grey-darker !default;
+$link-active: $grey-darker !default;
 $link-active-border: $grey-dark !default;
 
 // Typography
 
-$family-primary  : $family-sans-serif !default;
+$family-primary: $family-sans-serif !default;
 $family-secondary: $family-sans-serif !default;
-$family-code     : $family-monospace !default;
+$family-code: $family-monospace !default;
 
-$size-small : $size-7 !default;
+$size-small: $size-7 !default;
 $size-normal: $size-6 !default;
 $size-medium: $size-5 !default;
-$size-large : $size-4 !default;
+$size-large: $size-4 !default;
+
+// Effects
+
+$shadow: 0 0.5em 1em -0.125em rgba($scheme-invert, 0.1), 0 0px 0 1px rgba($scheme-invert, 0.02) !default;
 
 // Lists and maps
 $custom-colors: null !default;
 $custom-shades: null !default;
 
-$colors: mergeColorMaps(
-(
-  "white"  : ($white, $black),
-  "black"  : ($black, $white),
-  "light"  : ($light, $light-invert),
-  "dark"   : ($dark, $dark-invert),
-  "primary": ($primary, $primary-invert, $primary-light, $primary-dark),
-  "link"   : ($link, $link-invert, $link-light, $link-dark),
-  "info"   : ($info, $info-invert, $info-light, $info-dark),
-  "success": ($success, $success-invert, $success-light, $success-dark),
-  "warning": ($warning, $warning-invert, $warning-light, $warning-dark),
-  "danger" : ($danger, $danger-invert, $danger-light, $danger-dark)),
-  $custom-colors
-) !default;
+$colors: mergeColorMaps(("white": ($white, $black), "black": ($black, $white), "light": ($light, $light-invert), "dark": ($dark, $dark-invert), "primary": ($primary, $primary-invert, $primary-light, $primary-dark), "link": ($link, $link-invert, $link-light, $link-dark), "info": ($info, $info-invert, $info-light, $info-dark), "success": ($success, $success-invert, $success-light, $success-dark), "warning": ($warning, $warning-invert, $warning-light, $warning-dark), "danger": ($danger, $danger-invert, $danger-light, $danger-dark)), $custom-colors) !default;
 
-$shades: mergeColorMaps(
-(
-  "black-bis"   : $black-bis,
-  "black-ter"   : $black-ter,
-  "grey-darker" : $grey-darker,
-  "grey-dark"   : $grey-dark,
-  "grey"        : $grey,
-  "grey-light"  : $grey-light,
-  "grey-lighter": $grey-lighter,
-  "white-ter"   : $white-ter,
-  "white-bis"   : $white-bis),
-  $custom-shades
-) !default;
+$shades: mergeColorMaps(("black-bis": $black-bis, "black-ter": $black-ter, "grey-darker": $grey-darker, "grey-dark": $grey-dark, "grey": $grey, "grey-light": $grey-light, "grey-lighter": $grey-lighter, "white-ter": $white-ter, "white-bis": $white-bis), $custom-shades) !default;
 
 $sizes: $size-1 $size-2 $size-3 $size-4 $size-5 $size-6 $size-7 !default;

node_modules/bulma-scss/utilities/_extends.scss

@@ -0,0 +1,33 @@
+@import "mixins";
+
+%control {
+  @include control;
+}
+
+%unselectable {
+  @include unselectable;
+}
+
+%arrow {
+  @include arrow;
+}
+
+%block {
+  @include block;
+}
+
+%delete {
+  @include delete;
+}
+
+%loader {
+  @include loader;
+}
+
+%overlay {
+  @include overlay;
+}
+
+%reset {
+  @include reset;
+}

node_modules/bulma-scss/utilities/_functions.scss

@@ -74,7 +74,7 @@
   }
   @else if $exp < 0 {
     @for $i from 1 through -$exp {
-      $value: $value / $number;
+      $value: divide($value, $number);
     }
   }
 
@@ -90,13 +90,13 @@
 
   @each $name, $value in $color-rgb {
     $adjusted: 0;
-    $value: $value / 255;
+    $value: divide($value, 255);
 
     @if $value < 0.03928 {
-      $value: $value / 12.92;
+      $value: divide($value, 12.92);
     }
     @else {
-      $value: ($value + 0.055) / 1.055;
+      $value: divide($value + 0.055, 1.055);
       $value: powerNumber($value, 2);
     }
 
@@ -115,7 +115,7 @@
   }
 }
 
-@function findLightColor($color) {
+@function findLightColor($color, $l: 96%) {
   @if type-of($color) == "color" {
     $l: 96%;
 
@@ -129,9 +129,8 @@
   @return $background;
 }
 
-@function findDarkColor($color) {
+@function findDarkColor($color, $base-l: 29%) {
   @if type-of($color) == "color" {
-    $base-l: 29%;
     $luminance: colorLuminance($color);
     $luminance-delta: 0.53 - $luminance;
     $target-l: round($base-l + $luminance-delta * 53);
@@ -165,3 +164,36 @@
 
   @return lighten($color, $amount);
 }
+
+// Custom divide function by @mdo from https://github.com/twbs/bootstrap/pull/34245
+// Replaces old slash division deprecated in Dart Sass
+@function divide($dividend, $divisor, $precision: 10) {
+  $sign: if($dividend > 0 and $divisor > 0, 1, -1);
+  $dividend: abs($dividend);
+  $divisor: abs($divisor);
+  $quotient: 0;
+  $remainder: $dividend;
+
+  @if $dividend == 0 {
+    @return 0;
+  }
+
+  @if $divisor == 0 {
+    @error "Cannot divide by 0";
+  }
+
+  @if $divisor == 1 {
+    @return $dividend;
+  }
+
+  @while $remainder >= $divisor {
+    $quotient: $quotient + 1;
+    $remainder: $remainder - $divisor;
+  }
+
+  @if $remainder > 0 and $precision > 0 {
+    $remainder: divide($remainder * 10, $divisor, $precision - 1) * 0.1;
+  }
+
+  @return ($quotient + $remainder) * $sign;
+}

node_modules/bulma-scss/utilities/_initial-variables.scss

@@ -16,11 +16,11 @@ $white-bis: hsl(0, 0%, 98%) !default;
 $white: hsl(0, 0%, 100%) !default;
 
 $orange: hsl(14, 100%, 53%) !default;
-$yellow: hsl(48, 100%, 67%) !default;
-$green: hsl(141, 53%, 53%) !default;
+$yellow: hsl(44, 100%, 77%) !default;
+$green: hsl(153, 53%, 53%) !default;
 $turquoise: hsl(171, 100%, 41%) !default;
-$cyan: hsl(204, 71%, 53%) !default;
-$blue: hsl(217, 71%, 53%) !default;
+$cyan: hsl(207, 61%, 53%) !default;
+$blue: hsl(229, 53%, 53%) !default;
 $purple: hsl(271, 100%, 71%) !default;
 $red: hsl(348, 86%, 61%) !default;
 
@@ -66,6 +66,7 @@ $widescreen-enabled: true !default;
 // 1344px container + 4rem
 $fullhd: 1344px + 2 * $gap !default;
 $fullhd-enabled: true !default;
+$breakpoints: ("mobile": ("until": $tablet), "tablet": ("from": $tablet), "tablet-only": ("from": $tablet, "until": $desktop), "touch": ("from": $desktop), "desktop": ("from": $desktop), "desktop-only": ("from": $desktop, "until": $widescreen), "until-widescreen": ("until": $widescreen), "widescreen": ("from": $widescreen), "widescreen-only": ("from": $widescreen, "until": $fullhd), "until-fullhd": ("until": $fullhd), "fullhd": ("from": $fullhd)) !default;
 
 // Miscellaneous
 
@@ -73,7 +74,7 @@ $easing: ease-out !default;
 $radius-small: 2px !default;
 $radius: 4px !default;
 $radius-large: 6px !default;
-$radius-rounded: 290486px !default;
+$radius-rounded: 9999px !default;
 $speed: 86ms !default;
 
 // Flags

node_modules/bulma-scss/utilities/_mixins.scss

@@ -1,4 +1,4 @@
-@import "initial-variables";
+@import "derived-variables";
 
 @mixin clearfix {
   &::after {
@@ -12,12 +12,12 @@
   position: absolute;
 
   @if $height != 0 {
-    left: calc(50% - (#{$width} / 2));
-    top: calc(50% - (#{$height} / 2));
+    left: calc(50% - (#{$width} * 0.5));
+    top: calc(50% - (#{$height} * 0.5));
   }
   @else {
-    left: calc(50% - (#{$width} / 2));
-    top: calc(50% - (#{$width} / 2));
+    left: calc(50% - (#{$width} * 0.5));
+    top: calc(50% - (#{$width} * 0.5));
   }
 }
 
@@ -32,6 +32,11 @@
 }
 
 @mixin hamburger($dimensions) {
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  appearance: none;
+  background: none;
+  border: none;
   cursor: pointer;
   display: block;
   height: $dimensions;
@@ -99,6 +104,19 @@
   }
 }
 
+@mixin reset {
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  appearance: none;
+  background: none;
+  border: none;
+  color: currentColor;
+  font-family: inherit;
+  font-size: 1em;
+  margin: 0;
+  padding: 0;
+}
+
 // Responsiveness
 
 @mixin from($device) {
@@ -113,6 +131,12 @@
   }
 }
 
+@mixin between($from, $until) {
+  @media screen and (min-width: $from) and (max-width: $until - 1px) {
+    @content;
+  }
+}
+
 @mixin mobile {
   @media screen and (max-width: $tablet - 1px) {
     @content;
@@ -191,6 +215,31 @@
   }
 }
 
+@mixin breakpoint($name) {
+  $breakpoint: map-get($breakpoints, $name);
+
+  @if $breakpoint {
+    $from: map-get($breakpoint, "from");
+    $until: map-get($breakpoint, "until");
+
+    @if $from and $until {
+      @include between($from, $until) {
+        @content;
+      }
+    }
+    @else if $from {
+      @include from($from) {
+        @content;
+      }
+    }
+    @else if $until {
+      @include until($until) {
+        @content;
+      }
+    }
+  }
+}
+
 @mixin ltr {
   @if not $rtl {
     @content;
@@ -237,10 +286,6 @@
   user-select: none;
 }
 
-%unselectable {
-  @include unselectable;
-}
-
 @mixin arrow($color: transparent) {
   border: 3px solid $color;
   border-radius: 2px;
@@ -258,22 +303,14 @@
   width: 0.625em;
 }
 
-%arrow {
-  @include arrow;
-}
-
 @mixin block($spacing: $block-spacing) {
   &:not(:last-child) {
     margin-bottom: $spacing;
   }
 }
 
-%block {
-  @include block;
-}
-
 @mixin delete {
-  @extend %unselectable;
+  @include unselectable;
 
   -moz-appearance: none;
   -webkit-appearance: none;
@@ -356,10 +393,6 @@
   }
 }
 
-%delete {
-  @include delete;
-}
-
 @mixin loader {
   animation: spinAround 500ms infinite linear;
   border: 2px solid $grey-lighter;
@@ -373,10 +406,6 @@
   width: 1em;
 }
 
-%loader {
-  @include loader;
-}
-
 @mixin overlay($offset: 0) {
   bottom: $offset;
   left: $offset;
@@ -384,7 +413,3 @@
   right: $offset;
   top: $offset;
 }
-
-%overlay {
-  @include overlay;
-}

package-lock.json

@@ -7,7 +7,7 @@
       "dependencies": {
         "@fontsource/raleway": "^4.5.0",
         "@popperjs/core": "^2.4.4",
-        "bulma-scss": "^0.9.0-1",
+        "bulma-scss": "^0.9.4",
         "datatables.net": "^1.11.3",
         "datatables.net-fixedheader": "^3.1.2",
         "datatables.net-responsive": "^2.1.0",
@@ -32,8 +32,9 @@
       }
     },
     "node_modules/bulma-scss": {
-      "version": "0.9.0-1",
-      "license": "MIT"
+      "version": "0.9.4",
+      "resolved": "https://registry.npmjs.org/bulma-scss/-/bulma-scss-0.9.4.tgz",
+      "integrity": "sha512-iMrNFlR6yEMutYEAi1VseAmsadmmWnb8A2DghUR7jZKJLaw6AibmHOkqwlEPjsXkqJ7Pp1z/bEJ6gFMG0WNdJw=="
     },
     "node_modules/datatables.net": {
       "version": "1.11.3",
@@ -114,7 +115,9 @@
       "version": "2.4.4"
     },
     "bulma-scss": {
-      "version": "0.9.0-1"
+      "version": "0.9.4",
+      "resolved": "https://registry.npmjs.org/bulma-scss/-/bulma-scss-0.9.4.tgz",
+      "integrity": "sha512-iMrNFlR6yEMutYEAi1VseAmsadmmWnb8A2DghUR7jZKJLaw6AibmHOkqwlEPjsXkqJ7Pp1z/bEJ6gFMG0WNdJw=="
     },
     "datatables.net": {
       "version": "1.11.3",

package.json

@@ -2,7 +2,7 @@
   "dependencies": {
     "@fontsource/raleway": "^4.5.0",
     "@popperjs/core": "^2.4.4",
-    "bulma-scss": "^0.9.0-1",
+    "bulma-scss": "^0.9.4",
     "datatables.net": "^1.11.3",
     "datatables.net-fixedheader": "^3.1.2",
     "datatables.net-responsive": "^2.1.0",