Fix various spacings in markdown in shartcodes

1 files changed, 88 insertions, 0 deletions

diff --git a/assets/_shortcodes.scss b/assets/_shortcodes.scss
new file mode 100644
index 0000000..2ec5712
--- /dev/null
+++ b/assets/_shortcodes.scss
@@ -0,0 +1,88 @@
+@import 'variables';
+
+.markdown-inner { // Util class to remove extra margin in nested markdown content
+  > :first-child {
+    margin-top: 0;
+  }
+  > :last-child {
+    margin-bottom: 0;
+  }
+}
+
+// {{< expand "Label" "icon" >}}
+.book-expand {
+  border: 1px solid $gray-200;
+  margin-top: $padding-16;
+  margin-bottom: $padding-16;
+
+  .book-expand-head {
+    background: $gray-100;
+    padding: $padding-8 $padding-16;
+    cursor: pointer;
+  }
+
+  .book-expand-content {
+    display: none;
+    padding: $padding-16;
+  }
+
+  input[type="checkbox"]:checked + .book-expand-content {
+    display: block;
+  }
+}
+
+// {{< tabs >}}
+.book-tabs {
+  border: 1px solid $gray-200;
+  display: flex;
+  flex-wrap: wrap;
+
+  label {
+    display: inline-block;
+    padding: $padding-8 $padding-16;
+    border-bottom: $padding-1 transparent;
+    cursor: pointer;
+  }
+
+  .book-tabs-content {
+    order: 999; //Move content blocks to the end
+    width: 100%;
+    border-top: $padding-1 solid $gray-100;
+    padding: $padding-16;
+    display: none;
+  }
+
+  input[type="radio"]:checked + label {
+    border-bottom: $padding-1 solid $color-link;
+  }
+  input[type="radio"]:checked + label + .book-tabs-content {
+    display: block;
+  }
+}
+
+// {{< columns >}}
+.book-columns {
+  margin-top: $padding-16;
+  margin-bottom: $padding-16;
+}
+.book-columns > {
+  div {
+    max-width: 50%;
+  }
+  div + div {
+    margin-left: $padding-16 * 2;
+  }
+}
+
+// {{< button >}}
+a.book-btn {
+  display: inline-block;
+  color: $color-link !important;
+  text-decoration: none !important;
+  border: $padding-1 solid $color-link;
+  border-radius: $padding-4;
+  padding: $padding-4 $padding-16;
+  margin-top: $padding-8;
+  margin-bottom: $padding-8;
+  cursor: pointer;
+}