@openeuropa/bcl-theme-joinup 1.10.10 → 1.11.0

package/bcl-builder.config.js

@@ -1,10 +1,52 @@
+const fs = require("fs");
 const path = require("path");
 const replace = require("@rollup/plugin-replace");
 const iconList = require("@openeuropa/bcl-theme-default/src/icons/icons");
 const templates = require("./src/templates/bcl-templates");
 
+const resolvePackagePath = (packageName, ...segments) => {
+  let packageRoot;
+
+  try {
+    packageRoot = path.dirname(
+      require.resolve(`${packageName}/package.json`, { paths: [__dirname] }),
+    );
+  } catch (error) {
+    if (error.code !== "ERR_PACKAGE_PATH_NOT_EXPORTED") {
+      throw error;
+    }
+
+    let currentPath = fs.realpathSync(
+      require.resolve(packageName, { paths: [__dirname] }),
+    );
+
+    while (!packageRoot) {
+      currentPath = path.dirname(currentPath);
+
+      if (fs.existsSync(path.resolve(currentPath, "package.json"))) {
+        packageRoot = currentPath;
+      }
+    }
+  }
+
+  return path.resolve(packageRoot, ...segments);
+};
+
 const outputFolder = path.resolve(__dirname);
-const nodeModules = "../../../node_modules";
+const repoRoot = path.resolve(__dirname, "../../../");
+const nodeModules = path.resolve(__dirname, "../../../node_modules");
+const bootstrapIconsPath = resolvePackagePath("bootstrap-icons");
+const twigTemplatesPath = resolvePackagePath("@openeuropa/bcl-twig-templates");
+const resourcesFlagIconsPath = resolvePackagePath("@ecl/resources-flag-icons");
+const resourcesEcLogoPath = resolvePackagePath("@ecl/resources-ec-logo");
+const resourcesEuLogoPath = resolvePackagePath("@ecl/resources-eu-logo");
+const slimSelectPath = resolvePackagePath("slim-select");
+const slimSelect2Path = resolvePackagePath("slim-select-2");
+const flagIconsPath = resolvePackagePath("flag-icons");
+const bootstrapReplaceIconsPath = path.resolve(
+  repoRoot,
+  "bootstrap/replace-icons",
+);
 
 // SCSS includePaths
 const includePaths = [nodeModules];
@@ -12,7 +54,7 @@ const excludePaths = [];
 if (templates.length) {
   templates.forEach((template) => {
     excludePaths.push(
-      `${nodeModules}/@openeuropa/bcl-twig-templates/templates/bcl-${template}/*.html.twig`,
+      path.resolve(twigTemplatesPath, `templates/bcl-${template}/*.html.twig`),
     );
   });
 }
