diff options
| author | thingsym <thingsym@gmail.com> | 2020-11-22 11:19:40 +0300 |
|---|---|---|
| committer | thingsym <thingsym@gmail.com> | 2020-11-22 11:19:40 +0300 |
| commit | a84ed5b04c8ff8b1d3df3e120953b5d4511ad6a1 (patch) | |
| tree | 7d3ad8e14743e56f522b32ccbc9d22ed86502815 | |
| parent | 00460ce4b125f3eb90061b624ebd805a81db11c9 (diff) | |
| parent | 76b39a916c2c388097d419552ddc3da486188afb (diff) | |
Merge branch 'release-0.9.6'v0.9.6
25 files changed, 509 insertions, 296 deletions
@@ -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 ``` @@ -235,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/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`  + ## Image with link [](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 >}} 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 + +``` + + +## Image with link + +```markdown +[](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. +``` diff --git a/package-lock.json b/package-lock.json index a083f06..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": { @@ -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..4674648 100644 --- a/package.json +++ b/package.json @@ -1,16 +1,16 @@ { "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", "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", @@ -32,10 +32,10 @@ "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", + "sass": "^1.29.0", "stylelint": "^13.7.0", "stylelint-config-recommended": "^3.0.0", "stylelint-config-recommended-scss": "^4.2.0", @@ -105,10 +105,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", 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"; 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 |