@openeuropa/bcl-theme-default 0.16.0 → 0.17.0

package/css/oe-bcl-default.css

@@ -5487,6 +5487,69 @@ textarea.form-control-lg {
   border-bottom-right-radius: 0.2rem;
 }
 
+.placeholder {
+  display: inline-block;
+  min-height: 1em;
+  vertical-align: middle;
+  cursor: wait;
+  background-color: currentColor;
+  opacity: 0.5;
+}
+.placeholder.btn::before {
+  display: inline-block;
+  content: "";
+}
+
+.placeholder-xs {
+  min-height: 0.6em;
+}
+
+.placeholder-sm {
+  min-height: 0.8em;
+}
+
+.placeholder-lg {
+  min-height: 1.2em;
+}
+
+.placeholder-glow .placeholder {
+  -webkit-animation: placeholder-glow 2s ease-in-out infinite;
+          animation: placeholder-glow 2s ease-in-out infinite;
+}
+
+@-webkit-keyframes placeholder-glow {
+  50% {
+    opacity: 0.2;
+  }
+}
+
+@keyframes placeholder-glow {
+  50% {
+    opacity: 0.2;
+  }
+}
+.placeholder-wave {
+  -webkit-mask-image: linear-gradient(130deg, #000 55%, rgba(0, 0, 0, 0.8) 75%, #000 95%);
+          mask-image: linear-gradient(130deg, #000 55%, rgba(0, 0, 0, 0.8) 75%, #000 95%);
+  -webkit-mask-size: 200% 100%;
+          mask-size: 200% 100%;
+  -webkit-animation: placeholder-wave 2s linear infinite;
+          animation: placeholder-wave 2s linear infinite;
+}
+
+@-webkit-keyframes placeholder-wave {
+  100% {
+    -webkit-mask-position: -200% 0%;
+            mask-position: -200% 0%;
+  }
+}
+
+@keyframes placeholder-wave {
+  100% {
+    -webkit-mask-position: -200% 0%;
+            mask-position: -200% 0%;
+  }
+}
 .badge {
   display: inline-block;
   padding: 0.35em 0.65em;
@@ -15587,6 +15650,7 @@ body {
   font-weight: 300;
   color: #fff;
   vertical-align: middle;
+  max-width: 80%;
 }
 
 .bcl-header .navbar-toggler {
@@ -15632,6 +15696,19 @@ body {
     -ms-flex-pack: right;
         justify-content: right;
   }
+
+  .bcl-header__navbar .navbar-collapse {
+    max-width: 100%;
+  }
+  .bcl-header__navbar .navbar-collapse .nav-item.dropdown {
+    max-width: 100%;
+  }
+  .bcl-header__navbar .navbar-collapse .nav-item.dropdown a {
+    white-space: normal;
+  }
+  .bcl-header__navbar .navbar-collapse .nav-item.dropdown .dropdown-menu {
+    max-width: 100%;
+  }
 }
 @media (min-width: 992px) {
   .bcl-header__project.light,