@@ -89,7 +131,13 @@ module.exports = {
       options: {
         includePaths,
         sourceMap: "file",
-        silenceDeprecations: ["legacy-js-api", "import", "color-functions"],
+        silenceDeprecations: [
+          "legacy-js-api",
+          "import",
+          "color-functions",
+          "if-function",
+          "global-builtin",
+        ],
       },
     },
     {
@@ -99,13 +147,22 @@ module.exports = {
         includePaths,
         sourceMap: "file",
         minify: true,
-        silenceDeprecations: ["legacy-js-api", "import", "color-functions"],
+        silenceDeprecations: [
+          "legacy-js-api",
+          "import",
+          "color-functions",
+          "if-function",
+          "global-builtin",
+        ],
       },
     },
   ],
   sprite: [
     {
-      entry: path.resolve(nodeModules, "@openeuropa/bcl-bootstrap/icons"),
+      entry: [
+        bootstrapReplaceIconsPath,
+        path.resolve(bootstrapIconsPath, "icons"),
+      ],
       dest: path.resolve(outputFolder, "icons/"),
       options: {
         list: iconList,
@@ -114,56 +171,46 @@ module.exports = {
   ],
   copy: [
     {
-      from: [path.resolve(nodeModules, "slim-select/dist/slimselect.min.js")],
+      from: [path.resolve(slimSelectPath, "dist/slimselect.min.js")],
       to: path.resolve(outputFolder, "js"),
       options: { up: true },
     },
     {
-      from: [path.resolve(nodeModules, "slim-select-2/dist/slimselect.min.js")],
+      from: [path.resolve(slimSelect2Path, "dist/slimselect.min.js")],
       to: path.resolve(outputFolder, "js/slim-select-2"),
       options: { up: true },
     },
     {
-      from: [
-        path.resolve(
-          nodeModules,
-          "@openeuropa/bcl-bootstrap/bootstrap-icons.svg",
-        ),
-      ],
+      from: [path.resolve(bootstrapIconsPath, "bootstrap-icons.svg")],
       to: path.resolve(outputFolder, "icons"),
       options: { up: true },
     },
     {
       from: [
-        path.resolve(
-          nodeModules,
-          "@ecl/resources-flag-icons/dist/sprites/icons-flag.svg",
-        ),
+        path.resolve(resourcesFlagIconsPath, "dist/sprites/icons-flag.svg"),
       ],
       to: path.resolve(outputFolder, "icons"),
       options: { up: true },
     },
     {
-      from: [`${nodeModules}/flag-icons/flags/**/*.svg`],
+      from: [path.resolve(flagIconsPath, "flags/**/*.svg")],
       to: path.resolve(outputFolder, "icons/world-flags"),
       options: { up: 6 },
     },
     {
-      from: [`${nodeModules}/@ecl/resources-ec-logo/**/*.svg`],
+      from: [path.resolve(resourcesEcLogoPath, "**/*.svg")],
       to: path.resolve(outputFolder, "logos/ec"),
       options: { up: 7 },
     },
     {
-      from: [`${nodeModules}/@ecl/resources-eu-logo/**/*.svg`],
+      from: [path.resolve(resourcesEuLogoPath, "**/*.svg")],
       to: path.resolve(outputFolder, "logos/eu"),
       options: { up: 7 },
     },
     {
-      from: [
-        `${nodeModules}/@openeuropa/bcl-twig-templates/templates/**/*.twig`,
-      ],
+      from: [path.resolve(twigTemplatesPath, "templates/**/*.twig")],
       to: path.resolve(outputFolder, "templates"),
-      options: { up: 7, exclude: excludePaths },
+      options: { up: 8, exclude: excludePaths },
     },
     {
       from: ["src/templates/**/*.twig"],

package/css/oe-bcl-joinup.css

@@ -17396,6 +17396,14 @@ svg {
   background: rgb(12.8, 92, 177.6);
 }
 
+.bcl-copyright {
+  color: #212529;
+  padding: 0.25rem 0.5rem;
+  background: #f8f9fa;
+  font-size: 0.875rem;
+  text-align: left;
+}
+
 body {
   overflow-x: hidden;
 }
@@ -17535,6 +17543,7 @@ em.placeholder {
     height: 100%;
   }
   .bcl-header__navbar.navbar:not(:has(.bcl-mega-menu__container.show)) {
+    height: auto;
     overflow: auto;
   }
   .bcl-header__navbar.navbar .navbar-nav {
@@ -20176,6 +20185,9 @@ ul.bcl-mega-menu__items > li > button[aria-expanded=true] {
   -webkit-transform: translateX(-50%);
   transform: translateX(-50%);
 }
+.container .bcl-content-banner.bg-lighter .bcl-copyright {
+  padding: 0.25rem 0;
+}
 
 .bcl-banner__content {
   padding: 2.5rem 2rem;
@@ -20208,6 +20220,14 @@ ul.bcl-mega-menu__items > li > button[aria-expanded=true] {
     overflow: hidden;
     border-radius: 4px;
   }
+  .bcl-banner:has(+ .bcl-copyright) {
+    border-bottom-left-radius: 0;
+    border-bottom-right-radius: 0;
+  }
+  .bcl-banner + .bcl-copyright {
+    border-bottom-left-radius: 4px;
+    border-bottom-right-radius: 4px;
+  }
   .bcl-banner.overlay .bcl-banner__content {
     background: #fff;
     border-bottom: 4px solid var(--bs-primary);
@@ -20896,6 +20916,22 @@ Due to the split circle of progress-left and progress right, we must use the ani
   border-radius: 50%;
 }
 
+.carousel .bcl-copyright {
+  bottom: 0;
+  width: 100%;
+  position: absolute;
+  left: 0;
+}
+.carousel:has(.carousel-item.carousel-item-start .bcl-copyright) .carousel-indicators, .carousel:has(.carousel-item.carousel-item-end .bcl-copyright) .carousel-indicators, .carousel:has(.carousel-item.active .bcl-copyright) .carousel-indicators {
+  bottom: 29px;
+}
+.carousel:has(.carousel-item.carousel-item-start .bcl-copyright) .carousel-caption, .carousel:has(.carousel-item.carousel-item-end .bcl-copyright) .carousel-caption, .carousel:has(.carousel-item.active .bcl-copyright) .carousel-caption {
+  bottom: 29px;
+}
+.carousel:has(.carousel-item.carousel-item-start .bcl-copyright) .carousel-indicators + .carousel-inner .carousel-caption, .carousel:has(.carousel-item.carousel-item-end .bcl-copyright) .carousel-indicators + .carousel-inner .carousel-caption, .carousel:has(.carousel-item.active .bcl-copyright) .carousel-indicators + .carousel-inner .carousel-caption {
+  bottom: 79px;
+}
+
 @media (min-width: 768px) {
   .carousel-indicators + .carousel-inner .carousel-caption {
     bottom: 50px;