@eeacms/volto-bise-policy 1.0.2 → 1.0.3

package/CHANGELOG.md

@@ -4,11 +4,12 @@ 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).
 
-### [1.0.2](https://github.com/eea/volto-bise-policy/compare/1.0.1...1.0.2) - 29 March 2023
+### [1.0.3](https://github.com/eea/volto-bise-policy/compare/1.0.2...1.0.3) - 12 April 2023
 
-#### :house: Internal changes
+#### :hammer_and_wrench: Others
 
-- chore(package.json): reorder dependencies alphabetically [Miu Razvan - [`70e989e`](https://github.com/eea/volto-bise-policy/commit/70e989e40aac7a3ebf20a6ba6b493b6f82e1ec77)]
+- update [Miu Razvan - [`a75120c`](https://github.com/eea/volto-bise-policy/commit/a75120c5047d4654b064ba1e5114d2405be5d2ff)]
+### [1.0.2](https://github.com/eea/volto-bise-policy/compare/1.0.1...1.0.2) - 29 March 2023
 
 ### [1.0.1](https://github.com/eea/volto-bise-policy/compare/1.0.0...1.0.1) - 29 March 2023
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eeacms/volto-bise-policy",
-  "version": "1.0.2",
+  "version": "1.0.3",
   "description": "@eeacms/volto-bise-policy: Volto add-on",
   "main": "src/index.js",
   "author": "European Environment Agency: IDM2 A-Team",

package/razzle.extend.js

@@ -8,17 +8,18 @@ const modify = (config, { target, dev }, webpack) => {
   config.resolve.alias['../../theme.config'] = themeConfigPath;
   config.resolve.alias['../../theme'] = `${__dirname}/theme`;
   const projectRootPath = path.resolve('.');
-  const themeLessPath = `${projectRootPath}/node_modules/@eeacms/volto-eea-design-system/theme`;
+  const themeLessPath = `${projectRootPath}/node_modules/@eeacms/volto-spotlight/theme`;
 
-  config.resolve.alias['eea-design-system-theme'] = dev
-    ? `${projectRootPath}/src/addons/volto-eea-design-system/theme/themes/eea`
-    : `${themeLessPath}/themes/eea`;
+  config.resolve.alias['volto-spotlight-theme'] = dev
+    ? `${projectRootPath}/src/addons/volto-spotlight/theme/themes/spotlight`
+    : `${themeLessPath}/themes/spotlight`;
 
   const semanticLessPath = `${projectRootPath}/node_modules/semantic-ui-less`;
-  const hasDesignSystemInstalled = config.resolve.alias['eea-volto-themes'];
-  config.resolve.alias['eea-volto-theme-folder'] = hasDesignSystemInstalled
-    ? themeLessPath
-    : semanticLessPath;
+  const hasDesignSystemInstalled =
+    config.resolve.alias['volto-spotlight-themes'];
+  config.resolve.alias[
+    'volto-spotlight-theme-folder'
+  ] = hasDesignSystemInstalled ? themeLessPath : semanticLessPath;
 
   return config;
 };

package/src/components/manage/Blocks/schema.js

@@ -0,0 +1,55 @@
+import { cloneDeep } from 'lodash';
+import imageFitSVG from '@plone/volto/icons/image-fit.svg';
+import imageWideSVG from '@plone/volto/icons/image-wide.svg';
+import imageFullSVG from '@plone/volto/icons/image-full.svg';
+import imageNarrowSVG from '@eeacms/volto-bise-policy/../theme/assets/icons/image-narrow.svg';
+import leftSVG from '@eeacms/volto-bise-policy/../theme/assets/icons/image-half-left.svg';
+import rightSVG from '@eeacms/volto-bise-policy/../theme/assets/icons/image-half-right.svg';
+
+export const ALIGN_INFO_MAP = {
+  narrow_width: [imageNarrowSVG, 'Narrow width'],
+  container_width: [imageFitSVG, 'Container width'],
+  wide_width: [imageWideSVG, 'Wide width'],
+  full: [imageFullSVG, 'Full width'],
+  half_width_left: [leftSVG, 'Half width left'],
+  half_width_right: [rightSVG, 'Half width right'],
+};
+
+export const addStylingFieldsetSchemaEnhancer = ({ schema }) => {
+  const applied = schema?.properties?.styles;
+
+  if (!applied) {
+    const resSchema = cloneDeep(schema);
+
+    resSchema.fieldsets.push({
+      id: 'styling',
+      fields: ['styles'],
+      title: 'Styling',
+    });
+    resSchema.properties.styles = {
+      widget: 'object',
+      title: 'Styling',
+      schema: {
+        fieldsets: [
+          {
+            id: 'default',
+            title: 'Default',
+            fields: ['size'],
+          },
+        ],
+        properties: {
+          size: {
+            widget: 'style_align',
+            title: 'Section size',
+            actions: Object.keys(ALIGN_INFO_MAP),
+            actionsInfoMap: ALIGN_INFO_MAP,
+          },
+        },
+        required: [],
+      },
+    };
+    return resSchema;
+  }
+
+  return schema;
+};

package/src/index.js

@@ -1,4 +1,5 @@
 import installLink from '@plone/volto-slate/editor/plugins/AdvancedLink';
+import { addStylingFieldsetSchemaEnhancer } from '@eeacms/volto-bise-policy/components/manage/Blocks/schema';
 
 import installBlocks from './components/manage/Blocks';
 import installStyles from './components/manage/Styles';
@@ -75,6 +76,29 @@ const applyConfig = (config) => {
   toolbarButtons.splice(linkIndex, 1, 'a');
   toolbarButtons.splice(advancedLinkIndex, 1);
 
+  // Customizations
+  // Group
+  if (config.blocks.blocksConfig.group) {
+    config.blocks.blocksConfig.group.schemaEnhancer = addStylingFieldsetSchemaEnhancer;
+  }
+
+  // Columns
+  if (config.blocks.blocksConfig.columnsBlock) {
+    config.blocks.blocksConfig.columnsBlock.mostUsed = true;
+    config.blocks.blocksConfig.columnsBlock.schemaEnhancer = addStylingFieldsetSchemaEnhancer;
+  }
+
+  // Listing
+  if (config.blocks.blocksConfig.listing) {
+    config.blocks.blocksConfig.listing.title = 'Listing (Content)';
+    config.blocks.blocksConfig.listing.schemaEnhancer = addStylingFieldsetSchemaEnhancer;
+  }
+
+  // Hero image left
+  if (config.blocks.blocksConfig.hero_image_left) {
+    config.blocks.blocksConfig.hero_image_left.schemaEnhancer = addStylingFieldsetSchemaEnhancer;
+  }
+
   return [installBlocks, installStyles].reduce(
     (acc, apply) => apply(acc),
     config,

package/theme/assets/icons/image-half-left.svg

@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="36" height="36" viewBox="0 0 36 36">
+<g>
+<path fill-rule="nonzero" d="M18,13l2-2v14l-2-2h15l-2,2V11l2,2H18z M33,11v14H18V11H33z"/>
+<polygon points="3,31 33,31 33,29 3,29 "/>
+<polygon points="3,7 33,7 33,5 3,5 "/>
+<polygon points="12.3,15.8 14,17.5 5,17.5 6.7,15.8 5.9,15.1 3,18 5.9,20.9 6.7,20.2 5,18.5 14,18.5 12.3,20.2 13.1,20.9 16,18 
+	13.1,15.1 "/>
+	</g>
+</svg>

package/theme/assets/icons/image-half-right.svg

@@ -0,0 +1,10 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="36" height="36" viewBox="0 0 36 36">
+<g>
+<path fill-rule="nonzero" d="M3,13l2-2v14l-2-2h15l-2,2V11l2,2H3z M18,11v14H3V11H18z"/>
+<polygon points="3,31 33,31 33,29 3,29 "/>
+<polygon points="3,7 33,7 33,5 3,5 "/>
+<polygon points="29.3,15.8 31,17.5 22.1,17.5 23.8,15.8 23,15.1 20.1,18 23,20.9 23.8,20.2 22.1,18.5 31,18.5 29.3,20.2 30.1,20.9 
+	33,18 30.1,15.1 "/>
+	</g>
+
+</svg>

package/theme/assets/icons/image-narrow.svg

@@ -0,0 +1,5 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="36" height="36" viewBox="0 0 36 36">
+  <path d="M10 13L11.9333 11V25L10 23H26L24.0667 25V11L26 13H10ZM26 11V18V21.5V23.5V25H10V11H26Z" fill="black" />
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M7 31H29V29H7V31Z" />
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M7 7H29V5H7V7Z" />
+</svg>

package/theme/extras/pluggables.less

@@ -49,22 +49,10 @@
   }
 }
 
-.marginless {
-  margin: 0;
+.marginless,
+div#view .ui.container > .marginless {
   margin-top: 0;
-  margin-right: 0;
   margin-bottom: 0;
-  margin-left: 0;
-}
-
-div#view .ui.container > {
-  .marginless {
-    margin: 0;
-    margin-top: 0;
-    margin-right: 0;
-    margin-bottom: 0;
-    margin-left: 0;
-  }
 }
 
 .padded {

package/theme/extras/widgets.less

@@ -0,0 +1,3 @@
+.align-widget .align-buttons {
+  flex-wrap: wrap;
+}

package/theme/globals/site.overrides

@@ -2,13 +2,14 @@
         Global Overrides
 *******************************/
 
-@import '../extras/keyfacts.less';
-@import '../extras/factsheets.less';
-@import '../extras/pluggables.less';
-@import '../extras/stylemenu.less';
-@import '../extras/tocnav.less';
-@import './helpers.less';
-@import './natura2000.less';
+@import '../extras/widgets';
+@import '../extras/keyfacts';
+@import '../extras/factsheets';
+@import '../extras/pluggables';
+@import '../extras/stylemenu';
+@import '../extras/tocnav';
+@import './helpers';
+@import './natura2000';
 
 // :root {
 //   .define-color(primary, #005248);
@@ -22,24 +23,6 @@
 //   .define-color(dark-tertiary, #2e3e4c);
 // }
 
-// body::-webkit-scrollbar {
-//   width: @scrollbarWidth;
-// }
-
-// body::-webkit-scrollbar-track {
-//   background: #F9F9F9;
-// }
-
-// body::-webkit-scrollbar-thumb {
-//   background-color: #B4B4B4;
-//   border-radius: 20px;
-//   border: 3px solid #FAF9F9;
-// }
-
-// body::-webkit-scrollbar-thumb:hover {
-//   background-color: #6A6A6A;
-// }
-
 @font-face {
   font-family: 'OpenSans';
   font-weight: normal;
@@ -111,9 +94,9 @@ p.has--clear--both:empty {
       // border-bottom: 2px solid @darkSecondaryColor;
     }
 
-    h2 {
-      // border-bottom: 2px solid @secondaryColor;
-    }
+    // h2 {
+    //   border-bottom: 2px solid @secondaryColor;
+    // }
 
     .column-blocks-wrapper {
       display: flex;
@@ -275,4 +258,34 @@ p.has--clear--both:empty {
   .ui.content-area {
     margin-bottom: 2rem;
   }
-} 
+}
+
+#toolbar {
+  z-index: 6;
+}
+
+
+@{view} {
+  .red-bg::before {
+    .full-width();
+  }
+}
+
+@{edit} {
+  .red-bg::before {
+    .full-width-edit();
+  }
+}
+
+.red-bg {
+  position: relative;
+  color: #fff;
+
+  &::before {
+    content: '';
+    height: 100%;
+    background-color: coral;
+    z-index: -1 !important;
+    position: absolute !important;
+  }
+}

package/theme/theme.config

@@ -18,12 +18,13 @@
 */
 
 /* Global */
-@site        : 'eea';
+@site        : 'mirage';
 @reset       : 'eea';
+@mixins      : 'mirage';
 
 /* Elements */
 @button      : 'eea';
-@container   : 'eea';
+@container   : 'mirage';
 @divider     : 'eea';
 @flag        : 'eea';
 @header      : 'eea';
@@ -77,39 +78,41 @@
 @main        : 'eea';
 @custom      : 'eea';
 /* EEA Design system custom components */
-@blockquote             : 'eea';
-@pullquote              : 'eea';
-@banner                 : 'eea';
-@timeline               : 'eea';
-@footer                 : 'eea';
-@header                 : 'eea';
-@tag                    : 'eea';
-@tags                   : 'eea';
-@tagList                : 'eea';
-@contextNavigation      : 'eea';
-@inpageNavigation       : 'eea';
-@avatar                 : 'eea';
-@divider                : 'eea';
-@testimonial            : 'eea';
-@avatarGrid             : 'eea';
-@keyContent             : 'eea';
-@publicationCard        : 'eea';
-@contentBox             : 'eea';
-@reverseCardGrid        : 'eea';
-@relatedContent         : 'eea';
-@share                  : 'eea';
-@faqContent             : 'eea';
-@reportCard             : 'eea';
-@faqFilter              : 'eea';
-@contentAccordion       : 'eea';
-@downloadLabeledIcon    : 'eea';
-@newTabLabeledIcon      : 'eea';
-@labeledIconGroup       : 'eea';
-@languageLabeledIcon    : 'eea';
-@callout                : 'eea';
-@quote                  : 'eea';
-@hero                   : 'eea';
-@copyright              : 'eea';
+@blockquote          : 'eea';
+@pullquote           : 'eea';
+@banner              : 'eea';
+@timeline            : 'eea';
+@footer              : 'eea';
+@header              : 'eea';
+@tag                 : 'eea';
+@tags                : 'eea';
+@tagList             : 'eea';
+@inpageNavigation    : 'eea';
+@contextNavigation   : 'eea';
+@avatar           : 'eea';
+@divider          : 'eea';
+@testimonial      : 'eea';
+@avatarGrid       : 'eea';
+@keyContent       : 'eea';
+@publicationCard  : 'eea';
+@contentBox       : 'mirage';
+@reverseCardGrid  : 'eea';
+@relatedContent   : 'eea';
+@share            : 'eea';
+@faqContent       : 'eea';
+@reportCard       : 'eea';
+@faqFilter        : 'eea';
+@contentAccordion : 'eea';
+@downloadLabeledIcon :'eea';
+@newTabLabeledIcon   : 'eea';
+@labeledIconGroup    : 'eea';
+@languageLabeledIcon : 'eea';
+@callout    : 'eea';
+@quote      : 'eea';
+@hero       : 'mirage';
+@copyright  : 'eea';
+@columns    : 'mirage';
+@spotlight  : 'mirage';
 
 /*******************************
             Folders
@@ -124,7 +127,7 @@
 /*******************************
          Import Theme
 *******************************/
-@import (multiple) "~eea-volto-theme-folder/theme.less";
+@import (multiple) "~volto-spotlight-theme-folder/theme.less";
 
 @fontPath: "~volto-themes/default/assets/fonts";