Padding and margin fix

This commit is contained in:
Joe 2020-06-01 21:18:43 +01:00
parent 28bf917210
commit 400f8b42e4
3 changed files with 16 additions and 13 deletions

View File

@ -1,3 +1,5 @@
import {toNumber} from "lodash/fp"
export const generate_screen_css = component_arr => { export const generate_screen_css = component_arr => {
let styles = "" let styles = ""
for (const { _styles, _id, _children, _component } of component_arr) { for (const { _styles, _id, _children, _component } of component_arr) {
@ -37,7 +39,7 @@ export const generate_css = style => {
export const generate_array_styles = item => { export const generate_array_styles = item => {
let safeItem = item === "" ? 0 : item let safeItem = item === "" ? 0 : item
let hasPx = new RegExp("px$") let hasPx = new RegExp("px$")
if (!hasPx.test(safeItem)) { if (!hasPx.test(safeItem) && !isNaN(toNumber(safeItem))) {
return `${safeItem}px` return `${safeItem}px`
} else { } else {
return safeItem return safeItem

View File

@ -4,7 +4,7 @@
export let meta = [] export let meta = []
export let label = "" export let label = ""
export let value = [0, 0, 0, 0] export let value = [0, 0, 0, 0]
export let type = "number" export let type = "text"
export let onChange = () => {} export let onChange = () => {}
function handleChange(val, idx) { function handleChange(val, idx) {
@ -28,8 +28,6 @@
</div> </div>
<style> <style>
.input-container {
}
.label { .label {
flex: 0; flex: 0;
@ -53,18 +51,17 @@
border: 1px solid var(--grey); border: 1px solid var(--grey);
border-radius: 2px; border-radius: 2px;
outline: none; outline: none;
float: right;
} }
input[type="number"]::-webkit-inner-spin-button, input[type="text"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button { input[type="text"]::-webkit-outer-spin-button {
-webkit-appearance: none; -webkit-appearance: none;
-moz-appearance: none; -moz-appearance: none;
appearance: none; appearance: none;
margin: 0; margin: 0;
} }
input[type="number"] { input[type="text"] {
-moz-appearance: textfield; -moz-appearance: textfield;
} }

View File

@ -26,7 +26,7 @@ export const layout = [
options: [ options: [
{ label: "Row", value: "row" }, { label: "Row", value: "row" },
{ label: "Row Reverse", value: "rowReverse" }, { label: "Row Reverse", value: "rowReverse" },
{ label: "column", value: "column" }, { label: "Column", value: "column" },
{ label: "Column Reverse", value: "columnReverse" }, { label: "Column Reverse", value: "columnReverse" },
], ],
}, },
@ -71,14 +71,18 @@ export const layout = [
] ]
const spacingMeta = [ const spacingMeta = [
{ placeholder: "L" },
{ placeholder: "B" },
{ placeholder: "R" },
{ placeholder: "T" }, { placeholder: "T" },
{ placeholder: "R" },
{ placeholder: "B" },
{ placeholder: "L" },
] ]
export const spacing = [ export const spacing = [
{ label: "Margin", key: "margin", control: InputGroup, meta: spacingMeta }, { label: "Margin",
key: "margin",
control: InputGroup,
meta: spacingMeta
},
{ {
label: "Padding", label: "Padding",
key: "padding", key: "padding",