Add ability to toggle block border

client/web/compose/src/components/PageBlocks/Configurator.vue

@@ -90,6 +90,13 @@
         >
           {{ $t('general.wrap') }}
         </b-form-checkbox>
+
+        <b-form-checkbox
+          v-model="block.style.border.enabled"
+          switch
+        >
+          {{ $t('general.border') }}
+        </b-form-checkbox>
       </div>
     </b-tab>
 

client/web/compose/src/components/PageBlocks/Wrap/Card.vue

@@ -2,7 +2,7 @@
   <div class="h-100 p-2">
     <b-card
       no-body
-      class="h-100 border-0 shadow"
+      class="h-100 shadow"
       :class="blockClass"
     >
       <b-card-header
@@ -87,6 +87,7 @@ export default {
     blockClass () {
       return [
         'block',
+        { border: this.block.style.border.enabled },
         this.block.kind,
       ]
     },

client/web/compose/src/components/PageBlocks/Wrap/Plain.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="h-100 p-2">
     <div
-      class="d-flex flex-column border position-relative h-100 card bg-transparent"
+      class="card bg-transparent h-100"
       :class="blockClass"
     >
       <div
@@ -83,6 +83,7 @@ export default {
     blockClass () {
       return [
         'block',
+        { border: this.block.style.border.enabled },
         this.block.kind,
       ]
     },

lib/js/src/compose/types/page-block/base.ts

@@ -9,9 +9,14 @@ interface PageBlockStyleWrap {
   kind: string;
 }
 
+interface PageBlockStyleBorder {
+  enabled?: boolean;
+}
+
 interface PageBlockStyle {
   variants: PageBlockStyleVariants;
   wrap?: PageBlockStyleWrap;
+  border?: PageBlockStyleBorder;
 }
 
 export type PageBlockInput = PageBlock | Partial<PageBlock>
@@ -35,6 +40,9 @@ export class PageBlock {
     wrap: {
       kind: 'card',
     },
+    border: {
+      enabled: false,
+    },
   }
 
   constructor (i?: PageBlockInput) {

locale/en/corteza-webapp-compose/block.yaml

@@ -114,6 +114,7 @@ general:
   descriptionPlaceholder: Block description
   headerStyle: Block header style (color)
   wrap: Display block as a card
+  border: Show border
   label:
     add: Add
     back: Back

server/compose/types/page.go

@@ -71,8 +71,9 @@ type (
 	}
 
 	PageBlockStyle struct {
-		Variants map[string]string `json:"variants,omitempty"`
-		Wrap     map[string]string `json:"wrap,omitempty"`
+		Variants map[string]string      `json:"variants,omitempty"`
+		Wrap     map[string]string      `json:"wrap,omitempty"`
+		Border   map[string]interface{} `json:"border,omitempty"`
 	}
 
 	PageButton struct {