io-sanita-theme 2.6.0 → 2.7.0

package/CHANGELOG.md

@@ -1,5 +1,15 @@
 # Changelog
 
+## [2.7.0](https://github.com/RedTurtle/io-sanita-theme/compare/2.6.0...2.7.0) (2025-03-12)
+
+### Features
+
+* Subsites styles ([#72](https://github.com/RedTurtle/io-sanita-theme/issues/72)) ([813af14](https://github.com/RedTurtle/io-sanita-theme/commit/813af14ea6e8ea1a46b96ddf8c61c925147d6088))
+
+### Maintenance
+
+* locales ([f8e4092](https://github.com/RedTurtle/io-sanita-theme/commit/f8e4092efe0edef933fe3a8c785b994a5047670b))
+
 ## [2.6.0](https://github.com/RedTurtle/io-sanita-theme/compare/2.5.3...2.6.0) (2025-03-11)
 
 ### Features

package/RELEASE.md

@@ -41,7 +41,7 @@
 - ...
  -->
 
-## Versione x.x.x (x/x/x)
+## Versione 2.6.0 (11/03/2025)
 
 ### Novità
 

package/locales/de/LC_MESSAGES/volto.po

@@ -1493,6 +1493,11 @@ msgstr ""
 msgid "documento_servizio_riferimento"
 msgstr ""
 
+#. Default: "Fatto"
+#: components/manage/Widgets/SubsiteSocialLinksWidget/SubsiteSocialLinksWidget
+msgid "done_edit_social_links"
+msgstr ""
+
 #. Default: "Navigazione elementi slider"
 #: components/Blocks/Listing/Carousel/CarouselTemplate
 msgid "dots"
@@ -1513,6 +1518,11 @@ msgstr ""
 msgid "dropdownmenu-close-menu-button"
 msgstr ""
 
+#. Default: "Modifica i social"
+#: components/manage/Widgets/SubsiteSocialLinksWidget/SubsiteSocialLinksWidget
+msgid "edit_social_links"
+msgstr ""
+
 #. Default: "Email"
 #: components/View/PuntoDiContatto/PuntoDiContattoContatti
 msgid "email"

package/locales/en/LC_MESSAGES/volto.po

@@ -1488,6 +1488,11 @@ msgstr "Responsabile"
 msgid "documento_servizio_riferimento"
 msgstr "Referral service"
 
+#. Default: "Fatto"
+#: components/manage/Widgets/SubsiteSocialLinksWidget/SubsiteSocialLinksWidget
+msgid "done_edit_social_links"
+msgstr ""
+
 #. Default: "Navigazione elementi slider"
 #: components/Blocks/Listing/Carousel/CarouselTemplate
 msgid "dots"
@@ -1508,6 +1513,11 @@ msgstr "Open menu"
 msgid "dropdownmenu-close-menu-button"
 msgstr "Close menu"
 
+#. Default: "Modifica i social"
+#: components/manage/Widgets/SubsiteSocialLinksWidget/SubsiteSocialLinksWidget
+msgid "edit_social_links"
+msgstr ""
+
 #. Default: "Email"
 #: components/View/PuntoDiContatto/PuntoDiContattoContatti
 msgid "email"

package/locales/es/LC_MESSAGES/volto.po

@@ -1495,6 +1495,11 @@ msgstr ""
 msgid "documento_servizio_riferimento"
 msgstr ""
 
+#. Default: "Fatto"
+#: components/manage/Widgets/SubsiteSocialLinksWidget/SubsiteSocialLinksWidget
+msgid "done_edit_social_links"
+msgstr ""
+
 #. Default: "Navigazione elementi slider"
 #: components/Blocks/Listing/Carousel/CarouselTemplate
 msgid "dots"
@@ -1515,6 +1520,11 @@ msgstr ""
 msgid "dropdownmenu-close-menu-button"
 msgstr "Cerrar menú"
 
+#. Default: "Modifica i social"
+#: components/manage/Widgets/SubsiteSocialLinksWidget/SubsiteSocialLinksWidget
+msgid "edit_social_links"
+msgstr ""
+
 #. Default: "Email"
 #: components/View/PuntoDiContatto/PuntoDiContattoContatti
 msgid "email"

package/locales/fr/LC_MESSAGES/volto.po

@@ -1495,6 +1495,11 @@ msgstr ""
 msgid "documento_servizio_riferimento"
 msgstr ""
 
+#. Default: "Fatto"
+#: components/manage/Widgets/SubsiteSocialLinksWidget/SubsiteSocialLinksWidget
+msgid "done_edit_social_links"
+msgstr ""
+
 #. Default: "Navigazione elementi slider"
 #: components/Blocks/Listing/Carousel/CarouselTemplate
 msgid "dots"
@@ -1515,6 +1520,11 @@ msgstr ""
 msgid "dropdownmenu-close-menu-button"
 msgstr "Fermer le menu"
 
+#. Default: "Modifica i social"
+#: components/manage/Widgets/SubsiteSocialLinksWidget/SubsiteSocialLinksWidget
+msgid "edit_social_links"
+msgstr ""
+
 #. Default: "Email"
 #: components/View/PuntoDiContatto/PuntoDiContattoContatti
 msgid "email"

package/locales/it/LC_MESSAGES/volto.po

@@ -1488,6 +1488,11 @@ msgstr ""
 msgid "documento_servizio_riferimento"
 msgstr ""
 
+#. Default: "Fatto"
+#: components/manage/Widgets/SubsiteSocialLinksWidget/SubsiteSocialLinksWidget
+msgid "done_edit_social_links"
+msgstr ""
+
 #. Default: "Navigazione elementi slider"
 #: components/Blocks/Listing/Carousel/CarouselTemplate
 msgid "dots"
@@ -1508,6 +1513,11 @@ msgstr ""
 msgid "dropdownmenu-close-menu-button"
 msgstr "Chiudi il menu"
 
+#. Default: "Modifica i social"
+#: components/manage/Widgets/SubsiteSocialLinksWidget/SubsiteSocialLinksWidget
+msgid "edit_social_links"
+msgstr ""
+
 #. Default: "Email"
 #: components/View/PuntoDiContatto/PuntoDiContattoContatti
 msgid "email"

package/locales/volto.pot

@@ -1,7 +1,7 @@
 msgid ""
 msgstr ""
 "Project-Id-Version: Plone\n"
-"POT-Creation-Date: 2025-03-04T14:56:52.091Z\n"
+"POT-Creation-Date: 2025-03-12T11:53:17.365Z\n"
 "Last-Translator: Plone i18n <plone-i18n@lists.sourceforge.net>\n"
 "Language-Team: Plone i18n <plone-i18n@lists.sourceforge.net>\n"
 "Content-Type: text/plain; charset=utf-8\n"
@@ -1490,6 +1490,11 @@ msgstr ""
 msgid "documento_servizio_riferimento"
 msgstr ""
 
+#. Default: "Fatto"
+#: components/manage/Widgets/SubsiteSocialLinksWidget/SubsiteSocialLinksWidget
+msgid "done_edit_social_links"
+msgstr ""
+
 #. Default: "Navigazione elementi slider"
 #: components/Blocks/Listing/Carousel/CarouselTemplate
 msgid "dots"
@@ -1510,6 +1515,11 @@ msgstr ""
 msgid "dropdownmenu-close-menu-button"
 msgstr ""
 
+#. Default: "Modifica i social"
+#: components/manage/Widgets/SubsiteSocialLinksWidget/SubsiteSocialLinksWidget
+msgid "edit_social_links"
+msgstr ""
+
 #. Default: "Email"
 #: components/View/PuntoDiContatto/PuntoDiContattoContatti
 msgid "email"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "io-sanita-theme",
-  "version": "2.6.0",
+  "version": "2.7.0",
   "description": "io-sanita-theme: Volto add-on",
   "main": "src/index.js",
   "license": "MIT",

package/src/components/Blocks/Accordion/accordion.scss

@@ -89,7 +89,7 @@ $accordion-icon-color: #7fb2e5;
               button {
                 display: flex;
                 align-items: center;
-                color: var(--bs-primary);
+                color: var(--bs-link-color);
                 font-size: 1.2rem;
                 font-weight: bold;
                 text-align: left;
@@ -108,7 +108,7 @@ $accordion-icon-color: #7fb2e5;
               align-items: center;
 
               .title {
-                color: var(--bs-primary);
+                color: var(--bs-link-color);
               }
 
               button {

package/src/components/Blocks/Alert/alert.scss

@@ -15,7 +15,7 @@
   h5,
   h6,
   a {
-    color: $alert-danger-text;
+    color: $alert-danger-text !important;
   }
 }
 
@@ -23,7 +23,7 @@
   &,
   .cms-ui &.ui.button,
   .cms-ui &.ui.button.active {
-    background-color: $alert-warning;
+    background-color: $alert-warning !important;
   }
   &,
   h1,
@@ -33,7 +33,7 @@
   h5,
   h6,
   a {
-    color: $alert-warning-text;
+    color: $alert-warning-text !important;
   }
 }
 
@@ -51,7 +51,7 @@
   h5,
   h6,
   a {
-    color: $alert-info-text;
+    color: $alert-info-text !important;
   }
 }
 

package/src/components/Blocks/Icons/icons.scss

@@ -64,12 +64,12 @@
     &.bg-primary-lightest:after {
       background-color: rgb(
         from var(--primary-lightest) r g b / 85%
-      ); //rgba( var(--bs-primary), 0.85  ); // serve per fare la trasparenza sull'immagine di sfondo.
+      ); // serve per fare la trasparenza sull'immagine di sfondo.
     }
     &.bg-primary-dark:after {
       background-color: rgb(
         from var(--primary-dark) r g b / 85%
-      ); //  background-color: rgba($secondary, 0.85);; // serve per fare la trasparenza sull'immagine di sfondo.
+      ); // serve per fare la trasparenza sull'immagine di sfondo.
     }
     &.transparent:after {
       background-color: none;

package/src/components/Blocks/SearchBandi/Body.jsx

@@ -10,7 +10,7 @@ import { flattenToAppURL } from '@plone/volto/helpers/Url/Url';
 import { BandiTemplate } from 'io-sanita-theme/components/Blocks';
 import { Pagination } from 'io-sanita-theme/components';
 import { resetQuerystringResults } from 'io-sanita-theme/actions';
-import { scrollIntoView } from 'io-sanita-theme/helpers';
+import { scrollIntoView, useHomePath } from 'io-sanita-theme/helpers';
 
 const messages = defineMessages({
   find: {
@@ -30,6 +30,7 @@ const messages = defineMessages({
 const Body = ({ data, id, inEditMode, path, onChangeBlock, blocksConfig }) => {
   const intl = useIntl();
   const b_size = 6;
+  const homepath = useHomePath();
 
   moment.locale(intl.locale);
 
@@ -128,7 +129,8 @@ const Body = ({ data, id, inEditMode, path, onChangeBlock, blocksConfig }) => {
     return newState;
   };
 
-  const pathSearch = data?.location?.length > 0 ? data.location[0]['@id'] : '/';
+  const pathSearch =
+    data?.location?.length > 0 ? data.location[0]['@id'] : homepath;
   const FiltersConfigFN = blocksConfig['searchBandi'].filtersConfig;
   const filtersConfig = FiltersConfigFN
     ? FiltersConfigFN(null, pathSearch)

package/src/components/BrandWrapper/BrandWrapper.jsx

@@ -4,7 +4,7 @@ import { useSelector } from 'react-redux';
 import { useIntl, defineMessages } from 'react-intl';
 import { flattenToAppURL } from '@plone/volto/helpers/Url/Url';
 import UniversalLink from '@plone/volto/components/manage/UniversalLink/UniversalLink';
-import { getSiteProperty } from 'io-sanita-theme/helpers';
+import { getSiteProperty, useHomePath } from 'io-sanita-theme/helpers';
 import { Logo, BrandText } from 'io-sanita-theme/components';
 
 const messages = defineMessages({
@@ -20,7 +20,7 @@ const messages = defineMessages({
 
 const BrandWrapper = ({ mobile = false, setCollapseOpen }) => {
   const subsite = useSelector((state) => state.subsite?.data);
-
+  const homepath = useHomePath();
   const intl = useIntl();
 
   let wrapperAttrs = {};
@@ -34,7 +34,7 @@ const BrandWrapper = ({ mobile = false, setCollapseOpen }) => {
   return (
     <div className="it-brand-wrapper" {...wrapperAttrs}>
       <UniversalLink
-        href={subsite?.['@id'] ? flattenToAppURL(subsite['@id']) : '/'}
+        href={subsite?.['@id'] ? flattenToAppURL(subsite['@id']) : homepath}
         title={intl.formatMessage(messages.homepage)}
         {...linkAttrs}
       >

package/src/components/Breadcrumbs/Breadcrumbs.jsx

@@ -20,6 +20,7 @@ import UniversalLink from '@plone/volto/components/manage/UniversalLink/Universa
 import { Row, Col, BreadcrumbItem } from 'design-react-kit';
 import GoogleBreadcrumbs from 'io-sanita-theme/components/Breadcrumbs/GoogleBreadcrumbs';
 import config from '@plone/volto/registry';
+import { useHomePath } from 'io-sanita-theme/helpers';
 
 const messages = defineMessages({
   home: {
@@ -36,6 +37,7 @@ const Breadcrumbs = ({ pathname, match }) => {
   const intl = useIntl();
   const dispatch = useDispatch();
   const location = useLocation();
+  const homepath = useHomePath();
 
   let items =
     useSelector((state) => {
@@ -142,7 +144,7 @@ const Breadcrumbs = ({ pathname, match }) => {
           >
             <ol className="breadcrumb" data-element="breadcrumb">
               <BreadcrumbItem tag="li">
-                <UniversalLink href="/">
+                <UniversalLink href={homepath}>
                   {intl.formatMessage(messages.home)}
                 </UniversalLink>
                 <span className="separator">/</span>

package/src/components/Search/Search.jsx

@@ -20,6 +20,7 @@ import {
 
 import Helmet from '@plone/volto/helpers/Helmet/Helmet';
 import { flattenToAppURL } from '@plone/volto/helpers/Url/Url';
+import { resetSubsite } from 'volto-subsites';
 import { getSearchFilters, getSearchResults } from 'io-sanita-theme/actions';
 import {
   SearchBar,

package/src/components/Widgets/SearchCheckbox/SearchCheckbox.jsx

@@ -148,7 +148,7 @@ const SearchCheckbox = ({
         {/* NUMBER OF CHECKBOX SELECTED */}
         {showActiveOptions && (
           <span
-            className={cx('badge bg-secondary ms-3', {
+            className={cx('badge bg-primary ms-3', {
               'visually-hidden': activeOptions === 0,
             })}
             aria-live="polite"

package/src/components/index.js

@@ -50,7 +50,7 @@ export FooterInfos from 'io-sanita-theme/components/layout/Footer/FooterInfos';
 export FooterNewsletterSubscribe from 'io-sanita-theme/components/layout/Footer/FooterInfos';
 export FooterSocials from 'io-sanita-theme/components/layout/Footer/FooterSocials';
 export FooterSmall from 'io-sanita-theme/components/layout/Footer/FooterSmall';
-export SubsiteFooter from 'io-sanita-theme/components/layout/Footer/SubsiteFooter';
+export SubsiteFooter from 'io-sanita-theme/components/layout/Footer/SubsiteFooter/SubsiteFooter';
 
 //Menu
 export CollapseNavigation from 'io-sanita-theme/components/layout/Navigation/CollapseNavigation';

package/src/components/layout/Footer/FooterInfos.jsx

@@ -19,7 +19,7 @@ import {
   FooterNewsletterSubscribe,
   FooterSocials,
 } from 'io-sanita-theme/components';
-import { richTextHasContent } from 'io-sanita-theme/helpers';
+import { richTextHasContent, useHomePath } from 'io-sanita-theme/helpers';
 
 import { fromHtml } from 'volto-slate-italia/config/Slate/utils';
 
@@ -35,6 +35,7 @@ const FooterInfos = () => {
   const N_COLUMNS = 3;
   const location = useLocation();
   const dispatch = useDispatch();
+  const homepath = useHomePath();
 
   const req = useSelector((state) => state.editableFooterColumns);
   const footerConfiguration = useSelector(
@@ -50,7 +51,7 @@ const FooterInfos = () => {
   //filter rootpaths
   let footerColumns = getItemsByPath(
     footerConfiguration,
-    location?.pathname?.length ? location.pathname : '/',
+    location?.pathname?.length ? location.pathname : homepath,
   ).filter((c) => c.visible);
 
   footerColumns.forEach((column) => {

package/src/components/layout/Footer/FooterMain.jsx

@@ -13,6 +13,7 @@ import {
   LogoFooter,
   BrandTextFooter,
 } from 'io-sanita-theme/components/';
+import { useHomePath } from 'io-sanita-theme/helpers';
 
 import { FooterTop } from 'volto-editablefooter';
 
@@ -24,6 +25,7 @@ import { FooterTop } from 'volto-editablefooter';
 const FooterMain = () => {
   const footerTopContent = FooterTop();
   const footerNavigation = FooterNavigation();
+  const homepath = useHomePath();
   return (
     <div className="it-footer-main">
       <Container tag="div">
@@ -32,7 +34,7 @@ const FooterMain = () => {
             <Col sm={12} tag="div" widths={['xs', 'sm', 'md', 'lg', 'xl']}>
               <div className="it-brand-wrapper">
                 {footerTopContent ?? (
-                  <UniversalLink href="/">
+                  <UniversalLink href={homepath}>
                     <LogoFooter />
                     <BrandTextFooter />
                   </UniversalLink>

package/src/components/layout/Footer/FooterSmall.jsx

@@ -15,7 +15,7 @@ import { displayBanner } from 'volto-gdpr-privacy';
 
 import UniversalLink from '@plone/volto/components/manage/UniversalLink/UniversalLink';
 import { flattenToAppURL } from '@plone/volto/helpers/Url/Url';
-import { getSiteProperty } from 'io-sanita-theme/helpers';
+import { getSiteProperty, useHomePath } from 'io-sanita-theme/helpers';
 
 const messages = defineMessages({
   goToPage: {
@@ -37,7 +37,7 @@ const FooterSmall = () => {
   const intl = useIntl();
   const pathname = useLocation().pathname;
   const dispatch = useDispatch();
-
+  const homepath = useHomePath();
   const subFooter = useSelector((state) => state.subFooter?.result);
   const subFooterItems = getItemsByPath(subFooter, pathname)?.filter(
     (item) => item.visible,
@@ -56,7 +56,9 @@ const FooterSmall = () => {
           {subFooterItems?.length > 0 &&
             subFooterItems.map((item, index) => {
               let url =
-                item.href || flattenToAppURL(item.linkUrl?.[0]?.['@id']) || '/';
+                item.href ||
+                flattenToAppURL(item.linkUrl?.[0]?.['@id']) ||
+                homepath;
               return (
                 <li
                   className={cx('list-inline-item', {

package/src/components/layout/Footer/{SubsiteFooter.jsx → SubsiteFooter/SubsiteFooter.jsx}

@@ -9,6 +9,7 @@ import { useLocation } from 'react-router-dom';
 import { isCmsUi } from '@plone/volto/helpers/Url/Url';
 import { flattenHTMLToAppURL } from '@plone/volto/helpers/Url/Url';
 import { richTextHasContent } from 'io-sanita-theme/helpers';
+import './subsite-footer.scss';
 
 const SubsiteFooter = () => {
   const location = useLocation();

package/src/components/layout/Footer/SubsiteFooter/subsite-footer.scss

@@ -0,0 +1,23 @@
+@import 'io-sanita-theme/theme/bootstrap-italia-base-config';
+
+.subsite-footer {
+  //default bg color as main site
+  padding: 2rem 0;
+  background-color: $footer-top-background;
+  color: $white;
+  border-bottom: var(--is-footer-borders); // $footer-borders;
+
+  &,
+  p,
+  ul {
+    font-size: $footer-font-size;
+  }
+
+  a {
+    color: $white;
+
+    &:hover:not(.disabled) {
+      text-decoration: underline;
+    }
+  }
+}

package/src/components/layout/Header/HeaderSlim/HeaderSlim.jsx

@@ -13,7 +13,7 @@ import {
   HeaderRightZone,
 } from 'design-react-kit';
 import { useIntl, defineMessages } from 'react-intl';
-import { getSiteProperty } from 'io-sanita-theme/helpers';
+import { getSiteProperty, useHomePath } from 'io-sanita-theme/helpers';
 import { SiteProperty } from 'volto-site-settings';
 
 const messages = defineMessages({
@@ -25,9 +25,10 @@ const messages = defineMessages({
 const HeaderSlim = () => {
   const subsite = useSelector((state) => state.subsite?.data);
   const intl = useIntl();
+  const homepath = useHomePath();
 
   const parentSiteURL = subsite
-    ? '/'
+    ? homepath
     : getSiteProperty('parentSiteURL', intl.locale);
 
   const staticParentSiteTitle = getSiteProperty('parentSiteTitle', intl.locale);

package/src/components/layout/Header/HeaderSlim/ParentSiteMenu.jsx

@@ -8,7 +8,7 @@ import { useSelector } from 'react-redux';
 import { Link } from 'react-router-dom';
 import { flattenToAppURL } from '@plone/volto/helpers/Url/Url';
 import { Nav, NavItem, NavLink } from 'design-react-kit';
-
+import { useHomePath } from 'io-sanita-theme/helpers';
 import { defineMessages, useIntl } from 'react-intl';
 
 const messages = defineMessages({
@@ -24,6 +24,7 @@ const ParentSiteMenu = () => {
     (state) => state.dropdownMenuNavItems?.result,
   );
   const subsite = useSelector((state) => state.subsite?.data);
+  const homepath = useHomePath();
 
   let menu = null;
   if (subsite) {
@@ -33,7 +34,7 @@ const ParentSiteMenu = () => {
     let i = url_split.length - 1;
     while (i > 0) {
       let s = url_split.slice(0, i).join('/');
-      s = s.length === 0 ? '/' : s;
+      s = s.length === 0 ? homepath : s;
       // eslint-disable-next-line no-loop-func
       dropdownMenu.forEach((m) => {
         if (m.rootPath === s) {

package/src/components/manage/Widgets/SubsiteSocialLinksWidget/SubsiteSocialLinksWidget.jsx

@@ -0,0 +1,71 @@
+import React, { useState } from 'react';
+import { defineMessages, useIntl } from 'react-intl';
+import { Button, Modal, List } from 'semantic-ui-react';
+
+import { FormFieldWrapper } from '@plone/volto/components';
+import { Icon } from 'io-sanita-theme/components';
+import { SocialLinksWidget } from 'volto-social-settings';
+
+const messages = defineMessages({
+  edit_social_links: {
+    id: 'edit_social_links',
+    defaultMessage: 'Modifica i social',
+  },
+  done: {
+    id: 'done_edit_social_links',
+    defaultMessage: 'Fatto',
+  },
+});
+const SubsiteSocialLinksWidget = (props) => {
+  const intl = useIntl();
+  const [open, setOpen] = useState(false);
+
+  const value = props.value?.length > 0 ? JSON.parse(props.value) : [];
+  return (
+    <FormFieldWrapper {...props} className="subsite-social-links-widget">
+      {props.value?.length > 0 && (
+        <List horizontal className="social-list">
+          {value?.map((social, idx) =>
+            social.url ? (
+              <List.Item key={idx}>
+                <a
+                  title={social.title}
+                  href={social.url}
+                  target="_blank"
+                  rel="noopener noreferrer"
+                >
+                  <Icon icon={social.icon} padding={false} size="sm" />
+                </a>
+              </List.Item>
+            ) : null,
+          )}
+        </List>
+      )}
+
+      <Button
+        size="tiny"
+        onClick={(e) => {
+          e.preventDefault();
+          setOpen(true);
+        }}
+      >
+        {intl.formatMessage(messages.edit_social_links)}
+      </Button>
+      <Modal onClose={() => setOpen(false)} open={open} closeIcon>
+        <Modal.Header>
+          {intl.formatMessage(messages.edit_social_links)}
+        </Modal.Header>
+        <Modal.Content scrolling>
+          <SocialLinksWidget {...props} description={null} />
+        </Modal.Content>
+        <Modal.Actions>
+          <Button icon onClick={() => setOpen(false)} primary>
+            {intl.formatMessage(messages.done)}
+          </Button>
+        </Modal.Actions>
+      </Modal>
+    </FormFieldWrapper>
+  );
+};
+
+export default SubsiteSocialLinksWidget;

package/src/config/loadables.js

@@ -1,8 +1,9 @@
 import loadable from '@loadable/component';
-
+import { loadables as subsitesLoadables } from './subsites';
 
 export const loadables = {
   reactSlick: loadable.lib(() => import('react-slick')),
   //rrule: loadable.lib(() => import('rrule')),
   //htmlDiffLib: loadable.lib(() => import('htmldiff-js')),
+  ...subsitesLoadables,
 };

package/src/config/subsites/index.js

@@ -0,0 +1,28 @@
+import loadable from '@loadable/component';
+
+export const loadables = {
+  'subsite-light-blue': loadable.lib(() =>
+    import('io-sanita-theme/config/subsites/light-blue'),
+  ),
+  'subsite-light-pink': loadable.lib(() =>
+    import('io-sanita-theme/config/subsites/light-pink'),
+  ),
+  'subsite-light-teal': loadable.lib(() =>
+    import('io-sanita-theme/config/subsites/light-teal'),
+  ),
+  'subsite-light-yellow': loadable.lib(() =>
+    import('io-sanita-theme/config/subsites/light-yellow'),
+  ),
+  'subsite-magenta': loadable.lib(() =>
+    import('io-sanita-theme/config/subsites/magenta'),
+  ),
+  'subsite-teal': loadable.lib(() =>
+    import('io-sanita-theme/config/subsites/teal'),
+  ),
+  'subsite-white': loadable.lib(() =>
+    import('io-sanita-theme/config/subsites/white'),
+  ),
+  'subsite-yellow': loadable.lib(() =>
+    import('io-sanita-theme/config/subsites/yellow'),
+  ),
+};

package/src/config/subsites/light-blue.jsx

@@ -0,0 +1 @@
+import 'io-sanita-theme/theme/io-sanita/subsites/light-blue.scss';

package/src/config/subsites/light-pink.jsx

@@ -0,0 +1 @@
+import 'io-sanita-theme/theme/io-sanita/subsites/light-pink.scss';

package/src/config/subsites/light-teal.jsx

@@ -0,0 +1 @@
+import 'io-sanita-theme/theme/io-sanita/subsites/light-teal.scss';

package/src/config/subsites/light-yellow.jsx

@@ -0,0 +1 @@
+import 'io-sanita-theme/theme/io-sanita/subsites/light-yellow.scss';