@kitconcept/volto-light-theme 1.0.0 → 2.0.0

package/src/index.js

@@ -1,7 +1,10 @@
 import { defineMessages } from 'react-intl';
 
 import { composeSchema, getPreviousNextBlock } from '@plone/volto/helpers';
-import { defaultStylingSchema } from './components/Blocks/schema';
+import {
+  defaultStylingSchema,
+  removeStylingSchema,
+} from './components/Blocks/schema';
 import { teaserSchemaEnhancer } from './components/Blocks/Teaser/schema';
 import { videoBlockSchemaEnhancer } from './components/Blocks/Video/schema';
 import { gridTeaserDisableStylingSchema } from '@plone/volto/components/manage/Blocks/Teaser/schema';
@@ -48,6 +51,7 @@ defineMessages({
 const applyConfig = (config) => {
   config.settings.enableAutoBlockGroupingByBackgroundColor = true;
   config.settings.navDepth = 3;
+  config.settings.enableFatMenu = true;
   config.settings.slate.useLinkedHeadings = false;
 
   // No required blocks (eg. Title)
@@ -184,43 +188,43 @@ const applyConfig = (config) => {
     colors: BG_COLORS,
     schemaEnhancer: defaultStylingSchema,
     icon: gridSVG,
-    gridAllowedBlocks: ['teaser', 'image', 'slate'],
-    // One could customize the blocks inside the grid like this:
-    blocksConfig: {
-      ...config.blocks.blocksConfig,
-      slate: {
-        ...config.blocks.blocksConfig.slate,
-        // Slate in grids must have an extra wrapper with the `slate` className
-        view: (props) => {
-          const EnhancedSlateViewComponent =
-            config.blocks.blocksConfig.slate.view;
-          return (
-            <div className="slate">
-              <EnhancedSlateViewComponent {...props} />
-            </div>
-          );
-        },
-      },
-      image: {
-        ...config.blocks.blocksConfig.image,
-        schemaEnhancer: composeSchema(
-          imageBlockSchemaEnhancer,
-          gridImageDisableSizeAndPositionHandlersSchema,
-        ),
-      },
-      teaser: {
-        ...config.blocks.blocksConfig.teaser,
-        schemaEnhancer: composeSchema(
-          gridTeaserDisableStylingSchema,
-          teaserSchemaEnhancer,
-        ),
-      },
-      listing: {
-        ...config.blocks.blocksConfig.listing,
-        allowed_headline_tags: [['h2', 'h2']],
-        variations: config.blocks.blocksConfig.listing.variations,
+  };
+
+  config.blocks.blocksConfig.gridBlock.blocksConfig = {
+    ...config.blocks.blocksConfig,
+    slate: {
+      ...config.blocks.blocksConfig.slate,
+      // Slate in grids must have an extra wrapper with the `slate` className
+      view: (props) => {
+        const EnhancedSlateViewComponent =
+          config.blocks.blocksConfig.slate.view;
+        return (
+          <div className="slate">
+            <EnhancedSlateViewComponent {...props} />
+          </div>
+        );
       },
     },
+    image: {
+      ...config.blocks.blocksConfig.image,
+      schemaEnhancer: composeSchema(
+        imageBlockSchemaEnhancer,
+        gridImageDisableSizeAndPositionHandlersSchema,
+      ),
+    },
+    teaser: {
+      ...config.blocks.blocksConfig.teaser,
+      schemaEnhancer: composeSchema(
+        gridTeaserDisableStylingSchema,
+        teaserSchemaEnhancer,
+      ),
+    },
+    listing: {
+      ...config.blocks.blocksConfig.listing,
+      allowed_headline_tags: [['h2', 'h2']],
+      schemaEnhancer: removeStylingSchema,
+      variations: [],
+    },
   };
 
   config.blocks.blocksConfig.introduction = {
@@ -288,7 +292,7 @@ const applyConfig = (config) => {
   };
 
   // Check if the separator is present before enhancing it
-  if (config.blocks.blocksConfig.separator.id) {
+  if (config.blocks.blocksConfig?.separator?.id) {
     config.blocks.blocksConfig.separator = {
       ...config.blocks.blocksConfig.separator,
       schemaEnhancer: composeSchema(

package/src/theme/_bgcolor-blocks-layout.scss

@@ -50,3 +50,8 @@
     margin-bottom: 0;
   }
 }
+
+// Edit mode adjustments
+.block-editor-gridBlock.has--backgroundColor--grey .block h2.headline {
+  padding-top: $spacing-xlarge;
+}