From 51fe10a77c2f12adbcb9621c83134c39077e9fd6 Mon Sep 17 00:00:00 2001
From: thingsym <thingsym@gmail.com>
Date: Sun, 22 Nov 2020 16:21:47 +0900
Subject: [PATCH 1/8] chore: add dart-sass

---
 package-lock.json | 39 ++++++++++++++++++++++++---------------
 package.json      |  3 ++-
 2 files changed, 26 insertions(+), 16 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index a083f06..e597815 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -3869,6 +3869,12 @@
         }
       }
     },
+    "dlv": {
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/dlv/-/dlv-1.1.3.tgz",
+      "integrity": "sha512-+HlytyjlPKnIG8XuRG8WvmBP8xs8P71y+SKKS6ZXWoEgLuePxtDoUEiH7WkdePWrQ5JBpE6aoVqfZfJUQkjXwA==",
+      "dev": true
+    },
     "doctrine": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/doctrine/-/doctrine-3.0.0.tgz",
@@ -4003,12 +4009,12 @@
       }
     },
     "eazy-logger": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/eazy-logger/-/eazy-logger-3.0.2.tgz",
-      "integrity": "sha1-oyWqXlPROiIliJsqxBE7K5Y29Pw=",
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/eazy-logger/-/eazy-logger-3.1.0.tgz",
+      "integrity": "sha512-/snsn2JqBtUSSstEl4R0RKjkisGHAhvYj89i7r3ytNUKW12y178KDZwXLXIgwDqLW6E/VRMT9qfld7wvFae8bQ==",
       "dev": true,
       "requires": {
-        "tfunk": "^3.0.1"
+        "tfunk": "^4.0.0"
       }
     },
     "ecc-jsbn": {
@@ -10380,12 +10386,6 @@
       "integrity": "sha512-NuAESUOUMrlIXOfHKzD6bpPu3tYt3xvjNdRIQ+FeT0lNb4K8WR70CaDxhuNguS2XG+GjkyMwOzsN5ZktImfhLA==",
       "dev": true
     },
-    "object-path": {
-      "version": "0.9.2",
-      "resolved": "https://registry.npmjs.org/object-path/-/object-path-0.9.2.tgz",
-      "integrity": "sha1-D9mnT8X60a45aLWGvaXGMr1sBaU=",
-      "dev": true
-    },
     "object-visit": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/object-visit/-/object-visit-1.0.1.tgz",
@@ -12832,6 +12832,15 @@
       "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==",
       "dev": true
     },
+    "sass": {
+      "version": "1.29.0",
+      "resolved": "https://registry.npmjs.org/sass/-/sass-1.29.0.tgz",
+      "integrity": "sha512-ZpwAUFgnvAUCdkjwPREny+17BpUj8nh5Yr6zKPGtLNTLrmtoRYIjm7njP24COhjJldjwW1dcv52Lpf4tNZVVRA==",
+      "dev": true,
+      "requires": {
+        "chokidar": ">=2.0.0 <4.0.0"
+      }
+    },
     "sass-graph": {
       "version": "2.2.5",
       "resolved": "https://registry.npmjs.org/sass-graph/-/sass-graph-2.2.5.tgz",
@@ -14582,13 +14591,13 @@
       "dev": true
     },
     "tfunk": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/tfunk/-/tfunk-3.1.0.tgz",
