#39, Add expand and tabs shortcodes

3 files changed, 54 insertions, 1 deletions

diff --git a/assets/_markdown.scss b/assets/_markdown.scss
index 0d4ecc8..2844d22 100644
--- a/assets/_markdown.scss
+++ b/assets/_markdown.scss
@@ -10,7 +10,7 @@ $block-border-radius: 0.15rem;
     line-height: 1.25;
 
     // remove padding at the beginning of page
-    &:first-child { 
+    &> :first-child { 
       margin-top: 0;
       line-height: 1em;
     }
diff --git a/assets/_shortcode.scss b/assets/_shortcode.scss
new file mode 100644
index 0000000..3174bc4
--- /dev/null
+++ b/assets/_shortcode.scss
@@ -0,0 +1,52 @@
+@import "variables";
+
+.markdown-inner {
+  :first-child {
+    margin-top: 0;
+  }
+  :last-child {
+    margin-bottom: 0;
+  }
+}
+
+.book-expand {
+  border: 1px solid $gray-200;
+
+  .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;
+  }
+}
+
+.book-tabs {
+  border: 1px solid $gray-200;
+
+  .book-tabs-head {
+    border-bottom: $padding-1 solid $gray-100;
+
+    label {
+      display: inline-block;
+      padding: $padding-8 $padding-16;
+      cursor: pointer;
+    }
+  }
+
+  .book-tabs-content {
+    padding: $padding-16;
+    display: none;
+  }
+
+  input[type="radio"]:checked + .book-tabs-content {
+    display: block;
+  }
+}
diff --git a/assets/book.scss b/assets/book.scss
index 350088d..433970f 100644
--- a/assets/book.scss
+++ b/assets/book.scss
@@ -1,6 +1,7 @@
 @import "normalize";
 @import "variables";
 @import "markdown";
+@import "shortcode";
 @import "utils";
 
 html {