@eeacms/volto-eea-website-theme 0.6.8 → 0.6.11

package/CHANGELOG.md

@@ -4,8 +4,34 @@ All notable changes to this project will be documented in this file. Dates are d
 
 Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 
+#### [0.6.11](https://github.com/eea/volto-eea-website-theme/compare/0.6.10...0.6.11)
+
+- change(website): removed container from styles that implement content-box [`c513000`](https://github.com/eea/volto-eea-website-theme/commit/c513000ce374f3209f57a3d050c29a0fbff0916c)
+- Optimize Content Box SVG [`ba0d417`](https://github.com/eea/volto-eea-website-theme/commit/ba0d417ad30bfb3994855716d0d387463317d24e)
+- Add preview for Content Box preset styles [`cbed054`](https://github.com/eea/volto-eea-website-theme/commit/cbed05403113cb46bc2ed63dd9c47fc6168ac492)
+- Remove pluggableStyles previewText as if creates confusion [`467320d`](https://github.com/eea/volto-eea-website-theme/commit/467320df0142e8058487df20da01af5d496f2f1b)
+
+#### [0.6.10](https://github.com/eea/volto-eea-website-theme/compare/0.6.9...0.6.10)
+
+> 16 June 2022
+
+- fix(header): add homepage logic only on view and edit [`#42`](https://github.com/eea/volto-eea-website-theme/pull/42)
+- Use window.searchContext.resetSearch for search widget [`#41`](https://github.com/eea/volto-eea-website-theme/pull/41)
+- change(header): add homepage class also on edit page [`0a10847`](https://github.com/eea/volto-eea-website-theme/commit/0a108477a3a15f9d0e2172286837ddfd94e078fa)
+- Use window.searchContext.resetSearch [`c3a968b`](https://github.com/eea/volto-eea-website-theme/commit/c3a968b91646102dad461541a1501b93a653e2c9)
+- fix(header): homepage is now true only on view page [`a0618a7`](https://github.com/eea/volto-eea-website-theme/commit/a0618a74431a280c3ccb95597d7f771385fac2eb)
+
+#### [0.6.9](https://github.com/eea/volto-eea-website-theme/compare/0.6.8...0.6.9)
+
+> 14 June 2022
+
+- Add custom styles: Content Box [`#40`](https://github.com/eea/volto-eea-website-theme/pull/40)
+
 #### [0.6.8](https://github.com/eea/volto-eea-website-theme/compare/0.6.7...0.6.8)
 
+> 13 June 2022
+
+- change(theme): added homepage and homepage inverted pages [`#39`](https://github.com/eea/volto-eea-website-theme/pull/39)
 - Fix HomepageView typo [`41582a3`](https://github.com/eea/volto-eea-website-theme/commit/41582a39f8e84cd3ef62d9ef302798627e8350f1)
 - fix import to please jslint [`b4a6555`](https://github.com/eea/volto-eea-website-theme/commit/b4a655548600ef9b9c8ecdd156d0062d4b54d00e)
 - change(header): added homepage and homepage_inverse views [`6df68d7`](https://github.com/eea/volto-eea-website-theme/commit/6df68d7a592d623af76c1036c38d2c480fc6ce88)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eeacms/volto-eea-website-theme",
-  "version": "0.6.8",
+  "version": "0.6.11",
   "description": "@eeacms/volto-eea-website-theme: Volto add-on",
   "main": "src/index.js",
   "author": "European Environment Agency: IDM2 A-Team",

package/src/customizations/@eeacms/volto-eea-design-system/ui/Header/HeaderSearchPopUp.js

@@ -16,6 +16,11 @@ function HeaderSearchPopUp({ history, onClose, triggerRefs = [] }) {
 
   const onSubmit = (event) => {
     history.push(`/en/advanced-search?q=${text}`);
+
+    if (window?.searchContext?.resetSearch) {
+      window.searchContext.resetSearch({ searchTerm: text });
+    }
+
     onClose();
     event.preventDefault();
   };

package/src/customizations/volto/components/theme/Header/Header.jsx

@@ -25,6 +25,7 @@ import eeaFlag from '@eeacms/volto-eea-design-system/../theme/themes/eea/assets/
 
 import config from '@plone/volto/registry';
 import { compose } from 'recompose';
+import { BodyClass } from '@plone/volto/helpers';
 
 /**
  * EEA Specific Header component.
@@ -34,8 +35,18 @@ const EEAHeader = ({ pathname, token, items, history }) => {
   const translations = useSelector(
     (state) => state.content.data?.['@components']?.translations?.items,
   );
+
+  const router_pathname = useSelector((state) => {
+    return state.router?.location?.pathname || '';
+  });
+
   const isHomePageInverse = useSelector((state) => {
-    return state.content?.data?.layout === 'homepage_inverse_view';
+    const layout = state.content?.data?.layout;
+    const has_home_layout = layout === 'homepage_inverse_view';
+    return (
+      has_home_layout &&
+      (pathname === router_pathname || router_pathname.endsWith('/edit'))
+    );
   });
 
   const { eea } = config.settings;
@@ -48,9 +59,9 @@ const EEAHeader = ({ pathname, token, items, history }) => {
 
   React.useEffect(() => {
     const { settings } = config;
-    const base = getBaseUrl(pathname);
-    if (!hasApiExpander('navigation', base)) {
-      dispatch(getNavigation(base, settings.navDepth));
+    const base_url = getBaseUrl(pathname);
+    if (!hasApiExpander('navigation', base_url)) {
+      dispatch(getNavigation(base_url, settings.navDepth));
     }
   }, [pathname, dispatch]);
 
@@ -66,6 +77,7 @@ const EEAHeader = ({ pathname, token, items, history }) => {
 
   return (
     <Header menuItems={items}>
+      {isHomePageInverse && <BodyClass className="homepage" />}
       <Header.TopHeader>
         <Header.TopItem className="official-union">
           <Image src={eeaFlag} alt="eea flag"></Image>

package/src/icons/content-box.svg

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+<svg width="90mm" height="90mm" version="1.1" viewBox="0 0 90 90" xmlns="http://www.w3.org/2000/svg">
+ <text x="44.72715" y="38.463978" fill="#000000" font-family="sans-serif" font-size="16.933px" letter-spacing="0px" stroke-width=".26458" text-align="center" text-anchor="middle" word-spacing="0px" style="line-height:1.5" xml:space="preserve"><tspan x="44.72715" y="38.463978" text-align="center">Content</tspan><tspan x="44.72715" y="63.863926" text-align="center">Box</tspan></text>
+</svg>

package/src/index.js

@@ -6,12 +6,17 @@ import DraftBackground from '@eeacms/volto-eea-website-theme/components/theme/Dr
 import { TokenWidget } from '@eeacms/volto-eea-website-theme/components/theme/Widgets/TokenWidget';
 import HomePageView from '@eeacms/volto-eea-website-theme/components/theme/Homepage/HomePageView';
 import HomePageInverseView from '@eeacms/volto-eea-website-theme/components/theme/Homepage/HomePageInverseView';
+import { Icon } from '@plone/volto/components';
+import contentBoxSVG from './icons/content-box.svg';
 
 const applyConfig = (config) => {
+  // EEA specific settings
   config.settings.eea = {
     ...eea,
     ...(config.settings.eea || {}),
   };
+
+  // Homepage
   config.views.layoutViews = {
     homepage_view: HomePageView,
     homepage_inverse_view: HomePageInverseView,
@@ -51,8 +56,8 @@ const applyConfig = (config) => {
     },
   ];
 
+  // Custom CSS voltoCustom.css and Draft Background
   const appExtras = config.settings.appExtras || [];
-
   config.settings.appExtras = [
     ...appExtras,
     {
@@ -65,6 +70,69 @@ const applyConfig = (config) => {
     },
   ];
 
+  // Custom block styles
+  config.settings.previewText = '';
+  config.settings.pluggableStyles = [
+    ...(config.settings.pluggableStyles || []),
+    {
+      id: 'content-box-gray',
+      title: 'Default',
+      previewComponent: () => (
+        <Icon name={contentBoxSVG} size="88px" className="default" />
+      ),
+      viewComponent: (props) => {
+        return (
+          <div className="content-box">
+            <div className="content-box-inner">{props.children}</div>
+          </div>
+        );
+      },
+    },
+    {
+      id: 'content-box-primary',
+      title: 'Primary',
+      previewComponent: () => (
+        <Icon name={contentBoxSVG} size="88px" className="primary" />
+      ),
+      viewComponent: (props) => {
+        return (
+          <div className="content-box primary">
+            <div className="content-box-inner">{props.children}</div>
+          </div>
+        );
+      },
+    },
+    {
+      id: 'content-box-secondary',
+      title: 'Secondary',
+      previewComponent: () => (
+        <Icon name={contentBoxSVG} size="88px" className="secondary" />
+      ),
+      viewComponent: (props) => {
+        return (
+          <div className="content-box secondary">
+            <div className="content-box-inner">{props.children}</div>
+          </div>
+        );
+      },
+    },
+    {
+      id: 'content-box-tertiary',
+      title: 'Tertiary',
+      previewComponent: () => (
+        <Icon name={contentBoxSVG} size="88px" className="tertiary" />
+      ),
+      viewComponent: (props) => {
+        return (
+          <div className="content-box tertiary">
+            <div className="content-box-inner">{props.children}</div>
+          </div>
+        );
+      },
+    },
+  ];
+
+  // Custom blocks
   return [installCustomTitle].reduce((acc, apply) => apply(acc), config);
 };