Added examples, updated docs for image gallery api endpoints

[bookstack] / resources / sass / _layout.scss

diff --git a/resources/sass/_layout.scss b/resources/sass/_layout.scss
index d4413d32c493cd4694a7401022dd0c855bb0eb4e..19333faf71baf7c4a6d69e7cfda11a3e4e7902cd 100644 (file)
--- a/resources/sass/_layout.scss
+++ b/resources/sass/_layout.scss
@@ -144,6 +144,10 @@ body.flexbox {
   flex-direction: column;
 }
 
+.flex-container-row.inline, .flex-container-column.inline {
+  display: inline-flex !important;
+}
+
 .flex-container-column.wrap, .flex-container-row.wrap {
   flex-wrap: wrap;
 }
@@ -156,6 +160,11 @@ body.flexbox {
     flex-basis: auto;
     flex-grow: 0;
   }
+  &.fill-area {
+    flex-grow: 1;
+    flex-shrink: 0;
+    min-width: fit-content;
+  }
 }
 
 .flex-2 {
@@ -189,10 +198,22 @@ body.flexbox {
 .items-center {
   align-items: center;
 }
+.items-stretch {
+  align-items: stretch;
+}
 
 /**
  * Min width utilities
  */
+.min-width-xxxxs {
+  min-width: 60px;
+}
+.min-width-xxxs {
+  min-width: 80px;
+}
+.min-width-xxs {
+  min-width: 100px;
+}
 .min-width-xs {
   min-width: 120px;
 }
@@ -247,6 +268,11 @@ body.flexbox {
   }
 }
 
+.sticky-top-m {
+  position: sticky;
+  top: $-m;
+}
+
 /**
  * Visibility
  */
@@ -407,7 +433,7 @@ body.flexbox {
     display: none;
   }
   .tri-layout-left-contents > *, .tri-layout-right-contents > * {
-    @include lightDark(opacity, 0.6, 0.7);
+    @include lightDark(opacity, 0.6, 0.75);
     transition: opacity ease-in-out 120ms;
     &:hover, &:focus-within {
       opacity: 1 !important;
@@ -416,7 +442,6 @@ body.flexbox {
       opacity: 1 !important;
     }
   }
-
 }
 
 @include smaller-than($m) {