Editor and elemental improvements

dist/css/app.css

@@ -16161,7 +16161,21 @@ h6,
 .typography td,
 .typography img,
 .typography iframe {
-  max-width: 100%;
+  max-width: 100% !important;
+}
+
+@media (max-width: 575px) {
+  .typography div,
+  .typography table,
+  .typography p,
+  .typography tr,
+  .typography th,
+  .typography td,
+  .typography img,
+  .typography iframe {
+    display: block;
+    width: 100% !important;
+  }
 }
 
 .typography > *:last-child {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@a2nt/ss-bootstrap-ui-webpack-boilerplate",
-  "version": "1.9.0",
+  "version": "1.9.2",
   "author": "Tony Air <tony@twma.pro>",
   "license": "MIT",
   "description": "This UI Kit allows you to build Bootstrap 4 webapp with some extra UI features. It's easy to extend and easy to convert HTML templates to CMS templates.",

src/scss/_components/_ui.elemental.scss

@@ -1,6 +1,9 @@
 /*
  * Basic styles for silverstripe-elemental
  */
+.blog-post-info {
+    position: relative;
+}
 
 // add top/bottom paddings for basic elements
 .element {
@@ -62,3 +65,15 @@
         padding-right: 0;
     }
 }
+
+.element {
+    .elemental-area {
+        .element {
+            .container,
+            .container-fluid {
+                padding: 0;
+                width: auto;
+            }
+        }
+    }
+}

src/scss/types/editor.scss

@@ -121,5 +121,9 @@ th,
 td,
 img,
 iframe {
-    max-width: 100%;
+    max-width: 100% !important;
+    @media (max-width: map-get($grid-breakpoints, 'sm') - 1) {
+        display: block;
+        width: 100% !important;
+    }
 }