Merge branch 'main' into bg-color-poc

* main: (21 commits)
  Remove @plone/volto peerDepencency (#364)
  Release 3.1.1
  Fix typo in container deprecation notice (#362)
  Release 3.1.0
  Safer pass by value instead of by reference when modifying internal `blockConfig` data (#361)
  Use the Container in @plone/components (#360)
  Fix spacing between title and description in teaser block.(Breaking change) (#352)
  Fix header tabbing order (#251) (#346)
  Fix show figcaption tag if ther is no caption (#350) (#351)
  Add eu and es translations (#358)
  Release 3.0.1
  Fix teaser styles on add form (#355)
  Missing versions from the last merged PR
  Update to Volto 17.15.1 (#348)
  Fix image gallery opacity. (#347)
  Release 3.0.0
  Add Event metadata block (#290)
  Fix missing key in header (#345)
  Add options to show intranet flag and intranet header. (#318)
  Fix A11y in Navigation (#344)
  ...

.github/workflows/acceptance.yml

@@ -4,7 +4,7 @@ on: [push, pull_request]
 env:
   ADDON_NAME: "@kitconcept/volto-light-theme"
   ADDON_PATH: "volto-light-theme"
-  VOLTO_VERSION: "17.12.1"
+  VOLTO_VERSION: "17.15.5"
 
 jobs:
 

.github/workflows/deploy.yml

@@ -11,7 +11,7 @@ on:
 env:
   ENVIRONMENT: "light-theme.kitconcept.io"
   IMAGE_NAME: "ghcr.io/kitconcept/voltolighttheme-frontend"
-  VOLTO_VERSION: "17.12.1"
+  VOLTO_VERSION: "17.15.5"
 
 jobs:
   meta:

CHANGELOG.md

@@ -8,6 +8,59 @@
 
 <!-- towncrier release notes start -->
 
+## 3.1.1 (2024-03-08)
+
+### Bugfix
+
+- Fix typo in container deprecation notice @sneridagh [#362](https://github.com/kitconcept/volto-light-theme/pull/362)
+
+## 3.1.0 (2024-03-08)
+
+### Feature
+
+- [Vertical Spacing] Reduce spacing between title and description in teaser block @iFlameing [#353](https://github.com/kitconcept/volto-light-theme/pull/353)
+- Add eu and es translations @erral [#358](https://github.com/kitconcept/volto-light-theme/pull/358)
+
+### Bugfix
+
+- Fix header tabbing order @iRohitSingh [#251](https://github.com/kitconcept/volto-light-theme/pull/251)
+- Fix show figcaption tag if ther is no caption @iRohitSingh [#350](https://github.com/kitconcept/volto-light-theme/pull/350)
+- Safer pass by value instead of by reference when modifying internal `blockConfig` data @sneridagh [#361](https://github.com/kitconcept/volto-light-theme/pull/361)
+
+### Internal
+
+- @plone/components as dependency
+  Use the `Container` component from @plone/components instead of the local one.
+  The one in `src/components/Atoms/Container/Container.jsx` is deprecated and will be removed in the next major release. @sneridagh [#360](https://github.com/kitconcept/volto-light-theme/pull/360)
+
+## 3.0.1 (2024-03-04)
+
+### Bugfix
+
+- Fix image gallery opacity. @robgietema [#347](https://github.com/kitconcept/volto-light-theme/pull/347)
+- Fix teaser styles on add view. @davisagli [#354](https://github.com/kitconcept/volto-light-theme/pull/354)
+
+### Internal
+
+- Update to Volto 17.15.1 @sneridagh [#348](https://github.com/kitconcept/volto-light-theme/pull/348)
+
+## 3.0.0 (2024-02-14)
+
+### Feature
+
+- Add options to show intranet label and implement intranet header for intranet sites. @iFlameing [#304](https://github.com/kitconcept/volto-light-theme/pull/304)
+- Add Event Metadata block @iRohitSingh [#334](https://github.com/kitconcept/volto-light-theme/pull/334)
+
+### Bugfix
+
+- Fix Navigation fails html validator due to use of divs inside ul tag @iRohitSingh [#289](https://github.com/kitconcept/volto-light-theme/pull/289)
+- Fixed the Caption for Images, Video Blocks etc. to use semantically correct HTML Structure @Molochem [#341](https://github.com/kitconcept/volto-light-theme/pull/341)
+- Fix missing key in `Header` component @sneridagh [#345](https://github.com/kitconcept/volto-light-theme/pull/345)
+
+### Internal
+
+- Support for enhanced initial blocks in config - Update to Volto 17.12.1 @sneridagh [#342](https://github.com/kitconcept/volto-light-theme/pull/342)
+
 ## 3.0.0-alpha.3 (2024-02-02)
 
 ### Feature

Makefile

@@ -21,8 +21,8 @@ GREEN=`tput setaf 2`
 RESET=`tput sgr0`
 YELLOW=`tput setaf 3`
 
-PLONE_VERSION=6.0.9
-VOLTO_VERSION=17.12.1
+PLONE_VERSION=6
+VOLTO_VERSION=17.15.5
 
 ADDON_NAME='@kitconcept/volto-light-theme'
 ADDON_PATH='volto-light-theme'

README.md

@@ -9,32 +9,34 @@
 
 ## Vision
 
-The Volto Light Theme main vision is to provide kitconcept a theme to build upon the projects to come after the release of Plone 6.
+The main vision of the Volto Light Theme is to serve as a foundation for kitconcept's future projects, following the release of Plone 6.
 
-It should contain all the feedback and success stories in UI/UX side that the company had during the last years projects.
+It contains the feedback from the company's last years projects and the success stories in the UI/UX side.
 
-It should also be future proof, so it has to be aligned with the upcoming Volto vision in terms of theming strategy decided by the Plone community.
+It aims to be future proof, so it has to be aligned with the upcoming Volto vision in terms of theming strategy decided by the Plone community.
 
 ![Volto-Light-Theme](https://github.com/kitconcept/volto-light-theme/raw/main/volto-light-theme.png)
 
-## Requirements
+## Requirements and specs
 
 ### It should not use any SemanticUI component or styling
 
 Volto will abandon SemanticUI as default design component system in the mid term, and we should be prepared for it.
 
-We will achieve that not using any SemanticUI component, nor any related styling (`.ui.XXX`) in our upcoming themes.
+We will achieve that by not using any SemanticUI component, nor any related styling (`.ui.XXX`) in our upcoming themes.
 
 The Volto strategy is:
 
-- To provide a very basic and structural Vanilla components to build upon theming and CMSUI as well.
-- These components will be based in a headless component system. The best positioned right now is [react-aria](https://react-spectrum.adobe.com/react-aria/).
-- The theming could be done using these basic components or dropping in the component system of the developer/integrator choice. The presence of Volto's component registry system could help for adapting, if required.
-- The CMSUI will be isolated from the theming because it will be extremely CSS specific, so leaks from theming-CMSUI won't happen.
+- Provide a very basic and structural Vanilla components to build upon theming and CMSUI as well (`@plone/components`)
+- These components will be based in a headless component system [React Aria Components](https://react-spectrum.adobe.com/react-aria/components.html)
+- Volto projects can be themed using `@plone/components` as baseline or use a complete different design or component system of the developer/integrator choice. The presence of Volto's component registry system could help for adapting, if required.
 
 #### Volto components `customizations` use case
 
-If possible, we will switch to SemanticUI-less components in case of they exist. Specially if the elements that we are customizing are clearly "theme" (eg. header/footer, etc). In the case of other Volto customizations that are not clear part of the theme (eg. Search block), it's fine to stick using what the original is using (SemanticUI). When Volto will make the switch in the future, we should then adapt all the customizations to match the one in the Volto core.
+If possible, we will switch to SemanticUI-less components when `@plone/components` is ready.
+Specially if the elements that we are customizing are clearly "theme" (eg. header/footer, etc).
+In the case of other Volto customizations that are not clear part of the theme (eg. Search block), it's fine to stick using what the original is using (SemanticUI).
+When Volto will make the switch in the future, we should then adapt all the customizations to match the one in the Volto core.
 The approach used is to use a proxy to a component of the `components` folder. This way it's easier to keep track of changes, and another add-on can customize again the light theme component, not the original Volto customization.
 
 ### It should use kitconcept's layout used in FZJ/DLR projects
@@ -55,9 +57,9 @@ Since the new container queries spec is out, we will be introducing it to the cu
 
 We will start organising the files in the root of `theme` folder, to differentiate from a normal "SemanticUI" theme. Take a look at the current state. We will follow this convention:
 
-- One less file per component/block
-- All less files loading are centralized in one main less file `custom.less` in this project, could be different in the future.
-- Vanilla headless components are named under `atoms` folder.
+- One file per component/block
+- Use the Volto theme facility using the SCSS scape hatch provided so other add-ons can hook to it.
+- The styling is centralized in `main.scss`, the rest of the files are loaded from there.
 
 ## Why a headless component system?
 
@@ -69,6 +71,8 @@ This theme has the concept of block "grouping" given two consecutive blocks with
 
 The wrappers have the classnames `blocks-group-wrapper` and the name of the background color, eg. `grey`, defaulting to `transparent` if no `backgroundColor` property is set in the styling block wrapper in the block.
 
+**Disclaimer**: This might change in the near future, since we are developing a new integral Block Model for VLT and Volto.
+
 ### Vertical spacing rules
 
 These main rules spec applies to the theme:
@@ -93,7 +97,7 @@ We use container queries when do care explicitly about how the styling is being
 
 Reason: The container queries allow us to abstract the width from the sidebar and toolbar in edit mode, showing the content area as it will be in that size, in view mode.
 
-Remember: The margins in responsive are being taken care with container queries in `layout.scss`. So everything related to that, goes like it works in there, with container queries. See implementations for details in case you need it.
+**Remember**: The margins in responsive are being taken care with container queries in `layout.scss`. So everything related to that, goes like it works in there, with container queries. See implementations for details in case you need it.
 
 ## Specification
 
@@ -181,6 +185,49 @@ It's behind a feature flag, as opt-out:
 config.settings.enableFatMenu = true;
 ```
 
+### Show Site Label
+
+If you want to show a label on top of site you can pass label name to `siteLabel` property.
+
+```js
+config.settings.siteLabel = 'Plone Intranet';
+```
+
+If you wanted a translated label then you have to define a translation object in `defineMessages` function provided by react-intl.
+
+Here is the code snippets you have to add in your addon index.js file.
+If you don't have addon, you can also add in your config.js file in root of your frontend folder.
+
+```js
+import { defineMessages } from 'react-intl';
+
+defineMessages({
+  siteLabel: {
+    id: 'siteLabel',
+    defaultMessage: ' ',
+  },
+});
+
+```
+Then add the translation you want in your `locale` file.
+
+### Show intranetHeader
+
+We have totally different header for intranet sites. If you want that, you can enable it by passing `intranetHeader` property.
+
+```js
+config.settings.intranetHeader = true;
+```
+## Releases
+
+The releases follow a semantic versioning model.
+
+### Definition of breaking change
+
+In general, the same rules as Volto releases applies.
+However, in VLT we add an extra exception: The vertical spacing is carefully curated and considered an important feature of the theme and because of that, changes and improvements in the vertical spacing are **NOT** considered breaking changes.
+They will be noted properly in the changelog.
+
 ## Upgrade Guide
 
 See a detailed upgrade guide in: https://github.com/kitconcept/volto-light-theme/blob/main/UPGRADE-GUIDE.md

acceptance/cypress/tests/main/nav.cy.js

@@ -27,7 +27,6 @@ context('Navigation Acceptance Tests', () => {
       path: '/level-1/level-2',
     });
 
-
     cy.visit('/');
     cy.viewport('macbook-16');
   });
@@ -44,17 +43,12 @@ context('Navigation Acceptance Tests', () => {
     cy.get('ul.desktop-menu button').contains('Level 1').click();
     cy.get('.subitem-wrapper').findByText('Level 2').click();
     cy.get('.documentFirstHeading').should('have.text', 'Level 2');
-
   });
 
   it('Open 3rd level', function () {
     cy.wait('@content');
     cy.get('ul.desktop-menu button').contains('Level 1').click();
-    cy.get('.subsubitem-wrapper li').findByText('Level 3').click();
+    cy.get('.subsubitem-wrapper').findByText('Level 3').click();
     cy.get('.documentFirstHeading').should('have.text', 'Level 3');
-
   });
 });
-
-
-

locales/de/LC_MESSAGES/volto.po

@@ -228,15 +228,22 @@ msgstr "Rechts"
 #: components/Blocks/Search/components/SearchInput
 #: components/Blocks/Search/TopSideFacets
 #: components/MobileNavigation/MobileNavigation
+#: components/SearchWidget/IntranetSearchWidget
 #: components/SearchWidget/SearchWidget
 msgid "Search"
 msgstr "Suche"
 
 #. Default: "Search Site"
+#: components/SearchWidget/IntranetSearchWidget
 #: components/SearchWidget/SearchWidget
 msgid "Search Site"
 msgstr "Seite durchsuchen"
 
+#. Default: "Search for People, E-Mail Address, Phone Number, ..."
+#: components/SearchWidget/IntranetSearchWidget
+msgid "Search for People, E-Mail Address, Phone Number, ..."
+msgstr ""
+
 #. Default: "Search results"
 #: components/Blocks/Search/components/SearchDetails
 msgid "Search results"
@@ -253,7 +260,6 @@ msgid "Site"
 msgstr "Seite"
 
 #. Default: "Sitemap"
-#: components/Header/Header
 #: index
 msgid "Sitemap"
 msgstr "Übersicht"
@@ -327,3 +333,8 @@ msgstr ""
 #: components/Blocks/Listing/ListingBody
 msgid "of"
 msgstr "von"
+
+#. Default: ""
+#: components/Header/Header
+msgid "siteLabel"
+msgstr ""

locales/en/LC_MESSAGES/volto.po

@@ -223,15 +223,22 @@ msgstr ""
 #: components/Blocks/Search/components/SearchInput
 #: components/Blocks/Search/TopSideFacets
 #: components/MobileNavigation/MobileNavigation
+#: components/SearchWidget/IntranetSearchWidget
 #: components/SearchWidget/SearchWidget
 msgid "Search"
 msgstr ""
 
 #. Default: "Search Site"
+#: components/SearchWidget/IntranetSearchWidget
 #: components/SearchWidget/SearchWidget
 msgid "Search Site"
 msgstr ""
 
+#. Default: "Search for People, E-Mail Address, Phone Number, ..."
+#: components/SearchWidget/IntranetSearchWidget
+msgid "Search for People, E-Mail Address, Phone Number, ..."
+msgstr ""
+
 #. Default: "Search results"
 #: components/Blocks/Search/components/SearchDetails
 msgid "Search results"
@@ -248,7 +255,6 @@ msgid "Site"
 msgstr ""
 
 #. Default: "Sitemap"
-#: components/Header/Header
 #: index
 msgid "Sitemap"
 msgstr ""
@@ -322,3 +328,8 @@ msgstr ""
 #: components/Blocks/Listing/ListingBody
 msgid "of"
 msgstr ""
+
+#. Default: ""
+#: components/Header/Header
+msgid "siteLabel"
+msgstr ""