diff --git a/src/ColumnsBlock/ColumnVariations.jsx b/src/ColumnsBlock/ColumnVariations.jsx index b26f1c7..de904ec 100644 --- a/src/ColumnsBlock/ColumnVariations.jsx +++ b/src/ColumnsBlock/ColumnVariations.jsx @@ -6,11 +6,11 @@ export default ({ data, onChange, children, variants }) => { return (

Select layout:

- + {variants.map(({ icon, defaultData, title }, index) => ( onChange(defaultData)}> - + {title ?

{title}

: ''}
diff --git a/src/ColumnsBlock/icons/full-column.svg b/src/ColumnsBlock/icons/full-column.svg new file mode 100644 index 0000000..4875648 --- /dev/null +++ b/src/ColumnsBlock/icons/full-column.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/ColumnsBlock/styles.less b/src/ColumnsBlock/styles.less index 41f8bfc..6a559cf 100644 --- a/src/ColumnsBlock/styles.less +++ b/src/ColumnsBlock/styles.less @@ -6,6 +6,12 @@ // } } + .block-column .ui.block.inner { + .block { + margin-bottom: 0; + } + } + .column-grid { margin-left: -0.2rem!important; margin-right: -0.2rem!important; @@ -107,10 +113,18 @@ margin-bottom: 8px; position: absolute; margin-top: -34px; - z-index: 10; + z-index: 160; right: 0px; - .ui.basic.button { + .wrapper-column-block { + > .ui.basic.button { + &:hover { + background-color: transparent!important; + } + } + } + + >.ui.basic.button { &:hover { background-color: transparent!important; } diff --git a/src/grid.js b/src/grid.js index 82efa90..21a1c47 100644 --- a/src/grid.js +++ b/src/grid.js @@ -4,6 +4,7 @@ import iconC from './ColumnsBlock/icons/one-third-right.svg'; import iconD from './ColumnsBlock/icons/three-third-columns.svg'; import iconE from './ColumnsBlock/icons/three-columns.svg'; import iconF from './ColumnsBlock/icons/four-quarter-columns.svg'; +import iconG from './ColumnsBlock/icons/full-column.svg'; export const gridSizes = { full: { @@ -93,7 +94,7 @@ export const variants = [ title: '25 / 25 / 25 / 25', }, { - icon: iconF, + icon: iconG, defaultData: { gridSize: 12, gridCols: ['full'],