Merge pull request #975 from Budibase/optional-autoscreens

Optional autoscreens

packages/builder/src/components/backend/TableNavigator/modals/CreateTableModal.svelte

@@ -1,8 +1,8 @@
 <script>
-  import { goto, params } from "@sveltech/routify"
+  import { goto } from "@sveltech/routify"
   import { backendUiStore, store } from "builderStore"
   import { notifier } from "builderStore/store/notifications"
-  import { Input, Label, ModalContent } from "@budibase/bbui"
+  import { Input, Label, ModalContent, Toggle } from "@budibase/bbui"
   import TableDataImport from "../TableDataImport.svelte"
   import analytics from "analytics"
   import screenTemplates from "builderStore/store/screenTemplates"
@@ -20,6 +20,7 @@
   let name
   let dataImport
   let error = ""
+  let createAutoscreens = true
 
   function checkValid(evt) {
     const tableName = evt.target.value
@@ -48,6 +49,7 @@
     analytics.captureEvent("Table Created", { name })
 
     // Create auto screens
+    if (createAutoscreens) {
       const screens = screenTemplates($store, [table])
         .filter(template => defaultScreens.includes(template.id))
         .map(template => template.create())
@@ -65,6 +67,7 @@
         listScreen.routing.route,
         table.name
       )
+    }
 
     // Navigate to new table
     $goto(`./table/${table._id}`)
@@ -83,6 +86,9 @@
     on:input={checkValid}
     bind:value={name}
     {error} />
+  <Toggle
+    text="Generate screens in the design section"
+    bind:checked={createAutoscreens} />
   <div>
     <Label grey extraSmall>Create Table from CSV (Optional)</Label>
     <TableDataImport bind:dataImport />

packages/client/src/utils/styleable.js

@@ -36,7 +36,7 @@ const addBuilderPreviewStyles = (styleString, componentId, selectable) => {
 
     // Highlighted selected element
     if (componentId === state.selectedComponentId) {
-      str += `;box-shadow: 0 0 0 ${selectedComponentWidth}px ${selectedComponentColor} inset !important;`
+      str += `;border: ${selectedComponentWidth}px solid ${selectedComponentColor} !important;`
     }
   }