MirrorSave
/
budibase
mirror of https://github.com/Budibase/budibase.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Add flex design property and fix existing default layout

This commit is contained in:
Andrew Kingston 2020-10-13 17:46:18 +01:00
parent bb997eaf26
commit 650ace2f9e
4 changed files with 44 additions and 47 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
packages/builder/src/components/userInterface/AppPreview/CurrentItemPreview.svelte
View File

@ -28,7 +28,9 @@
_id: "screenslot-placeholder", _id: "screenslot-placeholder",
_component: "@budibase/standard-components/container", _component: "@budibase/standard-components/container",
_styles: { _styles: {
normal: {}, normal: {
flex: "1 1 auto",
},
hover: {}, hover: {},
active: {}, active: {},
selected: {}, selected: {},
@ -46,6 +48,7 @@
display: "flex", display: "flex",
"flex-direction": "column", "flex-direction": "column",
"align-items": "center", "align-items": "center",
flex: "1 1 auto",
}, },
hover: {}, hover: {},
active: {}, active: {},

18
packages/builder/src/components/userInterface/AppPreview/iframeTemplate.js
View File

@ -11,21 +11,6 @@ export default `<html>
*, *:before, *:after { *, *:before, *:after {
box-sizing: border-box; box-sizing: border-box;
} }
.lay-__screenslot__text {
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
padding: 20px 0;
border: dashed 2px #ccc;
font-family: sans-serif;
font-size: 1.2rem;
color: #999;
text-transform: uppercase;
font-weight: bold;
}
.container-screenslot-placeholder { .container-screenslot-placeholder {
display: flex; display: flex;
align-items: center; align-items: center;
@ -36,9 +21,8 @@ export default `<html>
border-width: 1px; border-width: 1px;
color: #000000; color: #000000;
background: #fafafa; background: #fafafa;
height: 94%; flex: 1 1 auto;
} }
.container-screenslot-placeholder span { .container-screenslot-placeholder span {
display: block; display: block;
margin-bottom: 10px; margin-bottom: 10px;

10
packages/builder/src/components/userInterface/propertyCategories.js
View File

@ -261,6 +261,16 @@ export const padding = [
] ]
export const size = [ export const size = [
{
label: "Flex",
key: "flex",
control: OptionSelect,
defaultValue: "0 1 auto",
options: [
{ label: "Shrink", value: "0 1 auto" },
{ label: "Grow", value: "1 1 auto" },
],
},
{ {
label: "Width", label: "Width",
key: "width", key: "width",

14
packages/server/src/utilities/appDirectoryTemplate/pages/main/page.json
View File

@ -62,10 +62,11 @@
"_component": "##builtin/screenslot", "_component": "##builtin/screenslot",
"_styles": { "_styles": {
"normal": { "normal": {
"padding": "0px", "flex": "1 1 auto",
"align-items": "flex-start", "display": "flex",
"height": "100vh", "flex-direction": "column",
"background-image": "None" "justify-content": "flex-start",
"align-items": "stretch"
}, },
"hover": {}, "hover": {},
"active": {}, "active": {},
@ -84,10 +85,9 @@
"flex-direction": "column", "flex-direction": "column",
"align-items": "stretch", "align-items": "stretch",
"justify-content": "flex-start", "justify-content": "flex-start",
"height": "",
"max-width": "",
"margin-right": "auto", "margin-right": "auto",
"margin-left": "auto" "margin-left": "auto",
"min-height": "100%"
}, },
"selected": {} "selected": {}
}, },