From 685d747e58e74fdb2299a66f8fbcc8d2c00f62db Mon Sep 17 00:00:00 2001 From: Deep0Thinking Date: Wed, 10 Jan 2024 11:09:11 -0800 Subject: [PATCH] add post-thumbnail, add ToC, update style-sheet, code formatted, bug fixed --- Gemfile | 7 + Gemfile.lock | 91 +++ _config.yml | 5 +- _includes/custom-head.html | 6 + _includes/head.html | 6 +- _includes/header.html | 31 + _layouts/default.html | 5 +- _layouts/home.html | 22 +- _layouts/page.html | 2 +- _sass/minima/_base.scss | 281 +++++++ _sass/minima/_layout.scss | 341 ++++++++ _sass/minima/custom-styles.scss | 293 +++++++ _sass/minima/custom-variables.scss | 1 + _sass/minima/initialize.scss | 50 ++ _sass/minima/skins/auto.scss | 361 +++++++++ _sass/minima/skins/classic.scss | 5 + _sass/minima/skins/dark.scss | 5 + _sass/minima/skins/solarized-dark.scss | 5 + _sass/minima/skins/solarized-light.scss | 4 + _sass/minima/skins/solarized.scss | 201 +++++ _site/2022/11/28/How-to-post-posts.html | 621 +++++++++++++++ _site/LICENSE | 21 + _site/README.md | 133 ++++ _site/about.html | 135 ++++ _site/all-tags.html | 109 +++ _site/archive.html | 276 +++++++ _site/assets/css/style.css | 998 ++++++++++++++++++++++++ _site/assets/css/style.css.map | 1 + _site/assets/js/custom-styles.js | 31 + _site/favicon/favicon.ico | Bin 0 -> 15406 bytes _site/index.html | 102 +++ _site/minima.gemspec | 24 + _site/tag/WoW.html | 78 ++ _site/tag/go.html | 78 ++ _site/tag/let's.html | 78 ++ _site/tag/this-is-a-tag.html | 78 ++ _site/tagpage.html | 1 + about.md | 35 +- archive.md | 226 +----- assets/css/style.scss | 10 + assets/js/custom-styles.js | 31 + minima.gemspec | 24 + 42 files changed, 4567 insertions(+), 245 deletions(-) create mode 100644 Gemfile create mode 100644 Gemfile.lock create mode 100644 _includes/custom-head.html create mode 100644 _includes/header.html create mode 100644 _sass/minima/_base.scss create mode 100644 _sass/minima/_layout.scss create mode 100644 _sass/minima/custom-styles.scss create mode 100644 _sass/minima/custom-variables.scss create mode 100644 _sass/minima/initialize.scss create mode 100644 _sass/minima/skins/auto.scss create mode 100644 _sass/minima/skins/classic.scss create mode 100644 _sass/minima/skins/dark.scss create mode 100644 _sass/minima/skins/solarized-dark.scss create mode 100644 _sass/minima/skins/solarized-light.scss create mode 100644 _sass/minima/skins/solarized.scss create mode 100644 _site/2022/11/28/How-to-post-posts.html create mode 100644 _site/LICENSE create mode 100644 _site/README.md create mode 100644 _site/about.html create mode 100644 _site/all-tags.html create mode 100644 _site/archive.html create mode 100644 _site/assets/css/style.css create mode 100644 _site/assets/css/style.css.map create mode 100644 _site/assets/js/custom-styles.js create mode 100644 _site/favicon/favicon.ico create mode 100644 _site/index.html create mode 100644 _site/minima.gemspec create mode 100644 _site/tag/WoW.html create mode 100644 _site/tag/go.html create mode 100644 _site/tag/let's.html create mode 100644 _site/tag/this-is-a-tag.html create mode 100644 _site/tagpage.html create mode 100644 assets/css/style.scss create mode 100644 assets/js/custom-styles.js create mode 100644 minima.gemspec diff --git a/Gemfile b/Gemfile new file mode 100644 index 0000000..b494f75 --- /dev/null +++ b/Gemfile @@ -0,0 +1,7 @@ +# frozen_string_literal: true + +source "https://rubygems.org" +gemspec + +gem "minima", ENV["JEKYLL_VERSION"] if ENV["JEKYLL_VERSION"] +gem 'jekyll-toc' diff --git a/Gemfile.lock b/Gemfile.lock new file mode 100644 index 0000000..1c7a84e --- /dev/null +++ b/Gemfile.lock @@ -0,0 +1,91 @@ +PATH + remote: . + specs: + minima (2.5.1) + jekyll (>= 3.5, < 5.0) + jekyll-feed (~> 0.9) + jekyll-seo-tag (~> 2.1) + +GEM + remote: https://rubygems.org/ + specs: + addressable (2.8.6) + public_suffix (>= 2.0.2, < 6.0) + colorator (1.1.0) + concurrent-ruby (1.2.2) + em-websocket (0.5.3) + eventmachine (>= 0.12.9) + http_parser.rb (~> 0) + eventmachine (1.2.7) + ffi (1.16.3) + forwardable-extended (2.6.0) + google-protobuf (3.25.1-arm64-darwin) + http_parser.rb (0.8.0) + i18n (1.14.1) + concurrent-ruby (~> 1.0) + jekyll (4.3.3) + addressable (~> 2.4) + colorator (~> 1.0) + em-websocket (~> 0.5) + i18n (~> 1.0) + jekyll-sass-converter (>= 2.0, < 4.0) + jekyll-watch (~> 2.0) + kramdown (~> 2.3, >= 2.3.1) + kramdown-parser-gfm (~> 1.0) + liquid (~> 4.0) + mercenary (>= 0.3.6, < 0.5) + pathutil (~> 0.9) + rouge (>= 3.0, < 5.0) + safe_yaml (~> 1.0) + terminal-table (>= 1.8, < 4.0) + webrick (~> 1.7) + jekyll-feed (0.17.0) + jekyll (>= 3.7, < 5.0) + jekyll-sass-converter (3.0.0) + sass-embedded (~> 1.54) + jekyll-seo-tag (2.8.0) + jekyll (>= 3.8, < 5.0) + jekyll-toc (0.18.0) + jekyll (>= 3.9) + nokogiri (~> 1.12) + jekyll-watch (2.2.1) + listen (~> 3.0) + kramdown (2.4.0) + rexml + kramdown-parser-gfm (1.1.0) + kramdown (~> 2.0) + liquid (4.0.4) + listen (3.8.0) + rb-fsevent (~> 0.10, >= 0.10.3) + rb-inotify (~> 0.9, >= 0.9.10) + mercenary (0.4.0) + nokogiri (1.16.0-arm64-darwin) + racc (~> 1.4) + pathutil (0.16.2) + forwardable-extended (~> 2.6) + public_suffix (5.0.4) + racc (1.7.3) + rb-fsevent (0.11.2) + rb-inotify (0.10.1) + ffi (~> 1.0) + rexml (3.2.6) + rouge (4.2.0) + safe_yaml (1.0.5) + sass-embedded (1.69.7-arm64-darwin) + google-protobuf (~> 3.25) + terminal-table (3.0.2) + unicode-display_width (>= 1.1.1, < 3) + unicode-display_width (2.5.0) + webrick (1.8.1) + +PLATFORMS + arm64-darwin-22 + ruby + +DEPENDENCIES + bundler + jekyll-toc + minima! + +BUNDLED WITH + 2.5.4 diff --git a/_config.yml b/_config.yml index e9604a8..c4c3061 100644 --- a/_config.yml +++ b/_config.yml @@ -2,7 +2,7 @@ title: Please-type-your-Github-name-here's Blog -remote_theme: Jekyll/Minima +remote_theme: jekyll/minima show_description: true @@ -10,3 +10,6 @@ header_pages: - all-tags.md - archive.md - about.md + +plugins: + - jekyll-toc \ No newline at end of file diff --git a/_includes/custom-head.html b/_includes/custom-head.html new file mode 100644 index 0000000..8559a67 --- /dev/null +++ b/_includes/custom-head.html @@ -0,0 +1,6 @@ +{% comment %} + Placeholder to allow defining custom head, in principle, you can add anything here, e.g. favicons: + + 1. Head over to https://realfavicongenerator.net/ to add your own favicons. + 2. Customize default _includes/custom-head.html in your source directory and insert the given code snippet. +{% endcomment %} diff --git a/_includes/head.html b/_includes/head.html index b664a38..f384a8d 100644 --- a/_includes/head.html +++ b/_includes/head.html @@ -2,9 +2,9 @@ - {%- seo -%} + - {%- feed_meta -%} + {%- if jekyll.environment == 'production' and site.google_analytics -%} {%- include google-analytics.html -%} {%- endif -%} @@ -19,4 +19,4 @@ - + \ No newline at end of file diff --git a/_includes/header.html b/_includes/header.html new file mode 100644 index 0000000..6293e81 --- /dev/null +++ b/_includes/header.html @@ -0,0 +1,31 @@ +
+
+ {%- assign default_paths = site.pages | map: "path" -%} + {%- assign page_paths = site.header_pages | default: default_paths -%} + {%- assign titles_size = site.pages | map: 'title' | join: '' | size -%} + + + {%- if titles_size > 0 -%} + + {%- endif -%} +
+
+ \ No newline at end of file diff --git a/_layouts/default.html b/_layouts/default.html index a73e1ad..a11ea5f 100644 --- a/_layouts/default.html +++ b/_layouts/default.html @@ -21,10 +21,13 @@
+ {% toc %} {{ content }}
- + + + \ No newline at end of file diff --git a/_layouts/home.html b/_layouts/home.html index 0127943..c314c00 100644 --- a/_layouts/home.html +++ b/_layouts/home.html @@ -3,7 +3,7 @@ ---
- + {%- if page.title -%}

{{ page.title }}

{%- endif -%} @@ -43,7 +43,23 @@



{%- if site.show_description -%} - {{ post.description }} +
+ + + {%- if post.thumbnail -%} +
+ Post Thumbnail +
+ {%- endif -%} + + + {%- if post.description -%} +
+ {{ post.description }} +
+ {%- endif -%} + +
{%- endif -%} @@ -71,4 +87,4 @@

{%- endif -%} -

+ \ No newline at end of file diff --git a/_layouts/page.html b/_layouts/page.html index d26fc7c..cd034f7 100644 --- a/_layouts/page.html +++ b/_layouts/page.html @@ -12,4 +12,4 @@

{{ page.title | escape }}

