Fix some styles

eea · Oct 1, 2020 · 284b9d5 · 284b9d5
1 parent f9f2e2a
commit 284b9d5
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 9 deletions.
diff --git a/src/ColumnsBlock/ColumnsBlockView.jsx b/src/ColumnsBlock/ColumnsBlockView.jsx
@@ -23,12 +23,14 @@ const ColumnsBlockView = (props) => {
         {columnList.map(([id, column], index) => {
           return (
             <Grid.Column
-              className="demo-column"
+              className="columns-block-column"
               key={id}
               {...(gridSizes[gridCols[index]] || gridCols[index])}
             >
-              <div className="column-bocks-wrapper"
-                   style={getStyle(column.settings || {})}>
+              <div
+                className="column-blocks-wrapper"
+                style={getStyle(column.settings || {})}
+              >
                 {/* <h4>{`Column ${index}`}</h4> */}
                 <RenderBlocks {...props} content={column} />
               </div>

diff --git a/src/ColumnsBlock/styles.less b/src/ColumnsBlock/styles.less
@@ -5,6 +5,7 @@
     //   padding: 4px !important;
     // }
   }
+
   .block-column {
     padding: 0.3em;
 
@@ -16,7 +17,7 @@
     // }
 
     .blocks-form {
-      padding: 0.8rem!important;
+      padding: 0.8rem !important;
     }
 
     .block {
@@ -29,7 +30,7 @@
   .ui.cards a.card,
   .ui.link.cards .card,
   a.ui.card,
-  .ui.link.card{
+  .ui.link.card {
     box-shadow: none;
     border: 1px solid #edf2f3;
     &:hover {
@@ -40,15 +41,18 @@
   }
 
   .ui.card .content {
-    text-align: center;
     font-size: 10px !important;
+    text-align: center;
+
     padding-top: 1.5em !important;
     padding-bottom: 1.5em !important;
 
-    p {color:#717171}
+    p {
+      color: #717171;
+    }
 
     svg {
-      fill: #68778D!important;
+      fill: #68778d !important;
     }
   }
 
@@ -57,19 +61,28 @@
   }
 }
 
-.column-bocks-wrapper {
+.column-blocks-wrapper {
   padding: 1rem;
 }
 
 .columns-view {
   .ui.grid.column-block-grid {
     display: initial !important;
   }
+  .column-blocks-wrapper {
+    padding: 0rem;
+  }
+
+  .columns-block-column {
+    overflow: auto;
+  }
 }
 
 .ui.grid.column-grid {
   margin-left: -0.5rem;
   margin-right: -0.5rem;
+  margin-top: 0px;
+  margin-bottom: 0px;
 
   .column:not(.row),
   > .row > .column {