CodeMirror/budibase
1
0
Fork 0
mirror of synced 2024-07-03 13:30:46 +12:00
Code Issues Projects Releases Wiki Activity

Change of structure for _styles

Browse source
This commit is contained in:
Conor_Mack 2020-05-22 15:30:29 +01:00
parent d5a27c08a0
commit dd14dd6de2
8 changed files with 29 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
packages/builder/src/builderStore/generate_css.js
View file

@ -135,9 +135,11 @@ const apply_class = (id, name, styles) => `.${name}-${id} {\n${styles}\n}`
//USED IN MULTIPLE PLACES IN THE BUILDER STORE //USED IN MULTIPLE PLACES IN THE BUILDER STORE
export const generate_screen_css = component_array => { export const generate_screen_css = component_array => {
let styles = "" let styles = ""
let emptyStyles = {} let emptyStyles = { normal: {}, hover: {}, active: {}, selected: {} }
for (let i = 0; i < component_array.length; i += 1) { for (let i = 0; i < component_array.length; i += 1) {
const { _styles, _id, _children } = component_array[i] const { _styles, _id, _children, _component } = component_array[i]
// let [componentName] = _component.match(/[a-z]*$/)
debugger
const cssString = generate_css(_styles || emptyStyles) || "" const cssString = generate_css(_styles || emptyStyles) || ""
if (cssString) { if (cssString) {
styles += apply_class(_id, "element", cssString) styles += apply_class(_id, "element", cssString)

9
packages/builder/src/components/userInterface/AppPreview/CurrentItemPreview.svelte
View file

@ -60,7 +60,7 @@
_children: [ _children: [
{ {
_component: "@budibase/standard-components/container", _component: "@budibase/standard-components/container",
_styles: {}, _styles: { normal: {}, hover: {}, active: {}, selected: {} },
_id: "__screenslot__text", _id: "__screenslot__text",
_code: "", _code: "",
className: "", className: "",
@ -69,7 +69,12 @@
_children: [ _children: [
{ {
_component: "@budibase/standard-components/text", _component: "@budibase/standard-components/text",
_styles: {}, _styles: {
normal: {},
hover: {},
active: {},
selected: {},
},
_id: "__screenslot__text_2", _id: "__screenslot__text_2",
_code: "", _code: "",
text: "content", text: "content",

6
packages/builder/src/components/userInterface/DesignView.svelte
View file

@ -7,7 +7,7 @@
export let componentDefinition = {} export let componentDefinition = {}
export let onStyleChanged = () => {} export let onStyleChanged = () => {}
let selectedCategory = "desktop" let selectedCategory = "normal"
const getProperties = name => panelDefinition[name] const getProperties = name => panelDefinition[name]
@ -16,8 +16,7 @@
} }
const buttonProps = [ const buttonProps = [
{ value: "desktop", text: "Desktop" }, { value: "normal", text: "Normal" },
{ value: "mobile", text: "Mobile" },
{ value: "hover", text: "Hover" }, { value: "hover", text: "Hover" },
{ value: "active", text: "Active" }, { value: "active", text: "Active" },
{ value: "selected", text: "Selected" }, { value: "selected", text: "Selected" },
@ -38,6 +37,7 @@
<PropertyGroup <PropertyGroup
name={groupName} name={groupName}
properties={getProperties(groupName)} properties={getProperties(groupName)}
styleCategory={selectedCategory}
{onStyleChanged} {onStyleChanged}
{componentDefinition} {componentDefinition}
{componentInstance} /> {componentInstance} />

1
packages/builder/src/components/userInterface/PropertyGroup.svelte
View file

@ -3,6 +3,7 @@
import PropertyControl from "./PropertyControl.svelte" import PropertyControl from "./PropertyControl.svelte"
export let name = "" export let name = ""
export let styleCategory = "normal"
export let properties = [] export let properties = []
export let componentInstance = {} export let componentInstance = {}
export let onStyleChanged = () => {} export let onStyleChanged = () => {}

4
packages/builder/src/components/userInterface/pagesParsing/createProps.js
View file

@ -24,7 +24,7 @@ export const createProps = (componentDefinition, derivedFromProps) => {
const props = { const props = {
_id: uuid(), _id: uuid(),
_component: componentDefinition._component, _component: componentDefinition._component,
_styles: {}, _styles: { normal: {}, hover: {}, active: {}, selected: {} },
_code: "", _code: "",
} }
@ -71,7 +71,7 @@ export const makePropsSafe = (componentDefinition, props) => {
} }
if (!props._styles) { if (!props._styles) {
props._styles = {} props._styles = { normal: {}, hover: {}, active: {}, selected: {} }
} }
return props return props

6
packages/cli/src/commands/new/appDirectoryTemplate/pages/main/page.json
View file

@ -9,8 +9,10 @@
"_id": 0, "_id": 0,
"type": "div", "type": "div",
"_styles": { "_styles": {
"layout": {}, "normal": {},
"position": {} "hover": {},
"active": {},
"selected": {}
}, },
"_code": "" "_code": ""
}, },

6
packages/cli/src/commands/new/appDirectoryTemplate/pages/unauthenticated/page.json
View file

@ -9,8 +9,10 @@
"_id": 1, "_id": 1,
"type": "div", "type": "div",
"_styles": { "_styles": {
"layout": {}, "normal": {},
"position": {} "hover": {},
"active": {},
"selected": {}
}, },
"_code": "" "_code": ""
}, },

6
packages/cli/src/commands/new/page.template.json
View file

@ -9,8 +9,10 @@
"_id": 0, "_id": 0,
"type": "div", "type": "div",
"_styles": { "_styles": {
"layout": {}, "normal": {},
"position": {} "hover": {},
"active": {},
"selected": {}
}, },
"_code": "" "_code": ""
}, },