{{ content }} - + \ No newline at end of file diff --git a/_sass/minima/_base.scss b/_sass/minima/_base.scss new file mode 100644 index 0000000..7b799e9 --- /dev/null +++ b/_sass/minima/_base.scss @@ -0,0 +1,281 @@ +html { + font-size: $base-font-size; +} + +/** + * Reset some basic elements + */ +body, h1, h2, h3, h4, h5, h6, +p, blockquote, pre, hr, +dl, dd, ol, ul, figure { + margin: 0; + padding: 0; + +} + + + +/** + * Basic styling + */ +body { + font: $base-font-weight #{$base-font-size}/#{$base-line-height} $base-font-family; + color: $text-color; + background-color: $background-color; + -webkit-text-size-adjust: 100%; + -webkit-font-feature-settings: "kern" 1; + -moz-font-feature-settings: "kern" 1; + -o-font-feature-settings: "kern" 1; + font-feature-settings: "kern" 1; + font-kerning: normal; + display: flex; + min-height: 100vh; + flex-direction: column; + overflow-wrap: break-word; +} + + + +/** + * Set `margin-bottom` to maintain vertical rhythm + */ +h1, h2, h3, h4, h5, h6, +p, blockquote, pre, +ul, ol, dl, figure, +%vertical-rhythm { + margin-bottom: $spacing-unit * .5; +} + +hr { + margin-top: $spacing-unit; + margin-bottom: $spacing-unit; +} + +/** + * `main` element + */ +main { + display: block; /* Default value of `display` of `main` element is 'inline' in IE 11. */ +} + + + +/** + * Images + */ +img { + max-width: 100%; + vertical-align: middle; +} + + + +/** + * Figures + */ +figure > img { + display: block; +} + +figcaption { + font-size: $small-font-size; +} + + + +/** + * Lists + */ +ul, ol { + margin-left: $spacing-unit; +} + +li { + > ul, + > ol { + margin-bottom: 0; + } +} + + + +/** + * Headings + */ +h1, h2, h3, h4, h5, h6 { + font-weight: $base-font-weight; +} + + + +/** + * Links + */ +a { + color: $link-base-color; + text-decoration: none; + + &:visited { + color: $link-visited-color; + } + + &:hover { + color: $link-hover-color; + text-decoration: underline; + } + + .social-media-list &:hover { + text-decoration: none; + + .username { + text-decoration: underline; + } + } +} + + +/** + * Blockquotes + */ +blockquote { + color: $brand-color; + border-left: 4px solid $border-color-01; + padding-left: $spacing-unit * .5; + @include relative-font-size(1.125); + font-style: italic; + + > :last-child { + margin-bottom: 0; + } + + i, em { + font-style: normal; + } +} + + + +/** + * Code formatting + */ +pre, +code { + font-family: $code-font-family; + font-size: 0.9375em; + border: 1px solid $border-color-01; + border-radius: 3px; + background-color: $code-background-color; +} + +code { + padding: 1px 5px; +} + +pre { + padding: 8px 12px; + overflow-x: auto; + + > code { + border: 0; + padding-right: 0; + padding-left: 0; + } +} + +.highlight { + border-radius: 3px; + background: $code-background-color; + @extend %vertical-rhythm; + + .highlighter-rouge & { + background: $code-background-color; + } +} + + + +/** + * Wrapper + */ +.wrapper { + max-width: calc(#{$content-width} - 150px - (#{$spacing-unit})); + margin-right: auto; + margin-left: auto; + padding-right: $spacing-unit * .5; + padding-left: $spacing-unit * .5; + @extend %clearfix; + + @media screen and (min-width: $on-large) { + max-width: calc(#{$content-width} - (#{$spacing-unit} * 2)); + padding-right: $spacing-unit; + padding-left: $spacing-unit; + } +} + + + +/** + * Clearfix + */ +%clearfix:after { + content: ""; + display: table; + clear: both; +} + + + +/** + * Icons + */ + +.orange { + color: #f66a0a; +} + +.grey { + color: #828282; +} + +.svg-icon { + width: 1.25em; + height: 1.25em; + display: inline-block; + fill: currentColor; + vertical-align: text-bottom; +} + + +/** + * Tables + */ +table { + margin-bottom: $spacing-unit; + width: 100%; + text-align: $table-text-align; + color: $table-text-color; + border-collapse: collapse; + border: 1px solid $table-border-color; + tr { + &:nth-child(even) { + background-color: $table-zebra-color; + } + } + th, td { + padding: ($spacing-unit * 33.3333333333 * .01) ($spacing-unit * .5); + } + th { + background-color: $table-header-bg-color; + border: 1px solid $table-header-border; + } + td { + border: 1px solid $table-border-color; + } + + @include media-query($on-laptop) { + display: block; + overflow-x: auto; + -webkit-overflow-scrolling: touch; + -ms-overflow-style: -ms-autohiding-scrollbar; + } +} diff --git a/_sass/minima/_layout.scss b/_sass/minima/_layout.scss new file mode 100644 index 0000000..4aa8582 --- /dev/null +++ b/_sass/minima/_layout.scss @@ -0,0 +1,341 @@ +/** + * Site header + */ +.site-header { + border-top: 5px solid $border-color-03; + border-bottom: 1px solid $border-color-01; + min-height: $spacing-unit * 1.865; + line-height: $base-line-height * $base-font-size * 2.25; + + // Positioning context for the mobile navigation icon + position: relative; +} + +.site-title { + @include relative-font-size(1.625); + font-weight: 300; + letter-spacing: -1px; + margin-bottom: 0; + float: left; + + @include media-query($on-palm) { + padding-right: 45px; + } + + &, + &:visited { + color: $site-title-color; + } +} + +.site-nav { + position: absolute; + top: 9px; + right: $spacing-unit * .5; + background-color: $background-color; + border: 1px solid $border-color-01; + border-radius: 5px; + text-align: right; + + .nav-trigger { + display: none; + } + + .menu-icon { + float: right; + width: 36px; + height: 26px; + line-height: 0; + padding-top: 10px; + text-align: center; + + > svg path { + fill: $border-color-03; + } + } + + label[for="nav-trigger"] { + display: block; + float: right; + width: 36px; + height: 36px; + z-index: 2; + cursor: pointer; + } + + input ~ .trigger { + clear: both; + display: none; + } + + input:checked ~ .trigger { + display: block; + padding-bottom: 5px; + } + + .page-link { + color: $text-color; + line-height: $base-line-height; + display: block; + padding: 5px 10px; + + // Gaps between nav items, but not on the last one + &:not(:last-child) { + margin-right: 0; + } + margin-left: 20px; + } + + @media screen and (min-width: $on-medium) { + position: static; + float: right; + border: none; + background-color: inherit; + + label[for="nav-trigger"] { + display: none; + } + + .menu-icon { + display: none; + } + + input ~ .trigger { + display: block; + } + + .page-link { + display: inline; + padding: 0; + + &:not(:last-child) { + margin-right: 20px; + } + margin-left: auto; + } + } +} + + + +/** + * Site footer + */ +.site-footer { + border-top: 1px solid $border-color-01; + padding: $spacing-unit 0; +} + +.footer-heading { + @include relative-font-size(1.125); + margin-bottom: $spacing-unit * .5; +} + +.feed-subscribe .svg-icon { + padding: 5px 5px 2px 0 +} + +.contact-list, +.social-media-list { + list-style: none; + margin-left: 0; +} + +.footer-col-wrapper, +.social-links { + @include relative-font-size(0.9375); + color: $brand-color; +} + +.footer-col { + margin-bottom: $spacing-unit * .5; +} + +.footer-col-1, +.footer-col-2 { + width: calc(50% - (#{$spacing-unit} / 2)); +} + +.footer-col-3 { + width: calc(100% - (#{$spacing-unit} / 2)); +} + +@media screen and (min-width: $on-large) { + .footer-col-1 { + width: calc(35% - (#{$spacing-unit} / 2)); + } + + .footer-col-2 { + width: calc(20% - (#{$spacing-unit} / 2)); + } + + .footer-col-3 { + width: calc(45% - (#{$spacing-unit} / 2)); + } +} + +@media screen and (min-width: $on-medium) { + .footer-col-wrapper { + display: flex + } + + .footer-col { + width: calc(100% - (#{$spacing-unit} / 2)); + padding: 0 ($spacing-unit * .5); + + &:first-child { + padding-right: $spacing-unit * .5; + padding-left: 0; + } + + &:last-child { + padding-right: 0; + padding-left: $spacing-unit * .5; + } + } +} + + + +/** + * Page content + */ +.page-content { + padding: $spacing-unit 0; + flex: 1 0 auto; +} + +.page-heading { + @include relative-font-size(2); +} + +.post-list-heading { + @include relative-font-size(1.75); +} + +.post-list { + margin-left: 0; + list-style: none; + + > li { + margin-bottom: $spacing-unit; + } +} + +.post-meta { + font-size: $small-font-size; + color: $brand-color; +} + +.post-link { + display: block; + @include relative-font-size(1.5); +} + + + +/** + * Posts + */ +.post-header { + margin-bottom: $spacing-unit; +} + +.post-title, +.post-content h1 { + @include relative-font-size(2.625); + letter-spacing: -1px; + line-height: 1.15; + + @media screen and (min-width: $on-large) { + @include relative-font-size(2.625); + } +} + +.post-content { + margin-bottom: $spacing-unit; + + h1, h2, h3, h4, h5, h6 { margin-top: $spacing-unit } + + h2 { + @include relative-font-size(1.75); + + @media screen and (min-width: $on-large) { + @include relative-font-size(2); + } + } + + h3 { + @include relative-font-size(1.375); + + @media screen and (min-width: $on-large) { + @include relative-font-size(1.625); + } + } + + h4 { + @include relative-font-size(1.25); + } + + h5 { + @include relative-font-size(1.125); + } + h6 { + @include relative-font-size(1.0625); + } +} + + +.social-media-list { + display: table; + margin: 0 auto; + li { + float: left; + margin: 5px 10px 5px 0; + &:last-of-type { margin-right: 0 } + a { + display: block; + padding: 10px 12px; + border: 1px solid $border-color-01; + &:hover { border-color: $border-color-02 } + } + } +} + + + +/** + * Pagination navbar + */ +.pagination { + margin-bottom: $spacing-unit; + @extend .social-media-list; + li { + a, div { + min-width: 41px; + text-align: center; + box-sizing: border-box; + } + div { + display: block; + padding: $spacing-unit * .25; + border: 1px solid transparent; + + &.pager-edge { + color: $border-color-01; + border: 1px dashed; + } + } + } +} + + + +/** + * Grid helpers + */ +@media screen and (min-width: $on-large) { + .one-half { + width: calc(50% - (#{$spacing-unit} / 2)); + } +} diff --git a/_sass/minima/custom-styles.scss b/_sass/minima/custom-styles.scss new file mode 100644 index 0000000..379cb2b --- /dev/null +++ b/_sass/minima/custom-styles.scss @@ -0,0 +1,293 @@ + +/** + * _layout.scss + */ + +.site-header +{ + position: sticky; + top: 0px; + background-color: rgba(255,255,255,1); + z-index: 1; +} + + + +/** + * about.md + */ + +@import + "https://cdn.jsdelivr.net/npm/remixicon@2.5.0/fonts/remixicon.css" +; + +.Icon-link +{ + transition: 0.3s; + text-decoration: none; + font-size: 7.5vmin; + color: black; + margin-right: 2vmin; + display: inline-block; +} + +.Icon-link:visited +{ + text-decoration: none; + color: black; +} + +.Icon-link:hover +{ + color: DodgerBlue; + text-decoration: underline; + transform: scale(1.2); + transition: 0.3s; +} + +.Info +{ + display: flex; + align-items: center; +} + +.Text-block +{ + flex-grow: 1; + text-align: center; +} + +.Img-block +{ + margin: 2.5vmin; +} + +.Avatar +{ + border-radius: 2vmin; + width: 30vmin; + height: 30vmin; +} + + + +/** + * archive.md + */ + +@import + "https://cdn.jsdelivr.net/npm/remixicon@2.5.0/fonts/remixicon.css" +; + +.Option-width +{ + width: 100%; + text-decoration: none; +} + +.Group-Container-Full-Display +{ + display: flex; + justify-content: space-around; + flex-direction: row; + flex-wrap: wrap; +} + +.Group-Container-Scrolling-Display +{ + display: flex; + flex-direction: row; + overflow: auto; +} + +.Single-Container +{ + position: relative; + width: 170px; + min-width: 170px; + margin: 11px; + height: 100%; + text-align: center; + cursor: pointer; + display: flex; + align-items: center; +} + +.ImgBorder +{ + transition: 0.3s; + display: inline-block; + width: 100%; + height: 100%; + border: 4px solid; + border-color: black; +} + + +.Single-Container:hover .ImgBorder +{ + border-color: DodgerBlue; + transform: scale(1.1); + transition: 0.3s; +} + +.ImgOpacity +{ + opacity: 1; + width: 100%; + transition: 0.3s; + vertical-align: top; +} + +.Single-Container:hover .ImgOpacity +{ + opacity: 0.15; + transition: 0.3s; +} + +.Text +{ + color: black; + font-size: 20px; + text-decoration: none; + opacity: 0; + transition: 0.3s; + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + width: 75%; + justify-content: center; +} + +.Single-Container:hover .Text +{ + opacity: 1; + color: black; + text-decoration: none; +} + +.Text:visited +{ + text-decoration: none; + color: black; +} + +.Selection +{ + color: black; + font-size: 20px; + text-decoration: none; + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + width: 75%; + height: 100%; + display: none; + opacity: 0; + transition: 0.3s; + flex-direction: column; + justify-content: space-around; + align-items: center; + flex-wrap: wrap; +} + +.Single-Container:hover .Selection +{ + opacity: 1; + transition: 0.3s; +} + +.Option +{ + position: relative; + border: black solid 3px; + padding: 3%; + transition: 0.3s; + color: black; + text-decoration: none; + width: auto; +} + +.Option:hover +{ + border-color: DodgerBlue; + transform: scale(1.1); + transition: 0.3s; + text-decoration: underline; + color: black; +} + +/** + * default.html + */ + +.section-nav +{ + display: none; + + @media screen and (min-width: $on-medium) + { + display: block; + text-align: left; + background-color: #fff; + margin: 5px 0; + padding: 10px 30px; + width: 145px; + max-height: calc(100vh - 180px); + overflow: auto; + white-space: nowrap; + border: 1px solid #e8e8e8; + border-radius: 3px; + position: fixed; + left: 25px; + top: 90px; + } + + @media screen and (min-width: calc($on-large + 90px)) + { + display: block; + text-align: left; + background-color: #fff; + margin: 5px 0; + padding: 10px 30px; + width: 205px; + max-height: calc(100vh - 180px); + overflow: auto; + white-space: nowrap; + border: 1px solid #e8e8e8; + border-radius: 3px; + position: fixed; + left: calc( (100vw - 1455px) /2); + top: 90px; + } + +} + +.hide-and-display { + visibility: hidden; +} + +.hide-and-display-trigger:hover .hide-and-display { + visibility: visible; +} + +/** + * home.html + */ + +.post-info::after { + content: ""; + display: table; + clear: both; +} + +.post-thumbnail img{ + margin-left: 5px; + margin-right: 15px; + float: left; + width: 200px; + height: auto; + border-radius: 10px; +} \ No newline at end of file diff --git a/_sass/minima/custom-variables.scss b/_sass/minima/custom-variables.scss new file mode 100644 index 0000000..2a2d0fa --- /dev/null +++ b/_sass/minima/custom-variables.scss @@ -0,0 +1 @@ +// Placeholder to allow overriding predefined variables smoothly. diff --git a/_sass/minima/initialize.scss b/_sass/minima/initialize.scss new file mode 100644 index 0000000..b036bff --- /dev/null +++ b/_sass/minima/initialize.scss @@ -0,0 +1,50 @@ +@charset "utf-8"; + +// Define defaults for each variable. + +$base-font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", "Segoe UI Emoji", "Segoe UI Symbol", "Apple Color Emoji", Roboto, Helvetica, Arial, sans-serif !default; +$code-font-family: "Menlo", "Inconsolata", "Consolas", "Roboto Mono", "Ubuntu Mono", "Liberation Mono", "Courier New", monospace; +$base-font-size: 16px !default; +$base-font-weight: 400 !default; +$small-font-size: $base-font-size * 0.875 !default; +$base-line-height: 1.5 !default; + +$spacing-unit: 20px !default; + +$table-text-align: left !default; + +// Width of the content area +$content-width: 900px !default; + +$on-palm: 1240px !default; +$on-laptop: 1366px !default; + +$on-medium: $on-palm !default; +$on-large: $on-laptop !default; + +// Use media queries like this: +// @include media-query($on-palm) { +// .wrapper { +// padding-right: $spacing-unit / 2; +// padding-left: $spacing-unit / 2; +// } +// } +// Notice the following mixin uses max-width, in a deprecated, desktop-first +// approach, whereas media queries used elsewhere now use min-width. +@mixin media-query($device) { + @media screen and (max-width: $device) { + @content; + } +} + +@mixin relative-font-size($ratio) { + font-size: #{$ratio}rem; +} + +// Import pre-styling-overrides hook and style-partials. +@import + "minima/custom-variables", // Hook to override predefined variables. + "minima/base", // Defines element resets. + "minima/layout", // Defines structure and style based on CSS selectors. + "minima/custom-styles" // Hook to override existing styles. +; diff --git a/_sass/minima/skins/auto.scss b/_sass/minima/skins/auto.scss new file mode 100644 index 0000000..8902e8c --- /dev/null +++ b/_sass/minima/skins/auto.scss @@ -0,0 +1,361 @@ +@charset "utf-8"; + +// Default color scheme settings +// These are overridden in classic.css and dark.scss + +$color-scheme-auto: true !default; +$color-scheme-dark: false !default; + + +// Light mode +// ---------- + +$lm-brand-color: #828282 !default; +$lm-brand-color-light: lighten($lm-brand-color, 40%) !default; +$lm-brand-color-dark: darken($lm-brand-color, 25%) !default; + +$lm-site-title-color: $lm-brand-color-dark !default; + +$lm-text-color: #111111 !default; +$lm-background-color: #fdfdfd !default; +$lm-code-background-color: #eeeeff !default; + +$lm-link-base-color: #2a7ae2 !default; +$lm-link-visited-color: darken($lm-link-base-color, 15%) !default; +$lm-link-hover-color: $lm-text-color !default; + +$lm-border-color-01: $lm-brand-color-light !default; +$lm-border-color-02: lighten($lm-brand-color, 35%) !default; +$lm-border-color-03: $lm-brand-color-dark !default; + +$lm-table-text-color: lighten($lm-text-color, 18%) !default; +$lm-table-zebra-color: lighten($lm-brand-color, 46%) !default; +$lm-table-header-bg-color: lighten($lm-brand-color, 43%) !default; +$lm-table-header-border: lighten($lm-brand-color, 37%) !default; +$lm-table-border-color: $lm-border-color-01 !default; + + +// Syntax highlighting styles should be adjusted appropriately for every "skin" +// ---------------------------------------------------------------------------- + +@mixin lm-highlight { + .highlight { + .c { color: #998; font-style: italic } // Comment + .err { color: #a61717; background-color: #e3d2d2 } // Error + .k { font-weight: bold } // Keyword + .o { font-weight: bold } // Operator + .cm { color: #998; font-style: italic } // Comment.Multiline + .cp { color: #999; font-weight: bold } // Comment.Preproc + .c1 { color: #998; font-style: italic } // Comment.Single + .cs { color: #999; font-weight: bold; font-style: italic } // Comment.Special + .gd { color: #000; background-color: #fdd } // Generic.Deleted + .gd .x { color: #000; background-color: #faa } // Generic.Deleted.Specific + .ge { font-style: italic } // Generic.Emph + .gr { color: #a00 } // Generic.Error + .gh { color: #999 } // Generic.Heading + .gi { color: #000; background-color: #dfd } // Generic.Inserted + .gi .x { color: #000; background-color: #afa } // Generic.Inserted.Specific + .go { color: #888 } // Generic.Output + .gp { color: #555 } // Generic.Prompt + .gs { font-weight: bold } // Generic.Strong + .gu { color: #aaa } // Generic.Subheading + .gt { color: #a00 } // Generic.Traceback + .kc { font-weight: bold } // Keyword.Constant + .kd { font-weight: bold } // Keyword.Declaration + .kp { font-weight: bold } // Keyword.Pseudo + .kr { font-weight: bold } // Keyword.Reserved + .kt { color: #458; font-weight: bold } // Keyword.Type + .m { color: #099 } // Literal.Number + .s { color: #d14 } // Literal.String + .na { color: #008080 } // Name.Attribute + .nb { color: #0086B3 } // Name.Builtin + .nc { color: #458; font-weight: bold } // Name.Class + .no { color: #008080 } // Name.Constant + .ni { color: #800080 } // Name.Entity + .ne { color: #900; font-weight: bold } // Name.Exception + .nf { color: #900; font-weight: bold } // Name.Function + .nn { color: #555 } // Name.Namespace + .nt { color: #000080 } // Name.Tag + .nv { color: #008080 } // Name.Variable + .ow { font-weight: bold } // Operator.Word + .w { color: #bbb } // Text.Whitespace + .mf { color: #099 } // Literal.Number.Float + .mh { color: #099 } // Literal.Number.Hex + .mi { color: #099 } // Literal.Number.Integer + .mo { color: #099 } // Literal.Number.Oct + .sb { color: #d14 } // Literal.String.Backtick + .sc { color: #d14 } // Literal.String.Char + .sd { color: #d14 } // Literal.String.Doc + .s2 { color: #d14 } // Literal.String.Double + .se { color: #d14 } // Literal.String.Escape + .sh { color: #d14 } // Literal.String.Heredoc + .si { color: #d14 } // Literal.String.Interpol + .sx { color: #d14 } // Literal.String.Other + .sr { color: #009926 } // Literal.String.Regex + .s1 { color: #d14 } // Literal.String.Single + .ss { color: #990073 } // Literal.String.Symbol + .bp { color: #999 } // Name.Builtin.Pseudo + .vc { color: #008080 } // Name.Variable.Class + .vg { color: #008080 } // Name.Variable.Global + .vi { color: #008080 } // Name.Variable.Instance + .il { color: #099 } // Literal.Number.Integer.Long + } +} + + +// Dark mode +// --------- + +$dm-brand-color: #999999 !default; +$dm-brand-color-light: lighten($dm-brand-color, 5%) !default; +$dm-brand-color-dark: darken($dm-brand-color, 35%) !default; + +$dm-site-title-color: $dm-brand-color-light !default; + +$dm-text-color: #bbbbbb !default; +$dm-background-color: #181818 !default; +$dm-code-background-color: #212121 !default; + +$dm-link-base-color: #79b8ff !default; +$dm-link-visited-color: $dm-link-base-color !default; +$dm-link-hover-color: $dm-text-color !default; + +$dm-border-color-01: $dm-brand-color-dark !default; +$dm-border-color-02: $dm-brand-color-light !default; +$dm-border-color-03: $dm-brand-color !default; + +$dm-table-text-color: $dm-text-color !default; +$dm-table-zebra-color: lighten($dm-background-color, 4%) !default; +$dm-table-header-bg-color: lighten($dm-background-color, 10%) !default; +$dm-table-header-border: lighten($dm-background-color, 21%) !default; +$dm-table-border-color: $dm-border-color-01 !default; + + +// Syntax highlighting styles should be adjusted appropriately for every "skin" +// List of tokens: https://github.com/rouge-ruby/rouge/wiki/List-of-tokens +// Some colors come from Material Theme Darker: +// https://github.com/material-theme/vsc-material-theme/blob/master/scripts/generator/settings/specific/darker-hc.ts +// https://github.com/material-theme/vsc-material-theme/blob/master/scripts/generator/color-set.ts +// ---------------------------------------------------------------------------- + +@mixin dm-highlight { + .highlight { + .c { color: #545454; font-style: italic } // Comment + .err { color: #f07178; background-color: #e3d2d2 } // Error + .k { color: #89DDFF; font-weight: bold } // Keyword + .o { font-weight: bold } // Operator + .cm { color: #545454; font-style: italic } // Comment.Multiline + .cp { color: #545454; font-weight: bold } // Comment.Preproc + .c1 { color: #545454; font-style: italic } // Comment.Single + .cs { color: #545454; font-weight: bold; font-style: italic } // Comment.Special + .gd { color: #000; background-color: #fdd } // Generic.Deleted + .gd .x { color: #000; background-color: #faa } // Generic.Deleted.Specific + .ge { font-style: italic } // Generic.Emph + .gr { color: #f07178 } // Generic.Error + .gh { color: #999 } // Generic.Heading + .gi { color: #000; background-color: #dfd } // Generic.Inserted + .gi .x { color: #000; background-color: #afa } // Generic.Inserted.Specific + .go { color: #888 } // Generic.Output + .gp { color: #555 } // Generic.Prompt + .gs { font-weight: bold } // Generic.Strong + .gu { color: #aaa } // Generic.Subheading + .gt { color: #f07178 } // Generic.Traceback + .kc { font-weight: bold } // Keyword.Constant + .kd { font-weight: bold } // Keyword.Declaration + .kp { font-weight: bold } // Keyword.Pseudo + .kr { font-weight: bold } // Keyword.Reserved + .kt { color: #FFCB6B; font-weight: bold } // Keyword.Type + .m { color: #F78C6C } // Literal.Number + .s { color: #C3E88D } // Literal.String + .na { color: #008080 } // Name.Attribute + .nb { color: #EEFFFF } // Name.Builtin + .nc { color: #FFCB6B; font-weight: bold } // Name.Class + .no { color: #008080 } // Name.Constant + .ni { color: #800080 } // Name.Entity + .ne { color: #900; font-weight: bold } // Name.Exception + .nf { color: #82AAFF; font-weight: bold } // Name.Function + .nn { color: #555 } // Name.Namespace + .nt { color: #FFCB6B } // Name.Tag + .nv { color: #EEFFFF } // Name.Variable + .ow { font-weight: bold } // Operator.Word + .w { color: #EEFFFF } // Text.Whitespace + .mf { color: #F78C6C } // Literal.Number.Float + .mh { color: #F78C6C } // Literal.Number.Hex + .mi { color: #F78C6C } // Literal.Number.Integer + .mo { color: #F78C6C } // Literal.Number.Oct + .sb { color: #C3E88D } // Literal.String.Backtick + .sc { color: #C3E88D } // Literal.String.Char + .sd { color: #C3E88D } // Literal.String.Doc + .s2 { color: #C3E88D } // Literal.String.Double + .se { color: #EEFFFF } // Literal.String.Escape + .sh { color: #C3E88D } // Literal.String.Heredoc + .si { color: #C3E88D } // Literal.String.Interpol + .sx { color: #C3E88D } // Literal.String.Other + .sr { color: #C3E88D } // Literal.String.Regex + .s1 { color: #C3E88D } // Literal.String.Single + .ss { color: #C3E88D } // Literal.String.Symbol + .bp { color: #999 } // Name.Builtin.Pseudo + .vc { color: #FFCB6B } // Name.Variable.Class + .vg { color: #EEFFFF } // Name.Variable.Global + .vi { color: #EEFFFF } // Name.Variable.Instance + .il { color: #F78C6C } // Literal.Number.Integer.Long + } +} + + +// Mode selection +// -------------- + + +// Classic skin (always light mode) +// Assign outside of the if construct to establish global variable scope + +$brand-color: $lm-brand-color; +$brand-color-light: $lm-brand-color-light; +$brand-color-dark: $lm-brand-color-dark; + +$site-title-color: $lm-site-title-color; + +$text-color: $lm-text-color; +$background-color: $lm-background-color; +$code-background-color: $lm-code-background-color; + +$link-base-color: $lm-link-base-color; +$link-visited-color: $lm-link-visited-color; +$link-hover-color: $lm-link-hover-color; + +$border-color-01: $lm-border-color-01; +$border-color-02: $lm-border-color-02; +$border-color-03: $lm-border-color-03; + +$table-text-color: $lm-table-text-color; +$table-zebra-color: $lm-table-zebra-color; +$table-header-bg-color: $lm-table-header-bg-color; +$table-header-border: $lm-table-header-border; +$table-border-color: $lm-table-border-color; + + +@if $color-scheme-auto { + + // Auto mode + + :root { + --minima-brand-color: #{$lm-brand-color}; + --minima-brand-color-light: #{$lm-brand-color-light}; + --minima-brand-color-dark: #{$lm-brand-color-dark}; + + --minima-site-title-color: #{$lm-site-title-color}; + + --minima-text-color: #{$lm-text-color}; + --minima-background-color: #{$lm-background-color}; + --minima-code-background-color: #{$lm-code-background-color}; + + --minima-link-base-color: #{$lm-link-base-color}; + --minima-link-visited-color: #{$lm-link-visited-color}; + --minima-link-hover-color: #{$lm-link-hover-color}; + + --minima-border-color-01: #{$lm-border-color-01}; + --minima-border-color-02: #{$lm-border-color-02}; + --minima-border-color-03: #{$lm-border-color-03}; + + --minima-table-text-color: #{$lm-table-text-color}; + --minima-table-zebra-color: #{$lm-table-zebra-color}; + --minima-table-header-bg-color: #{$lm-table-header-bg-color}; + --minima-table-header-border: #{$lm-table-header-border}; + --minima-table-border-color: #{$lm-table-border-color}; + } + + @include lm-highlight; + + @media (prefers-color-scheme: dark) { + :root { + --minima-brand-color: #{$dm-brand-color}; + --minima-brand-color-light: #{$dm-brand-color-light}; + --minima-brand-color-dark: #{$dm-brand-color-dark}; + + --minima-site-title-color: #{$dm-site-title-color}; + + --minima-text-color: #{$dm-text-color}; + --minima-background-color: #{$dm-background-color}; + --minima-code-background-color: #{$dm-code-background-color}; + + --minima-link-base-color: #{$dm-link-base-color}; + --minima-link-visited-color: #{$dm-link-visited-color}; + --minima-link-hover-color: #{$dm-link-hover-color}; + + --minima-border-color-01: #{$dm-border-color-01}; + --minima-border-color-02: #{$dm-border-color-02}; + --minima-border-color-03: #{$dm-border-color-03}; + + --minima-table-text-color: #{$dm-table-text-color}; + --minima-table-zebra-color: #{$dm-table-zebra-color}; + --minima-table-header-bg-color: #{$dm-table-header-bg-color}; + --minima-table-header-border: #{$dm-table-header-border}; + --minima-table-border-color: #{$dm-table-border-color}; + } + + @include dm-highlight; + } + + $brand-color: var(--minima-brand-color); + $brand-color-light: var(--minima-brand-color-light); + $brand-color-dark: var(--minima-brand-color-dark); + + $site-title-color: var(--minima-site-title-color); + + $text-color: var(--minima-text-color); + $background-color: var(--minima-background-color); + $code-background-color: var(--minima-code-background-color); + + $link-base-color: var(--minima-link-base-color); + $link-visited-color: var(--minima-link-visited-color); + $link-hover-color: var(--minima-link-hover-color); + + $border-color-01: var(--minima-border-color-01); + $border-color-02: var(--minima-border-color-02); + $border-color-03: var(--minima-border-color-03); + + $table-text-color: var(--minima-table-text-color); + $table-zebra-color: var(--minima-table-zebra-color); + $table-header-bg-color: var(--minima-table-header-bg-color); + $table-header-border: var(--minima-table-header-border); + $table-border-color: var(--minima-table-border-color); + + +} @else if $color-scheme-dark { + + // Dark skin (always dark mode) + + $brand-color: $dm-brand-color; + $brand-color-light: $dm-brand-color-light; + $brand-color-dark: $dm-brand-color-dark; + + $site-title-color: $dm-site-title-color; + + $text-color: $dm-text-color; + $background-color: $dm-background-color; + $code-background-color: $dm-code-background-color; + + $link-base-color: $dm-link-base-color; + $link-visited-color: $dm-link-visited-color; + $link-hover-color: $dm-link-hover-color; + + $border-color-01: $dm-border-color-01; + $border-color-02: $dm-border-color-02; + $border-color-03: $dm-border-color-03; + + $table-text-color: $dm-table-text-color; + $table-zebra-color: $dm-table-zebra-color; + $table-header-bg-color: $dm-table-header-bg-color; + $table-header-border: $dm-table-header-border; + $table-border-color: $dm-table-border-color; + + @include dm-highlight; + + +} @else { + + // Classic skin syntax highlighting + @include lm-highlight; + +} diff --git a/_sass/minima/skins/classic.scss b/_sass/minima/skins/classic.scss new file mode 100644 index 0000000..e61b078 --- /dev/null +++ b/_sass/minima/skins/classic.scss @@ -0,0 +1,5 @@ +@charset "utf-8"; + +$color-scheme-auto: false; +$color-scheme-dark: false; +@import "minima/skins/auto"; diff --git a/_sass/minima/skins/dark.scss b/_sass/minima/skins/dark.scss new file mode 100644 index 0000000..159226e --- /dev/null +++ b/_sass/minima/skins/dark.scss @@ -0,0 +1,5 @@ +@charset "utf-8"; + +$color-scheme-auto: false; +$color-scheme-dark: true; +@import "minima/skins/auto"; diff --git a/_sass/minima/skins/solarized-dark.scss b/_sass/minima/skins/solarized-dark.scss new file mode 100644 index 0000000..500dceb --- /dev/null +++ b/_sass/minima/skins/solarized-dark.scss @@ -0,0 +1,5 @@ +@charset "utf-8"; + +$sol-is-auto: false; +$sol-is-dark: true; +@import "minima/skins/solarized"; diff --git a/_sass/minima/skins/solarized-light.scss b/_sass/minima/skins/solarized-light.scss new file mode 100644 index 0000000..d2fc065 --- /dev/null +++ b/_sass/minima/skins/solarized-light.scss @@ -0,0 +1,4 @@ +@charset "utf-8"; + +$sol-is-auto: false; +@import "minima/skins/solarized"; diff --git a/_sass/minima/skins/solarized.scss b/_sass/minima/skins/solarized.scss new file mode 100644 index 0000000..7ac1f5a --- /dev/null +++ b/_sass/minima/skins/solarized.scss @@ -0,0 +1,201 @@ +@charset "utf-8"; + +// Solarized skin +// ============== +// Created by Sander Voerman using the Solarized +// color scheme by Ethan Schoonover . + +// This style sheet implements three options for the minima.skin setting: +// "solarized-light" for light mode, "solarized-dark" for dark mode, and +// "solarized" for light or dark mode depending on user preference. +$sol-is-auto: true !default; +$sol-is-dark: false !default; + + +// Color scheme +// ------------ +// The inline comments show the canonical L*a*b values for each color. + +$sol-base03: #002b36; // 15 -12 -12 +$sol-base02: #073642; // 20 -12 -12 +$sol-base01: #586e75; // 45 -07 -07 +$sol-base00: #657b83; // 50 -07 -07 +$sol-base0: #839496; // 60 -06 -03 +$sol-base1: #93a1a1; // 65 -05 -02 +$sol-base2: #eee8d5; // 92 -00 10 +$sol-base3: #fdf6e3; // 97 00 10 +$sol-yellow: #b58900; // 60 10 65 +$sol-orange: #cb4b16; // 50 50 55 +$sol-red: #dc322f; // 50 65 45 +$sol-magenta: #d33682; // 50 65 -05 +$sol-violet: #6c71c4; // 50 15 -45 +$sol-blue: #268bd2; // 55 -10 -45 +$sol-cyan: #2aa198; // 60 -35 -05 +$sol-green: #859900; // 60 -20 65 + + +// Mixed colors +// ------------ +// While not part of the original Solarized base tones, these derived tones +// are meant to replicate the visual style of the classic skin. They should +// not be used in cases where sufficiently contrasting colors are needed. + +$sol-light-mix1: mix($sol-base1, $sol-base3); +$sol-light-mix2: mix($sol-blue, $sol-base00); +$sol-light-mix3: mix($sol-base2, $sol-base3); +$sol-dark-mix1: mix($sol-base01, $sol-base03); +$sol-dark-mix2: mix($sol-blue, $sol-base0); +$sol-dark-mix3: mix($sol-base02, $sol-base03); + + +// Mode selection +// -------------- + +$sol-mono3: $sol-base3; +$sol-mono2: $sol-base2; +$sol-mono1: $sol-base1; +$sol-mono00: $sol-base00; +$sol-mono01: $sol-base01; +$sol-mix1: $sol-light-mix1; +$sol-mix2: $sol-light-mix2; +$sol-mix3: $sol-light-mix3; + +@if $sol-is-dark { + $sol-mono3: $sol-base03; + $sol-mono2: $sol-base02; + $sol-mono1: $sol-base01; + $sol-mono00: $sol-base0; + $sol-mono01: $sol-base1; + $sol-mix1: $sol-dark-mix1; + $sol-mix2: $sol-dark-mix2; + $sol-mix3: $sol-dark-mix3; +} + +@if $sol-is-auto { + :root { + --solarized-mono3: #{$sol-base3}; + --solarized-mono2: #{$sol-base2}; + --solarized-mono1: #{$sol-base1}; + --solarized-mono00: #{$sol-base00}; + --solarized-mono01: #{$sol-base01}; + --solarized-mix1: #{$sol-light-mix1}; + --solarized-mix2: #{$sol-light-mix2}; + --solarized-mix3: #{$sol-light-mix3}; + } + + @media (prefers-color-scheme: dark) { + :root { + --solarized-mono3: #{$sol-base03}; + --solarized-mono2: #{$sol-base02}; + --solarized-mono1: #{$sol-base01}; + --solarized-mono00: #{$sol-base0}; + --solarized-mono01: #{$sol-base1}; + --solarized-mix1: #{$sol-dark-mix1}; + --solarized-mix2: #{$sol-dark-mix2}; + --solarized-mix3: #{$sol-dark-mix3}; + } + } + + $sol-mono3: var(--solarized-mono3); + $sol-mono2: var(--solarized-mono2); + $sol-mono1: var(--solarized-mono1); + $sol-mono00: var(--solarized-mono00); + $sol-mono01: var(--solarized-mono01); + $sol-mix1: var(--solarized-mix1); + $sol-mix2: var(--solarized-mix2); + $sol-mix3: var(--solarized-mix3); +} + + +// Minima color variables +// ---------------------- + +$brand-color: $sol-mono1 !default; +$brand-color-light: $sol-mix1 !default; +$brand-color-dark: $sol-mono00 !default; + +$site-title-color: $sol-mono00 !default; + +$text-color: $sol-mono01 !default; +$background-color: $sol-mono3 !default; +$code-background-color: $sol-mono2 !default; + +$link-base-color: $sol-blue !default; +$link-visited-color: $sol-mix2 !default; +$link-hover-color: $sol-mono00 !default; + +$border-color-01: $brand-color-light !default; +$border-color-02: $sol-mono1 !default; +$border-color-03: $sol-mono00 !default; + +$table-text-color: $sol-mono00 !default; +$table-zebra-color: $sol-mix3 !default; +$table-header-bg-color: $sol-mono2 !default; +$table-header-border: $sol-mono1 !default; +$table-border-color: $sol-mono1 !default; + + +// Syntax highlighting styles +// -------------------------- + +.highlight { + .c { color: $sol-mono1; font-style: italic } // Comment + .err { color: $sol-red } // Error + .k { color: $sol-mono01; font-weight: bold } // Keyword + .o { color: $sol-mono01; font-weight: bold } // Operator + .cm { color: $sol-mono1; font-style: italic } // Comment.Multiline + .cp { color: $sol-mono1; font-weight: bold } // Comment.Preproc + .c1 { color: $sol-mono1; font-style: italic } // Comment.Single + .cs { color: $sol-mono1; font-weight: bold; font-style: italic } // Comment.Special + .gd { color: $sol-red } // Generic.Deleted + .gd .x { color: $sol-red } // Generic.Deleted.Specific + .ge { color: $sol-mono00; font-style: italic } // Generic.Emph + .gr { color: $sol-red } // Generic.Error + .gh { color: $sol-mono1 } // Generic.Heading + .gi { color: $sol-green } // Generic.Inserted + .gi .x { color: $sol-green } // Generic.Inserted.Specific + .go { color: $sol-mono00 } // Generic.Output + .gp { color: $sol-mono00 } // Generic.Prompt + .gs { color: $sol-mono01; font-weight: bold } // Generic.Strong + .gu { color: $sol-mono1 } // Generic.Subheading + .gt { color: $sol-red } // Generic.Traceback + .kc { color: $sol-mono01; font-weight: bold } // Keyword.Constant + .kd { color: $sol-mono01; font-weight: bold } // Keyword.Declaration + .kp { color: $sol-mono01; font-weight: bold } // Keyword.Pseudo + .kr { color: $sol-mono01; font-weight: bold } // Keyword.Reserved + .kt { color: $sol-violet; font-weight: bold } // Keyword.Type + .m { color: $sol-cyan } // Literal.Number + .s { color: $sol-magenta } // Literal.String + .na { color: $sol-cyan } // Name.Attribute + .nb { color: $sol-blue } // Name.Builtin + .nc { color: $sol-violet; font-weight: bold } // Name.Class + .no { color: $sol-cyan } // Name.Constant + .ni { color: $sol-violet } // Name.Entity + .ne { color: $sol-violet; font-weight: bold } // Name.Exception + .nf { color: $sol-blue; font-weight: bold } // Name.Function + .nn { color: $sol-mono00 } // Name.Namespace + .nt { color: $sol-blue } // Name.Tag + .nv { color: $sol-cyan } // Name.Variable + .ow { color: $sol-mono01; font-weight: bold } // Operator.Word + .w { color: $sol-mono1 } // Text.Whitespace + .mf { color: $sol-cyan } // Literal.Number.Float + .mh { color: $sol-cyan } // Literal.Number.Hex + .mi { color: $sol-cyan } // Literal.Number.Integer + .mo { color: $sol-cyan } // Literal.Number.Oct + .sb { color: $sol-magenta } // Literal.String.Backtick + .sc { color: $sol-magenta } // Literal.String.Char + .sd { color: $sol-magenta } // Literal.String.Doc + .s2 { color: $sol-magenta } // Literal.String.Double + .se { color: $sol-magenta } // Literal.String.Escape + .sh { color: $sol-magenta } // Literal.String.Heredoc + .si { color: $sol-magenta } // Literal.String.Interpol + .sx { color: $sol-magenta } // Literal.String.Other + .sr { color: $sol-green } // Literal.String.Regex + .s1 { color: $sol-magenta } // Literal.String.Single + .ss { color: $sol-magenta } // Literal.String.Symbol + .bp { color: $sol-mono1 } // Name.Builtin.Pseudo + .vc { color: $sol-cyan } // Name.Variable.Class + .vg { color: $sol-cyan } // Name.Variable.Global + .vi { color: $sol-cyan } // Name.Variable.Instance + .il { color: $sol-cyan } // Literal.Number.Integer.Long +} diff --git a/_site/2022/11/28/How-to-post-posts.html b/_site/2022/11/28/How-to-post-posts.html new file mode 100644 index 0000000..24daecc --- /dev/null +++ b/_site/2022/11/28/How-to-post-posts.html @@ -0,0 +1,621 @@ + + + + + + + + + + + + + + + + + + + + + + + +
+
+
+
+
+ +
+ +
+

How to post posts

+ + [ + + + this-is-a-tag + + + WoW + + + let's + + + go + + ] + +
+
+ +

+ You could write a brief description here to catch your readers' interests, like this is a post about how to post posts :) +

+ +

+
+ +
+ +
+

First, let’s talk about the basic requirements for a valid post file:

+ +
    +
  • +

    External requirements:

    + +
      +
    • +

      Naming: You need to name your post file with the naming format of “Year-Month-Date-Title.md”, for example: “2022-11-28-My-first-post.md”. (Attention: The file naming does not allow any “space” character, so please make sure to use “-“ to replace them.)

      +
      • +
    • +

      Location: You need to place your post file under the “/_posts/” folder.

      +
      • +
    • +

      tag-page: (You could temporarily skip this part until you have gotten up to the tags part under Internal requirements below) Please remember, if you add tags to a post, let’s assume one of the tags name is “the-tag-you-add”, then you should create a “the-tag-you-add.md” file under the “/tag/” folder in order to generate a tag-page for the “the-tag-you-add” and with just these contents in that “the-tag-you-add.md”:

      + + 
      ---
+layout: tagpage
+title: "Tag: the-tag-you-add"
+tag: the-tag-you-add
+---
+
      + +

      And that tag-page would collect and display all your posts with that tag. In fact, there is a more efficient way to repeat this repetitive procedure, which is to create a python script to help you do that, for more detailed information please click on the solutions link below.

      + +

      The tags and tag-page display solutions are here provided by Long Qian, great thanks to him!

      +
      • +
    +
    • +
  • +

    Internal requirements:

    + +
      +
    • +

      Predeclaration:

      + +

      Every “post.md” file you posted need to have a Predeclaration in the form of this at the file’s head (beginning) part (including this file: You can see the Predeclaration part at the beginning):

      + + 
      ---
+layout: post
+title: How to post posts
+tags: this-is-a-tag WoW let's go
+description: You could write a brief description here to catch your readers' interests, like this is a post about how to post posts :)
+---
+
      + +

      And let me explain this part line by line:

      + +
        +
      • +

        layout: post

        + +

        Please just write 1 word “post”. This means your post that you want to post would use the post layout of “_layouts/page.html” file.

        +
        • +
      • +

        title: Please write your post title here.

        + +

        In fact, the file name in the Naming part of the External requirements can be different from the title name here, but it is always a good habit to keep them the same to disambiguate and improve convenience (just like writing the annotation when coding), especially when you want to read or modify these posts files in the future. But if you find a more efficient and effective naming method, you could definitely follow your way.

        +
        • +
      • +

        tags: Please write your post tag(s) here.

        + +

        If you want to put 2 or more tags here, you need to use “space” to separate them, and what can you do if you don’t want the tag to be separated, you could use “-“ to replace the “space” to combine the words and prevent the breakage in 1 tag. For example: this-is-a-tag is 1 tag, WoW is 1 tag, let's go is 2 tags, they actually break into 2 tags of let's and go due to the “space” between them.

        +
        • +
      • +

        description: You could write a brief description in the description part to catch your readers’ interests (Attention: Please don’t leave “space” between “:” and following the word or punctuation in the description part, or your post and description will not be able to display.) , like this is a post about how to post posts (Me: It sounds super attractive right? Me again: Hahahahaha, no.) . Or, if you don’t like the description part, you could always turn it off in the “/_config.yml” file by replacing the true in show_description: true with false or just simply delete that whole line.

        +
        • +
      +
      • +
    • +

      Post body part:

      + +
        +
      • +

        The text language you can use:

        + +
          +
        • +

          Markdown

          +
          • +
        • +

          HTML

          +
          • +
        • +

          CSS

          +
          • +
        • +

          Javascript

          +
          • +
        + +

        Don’t worry, you don’t need to master these 4 languages to write a post, in fact, using only the Markdown language is basically enough (look at this post file name, its suffix is “.md” and md represents the Markdown language), because Markdown language can support the basic post arrangements and it is super easy and convenient to learn and use. BTW I bet you could master its basic syntax within 5 minutes, then you could be able to write the following Mardown contents too:

        +
        • +
      +
      • +
    +
    • +
+ +
+ +



+ +
# Heading 1
+## Heading 2
+### Heading 3
+#### Heading 4
+##### Heading 5
+###### Heading 6
+
+ +

Heading 1

+

Heading 2

+

Heading 3

+

Heading 4

+
Heading 5
+
Heading 6
+ +



+ +
Look, I *wrote* 6 headings! **Hahahahaha!**
+
+ +

Look, I wrote 6 headings! Hahahahaha!

+ +



+ +
***Nice!***
+
+ +

Nice!

+ +



+ +
I like ~~playing Xbox games~~ doing homework!
+
+ +

I like playing Xbox games doing homework!

+ +



+ +
Here is a [link to google](https://google.com).
+
+ +

Here is a link to google.

+ +



+ +
Here is an inline code: `print("Hello World!")`, it works!
+
+ +

Here is an inline code: print("Hello World!"), it works!

+ +



+ +
+Here is a code block:
+
+```python
+a = 3
+print(a)
+```
+
+ +

Here is a code block:

+ +
a = 3
+print(a)
+
+ +



+ +
Here is a table:
+
+|title 1|title 2|title 3|
+|:-|:-:|-:|
+|left|middle|right|
+|text|text|text|
+
+ +

Here is a table:

+ + + + + + + + + + + + + + + + + + + + + +
title 1title 2title 3
leftmiddleright
texttexttext
+ +



+ +
Here is an ordered list:
+
+1. H
+2. E
+3. Y
+4. !
+
+ +

Here is an ordered list:

+ +
    +
  1. H
    2. +
  2. E
    3. +
  3. Y
    4. +
  4. !
    5. +
+ +



+ +
Here is an unordered list:
+
+- Play music
+  - Open music app
+- Do sports
+  - Play tennis
+- Go to bed
+  - turn of the light
+    - close your eyes
+- Fall asleep
+
+ +

Here is an unordered list:

+ +
    +
  • Play music +
      +
    • Open music app
      • +
    +
    • +
  • Do sports +
      +
    • Play tennis
      • +
    +
    • +
  • Go to bed +
      +
    • turn of the light +
        +
      • close your eyes
        • +
      +
      • +
    +
    • +
  • Fall asleep
    • +
+ +



+ +
Here is a image (of the Github logo):
+
+![github logo](https://github.githubassets.com/images/modules/logos_page/GitHub-Logo.png)
+
+ +

Here is a image (of the Github logo):

+ +

github logo

+ +



+ +

However, if you want to add something like a downloadable-file link, a youtube video and a line, etc (just some more complex things?), you could easily embed some HTML code in the .md files to achieve these goals (since using purely Markdown language are not able to realize that) and it is totally valid because the Markdown language are always supportive to the HTML language. In addition to this, please remember that HTML is more expressive than Markdown, though Markdown is more convenient to learn and use.

+ +

BTW, the HTML is also very easy to learn, though it would take more time to master than the Markdown. I strongly recommend you to follow the tutorial of HTML (or other front-end languages) on these 2 cool website (I learned the front-end languages there :) ) :

+ +
    +
  1. +

    w3schools (easy to begin with and review, but lack of detailed explanation for the logic behind the code)

    +
    2. +
  2. +

    MDN Web Docs (much more comprehensive)

    +
    3. +
+ +

BTW: They are totally free and it would be better if you use both of them to learn :)

+ +



+ +
<h1> Heading </h1>
+<h2> Heading </h2>
+<h3> Heading </h3>
+<h4> Heading </h4>
+<h5> Heading </h5>
+<h6> Heading </h6>
+
+ +

Heading

+

Heading

+

Heading

+

Heading

+
Heading
+
Heading
+ +



+ +
Here is a downloadable file link:
+
+<a href="https://deep0thinking.github.io/ghp/2022/11/28/How-to-post-posts.html" download>
+Click me to download
+</a>
+
+ +

Here is a downloadable file link:

+ +

+Click me to download +

+ +



+ +
Here is an invisible line break:
+
+<br>
+
+ +

Here is an invisible line break:

+ +


+ +



+ +
Here is a horizontal line:
+
+<hr>
+
+ +

Here is a horizontal line:

+ +
+ +


+ +

If you want to embed a youtube video, you can first open that video on the youtube, then click on the “Share” button (or just right-click on the video display area) -> click on “Embed” and copy the related HTML code (click on “Copy embed code”), at last paste it inside your post file with some little tricks (and I will explain this on the “Attention” part below). Then you would successfully have an interactive youtube video like this (the example youtube video I embedded here is a awesome video produced by Veritasium !) .

+ +



+ +
<div style="position: relative; width: 100%; padding-bottom: 52.8%;">
+<iframe style="position: absolute; width: 100%; height: 100%;" src="https://www.youtube.com/embed/HeQX2HjkcNo" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
+</div>
+
+ +
+ +
+ +



+ +

(Attention: When you are trying to embed the HTML code of the video, please make sure to

+ +
    +
  1. +

    Put the embed code inside the part surrounded by<div style="position: relative; width: 100%; padding-bottom: ???%;"> and /div in this form: <div style="position: relative; width: 100%; padding-bottom: ???%;"> <iframe ... ></iframe> </div>

    +
    2. +
  2. +

    The ??? in the 1st rule above represents the width value of the youtube video you want to embed, and you need to calculate that value through right-click on the video display area -> click on “Stats for nerds”, then a data block would display on the top left corner of the video display area. Next, find the line of Viewport / Frames, like Viewport / Frames 966x510*2.00 / 0 dropped of 128, and then do the division: $510/966*100 \approx 52.8$ and replace the ??? with that result (52.8).

    +
    3. +
  3. +

    Delete the original width and height parts of the code you embedded (like: width=”966” height=”510” ), then put style="position: absolute; width: 100%; height: 100%;" inside its iframe element in this form: <div style="position: relative; width: 100%; padding-bottom: ???%;"> <iframe style="position: absolute; width: 100%; height: 100%;" ... ></iframe> </div> (The ... represents the remain part of the embed code you didn’t modify)**

    +
    4. +
+ +

These 3 steps are to adjust and make the embed video size suitable to all different devices screen size.

+ +

All in all, considering the 3 rules listed above, you should have this form of code block in order to display the youtube video properly on any devices:

+ +
<div style="position: relative; width: 100%; padding-bottom: ???%;">
+  <iframe style="position: absolute; width: 100%; height: 100%;" ... ></iframe>
+</div>
+
+ +

)

+ +



+ +
Here is an inline Maths equation: $\frac{\pi}{2}$ is half of pi
+
+ +

Here is an inline Maths equation: $\frac{\pi}{2}$ is half of pi

+ +



+ +
Here is a Maths equation block:
+
+<div style="overflow: auto;">
+$$
+\begin{aligned}
+&\lambda \text{ for } \begin{bmatrix}
+  \cos(\theta)& -\sin(\theta) & 0\\
+  \sin(\theta)&  \cos(\theta)& 0\\
+  0& 0&1
+\end{bmatrix}
+\quad
+\Longrightarrow
+\quad
+\det{
+\begin{bmatrix}
+  \cos(\theta)-\lambda& -\sin(\theta) & 0\\
+  \sin(\theta)&  \cos(\theta)-\lambda& 0\\
+  0& 0&1-\lambda
+\end{bmatrix}
+}=0
+\\\\
+\Longrightarrow
+\quad & \left( (\cos(\theta)-\lambda)(\cos(\theta)-\lambda)(1-\lambda)+0+0 \right)-\left(0+0+(-\sin(\theta))(\sin(\theta))(1-\lambda) \right)=0
+\\\\
+\Longrightarrow
+\quad & \left(\cos^2(\theta)-2\cos(\theta)\lambda+\lambda^2+\sin^2(\theta) \right)(1-\lambda)=0
+\\\\
+\Longrightarrow
+\quad & \left(\lambda^2-2\cos(\theta)\lambda+1 \right)(1-\lambda)=0
+\\\\
+\Longrightarrow
+\quad &
+\begin{cases}
+  \lambda_1&=1\\
+  \lambda_2=\frac{2\cos(\theta)+\sqrt{4\cos^2(\theta)-4}}{2}=\cos(\theta)+i\sin(\theta)&=e^{i\theta}\\
+  \lambda_3=\frac{2\cos(\theta)-\sqrt{4\cos^2(\theta)-4}}{2}=\cos(\theta)-i\sin(\theta)&=e^{-i\theta}
+\end{cases}
+\end{aligned}
+$$
+</div>
+
+ +

Here is a Maths equation block:

+ +
+$$ +\begin{aligned} +&\lambda \text{ for } \begin{bmatrix} + \cos(\theta)& -\sin(\theta) & 0\\ + \sin(\theta)& \cos(\theta)& 0\\ + 0& 0&1 +\end{bmatrix} +\quad +\Longrightarrow +\quad +\det{ +\begin{bmatrix} + \cos(\theta)-\lambda& -\sin(\theta) & 0\\ + \sin(\theta)& \cos(\theta)-\lambda& 0\\ + 0& 0&1-\lambda +\end{bmatrix} +}=0 +\\\\ +\Longrightarrow +\quad & \left( (\cos(\theta)-\lambda)(\cos(\theta)-\lambda)(1-\lambda)+0+0 \right)-\left(0+0+(-\sin(\theta))(\sin(\theta))(1-\lambda) \right)=0 +\\\\ +\Longrightarrow +\quad & \left(\cos^2(\theta)-2\cos(\theta)\lambda+\lambda^2+\sin^2(\theta) \right)(1-\lambda)=0 +\\\\ +\Longrightarrow +\quad & \left(\lambda^2-2\cos(\theta)\lambda+1 \right)(1-\lambda)=0 +\\\\ +\Longrightarrow +\quad & +\begin{cases} + \lambda_1&=1\\ + \lambda_2=\frac{2\cos(\theta)+\sqrt{4\cos^2(\theta)-4}}{2}=\cos(\theta)+i\sin(\theta)&=e^{i\theta}\\ + \lambda_3=\frac{2\cos(\theta)-\sqrt{4\cos^2(\theta)-4}}{2}=\cos(\theta)-i\sin(\theta)&=e^{-i\theta} +\end{cases} +\end{aligned} +$$ +
+ +


+ +

And the solution of embedding Latex to display Maths equation on a webpage is provided by MathJax, great thanks to them! For more detailed information, you can go to check the MathJax Documentation.

+ +

(Attention: Please make sure to surround the equations block (generally no necessary for the inline equations, unless you write a too long inline formula…) by <div style="overflow: auto;"> and </div>, or that may cause display overflow problem on some devices with narrower screen width. Besides that, if you meet some problem on displaying the Math formula with Mathjax, try to use \_ and \* instead of _ and * in the Mardown in order to trigger the Markdown escape mechanism. If that doesn’t help, these information may solve your problem:

+ +

Different behavior for $ and for $$ #2613

+ +

Multiple subscripts in one equation error #2081

+ +

Problem on Using Mathjax with Jekyll Markdown #830

+ +

)

+ +



+ +

And for the interactive animations, please go to learn the HTML, CSS and Javascript. Websites recommendation:

+ +
    +
  1. +

    w3schools (easy to begin with and review, but lack of detailed explanation for the logic behind the code)

    +
    2. +
  2. +

    MDN Web Docs (much more comprehensive)

    +
    3. +
+ +

BTW: They are totally free and it would be better if you use both of them to learn :)

+ +



+ +

Maybe you have already noticed the fake comments section below, wanna put it somewhere else or delete it? Click it for more information ~

+ +
+ +
+ +
+ +

fake comments section

+ +
+
+ + + + + + \ No newline at end of file diff --git a/_site/LICENSE b/_site/LICENSE new file mode 100644 index 0000000..d227398 --- /dev/null +++ b/_site/LICENSE @@ -0,0 +1,21 @@ +MIT License + +Copyright (c) 2023 Deep0Thinking + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in all +copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE +SOFTWARE. diff --git a/_site/README.md b/_site/README.md new file mode 100644 index 0000000..b5fa983 --- /dev/null +++ b/_site/README.md @@ -0,0 +1,133 @@ +# [2nd-Minima](https://deep0thinking.github.io/2nd-Minima/) + +### Table of Contents + +- [0 About](#0) + + - [0.1 About the 2nd-Minima repository](#0.1) + + - [0.2 About the "/README.md"](#0.2) + + - [0.3 About the usage](#0.3) + + - [0.4 About the acknowledgement](#0.4) + +- [1 Basic set up](#1) + + - [1.1 Use this template](#1.1) + + - [1.2 Webpage deployment](#1.2) + + +- [2 Usage](#2) + + - [2.1 "/_config.yml"](#2.1) + + - [2.2 Posts](#2.2) + + - [2.3 giscus.app](#2.3) + + - [2.4 "/about.md"](#2.4) + + - [2.5 "/archive.md"](#2.5) + + - [2.6 favicon](#2.6) + + +
+ +

0 About

+ +

0.1 About the 2nd-Minima repository

+ +This Github repository is designed for the people who want to build a personal website handily (based on [Jekyll-theme-Minima](https://github.com/jekyll/minima)) but are not familiar with front-end programming languages. + +To be more specific, it is an advanced modified-version **template** of personal websites based on [Jekyll-theme-Minima](https://github.com/jekyll/minima). + +And here is a [**2nd-Minima**](https://github.com/Deep0Thinking/2nd-Minima) based website sample: [Deep0Thinking.github.io](https://deep0thinking.github.io) + +![Deep0Thinking.github.io](https://repository-images.githubusercontent.com/589368822/c878cee3-1b76-4852-a06a-f8a773679ff5) + +

0.2 About the "/README.md"

+ +This "[**/README.md**](https://github.com/Deep0Thinking/2nd-Minima/blob/master/README.md)" file is considered to be a manual or handbook for the [**2nd-Minima**](https://github.com/Deep0Thinking/2nd-Minima) repository. I would try to explain everything as I can to help you to understand it and modify it according to your preference. + +

0.3 About the usage

+ +Briefly, you could do almost any modification based on this template as you want according to the [MIT License](https://github.com/Deep0Thinking/2nd-Minima/blob/main/LICENSE) in both [**2nd-Minima**](https://github.com/Deep0Thinking/2nd-Minima) and [Jekyll-theme-Minima](https://github.com/jekyll/minima). + +

0.4 About the acknowledgement

+ +I would like to thank all the developers and contributors of the [Jekyll-theme-Minima](https://github.com/jekyll/minima), because the [**2nd-Minima**](https://github.com/Deep0Thinking/2nd-Minima) is an advanced personal-website-template repository that developed mainly based on the [Jekyll-theme-Minima](https://github.com/jekyll/minima). + +And specifically, great thanks to [Long Qian](http://longqian.me/aboutme/), [MathJax](https://www.mathjax.org) and [giscus.app](https://giscus.app) for providing supportive tool and code for the community! + +Thanks should also go to Github, because this platform provide many people (including me) a chance to learn, cooperate and improve in coding. + +Finally, special thanks to my family and friends, without their support in every aspect, I would never accomplish this. + +Oh, and a big thank to you too, I really appreciate that you trust me and use it :) + +--- + +

1 Basic set up

+ +

1.1 Use this template

+ +Please enter the [**2nd-Minima**](https://github.com/Deep0Thinking/2nd-Minima) repository page first and click on `Use this template` (the green button) -> `Create a new repository` , then please enter the "Repository name", if this is your first time creating a repository, I recommend you to type in the form of "Your-Github-name.github.io" like "Louis.github.io", for more detailed explanation please check here: https://pages.github.com . But if you want to use other repository names like "Cookie-0111", it's totally acceptable and will not cause any difference or problem on the future use. + +And for other setting selections you could just leave them as default, or you could make your own choices based on your preference. (BTW, others could still access to your personal website as long as you've deployed this repository's webpage and they also got its link address, even though you choose `private` when creating the repository at first) + +

1.2 Webpage deployment

+ +Please enter the page of the repository which you've just created using the [**2nd-Minima**](https://github.com/Deep0Thinking/2nd-Minima) template, then please click on `Settings` (above the green button) -> `Pages` (on the left column list) -> `None` -> `master` -> `Save`. And after about 1 minute, your personal website will be generated successfully, BTW you can always check its deployment state through access your repository Github main page to see whether that little yellow point (next to the green button `< > Code`) has turned into the ✅ (and please keep refreshing the page) . + +And you can visit your site at `Settings` -> `Pages` -> `Visit site` , and don't forget to remember your website address :) + +In fact, you could save the address on your browser, or put that address into your repository's `About` block which is next to the green button `< > Code` on your repository Github main page by clicking the option button (the gear icon) in that `About` block, or create a clickable link combines with the heading in your "**/README.md**" file under the repository, like `# [please-paste-your-webpage-link-here](https://please-paste-your-webpage-link-here)` , and next time you can conveniently click on that heading on your repository Github main page to access your webpage since Github has set the "**README.md**" file of every repository to display automatically on their corresponding repository's Github main page. + +--- + +

2 Usage

+ +

2.1 "/_config.yml"

+ +First, please open the "**/_config.yml**" and replace the `Please-type-your-Github-name-here` with your Github name in the title part. + +Next, for line with `the show_description` , I recommend you to leave its value with `true` , and don't worry, we will help you to figure that out later. + +And for the `header_pages` , this part controls the display order of the pages on the navigation bar of `archive` , `about` and `all-tags` pages, you can change their sequence to affect their real display sequence on the webpage: the order of top to bottom in the `header_pages` corresponds to order of left to right on the webpage navigation bar. + +

2.2 Posts

+ +Want to write a post including texts, a picture, a youtube video, links to other website, Maths equations (latex), a downloadable document link, others comments, interactive animations, and etc? + +Now please go to check the [How-to-post-posts](https://deep0thinking.github.io/2nd-Minima/2022/11/28/How-to-post-posts.html) post :), it is under the "**/_posts/**" folder. + +

2.3 giscus.app

+ +I think you've noticed the **fake comments section** on the bottom part of the post of "**How to post posts**", this is actually the area that you would need to establish your **real comments section**. + +In fact, the real comments section is supported by [giscus.app](https://giscus.app). Please check that out, the [giscus.app](https://giscus.app) page have already written detailed information and instructions to enable the comments section (giscus). + +When you finish reading the [giscus.app](https://giscus.app) instructions and have copied the embed code for the comments section (giscus), you can now paste it and replace the **fake comments section** code (which is located at bottom of the file: `

fake comments section

` ) in your "**/_layouts/post.html**" file. And you also need to apply the same process to the your "**/about.md**" and "**/archive.md**" file, yeah I also put the **fake comments section** there respectively. + +Maybe you would wonder why can't I just put the giscus embed code in the "**/_layouts/page.html**" (since the [**about**](https://deep0thinking.github.io/2nd-Minima/about.html) and [**archive**](https://deep0thinking.github.io/2nd-Minima/archive.html) pages all have `layout: page` in the Predeclaration part) ? + +In fact, it is valid for you to do that, but I don't recommend this action because it would also cause the and [**all-tags**](https://deep0thinking.github.io/2nd-Minima/all-tags.html) and every single **tag** page to have the comments section at the bottom and that is not necessary and would somehow decrease the webpage aesthetics from my perspective. + +After completing the procedure above, you can now see the comments sections (giscus) appear at the bottom part in the corresponding pages. + +

2.4 "/about.md"

+ +The instruction of modifying [**about**](https://deep0thinking.github.io/2nd-Minima/about.html) page are provided inside the "**/about.md**" file, so you can now visit your "**/about.md**" file and do some personalized modification. + +

2.5 "/archive.md"

+ +The instruction of modifying [**archive**](https://deep0thinking.github.io/2nd-Minima/archive.html) page are provided inside the "**/archive.md**" file, so you can now visit your "**/archive.md**" file and do some personalized modification. + +

2.6 favicon

+ +Favicon is the icon that represents your webpage (did you notice the black icon located next to your webpage title? Yeah, that is the favicon I set as default for this repository, and I'll tell you how to change it) and you can design your own favicon for your webpage, here I recommend [favicon.io](https://favicon.io), it is a website that allows you to design and generate your favicon freely and conveniently. + +After you've done creating your favicon, all you need to do is to place the generated "**favicon.ico**" file under the "**/favicon/**" folder to **replace** the old one (the old "**favicon.ico**" file) I've put there before ***(Attention: The file name of the favicon file you put under the "/favicon/" folder must be "favicon.ico" exactly, or it won't work)***, then your webpage would be able to show the favicon you designed. diff --git a/_site/about.html b/_site/about.html new file mode 100644 index 0000000..c9be1e0 --- /dev/null +++ b/_site/about.html @@ -0,0 +1,135 @@ + + + + + + + + + + + + + + + + + + + + + + + +
+
+
+
+
+ +
+ +
+

About

+
+ +
+
+
+

+ Try to write something here! +

+

+ For example: Welcome! :) +

+
+
+ Avatar +
+
+ +

Instruction part 1 begins

+ +

To find your github avatar HTML source code, you need to first view the source code of your Github profile page (please go google “how to view the source code of a webpage”, and it is very easy to apply), then you need to use the built-in pointer tool of your browser to locate and click on your Github avatar area, then you will be lead to a HTML source code section in a form like :

+ +
<img style="height:auto;" alt="" width="260" height="260" class="avatar avatar-user width-full border color-bg-default" src="https://avatars.githubusercontent.com/u/103571424?v=4">
+
+ +

Next, please just copy the value of the src part and pasted it in the corresponding area above in your about page, after completing that procedure, your avatar on your personal website about page will sync with the one on your Github profile page. And finally you can delete this instruction part (from <h3 style="color: red">Instruction part 1 begins</h3> to <h3 style="color: red">Instruction part 1 ends</h3>) safely.

+ +

Instruction part 1 ends

+ +

Try to write something here:

+

Try to write something here

+ +

Maybe your hobbies:

+

…

+ +

Maybe your Contact Information:

+ +

For example:

+ +

Email: Please-paste-your-email-address-here

+ +

Your DiscordTag or Facebook…..

+ +

Maybe your Information On Other Platforms:

+
+ + + + +
+ +

Instruction part 2 begins

+ +

If you want to add more platforms information, you can go to remixicon.com to find icons you want and copy the corresponding embed code, for exam: <i class="ri-github-line"></i> . Then paste it and edit in the form of the above, and it’ll work properly.

+ +

Finally, after getting familiar with these procedure, you can delete this instruction part (from <h3 style="color: red">Instruction part 2 begins</h3> to <h3 style="color: red">Instruction part 2 ends</h3>) safely.

+ +

Instruction part 2 ends

+ +
+ +

fake comments section

+ +
+ +
+
+
+ + + + + + \ No newline at end of file diff --git a/_site/all-tags.html b/_site/all-tags.html new file mode 100644 index 0000000..c5bcd6c --- /dev/null +++ b/_site/all-tags.html @@ -0,0 +1,109 @@ + + + + + + + + + + + + + + + + + + + + + + + +
+
+
+
+
+ +
+ +
+

Tags

+
+ +
+
+ +
+ +
+ +
+
+
+ + + + + + \ No newline at end of file diff --git a/_site/archive.html b/_site/archive.html new file mode 100644 index 0000000..50772a8 --- /dev/null +++ b/_site/archive.html @@ -0,0 +1,276 @@ + + + + + + + + + + + + + + + + + + + + + + + +
+
+
+
+
+ +
+ +
+

Archive

+
+ +
+

Papers published by me (Full-Display Style) :

+ + +
+ + +
+ + +
Title
+ +
Title
+ +
+ + +
PDF
 + +
+ +
+ +
+ +
Title
+ +
Title
+ +
+ +
Link 1
 + +
Link 2
 + +
+ +
+ +
+ +
Title
+ +
Title
+ +
+ +
Link 1
 + +
Link 2
 + +
Link 3
 + +
+ +
+ +
+ +
Title
+ +
Title
+ +
+ +
Link 1
 + +
Link 2
 + +
Link 3
 + +
Link 4
 + +
+ +
+ +
+ +

Books published by me (Scrolling-Display Style) (you can scroll this part horizontally):

+ + +
+ +
+ +
Title
+ +
Title
+ +
+ +
PDF
 + +
+ +
+ +
+ +
Title
+ +
Title
+ +
+ +
Link 1
 + +
Link 2
 + +
+ +
+ +
+ +
Title
+ +
Title
+ +
+ +
Link 1
 + +
Link 2
 + +
Link 3
 + +
+ +
+ +
+ +
Title
+ +
Title
+ +
+ +
Link 1
 + +
Link 2
 + +
Link 3
 + +
Link 4
 + +
+ +
+ +
+ +
+ +

Instruction part begins

+ +

If you want to decorate it in your way, you may have to learn Jekyll and some front-end programming languages.

+ +

If you don’t like this page or think this page is somehow needless, you can easily remove it through deleting the “/new-page.md” file and the - new-page.md line under the “/_config.yml” file.

+ +

The following contents show 2 display block style:

+ +
    +
  1. +

    Full-Display Style

    +
    2. +
  2. +

    Scrolling-Display Style

    +
    3. +
+ +

And both of them support adding items ( <div class="Single-Container">...</div> , which is the least unit of a display item within a display block) with no max quantity limit. So you can edit them by deleting or adding this code block inside the Full-Display Style block <div class="Group-Container-Full-Display">...</div> or the Scrolling-Display Style block <div class="Group-Container-Scrolling-Display">...</div> :

+ +
<div class="Single-Container">
+
+	<div class="ImgBorder"><img class="ImgOpacity" src="https://thumbs.gfycat.com/MellowEvergreenAfricanelephant-size_restricted.gif" alt="Title"></div>
+
+	<div class="Text">Title</div>
+
+	<div class="Selection">
+
+		<!-- The least unit of an option, and you can add more options as you want up to 4 -->
+		<a class="Option-width" href="https://Please-paste-the-link-here" target="_blank"><div class="Option">Link 1</div></a>
+
+	</div>
+
+</div>
+
+ +

And please note that the src value in every display item are src="https://thumbs.gfycat.com/MellowEvergreenAfricanelephant-size_restricted.gif" , and that link address determines the cover of the corresponding item, so you use the same method of Instruction part 1 stated in the about page to change the cover.

+ +

Finally, after getting familiar with these procedure, you can delete this instruction part (from <h3 style="color: red">Instruction part begins</h3> to <h3 style="color: red">Instruction part ends</h3>) safely.

+ +

Instruction part ends

+ +
+ +

fake comments section

+ +
+ +
+
+
+ + + + + + \ No newline at end of file diff --git a/_site/assets/css/style.css b/_site/assets/css/style.css new file mode 100644 index 0000000..b479439 --- /dev/null +++ b/_site/assets/css/style.css @@ -0,0 +1,998 @@ +@import "https://cdn.jsdelivr.net/npm/remixicon@2.5.0/fonts/remixicon.css"; +@import "https://cdn.jsdelivr.net/npm/remixicon@2.5.0/fonts/remixicon.css"; +.highlight .c { + color: #998; + font-style: italic; +} +.highlight .err { + color: #a61717; + background-color: #e3d2d2; +} +.highlight .k { + font-weight: bold; +} +.highlight .o { + font-weight: bold; +} +.highlight .cm { + color: #998; + font-style: italic; +} +.highlight .cp { + color: #999; + font-weight: bold; +} +.highlight .c1 { + color: #998; + font-style: italic; +} +.highlight .cs { + color: #999; + font-weight: bold; + font-style: italic; +} +.highlight .gd { + color: #000; + background-color: #fdd; +} +.highlight .gd .x { + color: #000; + background-color: #faa; +} +.highlight .ge { + font-style: italic; +} +.highlight .gr { + color: #a00; +} +.highlight .gh { + color: #999; +} +.highlight .gi { + color: #000; + background-color: #dfd; +} +.highlight .gi .x { + color: #000; + background-color: #afa; +} +.highlight .go { + color: #888; +} +.highlight .gp { + color: #555; +} +.highlight .gs { + font-weight: bold; +} +.highlight .gu { + color: #aaa; +} +.highlight .gt { + color: #a00; +} +.highlight .kc { + font-weight: bold; +} +.highlight .kd { + font-weight: bold; +} +.highlight .kp { + font-weight: bold; +} +.highlight .kr { + font-weight: bold; +} +.highlight .kt { + color: #458; + font-weight: bold; +} +.highlight .m { + color: #099; +} +.highlight .s { + color: #d14; +} +.highlight .na { + color: #008080; +} +.highlight .nb { + color: #0086B3; +} +.highlight .nc { + color: #458; + font-weight: bold; +} +.highlight .no { + color: #008080; +} +.highlight .ni { + color: #800080; +} +.highlight .ne { + color: #900; + font-weight: bold; +} +.highlight .nf { + color: #900; + font-weight: bold; +} +.highlight .nn { + color: #555; +} +.highlight .nt { + color: #000080; +} +.highlight .nv { + color: #008080; +} +.highlight .ow { + font-weight: bold; +} +.highlight .w { + color: #bbb; +} +.highlight .mf { + color: #099; +} +.highlight .mh { + color: #099; +} +.highlight .mi { + color: #099; +} +.highlight .mo { + color: #099; +} +.highlight .sb { + color: #d14; +} +.highlight .sc { + color: #d14; +} +.highlight .sd { + color: #d14; +} +.highlight .s2 { + color: #d14; +} +.highlight .se { + color: #d14; +} +.highlight .sh { + color: #d14; +} +.highlight .si { + color: #d14; +} +.highlight .sx { + color: #d14; +} +.highlight .sr { + color: #009926; +} +.highlight .s1 { + color: #d14; +} +.highlight .ss { + color: #990073; +} +.highlight .bp { + color: #999; +} +.highlight .vc { + color: #008080; +} +.highlight .vg { + color: #008080; +} +.highlight .vi { + color: #008080; +} +.highlight .il { + color: #099; +} + +html { + font-size: 16px; +} + +/** + * Reset some basic elements + */ +body, h1, h2, h3, h4, h5, h6, +p, blockquote, pre, hr, +dl, dd, ol, ul, figure { + margin: 0; + padding: 0; +} + +/** + * Basic styling + */ +body { + font: 400 16px/1.5 -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", "Segoe UI Emoji", "Segoe UI Symbol", "Apple Color Emoji", Roboto, Helvetica, Arial, sans-serif; + color: #111111; + background-color: #fdfdfd; + -webkit-text-size-adjust: 100%; + -webkit-font-feature-settings: "kern" 1; + -moz-font-feature-settings: "kern" 1; + -o-font-feature-settings: "kern" 1; + font-feature-settings: "kern" 1; + font-kerning: normal; + display: flex; + min-height: 100vh; + flex-direction: column; + overflow-wrap: break-word; +} + +/** + * Set `margin-bottom` to maintain vertical rhythm + */ +h1, h2, h3, h4, h5, h6, +p, blockquote, pre, +ul, ol, dl, figure, +.highlight { + margin-bottom: 10px; +} + +hr { + margin-top: 20px; + margin-bottom: 20px; +} + +/** + * `main` element + */ +main { + display: block; /* Default value of `display` of `main` element is 'inline' in IE 11. */ +} + +/** + * Images + */ +img { + max-width: 100%; + vertical-align: middle; +} + +/** + * Figures + */ +figure > img { + display: block; +} + +figcaption { + font-size: 14px; +} + +/** + * Lists + */ +ul, ol { + margin-left: 20px; +} + +li > ul, +li > ol { + margin-bottom: 0; +} + +/** + * Headings + */ +h1, h2, h3, h4, h5, h6 { + font-weight: 400; +} + +/** + * Links + */ +a { + color: #2a7ae2; + text-decoration: none; +} +a:visited { + color: #1756a9; +} +a:hover { + color: #111111; + text-decoration: underline; +} +.social-media-list a:hover, .pagination a:hover { + text-decoration: none; +} +.social-media-list a:hover .username, .pagination a:hover .username { + text-decoration: underline; +} + +/** + * Blockquotes + */ +blockquote { + color: #828282; + border-left: 4px solid #e8e8e8; + padding-left: 10px; + font-size: 1.125rem; + font-style: italic; +} +blockquote > :last-child { + margin-bottom: 0; +} +blockquote i, blockquote em { + font-style: normal; +} + +/** + * Code formatting + */ +pre, +code { + font-family: "Menlo", "Inconsolata", "Consolas", "Roboto Mono", "Ubuntu Mono", "Liberation Mono", "Courier New", monospace; + font-size: 0.9375em; + border: 1px solid #e8e8e8; + border-radius: 3px; + background-color: #eeeeff; +} + +code { + padding: 1px 5px; +} + +pre { + padding: 8px 12px; + overflow-x: auto; +} +pre > code { + border: 0; + padding-right: 0; + padding-left: 0; +} + +.highlight { + border-radius: 3px; + background: #eeeeff; +} +.highlighter-rouge .highlight { + background: #eeeeff; +} + +/** + * Wrapper + */ +.wrapper { + max-width: calc(900px - 150px - (20px)); + margin-right: auto; + margin-left: auto; + padding-right: 10px; + padding-left: 10px; +} +@media screen and (min-width: 1366px) { + .wrapper { + max-width: calc(900px - 20px * 2); + padding-right: 20px; + padding-left: 20px; + } +} + +/** + * Clearfix + */ +.wrapper:after { + content: ""; + display: table; + clear: both; +} + +/** + * Icons + */ +.orange { + color: #f66a0a; +} + +.grey { + color: #828282; +} + +.svg-icon { + width: 1.25em; + height: 1.25em; + display: inline-block; + fill: currentColor; + vertical-align: text-bottom; +} + +/** + * Tables + */ +table { + margin-bottom: 20px; + width: 100%; + text-align: left; + color: #3f3f3f; + border-collapse: collapse; + border: 1px solid #e8e8e8; +} +table tr:nth-child(even) { + background-color: #f7f7f7; +} +table th, table td { + padding: 6.6666666667px 10px; +} +table th { + background-color: #f0f0f0; + border: 1px solid #e0e0e0; +} +table td { + border: 1px solid #e8e8e8; +} +@media screen and (max-width: 1366px) { + table { + display: block; + overflow-x: auto; + -webkit-overflow-scrolling: touch; + -ms-overflow-style: -ms-autohiding-scrollbar; + } +} + +/** + * Site header + */ +.site-header { + border-top: 5px solid #424242; + border-bottom: 1px solid #e8e8e8; + min-height: 37.3px; + line-height: 54px; + position: relative; +} + +.site-title { + font-size: 1.625rem; + font-weight: 300; + letter-spacing: -1px; + margin-bottom: 0; + float: left; +} +@media screen and (max-width: 1240px) { + .site-title { + padding-right: 45px; + } +} +.site-title, .site-title:visited { + color: #424242; +} + +.site-nav { + position: absolute; + top: 9px; + right: 10px; + background-color: #fdfdfd; + border: 1px solid #e8e8e8; + border-radius: 5px; + text-align: right; +} +.site-nav .nav-trigger { + display: none; +} +.site-nav .menu-icon { + float: right; + width: 36px; + height: 26px; + line-height: 0; + padding-top: 10px; + text-align: center; +} +.site-nav .menu-icon > svg path { + fill: #424242; +} +.site-nav label[for=nav-trigger] { + display: block; + float: right; + width: 36px; + height: 36px; + z-index: 2; + cursor: pointer; +} +.site-nav input ~ .trigger { + clear: both; + display: none; +} +.site-nav input:checked ~ .trigger { + display: block; + padding-bottom: 5px; +} +.site-nav .page-link { + color: #111111; + line-height: 1.5; + display: block; + padding: 5px 10px; + margin-left: 20px; +} +.site-nav .page-link:not(:last-child) { + margin-right: 0; +} +@media screen and (min-width: 1240px) { + .site-nav { + position: static; + float: right; + border: none; + background-color: inherit; + } + .site-nav label[for=nav-trigger] { + display: none; + } + .site-nav .menu-icon { + display: none; + } + .site-nav input ~ .trigger { + display: block; + } + .site-nav .page-link { + display: inline; + padding: 0; + margin-left: auto; + } + .site-nav .page-link:not(:last-child) { + margin-right: 20px; + } +} + +/** + * Site footer + */ +.site-footer { + border-top: 1px solid #e8e8e8; + padding: 20px 0; +} + +.footer-heading { + font-size: 1.125rem; + margin-bottom: 10px; +} + +.feed-subscribe .svg-icon { + padding: 5px 5px 2px 0; +} + +.contact-list, +.social-media-list, +.pagination { + list-style: none; + margin-left: 0; +} + +.footer-col-wrapper, +.social-links { + font-size: 0.9375rem; + color: #828282; +} + +.footer-col { + margin-bottom: 10px; +} + +.footer-col-1, +.footer-col-2 { + width: calc(50% - 20px / 2); +} + +.footer-col-3 { + width: calc(100% - 20px / 2); +} + +@media screen and (min-width: 1366px) { + .footer-col-1 { + width: calc(35% - 20px / 2); + } + .footer-col-2 { + width: calc(20% - 20px / 2); + } + .footer-col-3 { + width: calc(45% - 20px / 2); + } +} +@media screen and (min-width: 1240px) { + .footer-col-wrapper { + display: flex; + } + .footer-col { + width: calc(100% - 20px / 2); + padding: 0 10px; + } + .footer-col:first-child { + padding-right: 10px; + padding-left: 0; + } + .footer-col:last-child { + padding-right: 0; + padding-left: 10px; + } +} +/** + * Page content + */ +.page-content { + padding: 20px 0; + flex: 1 0 auto; +} + +.page-heading { + font-size: 2rem; +} + +.post-list-heading { + font-size: 1.75rem; +} + +.post-list { + margin-left: 0; + list-style: none; +} +.post-list > li { + margin-bottom: 20px; +} + +.post-meta { + font-size: 14px; + color: #828282; +} + +.post-link { + display: block; + font-size: 1.5rem; +} + +/** + * Posts + */ +.post-header { + margin-bottom: 20px; +} + +.post-title, +.post-content h1 { + font-size: 2.625rem; + letter-spacing: -1px; + line-height: 1.15; +} +@media screen and (min-width: 1366px) { + .post-title, + .post-content h1 { + font-size: 2.625rem; + } +} + +.post-content { + margin-bottom: 20px; +} +.post-content h1, .post-content h2, .post-content h3, .post-content h4, .post-content h5, .post-content h6 { + margin-top: 20px; +} +.post-content h2 { + font-size: 1.75rem; +} +@media screen and (min-width: 1366px) { + .post-content h2 { + font-size: 2rem; + } +} +.post-content h3 { + font-size: 1.375rem; +} +@media screen and (min-width: 1366px) { + .post-content h3 { + font-size: 1.625rem; + } +} +.post-content h4 { + font-size: 1.25rem; +} +.post-content h5 { + font-size: 1.125rem; +} +.post-content h6 { + font-size: 1.0625rem; +} + +.social-media-list, .pagination { + display: table; + margin: 0 auto; +} +.social-media-list li, .pagination li { + float: left; + margin: 5px 10px 5px 0; +} +.social-media-list li:last-of-type, .pagination li:last-of-type { + margin-right: 0; +} +.social-media-list li a, .pagination li a { + display: block; + padding: 10px 12px; + border: 1px solid #e8e8e8; +} +.social-media-list li a:hover, .pagination li a:hover { + border-color: #dbdbdb; +} + +/** + * Pagination navbar + */ +.pagination { + margin-bottom: 20px; +} +.pagination li a, .pagination li div { + min-width: 41px; + text-align: center; + box-sizing: border-box; +} +.pagination li div { + display: block; + padding: 5px; + border: 1px solid transparent; +} +.pagination li div.pager-edge { + color: #e8e8e8; + border: 1px dashed; +} + +/** + * Grid helpers + */ +@media screen and (min-width: 1366px) { + .one-half { + width: calc(50% - 20px / 2); + } +} +/** + * _layout.scss + */ +.site-header { + position: sticky; + top: 0px; + background-color: rgb(255, 255, 255); + z-index: 1; +} + +/** + * about.md + */ +.Icon-link { + transition: 0.3s; + text-decoration: none; + font-size: 7.5vmin; + color: black; + margin-right: 2vmin; + display: inline-block; +} + +.Icon-link:visited { + text-decoration: none; + color: black; +} + +.Icon-link:hover { + color: DodgerBlue; + text-decoration: underline; + transform: scale(1.2); + transition: 0.3s; +} + +.Info { + display: flex; + align-items: center; +} + +.Text-block { + flex-grow: 1; + text-align: center; +} + +.Img-block { + margin: 2.5vmin; +} + +.Avatar { + border-radius: 2vmin; + width: 30vmin; + height: 30vmin; +} + +/** + * archive.md + */ +.Option-width { + width: 100%; + text-decoration: none; +} + +.Group-Container-Full-Display { + display: flex; + justify-content: space-around; + flex-direction: row; + flex-wrap: wrap; +} + +.Group-Container-Scrolling-Display { + display: flex; + flex-direction: row; + overflow: auto; +} + +.Single-Container { + position: relative; + width: 170px; + min-width: 170px; + margin: 11px; + height: 100%; + text-align: center; + cursor: pointer; + display: flex; + align-items: center; +} + +.ImgBorder { + transition: 0.3s; + display: inline-block; + width: 100%; + height: 100%; + border: 4px solid; + border-color: black; +} + +.Single-Container:hover .ImgBorder { + border-color: DodgerBlue; + transform: scale(1.1); + transition: 0.3s; +} + +.ImgOpacity { + opacity: 1; + width: 100%; + transition: 0.3s; + vertical-align: top; +} + +.Single-Container:hover .ImgOpacity { + opacity: 0.15; + transition: 0.3s; +} + +.Text { + color: black; + font-size: 20px; + text-decoration: none; + opacity: 0; + transition: 0.3s; + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + width: 75%; + justify-content: center; +} + +.Single-Container:hover .Text { + opacity: 1; + color: black; + text-decoration: none; +} + +.Text:visited { + text-decoration: none; + color: black; +} + +.Selection { + color: black; + font-size: 20px; + text-decoration: none; + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + width: 75%; + height: 100%; + display: none; + opacity: 0; + transition: 0.3s; + flex-direction: column; + justify-content: space-around; + align-items: center; + flex-wrap: wrap; +} + +.Single-Container:hover .Selection { + opacity: 1; + transition: 0.3s; +} + +.Option { + position: relative; + border: black solid 3px; + padding: 3%; + transition: 0.3s; + color: black; + text-decoration: none; + width: auto; +} + +.Option:hover { + border-color: DodgerBlue; + transform: scale(1.1); + transition: 0.3s; + text-decoration: underline; + color: black; +} + +/** + * default.html + */ +.section-nav { + display: none; +} +@media screen and (min-width: 1240px) { + .section-nav { + display: block; + text-align: left; + background-color: #fff; + margin: 5px 0; + padding: 10px 30px; + width: 145px; + max-height: calc(100vh - 180px); + overflow: auto; + white-space: nowrap; + border: 1px solid #e8e8e8; + border-radius: 3px; + position: fixed; + left: 25px; + top: 90px; + } +} +@media screen and (min-width: 1456px) { + .section-nav { + display: block; + text-align: left; + background-color: #fff; + margin: 5px 0; + padding: 10px 30px; + width: 205px; + max-height: calc(100vh - 180px); + overflow: auto; + white-space: nowrap; + border: 1px solid #e8e8e8; + border-radius: 3px; + position: fixed; + left: calc((100vw - 1455px) / 2); + top: 90px; + } +} + +.hide-and-display { + visibility: hidden; +} + +.hide-and-display-trigger:hover .hide-and-display { + visibility: visible; +} + +/** + * home.html + */ +.post-info::after { + content: ""; + display: table; + clear: both; +} + +.post-thumbnail img { + margin-left: 5px; + margin-right: 15px; + float: left; + width: 200px; + height: auto; + border-radius: 10px; +} + +/*# sourceMappingURL=style.css.map */ \ No newline at end of file diff --git a/_site/assets/css/style.css.map b/_site/assets/css/style.css.map new file mode 100644 index 0000000..5f1a0aa --- /dev/null +++ b/_site/assets/css/style.css.map @@ -0,0 +1 @@ +{"version":3,"sourceRoot":"","sources":["../../_sass/minima/custom-styles.scss","../../_sass/minima/skins/auto.scss","../../_sass/minima/_base.scss","../../_sass/minima/initialize.scss","../../_sass/minima/_layout.scss"],"names":[],"mappings":"AAoBE;AA0DA;ACpCE;EAAS;EAAa;;AACtB;EAAS;EAAgB;;AACzB;EAAS;;AACT;EAAS;;AACT;EAAS;EAAa;;AACtB;EAAS;EAAa;;AACtB;EAAS;EAAa;;AACtB;EAAS;EAAa;EAAmB;;AACzC;EAAS;EAAa;;AACtB;EAAS;EAAa;;AACtB;EAAS;;AACT;EAAS;;AACT;EAAS;;AACT;EAAS;EAAa;;AACtB;EAAS;EAAa;;AACtB;EAAS;;AACT;EAAS;;AACT;EAAS;;AACT;EAAS;;AACT;EAAS;;AACT;EAAS;;AACT;EAAS;;AACT;EAAS;;AACT;EAAS;;AACT;EAAS;EAAa;;AACtB;EAAS;;AACT;EAAS;;AACT;EAAS;;AACT;EAAS;;AACT;EAAS;EAAa;;AACtB;EAAS;;AACT;EAAS;;AACT;EAAS;EAAa;;AACtB;EAAS;EAAa;;AACtB;EAAS;;AACT;EAAS;;AACT;EAAS;;AACT;EAAS;;AACT;EAAS;;AACT;EAAS;;AACT;EAAS;;AACT;EAAS;;AACT;EAAS;;AACT;EAAS;;AACT;EAAS;;AACT;EAAS;;AACT;EAAS;;AACT;EAAS;;AACT;EAAS;;AACT;EAAS;;AACT;EAAS;;AACT;EAAS;;AACT;EAAS;;AACT;EAAS;;AACT;EAAS;;AACT;EAAS;;AACT;EAAS;;AACT;EAAS;;AACT;EAAS;;;ACpGb;EACE,WCKiB;;;ADFnB;AAAA;AAAA;AAGA;AAAA;AAAA;EAGE;EACA;;;AAMF;AAAA;AAAA;AAGA;EACE;EACA,ODJyB;ECKzB,kBDJyB;ECKzB;EACA;EACG;EACE;EACG;EACR;EACA;EACA;EACA;EACA;;;AAKF;AAAA;AAAA;AAGA;AAAA;AAAA;AAAA;EAIE;;;AAGF;EACE,YCtCiB;EDuCjB,eCvCiB;;;AD0CnB;AAAA;AAAA;AAGA;EACE;;;AAKF;AAAA;AAAA;AAGA;EACE;EACA;;;AAKF;AAAA;AAAA;AAGA;EACE;;;AAGF;EACE,WCxEiB;;;AD6EnB;AAAA;AAAA;AAGA;EACE,aC9EiB;;;ADkFjB;AAAA;EAEE;;;AAMJ;AAAA;AAAA;AAGA;EACE,aClGiB;;;ADuGnB;AAAA;AAAA;AAGA;EACE,OD5FyB;EC6FzB;;AAEA;EACE,OD/FuB;;ACkGzB;EACE,ODxGuB;ECyGvB;;AAGF;EACE;;AAEA;EACE;;;AAMN;AAAA;AAAA;AAGA;EACE,ODhIyB;ECiIzB;EACA;ECtGA;EDwGA;;AAEA;EACE;;AAGF;EACE;;;AAMJ;AAAA;AAAA;AAGA;AAAA;EAEE,aC7JiB;ED8JjB;EACA;EACA;EACA,kBDlJyB;;;ACqJ3B;EACE;;;AAGF;EACE;EACA;;AAEA;EACE;EACA;EACA;;;AAIJ;EACE;EACA,YDtKyB;;ACyKzB;EACE,YD1KuB;;;ACgL3B;AAAA;AAAA;AAGA;EACE;EACA;EACA;EACA;EACA;;AAGA;EARF;IASI;IACA,eCtMe;IDuMf,cCvMe;;;;AD6MnB;AAAA;AAAA;AAGA;EACE;EACA;EACA;;;AAKF;AAAA;AAAA;AAIA;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAIF;AAAA;AAAA;AAGA;EACE,eCjPiB;EDkPjB;EACA,YCjPiB;EDkPjB,ODjOyB;ECkOzB;EACA;;AAEE;EACE,kBDrOqB;;ACwOzB;EACE;;AAEF;EACE,kBD3OuB;EC4OvB;;AAEF;EACE;;AC7OF;EDyNF;IAwBI;IACA;IACA;IACQ;;;;AEtRZ;AAAA;AAAA;AAGA;EACE;EACA;EACA;EACA;EAGA;;;AAGF;ED2BE;ECzBA;EACA;EACA;EACA;;ADgBA;ECrBF;IAQI;;;AAGF;EAEE,OHZuB;;;AGgB3B;EACE;EACA;EACA;EACA,kBHfyB;EGgBzB;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE,MHtCqB;;AG0CzB;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAGF;EACE,OH1DuB;EG2DvB,aDpEe;ECqEf;EACA;EAMA;;AAHA;EACE;;AAKJ;EA1DF;IA2DI;IACA;IACA;IACA;;EAEA;IACE;;EAGF;IACE;;EAGF;IACE;;EAGF;IACE;IACA;IAKA;;EAHA;IACE;;;;AASR;AAAA;AAAA;AAGA;EACE;EACA;;;AAGF;EDxFE;EC0FA;;;AAGF;EACE;;;AAGF;AAAA;AAAA;EAEE;EACA;;;AAGF;AAAA;EDvGE;EC0GA,OHtIyB;;;AGyI3B;EACE;;;AAGF;AAAA;EAEE;;;AAGF;EACE;;;AAGF;EACE;IACE;;EAGF;IACE;;EAGF;IACE;;;AAIJ;EACE;IACE;;EAGF;IACE;IACA;;EAEA;IACE;IACA;;EAGF;IACE;IACA;;;AAON;AAAA;AAAA;AAGA;EACE;EACA;;;AAGF;EDvKE;;;AC2KF;ED3KE;;;AC+KF;EACE;EACA;;AAEA;EACE,eDjNe;;;ACqNnB;EACE,WDzNiB;EC0NjB,OHtNyB;;;AGyN3B;EACE;ED9LA;;;ACoMF;AAAA;AAAA;AAGA;EACE,eDrOiB;;;ACwOnB;AAAA;ED3ME;EC8MA;EACA;;AAEA;EANF;AAAA;ID3ME;;;;ACsNF;EACE,eDpPiB;;ACsPjB;EAAyB,YDtPR;;ACwPjB;ED3NA;;AC8NE;EAHF;ID3NA;;;ACmOA;EDnOA;;ACsOE;EAHF;IDnOA;;;AC2OA;ED3OA;;AC+OA;ED/OA;;ACkPA;EDlPA;;;ACwPF;EACE;EACA;;AACA;EACE;EACA;;AACA;EAAiB;;AACjB;EACE;EACA;EACA;;AACA;EAAU,cHhRW;;;AGuR3B;AAAA;AAAA;AAGA;EACE,eD3SiB;;AC8Sf;EACE;EACA;EACA;;AAEF;EACE;EACA;EACA;;AAEA;EACE,OHvTmB;EGwTnB;;;AAQR;AAAA;AAAA;AAGA;EACE;IACE;;;AJjVJ;AAAA;AAAA;AAIA;EAEE;EACA;EACA;EACA;;;AAKF;AAAA;AAAA;AAQA;EAEE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EAEE;EACA;;;AAGF;EAEE;EACA;EACA;EACA;;;AAGF;EAEE;EACA;;;AAGF;EAEE;EACA;;;AAGF;EAEE;;;AAGF;EAEE;EACA;EACA;;;AAKF;AAAA;AAAA;AAQA;EAEE;EACA;;;AAGF;EAEE;EACA;EACA;EACA;;;AAGF;EAEE;EACA;EACA;;;AAGF;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EAEE;EACA;EACA;EACA;EACA;EACA;;;AAIF;EAEE;EACA;EACA;;;AAGF;EAEE;EACA;EACA;EACA;;;AAGF;EAEE;EACA;;;AAGF;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EAEE;EACA;EACA;;;AAGF;EAEE;EACA;;;AAGF;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EAEE;EACA;;;AAGF;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EAEE;EACA;EACA;EACA;EACA;;;AAGF;AAAA;AAAA;AAIA;EAEE;;AAEA;EAJF;IAMI;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;;;AAGF;EAtBF;IAwBI;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;;;;AAKJ;EACE;;;AAGF;EACE;;;AAGF;AAAA;AAAA;AAIA;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA","sourcesContent":["\n/**\n * _layout.scss\n */\n\n.site-header\n{\n position: sticky;\n top: 0px;\n background-color: rgba(255,255,255,1);\n z-index: 1;\n}\n\n\n\n/**\n * about.md\n */\n\n@import\n \"https://cdn.jsdelivr.net/npm/remixicon@2.5.0/fonts/remixicon.css\"\n;\n\n.Icon-link\n{\n transition: 0.3s;\n text-decoration: none;\n font-size: 7.5vmin;\n color: black;\n margin-right: 2vmin;\n display: inline-block;\n}\n\n.Icon-link:visited\n{\n text-decoration: none;\n color: black;\n}\n\n.Icon-link:hover\n{\n color: DodgerBlue;\n text-decoration: underline;\n transform: scale(1.2);\n transition: 0.3s;\n}\n\n.Info\n{\n display: flex;\n align-items: center;\n}\n\n.Text-block\n{\n flex-grow: 1;\n text-align: center;\n}\n\n.Img-block\n{\n margin: 2.5vmin;\n}\n\n.Avatar\n{\n border-radius: 2vmin;\n width: 30vmin;\n height: 30vmin;\n}\n\n\n\n/**\n * archive.md\n */\n\n@import\n \"https://cdn.jsdelivr.net/npm/remixicon@2.5.0/fonts/remixicon.css\"\n;\n\n.Option-width\n{\n width: 100%;\n text-decoration: none;\n}\n\n.Group-Container-Full-Display\n{\n display: flex;\n justify-content: space-around;\n flex-direction: row;\n flex-wrap: wrap;\n}\n\n.Group-Container-Scrolling-Display\n{\n display: flex;\n flex-direction: row;\n overflow: auto;\n}\n\n.Single-Container\n{\n position: relative;\n width: 170px;\n min-width: 170px;\n margin: 11px;\n height: 100%;\n text-align: center;\n cursor: pointer;\n display: flex;\n align-items: center;\n}\n\n.ImgBorder\n{\n transition: 0.3s;\n display: inline-block;\n width: 100%;\n height: 100%;\n border: 4px solid;\n border-color: black;\n}\n\n\n.Single-Container:hover .ImgBorder\n{\n border-color: DodgerBlue;\n transform: scale(1.1);\n transition: 0.3s;\n}\n\n.ImgOpacity\n{\n opacity: 1;\n width: 100%;\n transition: 0.3s;\n vertical-align: top;\n}\n\n.Single-Container:hover .ImgOpacity\n{\n opacity: 0.15;\n transition: 0.3s;\n}\n\n.Text\n{\n color: black;\n font-size: 20px;\n text-decoration: none;\n opacity: 0;\n transition: 0.3s;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n width: 75%;\n justify-content: center;\n}\n\n.Single-Container:hover .Text\n{\n opacity: 1;\n color: black;\n text-decoration: none;\n}\n\n.Text:visited\n{\n text-decoration: none;\n color: black;\n}\n\n.Selection\n{\n color: black;\n font-size: 20px;\n text-decoration: none;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n width: 75%;\n height: 100%;\n display: none;\n opacity: 0;\n transition: 0.3s;\n flex-direction: column;\n justify-content: space-around;\n align-items: center;\n flex-wrap: wrap;\n}\n\n.Single-Container:hover .Selection\n{\n opacity: 1;\n transition: 0.3s;\n}\n\n.Option\n{\n position: relative;\n border: black solid 3px;\n padding: 3%;\n transition: 0.3s;\n color: black;\n text-decoration: none;\n width: auto;\n}\n\n.Option:hover\n{\n border-color: DodgerBlue;\n transform: scale(1.1);\n transition: 0.3s;\n text-decoration: underline;\n color: black;\n}\n\n/**\n * default.html\n */\n\n.section-nav\n{\n display: none;\n\n @media screen and (min-width: $on-medium)\n {\n display: block;\n text-align: left;\n background-color: #fff;\n margin: 5px 0;\n padding: 10px 30px;\n width: 145px;\n max-height: calc(100vh - 180px);\n overflow: auto;\n white-space: nowrap;\n border: 1px solid #e8e8e8;\n border-radius: 3px;\n position: fixed;\n left: 25px; \n top: 90px;\n }\n\n @media screen and (min-width: calc($on-large + 90px))\n {\n display: block;\n text-align: left;\n background-color: #fff;\n margin: 5px 0;\n padding: 10px 30px;\n width: 205px;\n max-height: calc(100vh - 180px);\n overflow: auto;\n white-space: nowrap;\n border: 1px solid #e8e8e8;\n border-radius: 3px;\n position: fixed;\n left: calc( (100vw - 1455px) /2); \n top: 90px;\n }\n \n}\n\n.hide-and-display {\n visibility: hidden;\n}\n\n.hide-and-display-trigger:hover .hide-and-display {\n visibility: visible;\n}\n\n/**\n * home.html\n */\n\n.post-info::after {\n content: \"\";\n display: table;\n clear: both;\n}\n\n.post-thumbnail img{\n margin-left: 5px;\n margin-right: 15px;\n float: left;\n width: 200px;\n height: auto;\n border-radius: 10px;\n}","@charset \"utf-8\";\n\n// Default color scheme settings\n// These are overridden in classic.css and dark.scss\n\n$color-scheme-auto: true !default;\n$color-scheme-dark: false !default;\n\n\n// Light mode\n// ----------\n\n$lm-brand-color: #828282 !default;\n$lm-brand-color-light: lighten($lm-brand-color, 40%) !default;\n$lm-brand-color-dark: darken($lm-brand-color, 25%) !default;\n\n$lm-site-title-color: $lm-brand-color-dark !default;\n\n$lm-text-color: #111111 !default;\n$lm-background-color: #fdfdfd !default;\n$lm-code-background-color: #eeeeff !default;\n\n$lm-link-base-color: #2a7ae2 !default;\n$lm-link-visited-color: darken($lm-link-base-color, 15%) !default;\n$lm-link-hover-color: $lm-text-color !default;\n\n$lm-border-color-01: $lm-brand-color-light !default;\n$lm-border-color-02: lighten($lm-brand-color, 35%) !default;\n$lm-border-color-03: $lm-brand-color-dark !default;\n\n$lm-table-text-color: lighten($lm-text-color, 18%) !default;\n$lm-table-zebra-color: lighten($lm-brand-color, 46%) !default;\n$lm-table-header-bg-color: lighten($lm-brand-color, 43%) !default;\n$lm-table-header-border: lighten($lm-brand-color, 37%) !default;\n$lm-table-border-color: $lm-border-color-01 !default;\n\n\n// Syntax highlighting styles should be adjusted appropriately for every \"skin\"\n// ----------------------------------------------------------------------------\n\n@mixin lm-highlight {\n .highlight {\n .c { color: #998; font-style: italic } // Comment\n .err { color: #a61717; background-color: #e3d2d2 } // Error\n .k { font-weight: bold } // Keyword\n .o { font-weight: bold } // Operator\n .cm { color: #998; font-style: italic } // Comment.Multiline\n .cp { color: #999; font-weight: bold } // Comment.Preproc\n .c1 { color: #998; font-style: italic } // Comment.Single\n .cs { color: #999; font-weight: bold; font-style: italic } // Comment.Special\n .gd { color: #000; background-color: #fdd } // Generic.Deleted\n .gd .x { color: #000; background-color: #faa } // Generic.Deleted.Specific\n .ge { font-style: italic } // Generic.Emph\n .gr { color: #a00 } // Generic.Error\n .gh { color: #999 } // Generic.Heading\n .gi { color: #000; background-color: #dfd } // Generic.Inserted\n .gi .x { color: #000; background-color: #afa } // Generic.Inserted.Specific\n .go { color: #888 } // Generic.Output\n .gp { color: #555 } // Generic.Prompt\n .gs { font-weight: bold } // Generic.Strong\n .gu { color: #aaa } // Generic.Subheading\n .gt { color: #a00 } // Generic.Traceback\n .kc { font-weight: bold } // Keyword.Constant\n .kd { font-weight: bold } // Keyword.Declaration\n .kp { font-weight: bold } // Keyword.Pseudo\n .kr { font-weight: bold } // Keyword.Reserved\n .kt { color: #458; font-weight: bold } // Keyword.Type\n .m { color: #099 } // Literal.Number\n .s { color: #d14 } // Literal.String\n .na { color: #008080 } // Name.Attribute\n .nb { color: #0086B3 } // Name.Builtin\n .nc { color: #458; font-weight: bold } // Name.Class\n .no { color: #008080 } // Name.Constant\n .ni { color: #800080 } // Name.Entity\n .ne { color: #900; font-weight: bold } // Name.Exception\n .nf { color: #900; font-weight: bold } // Name.Function\n .nn { color: #555 } // Name.Namespace\n .nt { color: #000080 } // Name.Tag\n .nv { color: #008080 } // Name.Variable\n .ow { font-weight: bold } // Operator.Word\n .w { color: #bbb } // Text.Whitespace\n .mf { color: #099 } // Literal.Number.Float\n .mh { color: #099 } // Literal.Number.Hex\n .mi { color: #099 } // Literal.Number.Integer\n .mo { color: #099 } // Literal.Number.Oct\n .sb { color: #d14 } // Literal.String.Backtick\n .sc { color: #d14 } // Literal.String.Char\n .sd { color: #d14 } // Literal.String.Doc\n .s2 { color: #d14 } // Literal.String.Double\n .se { color: #d14 } // Literal.String.Escape\n .sh { color: #d14 } // Literal.String.Heredoc\n .si { color: #d14 } // Literal.String.Interpol\n .sx { color: #d14 } // Literal.String.Other\n .sr { color: #009926 } // Literal.String.Regex\n .s1 { color: #d14 } // Literal.String.Single\n .ss { color: #990073 } // Literal.String.Symbol\n .bp { color: #999 } // Name.Builtin.Pseudo\n .vc { color: #008080 } // Name.Variable.Class\n .vg { color: #008080 } // Name.Variable.Global\n .vi { color: #008080 } // Name.Variable.Instance\n .il { color: #099 } // Literal.Number.Integer.Long\n }\n}\n\n\n// Dark mode\n// ---------\n\n$dm-brand-color: #999999 !default;\n$dm-brand-color-light: lighten($dm-brand-color, 5%) !default;\n$dm-brand-color-dark: darken($dm-brand-color, 35%) !default;\n\n$dm-site-title-color: $dm-brand-color-light !default;\n\n$dm-text-color: #bbbbbb !default;\n$dm-background-color: #181818 !default;\n$dm-code-background-color: #212121 !default;\n\n$dm-link-base-color: #79b8ff !default;\n$dm-link-visited-color: $dm-link-base-color !default;\n$dm-link-hover-color: $dm-text-color !default;\n\n$dm-border-color-01: $dm-brand-color-dark !default;\n$dm-border-color-02: $dm-brand-color-light !default;\n$dm-border-color-03: $dm-brand-color !default;\n\n$dm-table-text-color: $dm-text-color !default;\n$dm-table-zebra-color: lighten($dm-background-color, 4%) !default;\n$dm-table-header-bg-color: lighten($dm-background-color, 10%) !default;\n$dm-table-header-border: lighten($dm-background-color, 21%) !default;\n$dm-table-border-color: $dm-border-color-01 !default;\n\n\n// Syntax highlighting styles should be adjusted appropriately for every \"skin\"\n// List of tokens: https://github.com/rouge-ruby/rouge/wiki/List-of-tokens\n// Some colors come from Material Theme Darker:\n// https://github.com/material-theme/vsc-material-theme/blob/master/scripts/generator/settings/specific/darker-hc.ts\n// https://github.com/material-theme/vsc-material-theme/blob/master/scripts/generator/color-set.ts\n// ----------------------------------------------------------------------------\n\n@mixin dm-highlight {\n .highlight {\n .c { color: #545454; font-style: italic } // Comment\n .err { color: #f07178; background-color: #e3d2d2 } // Error\n .k { color: #89DDFF; font-weight: bold } // Keyword\n .o { font-weight: bold } // Operator\n .cm { color: #545454; font-style: italic } // Comment.Multiline\n .cp { color: #545454; font-weight: bold } // Comment.Preproc\n .c1 { color: #545454; font-style: italic } // Comment.Single\n .cs { color: #545454; font-weight: bold; font-style: italic } // Comment.Special\n .gd { color: #000; background-color: #fdd } // Generic.Deleted\n .gd .x { color: #000; background-color: #faa } // Generic.Deleted.Specific\n .ge { font-style: italic } // Generic.Emph\n .gr { color: #f07178 } // Generic.Error\n .gh { color: #999 } // Generic.Heading\n .gi { color: #000; background-color: #dfd } // Generic.Inserted\n .gi .x { color: #000; background-color: #afa } // Generic.Inserted.Specific\n .go { color: #888 } // Generic.Output\n .gp { color: #555 } // Generic.Prompt\n .gs { font-weight: bold } // Generic.Strong\n .gu { color: #aaa } // Generic.Subheading\n .gt { color: #f07178 } // Generic.Traceback\n .kc { font-weight: bold } // Keyword.Constant\n .kd { font-weight: bold } // Keyword.Declaration\n .kp { font-weight: bold } // Keyword.Pseudo\n .kr { font-weight: bold } // Keyword.Reserved\n .kt { color: #FFCB6B; font-weight: bold } // Keyword.Type\n .m { color: #F78C6C } // Literal.Number\n .s { color: #C3E88D } // Literal.String\n .na { color: #008080 } // Name.Attribute\n .nb { color: #EEFFFF } // Name.Builtin\n .nc { color: #FFCB6B; font-weight: bold } // Name.Class\n .no { color: #008080 } // Name.Constant\n .ni { color: #800080 } // Name.Entity\n .ne { color: #900; font-weight: bold } // Name.Exception\n .nf { color: #82AAFF; font-weight: bold } // Name.Function\n .nn { color: #555 } // Name.Namespace\n .nt { color: #FFCB6B } // Name.Tag\n .nv { color: #EEFFFF } // Name.Variable\n .ow { font-weight: bold } // Operator.Word\n .w { color: #EEFFFF } // Text.Whitespace\n .mf { color: #F78C6C } // Literal.Number.Float\n .mh { color: #F78C6C } // Literal.Number.Hex\n .mi { color: #F78C6C } // Literal.Number.Integer\n .mo { color: #F78C6C } // Literal.Number.Oct\n .sb { color: #C3E88D } // Literal.String.Backtick\n .sc { color: #C3E88D } // Literal.String.Char\n .sd { color: #C3E88D } // Literal.String.Doc\n .s2 { color: #C3E88D } // Literal.String.Double\n .se { color: #EEFFFF } // Literal.String.Escape\n .sh { color: #C3E88D } // Literal.String.Heredoc\n .si { color: #C3E88D } // Literal.String.Interpol\n .sx { color: #C3E88D } // Literal.String.Other\n .sr { color: #C3E88D } // Literal.String.Regex\n .s1 { color: #C3E88D } // Literal.String.Single\n .ss { color: #C3E88D } // Literal.String.Symbol\n .bp { color: #999 } // Name.Builtin.Pseudo\n .vc { color: #FFCB6B } // Name.Variable.Class\n .vg { color: #EEFFFF } // Name.Variable.Global\n .vi { color: #EEFFFF } // Name.Variable.Instance\n .il { color: #F78C6C } // Literal.Number.Integer.Long\n }\n}\n\n\n// Mode selection\n// --------------\n\n\n// Classic skin (always light mode)\n// Assign outside of the if construct to establish global variable scope\n\n$brand-color: $lm-brand-color;\n$brand-color-light: $lm-brand-color-light;\n$brand-color-dark: $lm-brand-color-dark;\n\n$site-title-color: $lm-site-title-color;\n\n$text-color: $lm-text-color;\n$background-color: $lm-background-color;\n$code-background-color: $lm-code-background-color;\n\n$link-base-color: $lm-link-base-color;\n$link-visited-color: $lm-link-visited-color;\n$link-hover-color: $lm-link-hover-color;\n\n$border-color-01: $lm-border-color-01;\n$border-color-02: $lm-border-color-02;\n$border-color-03: $lm-border-color-03;\n\n$table-text-color: $lm-table-text-color;\n$table-zebra-color: $lm-table-zebra-color;\n$table-header-bg-color: $lm-table-header-bg-color;\n$table-header-border: $lm-table-header-border;\n$table-border-color: $lm-table-border-color;\n\n\n@if $color-scheme-auto {\n\n // Auto mode\n\n :root {\n --minima-brand-color: #{$lm-brand-color};\n --minima-brand-color-light: #{$lm-brand-color-light};\n --minima-brand-color-dark: #{$lm-brand-color-dark};\n\n --minima-site-title-color: #{$lm-site-title-color};\n\n --minima-text-color: #{$lm-text-color};\n --minima-background-color: #{$lm-background-color};\n --minima-code-background-color: #{$lm-code-background-color};\n\n --minima-link-base-color: #{$lm-link-base-color};\n --minima-link-visited-color: #{$lm-link-visited-color};\n --minima-link-hover-color: #{$lm-link-hover-color};\n\n --minima-border-color-01: #{$lm-border-color-01};\n --minima-border-color-02: #{$lm-border-color-02};\n --minima-border-color-03: #{$lm-border-color-03};\n\n --minima-table-text-color: #{$lm-table-text-color};\n --minima-table-zebra-color: #{$lm-table-zebra-color};\n --minima-table-header-bg-color: #{$lm-table-header-bg-color};\n --minima-table-header-border: #{$lm-table-header-border};\n --minima-table-border-color: #{$lm-table-border-color};\n }\n\n @include lm-highlight;\n\n @media (prefers-color-scheme: dark) {\n :root {\n --minima-brand-color: #{$dm-brand-color};\n --minima-brand-color-light: #{$dm-brand-color-light};\n --minima-brand-color-dark: #{$dm-brand-color-dark};\n\n --minima-site-title-color: #{$dm-site-title-color};\n\n --minima-text-color: #{$dm-text-color};\n --minima-background-color: #{$dm-background-color};\n --minima-code-background-color: #{$dm-code-background-color};\n\n --minima-link-base-color: #{$dm-link-base-color};\n --minima-link-visited-color: #{$dm-link-visited-color};\n --minima-link-hover-color: #{$dm-link-hover-color};\n\n --minima-border-color-01: #{$dm-border-color-01};\n --minima-border-color-02: #{$dm-border-color-02};\n --minima-border-color-03: #{$dm-border-color-03};\n\n --minima-table-text-color: #{$dm-table-text-color};\n --minima-table-zebra-color: #{$dm-table-zebra-color};\n --minima-table-header-bg-color: #{$dm-table-header-bg-color};\n --minima-table-header-border: #{$dm-table-header-border};\n --minima-table-border-color: #{$dm-table-border-color};\n }\n\n @include dm-highlight;\n }\n\n $brand-color: var(--minima-brand-color);\n $brand-color-light: var(--minima-brand-color-light);\n $brand-color-dark: var(--minima-brand-color-dark);\n\n $site-title-color: var(--minima-site-title-color);\n\n $text-color: var(--minima-text-color);\n $background-color: var(--minima-background-color);\n $code-background-color: var(--minima-code-background-color);\n\n $link-base-color: var(--minima-link-base-color);\n $link-visited-color: var(--minima-link-visited-color);\n $link-hover-color: var(--minima-link-hover-color);\n\n $border-color-01: var(--minima-border-color-01);\n $border-color-02: var(--minima-border-color-02);\n $border-color-03: var(--minima-border-color-03);\n\n $table-text-color: var(--minima-table-text-color);\n $table-zebra-color: var(--minima-table-zebra-color);\n $table-header-bg-color: var(--minima-table-header-bg-color);\n $table-header-border: var(--minima-table-header-border);\n $table-border-color: var(--minima-table-border-color);\n\n\n} @else if $color-scheme-dark {\n\n // Dark skin (always dark mode)\n\n $brand-color: $dm-brand-color;\n $brand-color-light: $dm-brand-color-light;\n $brand-color-dark: $dm-brand-color-dark;\n\n $site-title-color: $dm-site-title-color;\n\n $text-color: $dm-text-color;\n $background-color: $dm-background-color;\n $code-background-color: $dm-code-background-color;\n\n $link-base-color: $dm-link-base-color;\n $link-visited-color: $dm-link-visited-color;\n $link-hover-color: $dm-link-hover-color;\n\n $border-color-01: $dm-border-color-01;\n $border-color-02: $dm-border-color-02;\n $border-color-03: $dm-border-color-03;\n\n $table-text-color: $dm-table-text-color;\n $table-zebra-color: $dm-table-zebra-color;\n $table-header-bg-color: $dm-table-header-bg-color;\n $table-header-border: $dm-table-header-border;\n $table-border-color: $dm-table-border-color;\n\n @include dm-highlight;\n\n\n} @else {\n\n // Classic skin syntax highlighting\n @include lm-highlight;\n\n}\n","html {\n font-size: $base-font-size;\n}\n\n/**\n * Reset some basic elements\n */\nbody, h1, h2, h3, h4, h5, h6,\np, blockquote, pre, hr,\ndl, dd, ol, ul, figure {\n margin: 0;\n padding: 0;\n\n}\n\n\n\n/**\n * Basic styling\n */\nbody {\n font: $base-font-weight #{$base-font-size}/#{$base-line-height} $base-font-family;\n color: $text-color;\n background-color: $background-color;\n -webkit-text-size-adjust: 100%;\n -webkit-font-feature-settings: \"kern\" 1;\n -moz-font-feature-settings: \"kern\" 1;\n -o-font-feature-settings: \"kern\" 1;\n font-feature-settings: \"kern\" 1;\n font-kerning: normal;\n display: flex;\n min-height: 100vh;\n flex-direction: column;\n overflow-wrap: break-word;\n}\n\n\n\n/**\n * Set `margin-bottom` to maintain vertical rhythm\n */\nh1, h2, h3, h4, h5, h6,\np, blockquote, pre,\nul, ol, dl, figure,\n%vertical-rhythm {\n margin-bottom: $spacing-unit * .5;\n}\n\nhr {\n margin-top: $spacing-unit;\n margin-bottom: $spacing-unit;\n}\n\n/**\n * `main` element\n */\nmain {\n display: block; /* Default value of `display` of `main` element is 'inline' in IE 11. */\n}\n\n\n\n/**\n * Images\n */\nimg {\n max-width: 100%;\n vertical-align: middle;\n}\n\n\n\n/**\n * Figures\n */\nfigure > img {\n display: block;\n}\n\nfigcaption {\n font-size: $small-font-size;\n}\n\n\n\n/**\n * Lists\n */\nul, ol {\n margin-left: $spacing-unit;\n}\n\nli {\n > ul,\n > ol {\n margin-bottom: 0;\n }\n}\n\n\n\n/**\n * Headings\n */\nh1, h2, h3, h4, h5, h6 {\n font-weight: $base-font-weight;\n}\n\n\n\n/**\n * Links\n */\na {\n color: $link-base-color;\n text-decoration: none;\n\n &:visited {\n color: $link-visited-color;\n }\n\n &:hover {\n color: $link-hover-color;\n text-decoration: underline;\n }\n\n .social-media-list &:hover {\n text-decoration: none;\n\n .username {\n text-decoration: underline;\n }\n }\n}\n\n\n/**\n * Blockquotes\n */\nblockquote {\n color: $brand-color;\n border-left: 4px solid $border-color-01;\n padding-left: $spacing-unit * .5;\n @include relative-font-size(1.125);\n font-style: italic;\n\n > :last-child {\n margin-bottom: 0;\n }\n\n i, em {\n font-style: normal;\n }\n}\n\n\n\n/**\n * Code formatting\n */\npre,\ncode {\n font-family: $code-font-family;\n font-size: 0.9375em;\n border: 1px solid $border-color-01;\n border-radius: 3px;\n background-color: $code-background-color;\n}\n\ncode {\n padding: 1px 5px;\n}\n\npre {\n padding: 8px 12px;\n overflow-x: auto;\n\n > code {\n border: 0;\n padding-right: 0;\n padding-left: 0;\n }\n}\n\n.highlight {\n border-radius: 3px;\n background: $code-background-color;\n @extend %vertical-rhythm;\n\n .highlighter-rouge & {\n background: $code-background-color;\n }\n}\n\n\n\n/**\n * Wrapper\n */\n.wrapper {\n max-width: calc(#{$content-width} - 150px - (#{$spacing-unit}));\n margin-right: auto;\n margin-left: auto;\n padding-right: $spacing-unit * .5;\n padding-left: $spacing-unit * .5;\n @extend %clearfix;\n\n @media screen and (min-width: $on-large) {\n max-width: calc(#{$content-width} - (#{$spacing-unit} * 2));\n padding-right: $spacing-unit;\n padding-left: $spacing-unit;\n }\n}\n\n\n\n/**\n * Clearfix\n */\n%clearfix:after {\n content: \"\";\n display: table;\n clear: both;\n}\n\n\n\n/**\n * Icons\n */\n\n.orange {\n color: #f66a0a;\n}\n\n.grey {\n color: #828282;\n}\n\n.svg-icon {\n width: 1.25em;\n height: 1.25em;\n display: inline-block;\n fill: currentColor;\n vertical-align: text-bottom;\n}\n\n\n/**\n * Tables\n */\ntable {\n margin-bottom: $spacing-unit;\n width: 100%;\n text-align: $table-text-align;\n color: $table-text-color;\n border-collapse: collapse;\n border: 1px solid $table-border-color;\n tr {\n &:nth-child(even) {\n background-color: $table-zebra-color;\n }\n }\n th, td {\n padding: ($spacing-unit * 33.3333333333 * .01) ($spacing-unit * .5);\n }\n th {\n background-color: $table-header-bg-color;\n border: 1px solid $table-header-border;\n }\n td {\n border: 1px solid $table-border-color;\n }\n\n @include media-query($on-laptop) {\n display: block;\n overflow-x: auto;\n -webkit-overflow-scrolling: touch;\n -ms-overflow-style: -ms-autohiding-scrollbar;\n }\n}\n","@charset \"utf-8\";\n\n// Define defaults for each variable.\n\n$base-font-family: -apple-system, system-ui, BlinkMacSystemFont, \"Segoe UI\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Apple Color Emoji\", Roboto, Helvetica, Arial, sans-serif !default;\n$code-font-family: \"Menlo\", \"Inconsolata\", \"Consolas\", \"Roboto Mono\", \"Ubuntu Mono\", \"Liberation Mono\", \"Courier New\", monospace;\n$base-font-size: 16px !default;\n$base-font-weight: 400 !default;\n$small-font-size: $base-font-size * 0.875 !default;\n$base-line-height: 1.5 !default;\n\n$spacing-unit: 20px !default;\n\n$table-text-align: left !default;\n\n// Width of the content area\n$content-width: 900px !default;\n\n$on-palm: 1240px !default;\n$on-laptop: 1366px !default;\n\n$on-medium: $on-palm !default;\n$on-large: $on-laptop !default;\n\n// Use media queries like this:\n// @include media-query($on-palm) {\n// .wrapper {\n// padding-right: $spacing-unit / 2;\n// padding-left: $spacing-unit / 2;\n// }\n// }\n// Notice the following mixin uses max-width, in a deprecated, desktop-first\n// approach, whereas media queries used elsewhere now use min-width.\n@mixin media-query($device) {\n @media screen and (max-width: $device) {\n @content;\n }\n}\n\n@mixin relative-font-size($ratio) {\n font-size: #{$ratio}rem;\n}\n\n// Import pre-styling-overrides hook and style-partials.\n@import\n \"minima/custom-variables\", // Hook to override predefined variables.\n \"minima/base\", // Defines element resets.\n \"minima/layout\", // Defines structure and style based on CSS selectors.\n \"minima/custom-styles\" // Hook to override existing styles.\n;\n","/**\n * Site header\n */\n.site-header {\n border-top: 5px solid $border-color-03;\n border-bottom: 1px solid $border-color-01;\n min-height: $spacing-unit * 1.865;\n line-height: $base-line-height * $base-font-size * 2.25;\n\n // Positioning context for the mobile navigation icon\n position: relative;\n}\n\n.site-title {\n @include relative-font-size(1.625);\n font-weight: 300;\n letter-spacing: -1px;\n margin-bottom: 0;\n float: left;\n\n @include media-query($on-palm) {\n padding-right: 45px;\n }\n\n &,\n &:visited {\n color: $site-title-color;\n }\n}\n\n.site-nav {\n position: absolute;\n top: 9px;\n right: $spacing-unit * .5;\n background-color: $background-color;\n border: 1px solid $border-color-01;\n border-radius: 5px;\n text-align: right;\n\n .nav-trigger {\n display: none;\n }\n\n .menu-icon {\n float: right;\n width: 36px;\n height: 26px;\n line-height: 0;\n padding-top: 10px;\n text-align: center;\n\n > svg path {\n fill: $border-color-03;\n }\n }\n\n label[for=\"nav-trigger\"] {\n display: block;\n float: right;\n width: 36px;\n height: 36px;\n z-index: 2;\n cursor: pointer;\n }\n\n input ~ .trigger {\n clear: both;\n display: none;\n }\n\n input:checked ~ .trigger {\n display: block;\n padding-bottom: 5px;\n }\n\n .page-link {\n color: $text-color;\n line-height: $base-line-height;\n display: block;\n padding: 5px 10px;\n\n // Gaps between nav items, but not on the last one\n &:not(:last-child) {\n margin-right: 0;\n }\n margin-left: 20px;\n }\n\n @media screen and (min-width: $on-medium) {\n position: static;\n float: right;\n border: none;\n background-color: inherit;\n\n label[for=\"nav-trigger\"] {\n display: none;\n }\n\n .menu-icon {\n display: none;\n }\n\n input ~ .trigger {\n display: block;\n }\n\n .page-link {\n display: inline;\n padding: 0;\n\n &:not(:last-child) {\n margin-right: 20px;\n }\n margin-left: auto;\n }\n }\n}\n\n\n\n/**\n * Site footer\n */\n.site-footer {\n border-top: 1px solid $border-color-01;\n padding: $spacing-unit 0;\n}\n\n.footer-heading {\n @include relative-font-size(1.125);\n margin-bottom: $spacing-unit * .5;\n}\n\n.feed-subscribe .svg-icon {\n padding: 5px 5px 2px 0\n}\n\n.contact-list,\n.social-media-list {\n list-style: none;\n margin-left: 0;\n}\n\n.footer-col-wrapper,\n.social-links {\n @include relative-font-size(0.9375);\n color: $brand-color;\n}\n\n.footer-col {\n margin-bottom: $spacing-unit * .5;\n}\n\n.footer-col-1,\n.footer-col-2 {\n width: calc(50% - (#{$spacing-unit} / 2));\n}\n\n.footer-col-3 {\n width: calc(100% - (#{$spacing-unit} / 2));\n}\n\n@media screen and (min-width: $on-large) {\n .footer-col-1 {\n width: calc(35% - (#{$spacing-unit} / 2));\n }\n\n .footer-col-2 {\n width: calc(20% - (#{$spacing-unit} / 2));\n }\n\n .footer-col-3 {\n width: calc(45% - (#{$spacing-unit} / 2));\n }\n}\n\n@media screen and (min-width: $on-medium) {\n .footer-col-wrapper {\n display: flex\n }\n\n .footer-col {\n width: calc(100% - (#{$spacing-unit} / 2));\n padding: 0 ($spacing-unit * .5);\n\n &:first-child {\n padding-right: $spacing-unit * .5;\n padding-left: 0;\n }\n\n &:last-child {\n padding-right: 0;\n padding-left: $spacing-unit * .5;\n }\n }\n}\n\n\n\n/**\n * Page content\n */\n.page-content {\n padding: $spacing-unit 0;\n flex: 1 0 auto;\n}\n\n.page-heading {\n @include relative-font-size(2);\n}\n\n.post-list-heading {\n @include relative-font-size(1.75);\n}\n\n.post-list {\n margin-left: 0;\n list-style: none;\n\n > li {\n margin-bottom: $spacing-unit;\n }\n}\n\n.post-meta {\n font-size: $small-font-size;\n color: $brand-color;\n}\n\n.post-link {\n display: block;\n @include relative-font-size(1.5);\n}\n\n\n\n/**\n * Posts\n */\n.post-header {\n margin-bottom: $spacing-unit;\n}\n\n.post-title,\n.post-content h1 {\n @include relative-font-size(2.625);\n letter-spacing: -1px;\n line-height: 1.15;\n\n @media screen and (min-width: $on-large) {\n @include relative-font-size(2.625);\n }\n}\n\n.post-content {\n margin-bottom: $spacing-unit;\n\n h1, h2, h3, h4, h5, h6 { margin-top: $spacing-unit }\n\n h2 {\n @include relative-font-size(1.75);\n\n @media screen and (min-width: $on-large) {\n @include relative-font-size(2);\n }\n }\n\n h3 {\n @include relative-font-size(1.375);\n\n @media screen and (min-width: $on-large) {\n @include relative-font-size(1.625);\n }\n }\n\n h4 {\n @include relative-font-size(1.25);\n }\n\n h5 {\n @include relative-font-size(1.125);\n }\n h6 {\n @include relative-font-size(1.0625);\n }\n}\n\n\n.social-media-list {\n display: table;\n margin: 0 auto;\n li {\n float: left;\n margin: 5px 10px 5px 0;\n &:last-of-type { margin-right: 0 }\n a {\n display: block;\n padding: 10px 12px;\n border: 1px solid $border-color-01;\n &:hover { border-color: $border-color-02 }\n }\n }\n}\n\n\n\n/**\n * Pagination navbar\n */\n.pagination {\n margin-bottom: $spacing-unit;\n @extend .social-media-list;\n li {\n a, div {\n min-width: 41px;\n text-align: center;\n box-sizing: border-box;\n }\n div {\n display: block;\n padding: $spacing-unit * .25;\n border: 1px solid transparent;\n\n &.pager-edge {\n color: $border-color-01;\n border: 1px dashed;\n }\n }\n }\n}\n\n\n\n/**\n * Grid helpers\n */\n@media screen and (min-width: $on-large) {\n .one-half {\n width: calc(50% - (#{$spacing-unit} / 2));\n }\n}\n"],"file":"style.css"} \ No newline at end of file diff --git a/_site/assets/js/custom-styles.js b/_site/assets/js/custom-styles.js new file mode 100644 index 0000000..86b5a6e --- /dev/null +++ b/_site/assets/js/custom-styles.js @@ -0,0 +1,31 @@ +/** + * archive.md + */ + +// Toggle Display (none <-> block) +var x = document.getElementsByClassName("Text"); +var y = document.getElementsByClassName("Selection"); +var z = document.getElementsByClassName("Single-Container"); + +for (var i = 0, len = x.length; i < len; i++) +{ + (function(index){ + z[i].onclick = function(){ + + if (x[index].style.display === "none") + { + x[index].style.display = "flex"; + y[index].style.display = "none"; + } + + else + { + x[index].style.display = "none"; + y[index].style.display = "flex"; + } + + } + + })(i); + +} \ No newline at end of file diff --git a/_site/favicon/favicon.ico b/_site/favicon/favicon.ico new file mode 100644 index 0000000000000000000000000000000000000000..b5d120295342c2ff9b2b5e94bf6618d4274f7380 GIT binary patch literal 15406 zcmeI2O-jT-5QWR1z2m}tR+8ncTze5^mR>@m$QA=z&>j*`)V1_FMiK-(zWFG(=X*%ZTHfv)QUsL za?Fg~D(*N=>v50cx6JuCHrMTVC)eZ}24DaNU;qYS00v+H1_lO}+ymu4bg8-6-UGMH zLyp_~?|)r-jb5K + + + + + + + + + + + + + + + + + + + + + + +
+
+
+
+
+ +
+ + + +
  • + Nov 28, 2022 +

    + + How to post posts + +

    + + [ + + + this-is-a-tag + + + WoW + + + let's + + + go + + ] + +

    + +
    + You could write a brief description here to catch your readers' interests, like this is a post about how to post posts :) +
    • +
+ +
+
+
+ + + + + + \ No newline at end of file diff --git a/_site/minima.gemspec b/_site/minima.gemspec new file mode 100644 index 0000000..5d05424 --- /dev/null +++ b/_site/minima.gemspec @@ -0,0 +1,24 @@ +# frozen_string_literal: true + +Gem::Specification.new do |spec| + spec.name = "minima" + spec.version = "2.5.1" + spec.authors = ["Joel Glovier"] + spec.email = ["jglovier@github.com"] + + spec.summary = "A beautiful, minimal theme for Jekyll." + spec.homepage = "https://github.com/jekyll/minima" + spec.license = "MIT" + + spec.metadata["plugin_type"] = "theme" + + spec.files = `git ls-files -z`.split("\x0").select do |f| + f.match(%r!^(assets|_(includes|layouts|sass)/|(LICENSE|README)((\.(txt|md|markdown)|$)))!i) + end + + spec.add_runtime_dependency "jekyll", ">= 3.5", "< 5.0" + spec.add_runtime_dependency "jekyll-feed", "~> 0.9" + spec.add_runtime_dependency "jekyll-seo-tag", "~> 2.1" + + spec.add_development_dependency "bundler" + end \ No newline at end of file diff --git a/_site/tag/WoW.html b/_site/tag/WoW.html new file mode 100644 index 0000000..9da9691 --- /dev/null +++ b/_site/tag/WoW.html @@ -0,0 +1,78 @@ + + + + + + + + + + + + + + + + + + + + + + + +
+
+
+
+
+ +
+

Tag: WoW

+
+ +
  • + Nov 28, 2022 +

    + + How to post posts + +

    You could write a brief description here to catch your readers' interests, like this is a post about how to post posts :)
+ +
+
+ + + + + + \ No newline at end of file diff --git a/_site/tag/go.html b/_site/tag/go.html new file mode 100644 index 0000000..96331a9 --- /dev/null +++ b/_site/tag/go.html @@ -0,0 +1,78 @@ + + + + + + + + + + + + + + + + + + + + + + + +
+
+
+
+
+ +
+

Tag: go

+
+ +
  • + Nov 28, 2022 +

    + + How to post posts + +

    You could write a brief description here to catch your readers' interests, like this is a post about how to post posts :)
+ +
+
+ + + + + + \ No newline at end of file diff --git a/_site/tag/let's.html b/_site/tag/let's.html new file mode 100644 index 0000000..9a16466 --- /dev/null +++ b/_site/tag/let's.html @@ -0,0 +1,78 @@ + + + + + + + + + + + + + + + + + + + + + + + +
+
+
+
+
+ +
+

Tag: let's

+
+ +
  • + Nov 28, 2022 +

    + + How to post posts + +

    You could write a brief description here to catch your readers' interests, like this is a post about how to post posts :)
+ +
+
+ + + + + + \ No newline at end of file diff --git a/_site/tag/this-is-a-tag.html b/_site/tag/this-is-a-tag.html new file mode 100644 index 0000000..9081dc7 --- /dev/null +++ b/_site/tag/this-is-a-tag.html @@ -0,0 +1,78 @@ + + + + + + + + + + + + + + + + + + + + + + + +
+
+
+
+
+ +
+

Tag: this-is-a-tag

+
+ +
  • + Nov 28, 2022 +

    + + How to post posts + +

    You could write a brief description here to catch your readers' interests, like this is a post about how to post posts :)
+ +
+
+ + + + + + \ No newline at end of file diff --git a/_site/tagpage.html b/_site/tagpage.html new file mode 100644 index 0000000..8b13789 --- /dev/null +++ b/_site/tagpage.html @@ -0,0 +1 @@ + diff --git a/about.md b/about.md index 6a6b591..575d8fe 100644 --- a/about.md +++ b/about.md @@ -3,33 +3,6 @@ layout: page title: About --- - - - - - - - - -
@@ -81,10 +54,10 @@ Your DiscordTag or Facebook..... ### Maybe your Information On Other Platforms:
- - - - + + + +
diff --git a/archive.md b/archive.md index ae138da..dfcb9aa 100644 --- a/archive.md +++ b/archive.md @@ -3,154 +3,6 @@ layout: page title: Archive --- - - - - - - - - - - ### Papers published by me (Full-Display Style) : @@ -167,7 +19,7 @@ title: Archive
-
PDF
 +
PDF
@@ -181,9 +33,9 @@ title: Archive
-
Link 1
 +
Link 1
 -
Link 2
 +
Link 2
@@ -197,11 +49,11 @@ title: Archive
-
Link 1
 +
Link 1
 -
Link 2
 +
Link 2
 -
Link 3
 +
Link 3
@@ -215,13 +67,13 @@ title: Archive
-
Link 1
 +
Link 1
 -
Link 2
 +
Link 2
 -
Link 3
 +
Link 3
 -
Link 4
 +
Link 4
@@ -242,7 +94,7 @@ title: Archive
-
PDF
 +
PDF
@@ -256,9 +108,9 @@ title: Archive
-
Link 1
 +
Link 1
 -
Link 2
 +
Link 2
@@ -272,11 +124,11 @@ title: Archive
-
Link 1
 +
Link 1
 -
Link 2
 +
Link 2
 -
Link 3
 +
Link 3
@@ -290,13 +142,13 @@ title: Archive
-
Link 1
 +
Link 1
 -
Link 2
 +
Link 2
 -
Link 3
 +
Link 3
 -
Link 4
 +
Link 4
@@ -334,7 +186,7 @@ And both of them support adding items ( `
...
-
Link 1
 +
Link 1
@@ -347,42 +199,6 @@ Finally, after getting familiar with these procedure, you can delete this instru

Instruction part ends

- - - - - -

fake comments section

diff --git a/assets/css/style.scss b/assets/css/style.scss new file mode 100644 index 0000000..9ad4b9b --- /dev/null +++ b/assets/css/style.scss @@ -0,0 +1,10 @@ +--- +--- + +// keep these 2 lines of dashes at the top of the file, or the style sheet will not be located + +@import + + "minima/skins/{{ site.minima.skin | default: 'classic' }}", + "minima/initialize" + ; diff --git a/assets/js/custom-styles.js b/assets/js/custom-styles.js new file mode 100644 index 0000000..86b5a6e --- /dev/null +++ b/assets/js/custom-styles.js @@ -0,0 +1,31 @@ +/** + * archive.md + */ + +// Toggle Display (none <-> block) +var x = document.getElementsByClassName("Text"); +var y = document.getElementsByClassName("Selection"); +var z = document.getElementsByClassName("Single-Container"); + +for (var i = 0, len = x.length; i < len; i++) +{ + (function(index){ + z[i].onclick = function(){ + + if (x[index].style.display === "none") + { + x[index].style.display = "flex"; + y[index].style.display = "none"; + } + + else + { + x[index].style.display = "none"; + y[index].style.display = "flex"; + } + + } + + })(i); + +} \ No newline at end of file diff --git a/minima.gemspec b/minima.gemspec new file mode 100644 index 0000000..5d05424 --- /dev/null +++ b/minima.gemspec @@ -0,0 +1,24 @@ +# frozen_string_literal: true + +Gem::Specification.new do |spec| + spec.name = "minima" + spec.version = "2.5.1" + spec.authors = ["Joel Glovier"] + spec.email = ["jglovier@github.com"] + + spec.summary = "A beautiful, minimal theme for Jekyll." + spec.homepage = "https://github.com/jekyll/minima" + spec.license = "MIT" + + spec.metadata["plugin_type"] = "theme" + + spec.files = `git ls-files -z`.split("\x0").select do |f| + f.match(%r!^(assets|_(includes|layouts|sass)/|(LICENSE|README)((\.(txt|md|markdown)|$)))!i) + end + + spec.add_runtime_dependency "jekyll", ">= 3.5", "< 5.0" + spec.add_runtime_dependency "jekyll-feed", "~> 0.9" + spec.add_runtime_dependency "jekyll-seo-tag", "~> 2.1" + + spec.add_development_dependency "bundler" + end \ No newline at end of file