-      "integrity": "sha1-OORBT8ZJd9h6/apy+sttKfgve1s=",
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/tfunk/-/tfunk-4.0.0.tgz",
+      "integrity": "sha512-eJQ0dGfDIzWNiFNYFVjJ+Ezl/GmwHaFTBTjrtqNPW0S7cuVDBrZrmzUz6VkMeCR4DZFqhd4YtLwsw3i2wYHswQ==",
       "dev": true,
       "requires": {
-        "chalk": "^1.1.1",
-        "object-path": "^0.9.0"
+        "chalk": "^1.1.3",
+        "dlv": "^1.1.3"
       },
       "dependencies": {
         "ansi-styles": {
diff --git a/package.json b/package.json
index 07515dd..753835e 100644
--- a/package.json
+++ b/package.json
@@ -7,10 +7,10 @@
   "license": "MIT",
   "dependencies": {},
   "devDependencies": {
-    "autoprefixer": "^9.8.6",
     "@babel/core": "^7.11.6",
     "@babel/plugin-transform-runtime": "^7.11.5",
     "@babel/preset-env": "^7.11.5",
+    "autoprefixer": "^9.8.6",
     "babel-eslint": "^10.1.0",
     "babel-loader": "^8.1.0",
     "browser-sync": "~2.26.12",
@@ -36,6 +36,7 @@
     "npm-run-all": "^4.1.5",
     "postcss-cli": "^7.1.2",
     "run-sequence": "~2.2.1",
+    "sass": "^1.29.0",
     "stylelint": "^13.7.0",
     "stylelint-config-recommended": "^3.0.0",
     "stylelint-config-recommended-scss": "^4.2.0",

From 9ca28024bc70ca22e25d888b25e1a5f894c31c02 Mon Sep 17 00:00:00 2001
From: thingsym <thingsym@gmail.com>
Date: Sun, 22 Nov 2020 16:23:38 +0900
Subject: [PATCH 2/8] fix: fix npm scripts for dart-sass

---
 package.json | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/package.json b/package.json
index 753835e..e37b0b0 100644
--- a/package.json
+++ b/package.json
@@ -106,10 +106,10 @@
     "build:js": "npm-run-all -p webpack",
     "build:css": "run-p sass:**",
     "webpack": "cross-env BABEL_ENV=default NODE_ENV=production webpack",
-    "sass:style": "node-sass src/scss/theme.scss static/css/theme.css --output-style expanded && postcss --use autoprefixer --no-map -r static/css/theme.css",
-    "sass:style:minify": "node-sass src/scss/theme.scss static/css/theme.min.css --output-style expanded && postcss --use autoprefixer --use cssnano --no-map -r static/css/theme.min.css",
-    "sass:chroma": "node-sass src/scss/chroma.scss static/css/chroma.css --output-style expanded && postcss --use autoprefixer --no-map -r static/css/chroma.css",
-    "sass:chroma:minify": "node-sass src/scss/chroma.scss static/css/chroma.min.css --output-style expanded && postcss --use autoprefixer --use cssnano --no-map -r static/css/chroma.min.css",
+    "sass:style": "sass src/scss/theme.scss static/css/theme.css --style expanded --no-source-map && postcss --use autoprefixer --no-map -r static/css/theme.css",
+    "sass:style:minify": "sass src/scss/theme.scss static/css/theme.min.css --style expanded --no-source-map && postcss --use autoprefixer --use cssnano --no-map -r static/css/theme.min.css",
+    "sass:chroma": "sass src/scss/chroma.scss static/css/chroma.css --style expanded --no-source-map && postcss --use autoprefixer --no-map -r static/css/chroma.css",
+    "sass:chroma:minify": "sass src/scss/chroma.scss static/css/chroma.min.css --style expanded --no-source-map && postcss --use autoprefixer --use cssnano --no-map -r static/css/chroma.min.css",
     "lint": "run-p lint:*",
     "lint:es": "eslint static/js/bundle.js",
     "lint:es:fix": "eslint static/js/bundle.js --fix",

From 7f7d6115716b083c5d6d72b122d6b679987520c3 Mon Sep 17 00:00:00 2001
From: thingsym <thingsym@gmail.com>
Date: Sun, 22 Nov 2020 16:34:46 +0900
Subject: [PATCH 3/8] perf: replace scss from node-sass to dart-sass

---
 src/scss/_component.scss               | 71 +++++++++++++++-----------
 src/scss/_foundation.scss              |  4 --
 src/scss/_function.scss                |  4 --
 src/scss/_project.scss                 | 39 ++++++++------
 src/scss/_structure.scss               | 29 +++++++----
 src/scss/_variable.scss                |  6 ++-
 src/scss/foundation/_element.scss      | 53 ++++++++++---------
 src/scss/foundation/_index.scss        |  4 ++
 src/scss/foundation/_stack.scss        | 33 ++++++++----
 src/scss/function/_calc-font-size.scss | 17 +++---
 src/scss/function/_calc-stack.scss     | 27 ++++++----
 src/scss/function/_contrast-color.scss | 12 +++--
 src/scss/function/_index.scss          |  4 ++
 src/scss/function/_strip-unit.scss     | 10 ++--
 src/scss/theme.scss                    | 13 ++---
 15 files changed, 192 insertions(+), 134 deletions(-)
 delete mode 100644 src/scss/_foundation.scss
 delete mode 100644 src/scss/_function.scss
 create mode 100644 src/scss/foundation/_index.scss
 create mode 100644 src/scss/function/_index.scss

diff --git a/src/scss/_component.scss b/src/scss/_component.scss
index 59c9013..d6eb4bc 100644
--- a/src/scss/_component.scss
+++ b/src/scss/_component.scss
@@ -1,5 +1,15 @@
+// Built-In Modules
+@use 'sass:map';
+
+// Custom Modules
+@use '../../node_modules/flexbox-grid-mixins/sass/flexbox-grid-mixins';
+
+// Included Modules
+@use 'variable';
+@use 'foundation/stack';
+
 main * {
-	@extend .first-stack;
+	@extend %first-stack;
 }
 
 main {
@@ -14,18 +24,18 @@ main {
 		+ blockquote,
 		+ pre,
 		+ figure {
-			@extend .stack;
+			@extend %stack;
 		}
 	}
 
 	li > ul,
 	li > ol {
-		@extend .unset-stack;
+		@extend %unset-stack;
 	}
 }
 
 figure > figcaption {
-	@extend .none-stack;
+	@extend %none-stack;
 }
 
 .table_of_contents,
@@ -38,14 +48,14 @@ figure > figcaption {
 .button,
 .gist,
 .twitter-tweet {
-	@extend .stack;
+	@extend %stack;
 }
 
 .pagination {
-	@include grid($flex-wrap: nowrap, $justify-content: space-between);
+	@include flexbox-grid-mixins.grid($flex-wrap: nowrap, $justify-content: space-between);
 	font-weight: bold;
 	> * {
-		@extend .none-stack;
+		@extend %none-stack;
 	}
 }
 .nav-prev {}
@@ -53,9 +63,9 @@ figure > figcaption {
 	margin-left: auto;
 }
 
-@media screen and (max-width: #{map-get($default-breakpoints, xs )} ) {
+@media screen and (max-width: #{map.get(variable.$default-breakpoints, xs )} ) {
 	.pagination {
-		@include grid($flex-flow: column nowrap, $justify-content: null, $align-items: center);
+		@include flexbox-grid-mixins.grid($flex-flow: column nowrap, $justify-content: null, $align-items: center);
 	}
 	.nav-next {
 		margin-left: 0;
@@ -67,7 +77,7 @@ figure > figcaption {
 	--panel-background-color: unset;
 	--panel-border-color: transparent;
 
-	padding: $default-layout-padding;
+	padding: variable.$default-layout-padding;
 	color: var(--panel-font-color, #000);
 	background: var(--panel-background-color, unset);
 	border: 1px solid;
@@ -80,7 +90,7 @@ figure > figcaption {
 }
 
 .panel-primary {
-	--panel-border-color: #{$default-border-color};
+	--panel-border-color: #{variable.$default-border-color};
 }
 .panel-notice {
 	--panel-font-color: #fff;
@@ -127,9 +137,9 @@ figure > figcaption {
 
 	--button-font-color: #000;
 	--button-font-hover-color: #000;
-	--button-background-color: #{$default-background-color};
+	--button-background-color: #{variable.$default-background-color};
 	--button-background-hover-color: #f7f7f7;
-	--button-border-color: #{$default-border-color};
+	--button-border-color: #{variable.$default-border-color};
 
 	color: var(--button-font-color, #000);
 	background: var(--button-background-color, unset);
@@ -137,7 +147,7 @@ figure > figcaption {
 	border-color: var(--button-border-color, transparent);
 
 	&:hover {
-		color:var(--button-font-hover-color, #000);
+		color: var(--button-font-hover-color, #000);
 		text-decoration: none;
 		background: var(--button-background-hover-color, unset);
 	}
@@ -160,7 +170,7 @@ figure > figcaption {
 .button-caution {
 	--button-font-color: #fff;
 	--button-font-hover-color: #fff;
-	--button-background-color:  #f56558;
+	--button-background-color: #f56558;
 	--button-background-hover-color: #d45145;
 	--button-border-color: transparent;
 }
@@ -174,15 +184,15 @@ figure > figcaption {
 .button-danger {
 	--button-font-color: #fff;
 	--button-font-hover-color: #fff;
-	--button-background-color:  #ce3426;
+	--button-background-color: #ce3426;
 	--button-background-hover-color: #a0281d;
 	--button-border-color: transparent;
 }
 
 .notification {
-	padding: .2rem $default-layout-padding;
+	padding: .2rem variable.$default-layout-padding;
 	text-align: center;
-	background: $sidebar-active-color;
+	background: variable.$sidebar-active-color;
 }
 
 .backtothetop {
@@ -200,15 +210,15 @@ figure > figcaption h4 {
 
 .table_of_contents {
 	font-size: 90%;
-	padding: $default-layout-padding;
-	border: 4px solid $default-border-color;
+	padding: variable.$default-layout-padding;
+	border: 4px solid variable.$default-border-color;
 
 	ul {
 		list-style: none;
 		padding-left: 0;
 	}
 	li {
-		border-top: 1px solid $default-border-color;
+		border-top: 1px solid variable.$default-border-color;
 	}
 	> nav > ul > li:first-child {
 		border-top: unset;
@@ -251,14 +261,14 @@ figure > figcaption h4 {
 	color: #70757a;
 }
 .ais-Hits-item {
-	@extend .stack;
+	@extend %stack;
 
 	h3 {
 		font-size: 140%;
 		font-weight: normal;
 	}
 	p {
-		@extend .unset-stack;
+		@extend %unset-stack;
 		color: #3C4043;
 	}
 	.lastmod {
@@ -271,19 +281,20 @@ figure > figcaption h4 {
 	margin-top: 1em;
 }
 .ais-Pagination-list {
-	@extend ul.no-style;
-	@include grid($flex-wrap: wrap, $justify-content: center);
+	list-style: none;
+	padding-left: 0;
+	@include flexbox-grid-mixins.grid($flex-wrap: wrap, $justify-content: center);
 }
 .ais-Pagination-item {
 	padding: .6rem;
 }
 
 .code {
-	@include grid($flex-wrap: wrap);
-	@extend .stack;
+	@include flexbox-grid-mixins.grid($flex-wrap: wrap);
+	@extend %stack;
 
 	.filename {
-		@include grid-col($col: 9, $flex-shrink: 0, $max-width: 75%);
+		@include flexbox-grid-mixins.grid-col($col: 9, $flex-shrink: 0, $max-width: 75%);
 		font-size: 80%;
 		color: #666;
 	}
@@ -302,10 +313,10 @@ figure > figcaption h4 {
 		outline: none;
 	}
 	.code-content {
-		@include grid-col($col: 12, $flex-shrink: 0, $max-width: 100%);
+		@include flexbox-grid-mixins.grid-col($col: 12, $flex-shrink: 0, $max-width: 100%);
 
 		.highlight {
-			@extend .none-stack;
+			@extend %none-stack;
 		}
 	}
 }
diff --git a/src/scss/_foundation.scss b/src/scss/_foundation.scss
deleted file mode 100644
index fc99f81..0000000
--- a/src/scss/_foundation.scss
+++ /dev/null
@@ -1,4 +0,0 @@
-@import "foundation/normalize";
-@import "foundation/reset";
-@import "foundation/element";
-@import "foundation/stack";
diff --git a/src/scss/_function.scss b/src/scss/_function.scss
deleted file mode 100644
index d1bb570..0000000
--- a/src/scss/_function.scss
+++ /dev/null
@@ -1,4 +0,0 @@
-@import 'function/calc-font-size';
-@import 'function/calc-stack';
-@import 'function/strip-unit';
-@import 'function/contrast-color';
diff --git a/src/scss/_project.scss b/src/scss/_project.scss
index 52186c7..2c5c444 100644
--- a/src/scss/_project.scss
+++ b/src/scss/_project.scss
@@ -1,7 +1,16 @@
+// Built-In Modules
+@use 'sass:map';
+
+// Custom Modules
+@use '../../node_modules/flexbox-grid-mixins/sass/flexbox-grid-mixins';
+
+// Included Modules
+@use 'variable';
+
 header {
 	color: var(--custom-font-color, #fff);
 	background: var(--custom-background-color, #000);
-	padding: .5rem $default-layout-padding;
+	padding: .5rem variable.$default-layout-padding;
 
 	h1 {
 		font-size: 140%;
@@ -26,7 +35,7 @@ header {
 .global-menu {
 	color: var(--custom-font-color, #fff);
 	background: var(--custom-background-color, #000);
-	padding: .2rem $default-layout-padding;
+	padding: .2rem variable.$default-layout-padding;
 
 	ul {
 		list-style: none;
@@ -48,7 +57,7 @@ header {
 		z-index: 99999;
 
 		li {
-			padding: .2rem $default-layout-padding;
+			padding: .2rem variable.$default-layout-padding;
 			background: var(--custom-background-color, #000);
 			width: 140px;
 			font-size: 80%;
@@ -63,10 +72,10 @@ header {
 		font-size: 80%;
 	}
 	li.parent:hover > ul.sub-menu {
-		@include grid($flex-flow: column nowrap);
+		@include flexbox-grid-mixins.grid($flex-flow: column nowrap);
 	}
 
-	@media screen and (max-width: #{map-get($default-breakpoints, xs )} ) {
+	@media screen and (max-width: #{map.get(variable.$default-breakpoints, xs )} ) {
 		li {
 			display: block;
 			margin-right: 0;
@@ -113,7 +122,7 @@ main {
 	padding: 3rem;
 }
 
-@media screen and (max-width: #{map-get($default-breakpoints, xs )} ) {
+@media screen and (max-width: #{map.get(variable.$default-breakpoints, xs )} ) {
 	main {
 		padding: 1rem;
 	}
@@ -122,8 +131,8 @@ main {
 .sidebar {
 	font-size: 90%;
 	line-height: 1.8;
-	background: $sidebar-background-color;
-	border-right: 1px solid $sidebar-active-color;
+	background: variable.$sidebar-background-color;
+	border-right: 1px solid variable.$sidebar-active-color;
 
 	ul {
 		list-style: none;
@@ -137,12 +146,12 @@ main {
 		color: #404040;
 		text-decoration: none;
 		padding: .2rem 1rem;
-		border-left: solid 4px $sidebar-background-color;
-		border-bottom: solid 1px $sidebar-active-color;
+		border-left: solid 4px variable.$sidebar-background-color;
+		border-bottom: solid 1px variable.$sidebar-active-color;
 
 		&:hover {
 			color: #404040;
-			background: $sidebar-hover-color;
+			background: variable.$sidebar-hover-color;
 			border-left: solid 4px #ccc;
 		}
 	}
@@ -163,14 +172,14 @@ main {
 		padding-left: 1rem + 1rem * 5;
 	}
 
-	@media screen and (max-width: #{map-get($default-breakpoints, xs )} ) {
+	@media screen and (max-width: #{map.get(variable.$default-breakpoints, xs )} ) {
 		nav > ul > li:first-child a {
-			border-top: solid 1px $sidebar-active-color;
+			border-top: solid 1px variable.$sidebar-active-color;
 		}
 	}
 
 	.active > a {
-		background: $sidebar-active-color;
+		background: variable.$sidebar-active-color;
 		border-left: solid 4px #ccc;
 	}
 
@@ -196,7 +205,7 @@ main {
 }
 
 .sidebar-footer {
-	padding: $default-layout-padding;
+	padding: variable.$default-layout-padding;
 }
 
 footer {
diff --git a/src/scss/_structure.scss b/src/scss/_structure.scss
index a2f4c84..e58fab2 100644
--- a/src/scss/_structure.scss
+++ b/src/scss/_structure.scss
@@ -1,3 +1,12 @@
+// Built-In Modules
+@use 'sass:map';
+
+// Custom Modules
+@use '../../node_modules/flexbox-grid-mixins/sass/flexbox-grid-mixins';
+
+// Included Modules
+@use 'variable';
+
 /*-----------------------*
 		Structure
 *-----------------------*/
@@ -9,40 +18,40 @@ body {
 .container {
 	width: 100%;
 	height: 100%;
-	@include grid($flex-flow: column nowrap);
+	@include flexbox-grid-mixins.grid($flex-flow: column nowrap);
 	margin: auto;
 }
 
 .content-container {
-	@include grid-col($flex-grow: 1, $flex-shrink: 0, $flex-basis: auto);
-	@include grid($justify-content: center);
+	@include flexbox-grid-mixins.grid-col($flex-grow: 1, $flex-shrink: 0, $flex-basis: auto);
+	@include flexbox-grid-mixins.grid($justify-content: center);
 }
 
 main {
-	@include grid-col($col: 9, $flex-shrink: 0, $max-width: 75%);
+	@include flexbox-grid-mixins.grid-col($col: 9, $flex-shrink: 0, $max-width: 75%);
 
 	&:only-child {
-		@include grid-col($col: 12, $flex-shrink: 0, $max-width: 100%);
+		@include flexbox-grid-mixins.grid-col($col: 12, $flex-shrink: 0, $max-width: 100%);
 	}
 }
 
 .sidebar {
-	@include grid-col($col: 3, $order: -1);
+	@include flexbox-grid-mixins.grid-col($col: 3, $order: -1);
 	// position: fixed;
 	// overflow-x: hidden;
 	overflow-x: hidden;
 	overflow-y: scroll;
 }
 
-@media screen and (max-width: #{map-get($default-breakpoints, xs )} ) {
+@media screen and (max-width: #{map.get(variable.$default-breakpoints, xs )} ) {
 	.content-container {
-		@include grid($flex-flow: column nowrap);
+		@include flexbox-grid-mixins.grid($flex-flow: column nowrap);
 	}
 
 	main {
-		@include grid-col($col: none, $flex-shrink: 0, $min-width: 100%);
+		@include flexbox-grid-mixins.grid-col($col: none, $flex-shrink: 0, $min-width: 100%);
 	}
 	.sidebar {
-		@include grid-col($col: none, $order: 1);
+		@include flexbox-grid-mixins.grid-col($col: none, $order: 1);
 	}
 }
diff --git a/src/scss/_variable.scss b/src/scss/_variable.scss
index 0e2f5a6..6c9b578 100644
--- a/src/scss/_variable.scss
+++ b/src/scss/_variable.scss
@@ -1,9 +1,11 @@
+@use 'function/calc-stack';
+
 $default-layout-width: 1024px !default;
 
 $default-font-size: 100% !default;
 $default-line-space: 8px !default;
-$default-line-height: line-height($default-line-space, $default-font-size) !default;
-$default-stack: stack($default-line-height, $default-font-size) * 4 !default;
+$default-line-height: calc-stack.line-height($default-line-space, $default-font-size) !default;
+$default-stack: calc-stack.stack($default-line-height, $default-font-size) * 4 !default;
 
 $default-layout-margin: 0 !default;
 $default-layout-padding: $default-stack !default;
diff --git a/src/scss/foundation/_element.scss b/src/scss/foundation/_element.scss
index 4b5b54c..3444edf 100644
--- a/src/scss/foundation/_element.scss
+++ b/src/scss/foundation/_element.scss
@@ -1,3 +1,6 @@
+@use '../variable';
+@use '../function/calc-stack';
+
 /*-----------------------*
 		Element v1.0.0-custom
 *-----------------------*/
@@ -6,16 +9,16 @@
 }
 
 :root {
-	font-size: $default-font-size;
-	line-height: line-height($default-line-space, $default-font-size);
-	color: $default-font-color;
-	font-family: var(--custom-font-family-base, $default-font-family);
+	font-size: variable.$default-font-size;
+	line-height: calc-stack.line-height(variable.$default-line-space, variable.$default-font-size);
+	color: variable.$default-font-color;
+	font-family: var(--custom-font-family-base, variable.$default-font-family);
 	font-feature-settings : 'pwid';
 }
 
 body {
-	background-color: $default-background-color;
-	margin: $default-layout-margin;
+	background-color: variable.$default-background-color;
+	margin: variable.$default-layout-margin;
 }
 
 h1,
@@ -24,9 +27,9 @@ h3,
 h4,
 h5,
 h6 {
-	font-family: var(--custom-font-family-headings, $default-font-family);
+	font-family: var(--custom-font-family-headings, variable.$default-font-family);
 	font-weight: bold;
-	line-height: $default-line-height;
+	line-height: variable.$default-line-height;
 
 	> small {
 		font-size: 75%;
@@ -36,37 +39,37 @@ h6 {
 
 h1 {
 	font-size: 240%;
-	line-height: line-height($default-line-space, 240%);
+	line-height: calc-stack.line-height(variable.$default-line-space, 240%);
 }
 h2 {
 	font-size: 200%;
-	line-height: line-height($default-line-space, 200%);
+	line-height: calc-stack.line-height(variable.$default-line-space, 200%);
 }
 h3 {
 	font-size: 160%;
-	line-height: line-height($default-line-space, 160%);
+	line-height: calc-stack.line-height(variable.$default-line-space, 160%);
 }
 h4 {
 	font-size: 140%;
-	line-height: line-height($default-line-space, 140%);
+	line-height: calc-stack.line-height(variable.$default-line-space, 140%);
 }
 h5 {
 	font-size: 120%;
-	line-height: line-height($default-line-space, 120%);
+	line-height: calc-stack.line-height(variable.$default-line-space, 120%);
 }
 h6 {
 	font-size: 100%;
-	line-height: line-height($default-line-space, 100%);
+	line-height: calc-stack.line-height(variable.$default-line-space, 100%);
 }
 
 a {
-	color: var(--custom-link-text-color, $default-link-text-color);
+	color: var(--custom-link-text-color, variable.$default-link-text-color);
 	text-decoration: none;
 
 	&:focus,
 	&:active,
 	&:hover {
-		color: var(--custom-link-text-hover-color, $default-link-text-hover-color);
+		color: var(--custom-link-text-hover-color, variable.$default-link-text-hover-color);
 		text-decoration: underline;
 	}
 }
@@ -78,7 +81,7 @@ hr {
 }
 
 p {
-	font-size: $default-font-size;
+	font-size: variable.$default-font-size;
 }
 
 img {
@@ -94,13 +97,13 @@ video {
 
 table {
 	border-collapse: collapse;
-	border: 1px solid $default-border-color;
+	border: 1px solid variable.$default-border-color;
 	width: 100%;
 }
 th,
 td {
-	border-top: 1px solid $default-border-color;
-	border-right: 1px solid $default-border-color;
+	border-top: 1px solid variable.$default-border-color;
+	border-right: 1px solid variable.$default-border-color;
 	tr:nth-child(even) & {
 		background: #f8f8f8;
 	}
@@ -140,9 +143,9 @@ dd {
 
 blockquote {
 	color: #999;
-	padding: $default-layout-padding;
+	padding: variable.$default-layout-padding;
 	background-color: #f4f4f4;
-	border-left: 4px solid $default-border-color;
+	border-left: 4px solid variable.$default-border-color;
 	border-radius: .2rem;
 }
 
@@ -167,7 +170,7 @@ kbd {
 
 pre {
 	background-color: #f4f4f4;
-	padding: $default-layout-padding;
+	padding: variable.$default-layout-padding;
 	overflow: auto;
 	white-space: pre-wrap;
 	border-radius: .2rem;
@@ -191,6 +194,6 @@ pre {
 
 figcaption {
 	color: #333;
-	font-size: $default-font-size;
-	line-height: line-height($default-line-space, $default-font-size);
+	font-size: variable.$default-font-size;
+	line-height: calc-stack.line-height(variable.$default-line-space, variable.$default-font-size);
 }
diff --git a/src/scss/foundation/_index.scss b/src/scss/foundation/_index.scss
new file mode 100644
index 0000000..edd558a
--- /dev/null
+++ b/src/scss/foundation/_index.scss
@@ -0,0 +1,4 @@
+@use "normalize";
+@use "reset";
+@use "element";
+@use "stack";
diff --git a/src/scss/foundation/_stack.scss b/src/scss/foundation/_stack.scss
index d7d3cb1..d9feb14 100644
--- a/src/scss/foundation/_stack.scss
+++ b/src/scss/foundation/_stack.scss
@@ -1,9 +1,11 @@
+@use '../variable';
+
 /*-----------------------*
 		stack
 *-----------------------*/
 :root {
-	--const-stack: #{$default-stack};
-	--stack-top: #{$default-stack};
+	--const-stack: #{variable.$default-stack};
+	--stack-top: #{variable.$default-stack};
 	--stack-bottom: 0;
 	--first-stack-top: 0;
 	--first-stack-bottom: 0;
@@ -11,45 +13,54 @@
 	--last-stack-bottom: 0;
 }
 
-.first-stack {
+.first-stack,
+%first-stack {
 	margin-top: var(--first-stack-top, unset);
 	margin-bottom: var(--first-stack-bottom, unset);
 }
 
-.stack {
+.stack,
+%stack {
 	margin-top: var(--stack-top, unset);
 	margin-bottom: var(--stack-bottom, unset);
 }
 
-.last-stack {
+.last-stack,
+%last-stack {
 	margin-top: var(--last-stack-top, unset);
 	margin-bottom: var(--last-stack-bottom, unset);
 }
 
-.stack-multi--by2 {
+.stack-multi--by2,
+%stack-multi--by2 {
 	margin-top: calc(var(--first-stack-top, unset) * 2);
 	margin-bottom: calc(var(--first-stack-bottom, unset) * 2);
 }
 
-.stack-multi--by4 {
+.stack-multi--by4,
+%stack-multi--by4 {
 	margin-top: calc(var(--first-stack-top, unset) * 4);
 	margin-bottom: calc(var(--first-stack-bottom, unset) * 4);
 }
 
-.stack-divi--by2 {
+.stack-divi--by2,
+%stack-divi--by2 {
 	margin-top: calc(var(--first-stack-top, unset) / 2);
 	margin-bottom: calc(var(--first-stack-bottom, unset) / 2);
 }
 
-.none-stack {
+.none-stack,
+%none-stack {
 	margin-top: 0;
 }
 
-.unset-stack {
+.unset-stack,
+%unset-stack {
 	margin-top: unset;
 }
 
-.reverse-stack {
+.reverse-stack
+%reverse-stack {
 	margin-top: var(--stack-bottom, unset);
 	margin-bottom: var(--stack-top, unset);
 }
diff --git a/src/scss/function/_calc-font-size.scss b/src/scss/function/_calc-font-size.scss
index 963c762..1e54885 100644
--- a/src/scss/function/_calc-font-size.scss
+++ b/src/scss/function/_calc-font-size.scss
@@ -1,21 +1,24 @@
 @charset "utf-8";
+
+@use 'strip-unit';
+
 // ===================================================================
 // px to em
 // ===================================================================
 
 @function px2em($px, $base: 16) {
-	@return strip-unit($px) / strip-unit($base) * 1em;
+	@return strip-unit.strip-unit($px) / strip-unit.strip-unit($base) * 1em;
 }
 
 @function px2rem($px, $base: 16) {
-	@return strip-unit($px) / strip-unit($base) * 1rem;
+	@return strip-unit.strip-unit($px) / strip-unit.strip-unit($base) * 1rem;
 }
 // ===================================================================
 // percent to px
 // ===================================================================
 
 @function percent2px($percent, $base: 16) {
-  @return strip-unit($base) * (strip-unit($percent) / 100) * 1px;
+  @return strip-unit.strip-unit($base) * (strip-unit.strip-unit($percent) / 100) * 1px;
 }
 
 // ===================================================================
@@ -23,11 +26,11 @@
 // ===================================================================
 
 @function percent2em($percent, $base: 16) {
-  @return (strip-unit($base) * (strip-unit($percent) / 100)) / strip-unit($base) * 1em;
+  @return (strip-unit.strip-unit($base) * (strip-unit.strip-unit($percent) / 100)) / strip-unit.strip-unit($base) * 1em;
 }
 
 @function percent2rem($percent, $base: 16) {
-  @return (strip-unit($base) * (strip-unit($percent) / 100)) / strip-unit($base) * 1rem;
+  @return (strip-unit.strip-unit($base) * (strip-unit.strip-unit($percent) / 100)) / strip-unit.strip-unit($base) * 1rem;
 }
 
 // ===================================================================
@@ -35,9 +38,9 @@
 // ===================================================================
 
 @function em2px($em, $base: 16) {
-  @return strip-unit($em) * strip-unit($base) * 1px;
+  @return strip-unit.strip-unit($em) * strip-unit.strip-unit($base) * 1px;
 }
 
 @function rem2px($rem, $base: 16) {
-  @return strip-unit($rem) * strip-unit($base) * 1px;
+  @return strip-unit.strip-unit($rem) * strip-unit.strip-unit($base) * 1px;
 }
diff --git a/src/scss/function/_calc-stack.scss b/src/scss/function/_calc-stack.scss
index 3647d85..cb9f05e 100644
--- a/src/scss/function/_calc-stack.scss
+++ b/src/scss/function/_calc-stack.scss
@@ -1,21 +1,28 @@
 @charset "utf-8";
 
+// Built-In Modules
+@use 'sass:math';
+
+// Included Modules
+@use 'calc-font-size';
+@use 'strip-unit';
+
 @function stack($line-height: 1, $font-size: 16px, $base: 16px) {
-	$line-height: strip-unit($line-height) * strip-unit($base);
-	@return $line-height / strip-unit($font-size) * 1rem;
+	$line-height: strip-unit.strip-unit($line-height) * strip-unit.strip-unit($base);
+	@return $line-height / strip-unit.strip-unit($font-size) * 1rem;
 }
 
 @function line-height($line-space: 4px, $font-size: 16px, $base: 16px) {
-	@if unit($font-size) == '%' {
-		$font-size: percent2px($font-size, $base);
-	} @else if unit($font-size) == 'em' {
-		$font-size: em2px($font-size, $base);
-	} @else if unit($font-size,) == 'rem' {
-		$font-size: rem2px($font-size, $base);
+	@if math.unit($font-size) == '%' {
+		$font-size: calc-font-size.percent2px($font-size, $base);
+	} @else if math.unit($font-size) == 'em' {
+		$font-size: calc-font-size.em2px($font-size, $base);
+	} @else if math.unit($font-size,) == 'rem' {
+		$font-size: calc-font-size.rem2px($font-size, $base);
 	}
 
-	$font-size: strip-unit($font-size);
-	$line-space: strip-unit($line-space);
+	$font-size: strip-unit.strip-unit($font-size);
+	$line-space: strip-unit.strip-unit($line-space);
 
 	@return (($line-space * 2) + $font-size) / $font-size;
 }
diff --git a/src/scss/function/_contrast-color.scss b/src/scss/function/_contrast-color.scss
index 75f341c..3867958 100644
--- a/src/scss/function/_contrast-color.scss
+++ b/src/scss/function/_contrast-color.scss
@@ -1,9 +1,13 @@
+@charset "utf-8";
+
+// Built-In Modules
+@use 'sass:math';
+@use 'sass:color';
+
 // ===================================================================
 // contrast color
 // ===================================================================
 
-@charset "utf-8";
-
 @function contrast-color($color: null, $dark: #000, $light: #fff) {
 	@if $color == null {
 		@return null;
@@ -13,10 +17,10 @@
 		$light-color-brightness: brightness($light);
 		$dark-color-brightness: brightness($dark);
 
-		@return if(abs($color-brightness - $light-color-brightness) > abs($color-brightness - $dark-color-brightness), $light, $dark);
+		@return if(math.abs($color-brightness - $light-color-brightness) > math.abs($color-brightness - $dark-color-brightness), $light, $dark);
 	}
 }
 
 @function brightness($color: null) {
-	@return ((red($color) * 299) + (green($color) * 587) + (blue($color) * 114)) / 1000;
+	@return ((color.red($color) * 299) + (color.green($color) * 587) + (color.blue($color) * 114)) / 1000;
 }
diff --git a/src/scss/function/_index.scss b/src/scss/function/_index.scss
new file mode 100644
index 0000000..41e990a
--- /dev/null
+++ b/src/scss/function/_index.scss
@@ -0,0 +1,4 @@
+@use 'calc-font-size';
+@use 'calc-stack';
+@use 'strip-unit';
+@use 'contrast-color';
diff --git a/src/scss/function/_strip-unit.scss b/src/scss/function/_strip-unit.scss
index b38fdfe..99794b6 100644
--- a/src/scss/function/_strip-unit.scss
+++ b/src/scss/function/_strip-unit.scss
@@ -1,13 +1,17 @@
 @charset "utf-8";
 
+// Built-In Modules
+@use 'sass:meta';
+@use 'sass:math';
+
 @function strip-unit($value) {
-	@if type-of($value) == 'number' and unitless($value) == false {
+	@if meta.type-of($value) == 'number' and math.is-unitless($value) == false {
 		@return $value / ($value * 0 + 1);
-	} @else if type-of($value) == 'number' {
+	} @else if meta.type-of($value) == 'number' {
 		@return $value;
 	} @else {
 		@warn $value;
-		@warn type-of($value);
+		@warn meta.type-of($value);
 		@error "error strip unit"
 	}
 }
diff --git a/src/scss/theme.scss b/src/scss/theme.scss
index e43d9b4..25e2e04 100644
--- a/src/scss/theme.scss
+++ b/src/scss/theme.scss
@@ -1,9 +1,4 @@
-@import 'node_modules/flexbox-grid-mixins/sass/flexbox-grid-mixins';
-@import 'function';
-
-@import 'variable';
-
-@import "foundation";
-@import "structure";
-@import "component";
-@import "project";
+@use "foundation";
+@use "structure";
+@use "component";
+@use "project";

From 700d33fd2169564059f2f45bb69c01cbc961fb72 Mon Sep 17 00:00:00 2001
From: thingsym <thingsym@gmail.com>
Date: Sun, 22 Nov 2020 16:39:09 +0900
Subject: [PATCH 4/8] fix: fix npm script

---
 package.json | 1 -
 1 file changed, 1 deletion(-)

diff --git a/package.json b/package.json
index e37b0b0..7e950ba 100644
--- a/package.json
+++ b/package.json
@@ -32,7 +32,6 @@
     "gulp-stylelint": "^13.0.0",
     "gulp-util": "~3.0.8",
     "gulp-watch": "~5.0.1",
-    "node-sass": "^4.14.1",
     "npm-run-all": "^4.1.5",
     "postcss-cli": "^7.1.2",
     "run-sequence": "~2.2.1",

From 9ef8e90fb5f1f760fba5939f6d9811f6688ce698 Mon Sep 17 00:00:00 2001
From: thingsym <thingsym@gmail.com>
Date: Sun, 22 Nov 2020 16:55:10 +0900
Subject: [PATCH 5/8] docs: update sample document

---
 exampleSite/content/sample/_index.md          | 55 +++++++++++++++----
 .../content/sample/build-in-shortcodes.md     |  4 --
 2 files changed, 44 insertions(+), 15 deletions(-)

diff --git a/exampleSite/content/sample/_index.md b/exampleSite/content/sample/_index.md
index ede6a6b..fa2928d 100644
--- a/exampleSite/content/sample/_index.md
+++ b/exampleSite/content/sample/_index.md
@@ -6,14 +6,14 @@ weight: 10
 description: "this is a sample document."
 ---
 
-## Header
+## Headings
 
-# H1 Header
-## H2 Header
-### H3 Header
-#### H4 Header
-##### H5 Header
-###### H6 Header
+# Heading level 1
+## Heading level 2
+### Heading level 3
+#### Heading level 4
+##### Heading level 5
+###### Heading level 6
 
 ## Paragraph
 
@@ -27,7 +27,9 @@ Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
 
 ---
 
-## List
+## Lists
+
+### Unordered Lists
 
 * Lorem ipsum dolor sit amet, consectetur adipisicing elit
 * Lorem ipsum dolor sit amet, consectetur adipisicing elit
@@ -37,6 +39,8 @@ Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
 	* Lorem ipsum dolor sit amet, consectetur adipisicing elit
 	* Lorem ipsum dolor sit amet, consectetur adipisicing elit
 
+### Ordered Lists
+
 1. Lorem ipsum dolor sit amet, consectetur adipisicing elit
 2. Lorem ipsum dolor sit amet, consectetur adipisicing elit
 3. Lorem ipsum dolor sit amet, consectetur adipisicing elit
@@ -44,16 +48,21 @@ Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
 ## Code
 
 ```ruby
-puts 'The best way to log and share programmers knowledge.' puts 'The best way to log and share programmers knowledge.'
+puts 'The best way to log and share programmers knowledge.' 
+puts 'The best way to log and share programmers knowledge.'
 
-puts 'The best way to log and share programmers knowledge.' puts 'The best way to log and share programmers knowledge.'
+puts 'The best way to log and share programmers knowledge.' 
+puts 'The best way to log and share programmers knowledge.'
 
 puts 'The best way to log and share programmers knowledge.'
 
+puts 'The best way to log and share programmers knowledge.' 
+puts 'The best way to log and share programmers knowledge.' 
 puts 'The best way to log and share programmers knowledge.'
-puts 'The best way to log and share programmers knowledge.' puts 'The best way to log and share programmers knowledge.'
 ```
 
+## Inline code
+
 inline code `#ffce44`
 
 ## Blockquote
@@ -91,6 +100,30 @@ inline code `#ffce44`
 
 ![2 People Sitting With View of Yellow Flowers during Daytime](/images/pexels-photo-196666.jpeg "sample")
 
+
 ## Image with link
 
 [![2 People Sitting With View of Yellow Flowers during Daytime](/images/pexels-photo-196666.jpeg)](https://www.pexels.com/photo/2-people-sitting-with-view-of-yellow-flowers-during-daytime-196666/)
+
+
+## Definition Lists
+
+First Term
+: This is the definition.
+
+Second Term
+: This is the definition.
+: This is the definition.
+
+## Task Lists
+
+- [x] to do task 1
+- [ ] to do task 2
+- [ ] to do task 3
+
+## Footnotes
+
+this is a footnote,[^1] and this is a second footnote.[^2]
+
+[^1]: This is the first footnote.
+[^2]: This is the second footnote.
diff --git a/exampleSite/content/sample/build-in-shortcodes.md b/exampleSite/content/sample/build-in-shortcodes.md
index 289d1ff..d1fc21c 100644
--- a/exampleSite/content/sample/build-in-shortcodes.md
+++ b/exampleSite/content/sample/build-in-shortcodes.md
@@ -30,10 +30,6 @@ See https://gohugo.io/content-management/shortcodes/#use-hugos-built-in-shortcod
 </section>
 {{< /highlight >}}
 
-## instagram
-
-{{< instagram BWNjjyYFxVx >}}
-
 ## tweet
 
 {{< tweet 877500564405444608 >}}

From 81905e9a1d81d21169ef1b36b1b6eae865b70819 Mon Sep 17 00:00:00 2001
From: thingsym <thingsym@gmail.com>
Date: Sun, 22 Nov 2020 16:56:09 +0900
Subject: [PATCH 6/8] docs: add sample Markdown Syntax

---
 exampleSite/content/sample/markdown-syntax.md | 147 ++++++++++++++++++
 1 file changed, 147 insertions(+)
 create mode 100644 exampleSite/content/sample/markdown-syntax.md

diff --git a/exampleSite/content/sample/markdown-syntax.md b/exampleSite/content/sample/markdown-syntax.md
new file mode 100644
index 0000000..8d1628f
--- /dev/null
+++ b/exampleSite/content/sample/markdown-syntax.md
@@ -0,0 +1,147 @@
+---
+title: "Markdown Syntax"
+date: 2020-11-17T15:26:15Z
+draft: false
+weight: 10
+description: "calling custom Shortcodes into your content files."
+---
+
+## Headings
+
+```markdown
+# Heading level 1
+## Heading level 2
+### Heading level 3
+#### Heading level 4
+##### Heading level 5
+###### Heading level 6
+```
+
+## Emphasis
+
+```markdown
+*Italic*  
+**Bold**  
+~~Strikethrough~~
+```
+
+## Horizontal Rule
+
+```markdown
+---
+```
+
+## Lists
+
+### Unordered Lists
+
+```markdown
+- First item
+- Second item
+- Third item
+- Fourth item
+```
+
+or
+
+```markdown
+* First item
+* Second item
+* Third item
+* Fourth item
+```
+
+### Ordered Lists
+
+```markdown
+1. First item
+2. Second item
+3. Third item
+4. Fourth item
+```
+
+## Code
+
+````markdown
+```ruby
+puts 'The best way to log and share programmers knowledge.'
+puts 'The best way to log and share programmers knowledge.'
+```
+````
+
+## Inline code
+
+```markdown
+`#ffce44`
+```
+
+## Blockquote
+
+```markdown
+> this is a blockquote. this is a blockquote. this is a blockquote. this is a blockquote. this is a blockquote. this is a blockquote.
+>
+> this is a blockquote.
+>
+> this is a blockquote.
+>
+> this is a blockquote
+```
+
+## Links
+
+```markdown
+[Hugo Techdoc Theme demo](https://themes.gohugo.io/theme/hugo-theme-techdoc/)
+```
+
+## Table
+
+```markdown
+| header | header | header |
+|------------|-------------|--------------|
+| Lorem      | Lorem       | Lorem        |
+| ipsum      | ipsum       | ipsum        |
+| dolor      | dolor       | dolor        |
+| sit        | sit         | sit          |
+| amet       | amet        | amet         |
+```
+
+## Images
+
+```markdown
+![2 People Sitting With View of Yellow Flowers during Daytime](/images/pexels-photo-196666.jpeg "sample")
+```
+
+
+## Image with link
+
+```markdown
+[![2 People Sitting With View of Yellow Flowers during Daytime](/images/pexels-photo-196666.jpeg)](https://www.pexels.com/photo/2-people-sitting-with-view-of-yellow-flowers-during-daytime-196666/)
+```
+
+## Definition Lists
+
+```markdown
+First Term
+: This is the definition.
+
+Second Term
+: This is the definition.
+: This is the definition.
+```
+
+## Task Lists
+
+```markdown
+- [x] to do task 1
+- [ ] to do task 2
+- [ ] to do task 3
+```
+
+## Footnotes
+
+```markdown
+this is a footnote,[^1] and this is the second footnote.[^2]
+
+[^1]: This is the first footnote.
+[^2]: This is the second footnote.
+```

From 8063e26056d8473e7f2866757ea4de615737a514 Mon Sep 17 00:00:00 2001
From: thingsym <thingsym@gmail.com>
Date: Sun, 22 Nov 2020 17:13:41 +0900
Subject: [PATCH 7/8] docs: edit README

---
 README.md | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/README.md b/README.md
index 78b0ba4..86ef8d8 100644
--- a/README.md
+++ b/README.md
@@ -79,6 +79,14 @@ You may specify options in config.toml (or config.yaml/config.json) of your site
 
 For an example of `config.toml`, [config.toml](https://github.com/thingsym/hugo-theme-techdoc/blob/master/exampleSite/config.toml) in exampleSite.
 
+### Update Hugo theme for git submodule
+
+```
+git submodule update --remote
+git add themes/hugo-theme-techdoc
+git commit
+```
+
 ### Directory layout
 
 ```

From 76b39a916c2c388097d419552ddc3da486188afb Mon Sep 17 00:00:00 2001
From: thingsym <thingsym@gmail.com>
Date: Sun, 22 Nov 2020 17:19:20 +0900
Subject: [PATCH 8/8] Version 0.9.6

---
 README.md                                     |   5 +-
 exampleSite/config.toml                       |   2 +-
 .../content/getting-started/configuration.md  |   4 +-
 package-lock.json                             |   2 +-
 package.json                                  |   2 +-
 static/css/theme.css                          | 197 +++++++-----------
 static/css/theme.min.css                      |   2 +-
 7 files changed, 88 insertions(+), 126 deletions(-)

diff --git a/README.md b/README.md
index 86ef8d8..340363d 100644
--- a/README.md
+++ b/README.md
@@ -243,9 +243,12 @@ Small patches and bug reports can be submitted a issue tracker in Github. Forkin
 
 ## Changelog
 
+* Version 0.9.6 - 2020.11.22
+  * add sample Markdown Syntax
+  * update sample document
+  * replace scss from node-sass to dart-sass
 * Version 0.9.5 - 2020.11.05
   * fix link style with Alert panel
-
 * Version 0.9.4 - 2020.10.08
   * improve scss for custom shortcodes using css custom properties
   * change stack to css custom properties
diff --git a/exampleSite/config.toml b/exampleSite/config.toml
index 53420f9..f385da7 100755
--- a/exampleSite/config.toml
+++ b/exampleSite/config.toml
@@ -17,7 +17,7 @@ enableMissingTranslationPlaceholders = false
     # Source Code repository section
     description = "put your description"
     github_repository = "https://github.com/thingsym/hugo-theme-techdoc"
-    version = "0.9.5"
+    version = "0.9.6"
 
     # Documentation repository section
     # documentation repository (set edit link to documentation repository)
diff --git a/exampleSite/content/getting-started/configuration.md b/exampleSite/content/getting-started/configuration.md
index de3cda5..72818ac 100644
--- a/exampleSite/content/getting-started/configuration.md
+++ b/exampleSite/content/getting-started/configuration.md
@@ -15,7 +15,7 @@ For an example of `config.toml`, see [config.toml](https://github.com/thingsym/h
     # Source Code repository section
     description = "put your description"
     github_repository = "https://github.com/thingsym/hugo-theme-techdoc"
-    version = "0.9.5"
+    version = "0.9.6"
 
     # Documentation repository section
     # documentation repository (set edit link to documentation repository)
@@ -80,7 +80,7 @@ default: `https://github.com/thingsym/hugo-theme-techdoc`
 
 The version of souce code
 
-default: `0.9.5`
+default: `0.9.6`
 
 #### `github_doc_repository`
 
diff --git a/package-lock.json b/package-lock.json
index e597815..fefe023 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,6 +1,6 @@
 {
   "name": "hugo-theme-techdoc",
-  "version": "0.9.5",
+  "version": "0.9.6",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {
diff --git a/package.json b/package.json
index 7e950ba..4674648 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "hugo-theme-techdoc",
-  "version": "0.9.5",
+  "version": "0.9.6",
   "description": "The Techdoc is a Hugo Theme for technical documentation.",
   "main": "gulpfile.js",
   "author": "Thingsym",
diff --git a/static/css/theme.css b/static/css/theme.css
index 2562478..a1654bf 100644
--- a/static/css/theme.css
+++ b/static/css/theme.css
@@ -196,9 +196,9 @@ select {
  * Correct the inability to style clickable types in iOS and Safari.
  */
 button,
-[type="button"],
-[type="reset"],
-[type="submit"] {
+[type=button],
+[type=reset],
+[type=submit] {
   -webkit-appearance: button;
 }
 
@@ -206,9 +206,9 @@ button,
  * Remove the inner border and padding in Firefox.
  */
 button::-moz-focus-inner,
-[type="button"]::-moz-focus-inner,
-[type="reset"]::-moz-focus-inner,
-[type="submit"]::-moz-focus-inner {
+[type=button]::-moz-focus-inner,
+[type=reset]::-moz-focus-inner,
+[type=submit]::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
@@ -217,9 +217,9 @@ button::-moz-focus-inner,
  * Restore the focus styles unset by the previous rule.
  */
 button:-moz-focusring,
-[type="button"]:-moz-focusring,
-[type="reset"]:-moz-focusring,
-[type="submit"]:-moz-focusring {
+[type=button]:-moz-focusring,
+[type=reset]:-moz-focusring,
+[type=submit]:-moz-focusring {
   outline: 1px dotted ButtonText;
 }
 
@@ -270,8 +270,8 @@ textarea {
  * 1. Add the correct box sizing in IE 10.
  * 2. Remove the padding in IE 10.
  */
-[type="checkbox"],
-[type="radio"] {
+[type=checkbox],
+[type=radio] {
   -webkit-box-sizing: border-box;
           box-sizing: border-box;
   /* 1 */
@@ -282,8 +282,8 @@ textarea {
 /**
  * Correct the cursor style of increment and decrement buttons in Chrome.
  */
-[type="number"]::-webkit-inner-spin-button,
-[type="number"]::-webkit-outer-spin-button {
+[type=number]::-webkit-inner-spin-button,
+[type=number]::-webkit-outer-spin-button {
   height: auto;
 }
 
@@ -291,7 +291,7 @@ textarea {
  * 1. Correct the odd appearance in Chrome and Safari.
  * 2. Correct the outline style in Safari.
  */
-[type="search"] {
+[type=search] {
   -webkit-appearance: textfield;
   /* 1 */
   outline-offset: -2px;
@@ -301,7 +301,7 @@ textarea {
 /**
  * Remove the inner padding in Chrome and Safari on macOS.
  */
-[type="search"]::-webkit-search-decoration {
+[type=search]::-webkit-search-decoration {
   -webkit-appearance: none;
 }
 
@@ -435,8 +435,8 @@ fieldset {
   line-height: 2;
   color: #000;
   font-family: var(--custom-font-family-base, -apple-system, BlinkMacSystemFont, "游ゴシック体", YuGothic, "メイリオ", Meiryo, "Helvetica Neue", HelveticaNeue, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
-  -webkit-font-feature-settings: 'pwid';
-          font-feature-settings: 'pwid';
+  -webkit-font-feature-settings: "pwid";
+          font-feature-settings: "pwid";
 }
 
 body {
@@ -454,7 +454,6 @@ h6 {
   font-weight: bold;
   line-height: 2;
 }
-
 h1 > small,
 h2 > small,
 h3 > small,
@@ -467,7 +466,7 @@ h6 > small {
 
 h1 {
   font-size: 240%;
-  line-height: 1.41667;
+  line-height: 1.4166666667;
 }
 
 h2 {
@@ -482,12 +481,12 @@ h3 {
 
 h4 {
   font-size: 140%;
-  line-height: 1.71429;
+  line-height: 1.7142857143;
 }
 
 h5 {
   font-size: 120%;
-  line-height: 1.83333;
+  line-height: 1.8333333333;
 }
 
 h6 {
@@ -499,7 +498,6 @@ a {
   color: var(--custom-link-text-color, #2e7eb3);
   text-decoration: none;
 }
-
 a:focus, a:active, a:hover {
   color: var(--custom-link-text-hover-color, #38a0e4);
   text-decoration: underline;
@@ -536,11 +534,10 @@ th,
 td {
   border-top: 1px solid #f0f0f0;
   border-right: 1px solid #f0f0f0;
-  padding: .6rem;
+  padding: 0.6rem;
 }
-
-tr:nth-child(even) th, tr:nth-child(even)
-td {
+tr:nth-child(even) th,
+tr:nth-child(even) td {
   background: #f8f8f8;
 }
 
@@ -554,16 +551,14 @@ ul {
   list-style-type: disc;
 }
 
-ul.no-style, .ais-Pagination-list {
+ul.no-style {
   list-style: none;
   padding-left: 0;
 }
-
 ul.inline {
   list-style: none;
   padding-left: 0;
 }
-
 ul.inline li {
   display: inline;
   padding-right: 2rem;
@@ -582,7 +577,7 @@ blockquote {
   padding: 1.28rem;
   background-color: #f4f4f4;
   border-left: 4px solid #f0f0f0;
-  border-radius: .2rem;
+  border-radius: 0.2rem;
 }
 
 code,
@@ -593,8 +588,8 @@ kbd {
 
 code,
 kbd {
-  padding: .2rem;
-  border-radius: .2rem;
+  padding: 0.2rem;
+  border-radius: 0.2rem;
 }
 
 code {
@@ -611,21 +606,18 @@ pre {
   padding: 1.28rem;
   overflow: auto;
   white-space: pre-wrap;
-  border-radius: .2rem;
+  border-radius: 0.2rem;
 }
-
 pre code {
   padding: 0;
   background-color: unset;
 }
-
 pre.wrap {
   white-space: pre;
   white-space: pre-wrap;
   word-break: break-all;
   word-wrap: break-word;
 }
-
 pre.scrollable {
   max-height: 240px;
   overflow-y: scroll;
@@ -650,12 +642,19 @@ figcaption {
   --last-stack-bottom: 0;
 }
 
-.first-stack, main * {
+.first-stack,
+main * {
   margin-top: var(--first-stack-top, unset);
   margin-bottom: var(--first-stack-bottom, unset);
 }
 
-.stack, main * + h1, main * + h2, main * + h3, main * + h4, main * + h5, main * + h6,
+.stack,
+main * + h1,
+main * + h2,
+main * + h3,
+main * + h4,
+main * + h5,
+main * + h6,
 main * + p,
 main * + hr,
 main * + table,
@@ -664,7 +663,8 @@ main * + ol,
 main * + dl,
 main * + blockquote,
 main * + pre,
-main * + figure, .table_of_contents,
+main * + figure,
+.table_of_contents,
 .edit-meta,
 .edit-page,
 .pagination,
@@ -673,7 +673,9 @@ main * + figure, .table_of_contents,
 .panel,
 .button,
 .gist,
-.twitter-tweet, .ais-Hits-item, .code {
+.twitter-tweet,
+.ais-Hits-item,
+.code {
   margin-top: var(--stack-top, unset);
   margin-bottom: var(--stack-bottom, unset);
 }
@@ -698,20 +700,20 @@ main * + figure, .table_of_contents,
   margin-bottom: calc(var(--first-stack-bottom, unset) / 2);
 }
 
-.none-stack, figure > figcaption, .pagination > *, .code .code-content .highlight {
+.none-stack,
+figure > figcaption,
+.pagination > *,
+.code .code-content .highlight {
   margin-top: 0;
 }
 
-.unset-stack, main li > ul,
-main li > ol, .ais-Hits-item p {
+.unset-stack,
+main li > ul,
+main li > ol,
+.ais-Hits-item p {
   margin-top: unset;
 }
 
-.reverse-stack {
-  margin-top: var(--stack-bottom, unset);
-  margin-bottom: var(--stack-top, unset);
-}
-
 /*-----------------------*
 		Structure
 *-----------------------*/
@@ -758,7 +760,6 @@ main {
           flex: 0 0 75%;
   max-width: 75%;
 }
-
 main:only-child {
   -webkit-box-sizing: border-box;
           box-sizing: border-box;
@@ -793,6 +794,7 @@ main:only-child {
         -ms-flex-flow: column nowrap;
             flex-flow: column nowrap;
   }
+
   main {
     -webkit-box-sizing: border-box;
             box-sizing: border-box;
@@ -801,6 +803,7 @@ main:only-child {
             flex: 0 0 auto;
     min-width: 100%;
   }
+
   .sidebar {
     -webkit-box-sizing: border-box;
             box-sizing: border-box;
@@ -812,7 +815,6 @@ main:only-child {
             order: 1;
   }
 }
-
 .pagination {
   -webkit-box-sizing: border-box;
           box-sizing: border-box;
@@ -826,7 +828,6 @@ main:only-child {
           justify-content: space-between;
   font-weight: bold;
 }
-
 .nav-next {
   margin-left: auto;
 }
@@ -846,11 +847,11 @@ main:only-child {
         -ms-flex-align: center;
             align-items: center;
   }
+
   .nav-next {
     margin-left: 0;
   }
 }
-
 .panel {
   --panel-font-color: #000;
   --panel-background-color: unset;
@@ -861,7 +862,6 @@ main:only-child {
   border: 1px solid;
   border-color: var(--panel-border-color, transparent);
 }
-
 .panel a {
   text-decoration: underline;
   font-weight: bold;
@@ -909,10 +909,10 @@ main:only-child {
 .button {
   display: inline-block;
   font-size: 120%;
-  padding: .5rem 1.2rem;
+  padding: 0.5rem 1.2rem;
   font-weight: bold;
   text-decoration: none;
-  border-radius: .8rem;
+  border-radius: 0.8rem;
   --button-font-color: #000;
   --button-font-hover-color: #000;
   --button-background-color: #fafafa;
@@ -923,7 +923,6 @@ main:only-child {
   border: 2px solid;
   border-color: var(--button-border-color, transparent);
 }
-
 .button:hover {
   color: var(--button-font-hover-color, #000);
   text-decoration: none;
@@ -949,7 +948,7 @@ main:only-child {
 .button-caution {
   --button-font-color: #fff;
   --button-font-hover-color: #fff;
-  --button-background-color:  #f56558;
+  --button-background-color: #f56558;
   --button-background-hover-color: #d45145;
   --button-border-color: transparent;
 }
@@ -965,7 +964,7 @@ main:only-child {
 .button-danger {
   --button-font-color: #fff;
   --button-font-hover-color: #fff;
-  --button-background-color:  #ce3426;
+  --button-background-color: #ce3426;
   --button-background-hover-color: #a0281d;
   --button-border-color: transparent;
 }
@@ -995,52 +994,43 @@ figure > figcaption h4 {
   padding: 1.28rem;
   border: 4px solid #f0f0f0;
 }
-
 .table_of_contents ul {
   list-style: none;
   padding-left: 0;
 }
-
 .table_of_contents li {
   border-top: 1px solid #f0f0f0;
 }
-
 .table_of_contents > nav > ul > li:first-child {
   border-top: unset;
 }
-
 .table_of_contents ul > li li a {
   margin-left: 2rem;
 }
-
 .table_of_contents ul ul > li li a {
   margin-left: 4rem;
 }
-
 .table_of_contents ul ul ul > li li a {
   margin-left: 6rem;
 }
-
 .table_of_contents ul ul ul ul > li li a {
   margin-left: 8rem;
 }
-
 .table_of_contents ul ul ul ul ul > li li a {
   margin-left: 10rem;
 }
 
 .headerlink > .svg-inline--fa {
-  margin-left: .4rem;
-  width: .8rem;
+  margin-left: 0.4rem;
+  width: 0.8rem;
 }
 
 .ais-SearchBox .ais-SearchBox-input {
   width: 70%;
 }
-
 .ais-SearchBox button {
-  margin-left: .2rem;
-  padding: .4rem;
+  margin-left: 0.2rem;
+  padding: 0.4rem;
 }
 
 .ais-Stats {
@@ -1052,11 +1042,9 @@ figure > figcaption h4 {
   font-size: 140%;
   font-weight: normal;
 }
-
 .ais-Hits-item p {
   color: #3C4043;
 }
-
 .ais-Hits-item .lastmod {
   font-size: 90%;
   color: #70757a;
@@ -1067,6 +1055,8 @@ figure > figcaption h4 {
 }
 
 .ais-Pagination-list {
+  list-style: none;
+  padding-left: 0;
   -webkit-box-sizing: border-box;
           box-sizing: border-box;
   display: -webkit-box;
@@ -1080,7 +1070,7 @@ figure > figcaption h4 {
 }
 
 .ais-Pagination-item {
-  padding: .6rem;
+  padding: 0.6rem;
 }
 
 .code {
@@ -1092,7 +1082,6 @@ figure > figcaption h4 {
   -ms-flex-wrap: wrap;
       flex-wrap: wrap;
 }
-
 .code .filename {
   -webkit-box-sizing: border-box;
           box-sizing: border-box;
@@ -1103,20 +1092,18 @@ figure > figcaption h4 {
   font-size: 80%;
   color: #666;
 }
-
 .code .copy-btn {
   margin-left: auto;
   cursor: pointer;
   position: relative;
   font-size: 80%;
   border: solid 1px #ccc;
-  padding: .2rem .6rem;
-  border-radius: .3rem;
+  padding: 0.2rem 0.6rem;
+  border-radius: 0.3rem;
   line-height: 1;
-  margin-bottom: .2rem;
+  margin-bottom: 0.2rem;
   outline: none;
 }
-
 .code .code-content {
   -webkit-box-sizing: border-box;
           box-sizing: border-box;
@@ -1125,22 +1112,21 @@ figure > figcaption h4 {
           flex: 0 0 100%;
   max-width: 100%;
 }
-
 .tooltipped::after {
-  content: 'Copied!';
+  content: "Copied!";
   background: #555;
   display: inline-block;
   color: #fff;
-  border-radius: .4rem;
+  border-radius: 0.4rem;
   position: absolute;
   left: 50%;
   top: -1.8rem;
   -webkit-transform: translate(-50%, 0);
           transform: translate(-50%, 0);
-  font-size: .75rem;
+  font-size: 0.75rem;
   padding: 4px 10px 6px 10px;
-  -webkit-animation: fade-tooltip .5s 1s 1 forwards;
-          animation: fade-tooltip .5s 1s 1 forwards;
+  -webkit-animation: fade-tooltip 0.5s 1s 1 forwards;
+          animation: fade-tooltip 0.5s 1s 1 forwards;
 }
 
 @-webkit-keyframes fade-tooltip {
@@ -1154,26 +1140,22 @@ figure > figcaption h4 {
     opacity: 0;
   }
 }
-
 header {
   color: var(--custom-font-color, #fff);
   background: var(--custom-background-color, #000);
   padding: 0.5rem 1.28rem;
 }
-
 header h1 {
   font-size: 140%;
   display: inline-block;
 }
-
 header .version {
-  margin-left: .4rem;
+  margin-left: 0.4rem;
   font-size: 80%;
 }
-
 header .github {
   color: currentColor;
-  margin-left: .4rem;
+  margin-left: 0.4rem;
   font-size: 180%;
 }
 
@@ -1182,19 +1164,16 @@ header .github {
   background: var(--custom-background-color, #000);
   padding: 0.2rem 1.28rem;
 }
-
 .global-menu ul {
   list-style: none;
   padding: 0;
   margin: 0;
 }
-
 .global-menu li {
   display: inline-block;
   margin-right: 1.8rem;
   position: relative;
 }
-
 .global-menu ul.sub-menu {
   display: none;
   margin: 0;
@@ -1203,23 +1182,19 @@ header .github {
   left: 0;
   z-index: 99999;
 }
-
 .global-menu ul.sub-menu li {
   padding: 0.2rem 1.28rem;
   background: var(--custom-background-color, #000);
   width: 140px;
   font-size: 80%;
 }
-
 .global-menu ul.sub-menu li a {
   color: var(--custom-font-color, #fff);
 }
-
 .global-menu .fa-angle-right {
-  margin-left: .4rem;
+  margin-left: 0.4rem;
   font-size: 80%;
 }
-
 .global-menu li.parent:hover > ul.sub-menu {
   -webkit-box-sizing: border-box;
           box-sizing: border-box;
@@ -1231,7 +1206,6 @@ header .github {
       -ms-flex-flow: column nowrap;
           flex-flow: column nowrap;
 }
-
 @media screen and (max-width: 480px) {
   .global-menu li {
     display: block;
@@ -1251,22 +1225,20 @@ header .github {
   .global-menu ul.sub-menu li {
     width: auto;
     background: transparent;
-    padding: 0 .4rem;
+    padding: 0 0.4rem;
   }
   .global-menu ul.sub-menu li + li {
-    padding-top: .2rem;
+    padding-top: 0.2rem;
   }
   .global-menu ul.sub-menu li a {
     color: currentColor;
   }
 }
-
 .global-menu a {
   display: block;
   color: currentColor;
   text-decoration: none;
 }
-
 .global-menu a:hover {
   text-decoration: underline;
 }
@@ -1280,71 +1252,58 @@ main {
     padding: 1rem;
   }
 }
-
 .sidebar {
   font-size: 90%;
   line-height: 1.8;
   background: #f9f9f9;
   border-right: 1px solid #eee;
 }
-
 .sidebar ul {
   list-style: none;
   padding: 0;
   margin: 0;
 }
-
 .sidebar a {
   position: relative;
   display: block;
   color: #404040;
   text-decoration: none;
-  padding: .2rem 1rem;
+  padding: 0.2rem 1rem;
   border-left: solid 4px #f9f9f9;
   border-bottom: solid 1px #eee;
 }
-
 .sidebar a:hover {
   color: #404040;
   background: #eee;
   border-left: solid 4px #ccc;
 }
-
 .sidebar nav > ul > li li a {
   padding-left: 2rem;
 }
-
 .sidebar nav > ul ul > li li a {
   padding-left: 3rem;
 }
-
 .sidebar nav > ul ul ul > li li a {
   padding-left: 4rem;
 }
-
 .sidebar nav > ul ul ul ul > li li a {
   padding-left: 5rem;
 }
-
 .sidebar nav > ul ul ul ul ul > li li a {
   padding-left: 6rem;
 }
-
 @media screen and (max-width: 480px) {
   .sidebar nav > ul > li:first-child a {
     border-top: solid 1px #eee;
   }
 }
-
 .sidebar .active > a {
   background: #eee;
   border-left: solid 4px #ccc;
 }
-
 .sidebar .slide-menu .has-sub-menu:not(.parent) ul {
   display: none;
 }
-
 .sidebar .slide-menu .has-sub-menu > a span.mark {
   position: absolute;
   top: 0;
diff --git a/static/css/theme.min.css b/static/css/theme.min.css
index 5ba8d06..0fd1e1f 100644
--- a/static/css/theme.min.css
+++ b/static/css/theme.min.css
@@ -1,2 +1,2 @@
 @charset "UTF-8";
-/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}main{display:block}h1{font-size:2em;margin:.67em 0}hr{-webkit-box-sizing:content-box;box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{-webkit-box-sizing:border-box;box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{-webkit-box-sizing:border-box;box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}[hidden],template{display:none}blockquote,body,dd,dl,figcaption,figure,h1,h2,h3,h4,h5,h6,li,ol,p,ul{margin:0}a{color:inherit;cursor:pointer}button,input,select,textarea{font:inherit}button{background-color:transparent;color:inherit;border-width:0;padding:0;cursor:pointer}input::-moz-focus-inner{border:0;margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}cite{font-style:normal}fieldset{border-width:0;margin:0;padding:0}*{-webkit-box-sizing:border-box;box-sizing:border-box}:root{font-size:100%;line-height:2;color:#000;font-family:var(--custom-font-family-base,-apple-system,BlinkMacSystemFont,"游ゴシック体",YuGothic,"メイリオ",Meiryo,"Helvetica Neue",HelveticaNeue,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");-webkit-font-feature-settings:"pwid";font-feature-settings:"pwid"}body{background-color:#fafafa;margin:0}h1,h2,h3,h4,h5,h6{font-family:var(--custom-font-family-headings,-apple-system,BlinkMacSystemFont,"游ゴシック体",YuGothic,"メイリオ",Meiryo,"Helvetica Neue",HelveticaNeue,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-weight:700;line-height:2}h1>small,h2>small,h3>small,h4>small,h5>small,h6>small{font-size:75%;font-weight:400}h1{font-size:240%;line-height:1.41667}h2{font-size:200%;line-height:1.5}h3{font-size:160%;line-height:1.625}h4{font-size:140%;line-height:1.71429}h5{font-size:120%;line-height:1.83333}h6{font-size:100%;line-height:2}a{color:var(--custom-link-text-color,#2e7eb3);text-decoration:none}a:active,a:focus,a:hover{color:var(--custom-link-text-hover-color,#38a0e4);text-decoration:underline}hr{background-color:#ccc;height:2px;border:0}p{font-size:100%}img{display:inline-block;line-height:0}img,video{height:auto;max-width:100%}table{border-collapse:collapse;border:1px solid #f0f0f0;width:100%}td,th{border-top:1px solid #f0f0f0;border-right:1px solid #f0f0f0;padding:.6rem}tr:nth-child(2n) td,tr:nth-child(2n) th{background:#f8f8f8}th{background:#eee;font-weight:700;text-align:left}ul{list-style-type:disc}.ais-Pagination-list,ul.inline,ul.no-style{list-style:none;padding-left:0}ul.inline li{display:inline;padding-right:2rem}dt{font-weight:700}dd{margin-left:2rem}blockquote{color:#999;padding:1.28rem;background-color:#f4f4f4;border-left:4px solid #f0f0f0;border-radius:.2rem}code,kbd,pre{font-family:Menlo,Monaco,Courier New,monospace}code,kbd{padding:.2rem;border-radius:.2rem}code{background-color:#f4f4f4}kbd{color:#fff;background-color:#333}pre{background-color:#f4f4f4;padding:1.28rem;overflow:auto;white-space:pre-wrap;border-radius:.2rem}pre code{padding:0;background-color:unset}pre.wrap{white-space:pre;white-space:pre-wrap;word-break:break-all;word-wrap:break-word}pre.scrollable{max-height:240px;overflow-y:scroll}figcaption{color:#333;font-size:100%;line-height:2}:root{--const-stack:1.28rem;--stack-top:1.28rem;--stack-bottom:0;--first-stack-top:0;--first-stack-bottom:0;--last-stack-top:0;--last-stack-bottom:0}.first-stack,main *{margin-top:var(--first-stack-top,unset);margin-bottom:var(--first-stack-bottom,unset)}.ais-Hits-item,.button,.code,.edit-meta,.edit-page,.gist,.highlight,.pagination,.panel,.powered,.stack,.table_of_contents,.twitter-tweet,main *+blockquote,main *+dl,main *+figure,main *+h1,main *+h2,main *+h3,main *+h4,main *+h5,main *+h6,main *+hr,main *+ol,main *+p,main *+pre,main *+table,main *+ul{margin-top:var(--stack-top,unset);margin-bottom:var(--stack-bottom,unset)}.last-stack{margin-top:var(--last-stack-top,unset);margin-bottom:var(--last-stack-bottom,unset)}.stack-multi--by2{margin-top:calc(var(--first-stack-top, unset)*2);margin-bottom:calc(var(--first-stack-bottom, unset)*2)}.stack-multi--by4{margin-top:calc(var(--first-stack-top, unset)*4);margin-bottom:calc(var(--first-stack-bottom, unset)*4)}.stack-divi--by2{margin-top:calc(var(--first-stack-top, unset)/2);margin-bottom:calc(var(--first-stack-bottom, unset)/2)}.code .code-content .highlight,.none-stack,.pagination>*,figure>figcaption{margin-top:0}.ais-Hits-item p,.unset-stack,main li>ol,main li>ul{margin-top:unset}.reverse-stack{margin-top:var(--stack-bottom,unset);margin-bottom:var(--stack-top,unset)}body,html{height:100%}.container{width:100%;height:100%;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-flow:column nowrap;flex-flow:column nowrap;margin:auto}.container,.content-container{-webkit-box-sizing:border-box;box-sizing:border-box;display:-webkit-box;display:-ms-flexbox;display:flex}.content-container{-webkit-box-flex:1;-ms-flex:1 0 auto;flex:1 0 auto;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}main{-ms-flex:0 0 75%;flex:0 0 75%;max-width:75%}main,main:only-child{-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-box-flex:0}main:only-child{-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%}.sidebar{-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-box-flex:0;-ms-flex:0 0 25%;flex:0 0 25%;-webkit-box-ordinal-group:0;-ms-flex-order:-1;order:-1;overflow-x:hidden;overflow-y:scroll}@media screen and (max-width:480px){.content-container{-webkit-box-sizing:border-box;box-sizing:border-box;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-flow:column nowrap;flex-flow:column nowrap}main{min-width:100%}.sidebar,main{-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto}.sidebar{-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1}}.pagination{-webkit-box-sizing:border-box;box-sizing:border-box;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;font-weight:700}.nav-next{margin-left:auto}@media screen and (max-width:480px){.pagination{-webkit-box-sizing:border-box;box-sizing:border-box;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-flow:column nowrap;flex-flow:column nowrap;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.nav-next{margin-left:0}}.panel{--panel-font-color:#000;--panel-background-color:unset;--panel-border-color:transparent;padding:1.28rem;color:var(--panel-font-color,#000);background:var(--panel-background-color,unset);border:1px solid;border-color:var(--panel-border-color,transparent)}.panel a{text-decoration:underline;font-weight:700}.panel-primary{--panel-border-color:#f0f0f0}.panel-notice{--panel-background-color:#4ba0e1}.panel-notice,.panel-success{--panel-font-color:#fff;--custom-link-text-color:#fff;--custom-link-text-hover-color:#fff}.panel-success{--panel-background-color:#609f43}.panel-caution{--panel-background-color:#de776d}.panel-caution,.panel-warning{--panel-font-color:#fff;--custom-link-text-color:#fff;--custom-link-text-hover-color:#fff}.panel-warning{--panel-background-color:#e67e22}.panel-danger{--panel-font-color:#fff;--panel-background-color:#ce3426;--custom-link-text-color:#fff;--custom-link-text-hover-color:#fff}.button{display:inline-block;font-size:120%;padding:.5rem 1.2rem;font-weight:700;text-decoration:none;border-radius:.8rem;--button-font-color:#000;--button-font-hover-color:#000;--button-background-color:#fafafa;--button-background-hover-color:#f7f7f7;--button-border-color:#f0f0f0;color:var(--button-font-color,#000);background:var(--button-background-color,unset);border:2px solid;border-color:var(--button-border-color,transparent)}.button:hover{color:var(--button-font-hover-color,#000);text-decoration:none;background:var(--button-background-hover-color,unset)}.button-notice{--button-font-color:#fff;--button-font-hover-color:#fff;--button-background-color:#4ba0e1;--button-background-hover-color:#3b89c5;--button-border-color:transparent}.button-success{--button-font-color:#fff;--button-font-hover-color:#fff;--button-background-color:#369b08;--button-background-hover-color:#256905;--button-border-color:transparent}.button-caution{--button-font-color:#fff;--button-font-hover-color:#fff;--button-background-color:#f56558;--button-background-hover-color:#d45145;--button-border-color:transparent}.button-warning{--button-font-color:#fff;--button-font-hover-color:#fff;--button-background-color:#f5811b;--button-background-hover-color:#db7012;--button-border-color:transparent}.button-danger{--button-font-color:#fff;--button-font-hover-color:#fff;--button-background-color:#ce3426;--button-background-hover-color:#a0281d;--button-border-color:transparent}.notification{padding:.2rem 1.28rem;text-align:center;background:#eee}.backtothetop{display:none;font-size:200%}.fa-layers .fa-circle{color:#fff}figure>figcaption h4{font-size:80%;font-weight:400}.table_of_contents{font-size:90%;padding:1.28rem;border:4px solid #f0f0f0}.table_of_contents ul{list-style:none;padding-left:0}.table_of_contents li{border-top:1px solid #f0f0f0}.table_of_contents>nav>ul>li:first-child{border-top:unset}.table_of_contents ul>li li a{margin-left:2rem}.table_of_contents ul ul>li li a{margin-left:4rem}.table_of_contents ul ul ul>li li a{margin-left:6rem}.table_of_contents ul ul ul ul>li li a{margin-left:8rem}.table_of_contents ul ul ul ul ul>li li a{margin-left:10rem}.headerlink>.svg-inline--fa{margin-left:.4rem;width:.8rem}.ais-SearchBox .ais-SearchBox-input{width:70%}.ais-SearchBox button{margin-left:.2rem;padding:.4rem}.ais-Stats{font-size:80%;color:#70757a}.ais-Hits-item h3{font-size:140%;font-weight:400}.ais-Hits-item p{color:#3c4043}.ais-Hits-item .lastmod{font-size:90%;color:#70757a}.ais-Pagination{margin-top:1em}.ais-Pagination-list{-webkit-box-sizing:border-box;box-sizing:border-box;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.ais-Pagination-item{padding:.6rem}.code{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.code,.code .filename{-webkit-box-sizing:border-box;box-sizing:border-box}.code .filename{-webkit-box-flex:0;-ms-flex:0 0 75%;flex:0 0 75%;max-width:75%;font-size:80%;color:#666}.code .copy-btn{margin-left:auto;cursor:pointer;position:relative;font-size:80%;border:1px solid #ccc;padding:.2rem .6rem;border-radius:.3rem;line-height:1;margin-bottom:.2rem;outline:none}.code .code-content{-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%}.tooltipped:after{content:"Copied!";background:#555;display:inline-block;color:#fff;border-radius:.4rem;position:absolute;left:50%;top:-1.8rem;-webkit-transform:translate(-50%);transform:translate(-50%);font-size:.75rem;padding:4px 10px 6px;-webkit-animation:fade-tooltip .5s 1s 1 forwards;animation:fade-tooltip .5s 1s 1 forwards}@-webkit-keyframes fade-tooltip{to{opacity:0}}@keyframes fade-tooltip{to{opacity:0}}header{color:var(--custom-font-color,#fff);background:var(--custom-background-color,#000);padding:.5rem 1.28rem}header h1{font-size:140%;display:inline-block}header .version{margin-left:.4rem;font-size:80%}header .github{color:currentColor;margin-left:.4rem;font-size:180%}.global-menu{color:var(--custom-font-color,#fff);background:var(--custom-background-color,#000);padding:.2rem 1.28rem}.global-menu ul{list-style:none;padding:0;margin:0}.global-menu li{display:inline-block;margin-right:1.8rem;position:relative}.global-menu ul.sub-menu{display:none;margin:0;position:absolute;top:1.8rem;left:0;z-index:99999}.global-menu ul.sub-menu li{padding:.2rem 1.28rem;background:var(--custom-background-color,#000);width:140px;font-size:80%}.global-menu ul.sub-menu li a{color:var(--custom-font-color,#fff)}.global-menu .fa-angle-right{margin-left:.4rem;font-size:80%}.global-menu li.parent:hover>ul.sub-menu{-webkit-box-sizing:border-box;box-sizing:border-box;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-flow:column nowrap;flex-flow:column nowrap}@media screen and (max-width:480px){.global-menu li{display:block;margin-right:0;border-bottom:1px solid}.global-menu li:last-child{border-bottom:none}.global-menu .fa-angle-right{display:none}.global-menu ul.sub-menu{display:block;position:static}.global-menu ul.sub-menu li{width:auto;background:transparent;padding:0 .4rem}.global-menu ul.sub-menu li+li{padding-top:.2rem}.global-menu ul.sub-menu li a{color:currentColor}}.global-menu a{display:block;color:currentColor;text-decoration:none}.global-menu a:hover{text-decoration:underline}main{padding:3rem}@media screen and (max-width:480px){main{padding:1rem}}.sidebar{font-size:90%;line-height:1.8;background:#f9f9f9;border-right:1px solid #eee}.sidebar ul{list-style:none;padding:0;margin:0}.sidebar a{position:relative;display:block;color:#404040;text-decoration:none;padding:.2rem 1rem;border-left:4px solid #f9f9f9;border-bottom:1px solid #eee}.sidebar a:hover{color:#404040;background:#eee;border-left:4px solid #ccc}.sidebar nav>ul>li li a{padding-left:2rem}.sidebar nav>ul ul>li li a{padding-left:3rem}.sidebar nav>ul ul ul>li li a{padding-left:4rem}.sidebar nav>ul ul ul ul>li li a{padding-left:5rem}.sidebar nav>ul ul ul ul ul>li li a{padding-left:6rem}@media screen and (max-width:480px){.sidebar nav>ul>li:first-child a{border-top:1px solid #eee}}.sidebar .active>a{background:#eee;border-left:4px solid #ccc}.sidebar .slide-menu .has-sub-menu:not(.parent) ul{display:none}.sidebar .slide-menu .has-sub-menu>a span.mark{position:absolute;top:0;right:0;display:inline-block;height:32px;width:32px;line-height:2;text-align:center;color:#979797;background:#f2f2f2;border-left:1px solid #e7e7e7}.sidebar-footer{padding:1.28rem}.edit-meta{font-size:80%;text-align:right}.edit-page{font-weight:700}.powered{font-size:80%;text-align:right;color:#999}
\ No newline at end of file
+/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}main{display:block}h1{font-size:2em;margin:.67em 0}hr{-webkit-box-sizing:content-box;box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{-webkit-box-sizing:border-box;box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{-webkit-box-sizing:border-box;box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}[hidden],template{display:none}blockquote,body,dd,dl,figcaption,figure,h1,h2,h3,h4,h5,h6,li,ol,p,ul{margin:0}a{color:inherit;cursor:pointer}button,input,select,textarea{font:inherit}button{background-color:transparent;color:inherit;border-width:0;padding:0;cursor:pointer}input::-moz-focus-inner{border:0;margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}cite{font-style:normal}fieldset{border-width:0;margin:0;padding:0}*{-webkit-box-sizing:border-box;box-sizing:border-box}:root{font-size:100%;line-height:2;color:#000;font-family:var(--custom-font-family-base,-apple-system,BlinkMacSystemFont,"游ゴシック体",YuGothic,"メイリオ",Meiryo,"Helvetica Neue",HelveticaNeue,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");-webkit-font-feature-settings:"pwid";font-feature-settings:"pwid"}body{background-color:#fafafa;margin:0}h1,h2,h3,h4,h5,h6{font-family:var(--custom-font-family-headings,-apple-system,BlinkMacSystemFont,"游ゴシック体",YuGothic,"メイリオ",Meiryo,"Helvetica Neue",HelveticaNeue,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-weight:700;line-height:2}h1>small,h2>small,h3>small,h4>small,h5>small,h6>small{font-size:75%;font-weight:400}h1{font-size:240%;line-height:1.4166666667}h2{font-size:200%;line-height:1.5}h3{font-size:160%;line-height:1.625}h4{font-size:140%;line-height:1.7142857143}h5{font-size:120%;line-height:1.8333333333}h6{font-size:100%;line-height:2}a{color:var(--custom-link-text-color,#2e7eb3);text-decoration:none}a:active,a:focus,a:hover{color:var(--custom-link-text-hover-color,#38a0e4);text-decoration:underline}hr{background-color:#ccc;height:2px;border:0}p{font-size:100%}img{display:inline-block;line-height:0}img,video{height:auto;max-width:100%}table{border-collapse:collapse;border:1px solid #f0f0f0;width:100%}td,th{border-top:1px solid #f0f0f0;border-right:1px solid #f0f0f0;padding:.6rem}tr:nth-child(2n) td,tr:nth-child(2n) th{background:#f8f8f8}th{background:#eee;font-weight:700;text-align:left}ul{list-style-type:disc}ul.inline,ul.no-style{list-style:none;padding-left:0}ul.inline li{display:inline;padding-right:2rem}dt{font-weight:700}dd{margin-left:2rem}blockquote{color:#999;padding:1.28rem;background-color:#f4f4f4;border-left:4px solid #f0f0f0;border-radius:.2rem}code,kbd,pre{font-family:Menlo,Monaco,Courier New,monospace}code,kbd{padding:.2rem;border-radius:.2rem}code{background-color:#f4f4f4}kbd{color:#fff;background-color:#333}pre{background-color:#f4f4f4;padding:1.28rem;overflow:auto;white-space:pre-wrap;border-radius:.2rem}pre code{padding:0;background-color:unset}pre.wrap{white-space:pre;white-space:pre-wrap;word-break:break-all;word-wrap:break-word}pre.scrollable{max-height:240px;overflow-y:scroll}figcaption{color:#333;font-size:100%;line-height:2}:root{--const-stack:1.28rem;--stack-top:1.28rem;--stack-bottom:0;--first-stack-top:0;--first-stack-bottom:0;--last-stack-top:0;--last-stack-bottom:0}.first-stack,main *{margin-top:var(--first-stack-top,unset);margin-bottom:var(--first-stack-bottom,unset)}.ais-Hits-item,.button,.code,.edit-meta,.edit-page,.gist,.highlight,.pagination,.panel,.powered,.stack,.table_of_contents,.twitter-tweet,main *+blockquote,main *+dl,main *+figure,main *+h1,main *+h2,main *+h3,main *+h4,main *+h5,main *+h6,main *+hr,main *+ol,main *+p,main *+pre,main *+table,main *+ul{margin-top:var(--stack-top,unset);margin-bottom:var(--stack-bottom,unset)}.last-stack{margin-top:var(--last-stack-top,unset);margin-bottom:var(--last-stack-bottom,unset)}.stack-multi--by2{margin-top:calc(var(--first-stack-top, unset)*2);margin-bottom:calc(var(--first-stack-bottom, unset)*2)}.stack-multi--by4{margin-top:calc(var(--first-stack-top, unset)*4);margin-bottom:calc(var(--first-stack-bottom, unset)*4)}.stack-divi--by2{margin-top:calc(var(--first-stack-top, unset)/2);margin-bottom:calc(var(--first-stack-bottom, unset)/2)}.code .code-content .highlight,.none-stack,.pagination>*,figure>figcaption{margin-top:0}.ais-Hits-item p,.unset-stack,main li>ol,main li>ul{margin-top:unset}body,html{height:100%}.container{width:100%;height:100%;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-flow:column nowrap;flex-flow:column nowrap;margin:auto}.container,.content-container{-webkit-box-sizing:border-box;box-sizing:border-box;display:-webkit-box;display:-ms-flexbox;display:flex}.content-container{-webkit-box-flex:1;-ms-flex:1 0 auto;flex:1 0 auto;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}main{-ms-flex:0 0 75%;flex:0 0 75%;max-width:75%}main,main:only-child{-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-box-flex:0}main:only-child{-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%}.sidebar{-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-box-flex:0;-ms-flex:0 0 25%;flex:0 0 25%;-webkit-box-ordinal-group:0;-ms-flex-order:-1;order:-1;overflow-x:hidden;overflow-y:scroll}@media screen and (max-width:480px){.content-container{-webkit-box-sizing:border-box;box-sizing:border-box;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-flow:column nowrap;flex-flow:column nowrap}main{min-width:100%}.sidebar,main{-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto}.sidebar{-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1}}.pagination{-webkit-box-sizing:border-box;box-sizing:border-box;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;font-weight:700}.nav-next{margin-left:auto}@media screen and (max-width:480px){.pagination{-webkit-box-sizing:border-box;box-sizing:border-box;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-flow:column nowrap;flex-flow:column nowrap;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.nav-next{margin-left:0}}.panel{--panel-font-color:#000;--panel-background-color:unset;--panel-border-color:transparent;padding:1.28rem;color:var(--panel-font-color,#000);background:var(--panel-background-color,unset);border:1px solid;border-color:var(--panel-border-color,transparent)}.panel a{text-decoration:underline;font-weight:700}.panel-primary{--panel-border-color:#f0f0f0}.panel-notice{--panel-background-color:#4ba0e1}.panel-notice,.panel-success{--panel-font-color:#fff;--custom-link-text-color:#fff;--custom-link-text-hover-color:#fff}.panel-success{--panel-background-color:#609f43}.panel-caution{--panel-background-color:#de776d}.panel-caution,.panel-warning{--panel-font-color:#fff;--custom-link-text-color:#fff;--custom-link-text-hover-color:#fff}.panel-warning{--panel-background-color:#e67e22}.panel-danger{--panel-font-color:#fff;--panel-background-color:#ce3426;--custom-link-text-color:#fff;--custom-link-text-hover-color:#fff}.button{display:inline-block;font-size:120%;padding:.5rem 1.2rem;font-weight:700;text-decoration:none;border-radius:.8rem;--button-font-color:#000;--button-font-hover-color:#000;--button-background-color:#fafafa;--button-background-hover-color:#f7f7f7;--button-border-color:#f0f0f0;color:var(--button-font-color,#000);background:var(--button-background-color,unset);border:2px solid;border-color:var(--button-border-color,transparent)}.button:hover{color:var(--button-font-hover-color,#000);text-decoration:none;background:var(--button-background-hover-color,unset)}.button-notice{--button-font-color:#fff;--button-font-hover-color:#fff;--button-background-color:#4ba0e1;--button-background-hover-color:#3b89c5;--button-border-color:transparent}.button-success{--button-font-color:#fff;--button-font-hover-color:#fff;--button-background-color:#369b08;--button-background-hover-color:#256905;--button-border-color:transparent}.button-caution{--button-font-color:#fff;--button-font-hover-color:#fff;--button-background-color:#f56558;--button-background-hover-color:#d45145;--button-border-color:transparent}.button-warning{--button-font-color:#fff;--button-font-hover-color:#fff;--button-background-color:#f5811b;--button-background-hover-color:#db7012;--button-border-color:transparent}.button-danger{--button-font-color:#fff;--button-font-hover-color:#fff;--button-background-color:#ce3426;--button-background-hover-color:#a0281d;--button-border-color:transparent}.notification{padding:.2rem 1.28rem;text-align:center;background:#eee}.backtothetop{display:none;font-size:200%}.fa-layers .fa-circle{color:#fff}figure>figcaption h4{font-size:80%;font-weight:400}.table_of_contents{font-size:90%;padding:1.28rem;border:4px solid #f0f0f0}.table_of_contents ul{list-style:none;padding-left:0}.table_of_contents li{border-top:1px solid #f0f0f0}.table_of_contents>nav>ul>li:first-child{border-top:unset}.table_of_contents ul>li li a{margin-left:2rem}.table_of_contents ul ul>li li a{margin-left:4rem}.table_of_contents ul ul ul>li li a{margin-left:6rem}.table_of_contents ul ul ul ul>li li a{margin-left:8rem}.table_of_contents ul ul ul ul ul>li li a{margin-left:10rem}.headerlink>.svg-inline--fa{margin-left:.4rem;width:.8rem}.ais-SearchBox .ais-SearchBox-input{width:70%}.ais-SearchBox button{margin-left:.2rem;padding:.4rem}.ais-Stats{font-size:80%;color:#70757a}.ais-Hits-item h3{font-size:140%;font-weight:400}.ais-Hits-item p{color:#3c4043}.ais-Hits-item .lastmod{font-size:90%;color:#70757a}.ais-Pagination{margin-top:1em}.ais-Pagination-list{list-style:none;padding-left:0;-webkit-box-sizing:border-box;box-sizing:border-box;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.ais-Pagination-item{padding:.6rem}.code{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.code,.code .filename{-webkit-box-sizing:border-box;box-sizing:border-box}.code .filename{-webkit-box-flex:0;-ms-flex:0 0 75%;flex:0 0 75%;max-width:75%;font-size:80%;color:#666}.code .copy-btn{margin-left:auto;cursor:pointer;position:relative;font-size:80%;border:1px solid #ccc;padding:.2rem .6rem;border-radius:.3rem;line-height:1;margin-bottom:.2rem;outline:none}.code .code-content{-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%}.tooltipped:after{content:"Copied!";background:#555;display:inline-block;color:#fff;border-radius:.4rem;position:absolute;left:50%;top:-1.8rem;-webkit-transform:translate(-50%);transform:translate(-50%);font-size:.75rem;padding:4px 10px 6px;-webkit-animation:fade-tooltip .5s 1s 1 forwards;animation:fade-tooltip .5s 1s 1 forwards}@-webkit-keyframes fade-tooltip{to{opacity:0}}@keyframes fade-tooltip{to{opacity:0}}header{color:var(--custom-font-color,#fff);background:var(--custom-background-color,#000);padding:.5rem 1.28rem}header h1{font-size:140%;display:inline-block}header .version{margin-left:.4rem;font-size:80%}header .github{color:currentColor;margin-left:.4rem;font-size:180%}.global-menu{color:var(--custom-font-color,#fff);background:var(--custom-background-color,#000);padding:.2rem 1.28rem}.global-menu ul{list-style:none;padding:0;margin:0}.global-menu li{display:inline-block;margin-right:1.8rem;position:relative}.global-menu ul.sub-menu{display:none;margin:0;position:absolute;top:1.8rem;left:0;z-index:99999}.global-menu ul.sub-menu li{padding:.2rem 1.28rem;background:var(--custom-background-color,#000);width:140px;font-size:80%}.global-menu ul.sub-menu li a{color:var(--custom-font-color,#fff)}.global-menu .fa-angle-right{margin-left:.4rem;font-size:80%}.global-menu li.parent:hover>ul.sub-menu{-webkit-box-sizing:border-box;box-sizing:border-box;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-flow:column nowrap;flex-flow:column nowrap}@media screen and (max-width:480px){.global-menu li{display:block;margin-right:0;border-bottom:1px solid}.global-menu li:last-child{border-bottom:none}.global-menu .fa-angle-right{display:none}.global-menu ul.sub-menu{display:block;position:static}.global-menu ul.sub-menu li{width:auto;background:transparent;padding:0 .4rem}.global-menu ul.sub-menu li+li{padding-top:.2rem}.global-menu ul.sub-menu li a{color:currentColor}}.global-menu a{display:block;color:currentColor;text-decoration:none}.global-menu a:hover{text-decoration:underline}main{padding:3rem}@media screen and (max-width:480px){main{padding:1rem}}.sidebar{font-size:90%;line-height:1.8;background:#f9f9f9;border-right:1px solid #eee}.sidebar ul{list-style:none;padding:0;margin:0}.sidebar a{position:relative;display:block;color:#404040;text-decoration:none;padding:.2rem 1rem;border-left:4px solid #f9f9f9;border-bottom:1px solid #eee}.sidebar a:hover{color:#404040;background:#eee;border-left:4px solid #ccc}.sidebar nav>ul>li li a{padding-left:2rem}.sidebar nav>ul ul>li li a{padding-left:3rem}.sidebar nav>ul ul ul>li li a{padding-left:4rem}.sidebar nav>ul ul ul ul>li li a{padding-left:5rem}.sidebar nav>ul ul ul ul ul>li li a{padding-left:6rem}@media screen and (max-width:480px){.sidebar nav>ul>li:first-child a{border-top:1px solid #eee}}.sidebar .active>a{background:#eee;border-left:4px solid #ccc}.sidebar .slide-menu .has-sub-menu:not(.parent) ul{display:none}.sidebar .slide-menu .has-sub-menu>a span.mark{position:absolute;top:0;right:0;display:inline-block;height:32px;width:32px;line-height:2;text-align:center;color:#979797;background:#f2f2f2;border-left:1px solid #e7e7e7}.sidebar-footer{padding:1.28rem}.edit-meta{font-size:80%;text-align:right}.edit-page{font-weight:700}.powered{font-size:80%;text-align:right;color:#999}
\ No newline at end of file