- {{ .Title }} -
-
-
-
diff --git a/assets/css/_common/_core/base.scss b/assets/css/_common/_core/base.scss deleted file mode 100644 index 36fd67bd..00000000 --- a/assets/css/_common/_core/base.scss +++ /dev/null @@ -1,129 +0,0 @@ -/** Font **/ -/* Lato */ -@import url(https://fonts.googleapis.com/css?family=Lato:100,300,400,700,900); - -/* Montserrat */ -@import url(https://fonts.googleapis.com/css?family=Montserrat:400,500,600,700,800); - -/* Roboto */ -@import url(https://fonts.googleapis.com/css?family=Roboto:400,900); - -html { - &::-webkit-scrollbar { - width: 8px; - height: 8px; - } - &::-webkit-scrollbar-thumb { - height: 40px; - background-color: #eee; - border-radius: 16px; - &:hover { - background-color: #ddd; - } - } -} - - ::selection { - background: rgba(0, 149, 255, 0.1); - } - - html { - font-family: "Roboto", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "PingFang SC", "Hiragino Sans GB", STHeiti, "Microsoft Yahei", "WenQuanYi Micro Hei", Arial, Verdana, sans-serif; - } - - body { - font-size: 11pt; - font-weight: 400; - line-height: 2em; - background-color: $light-background-color; - color: $light-font-color; - &:before { - content: ""; - background-repeat: no-repeat; - background-position: center; - opacity: 0.05; - position: fixed; - top: 0; - left: 0; - width: 100%; - height: 100%; - z-index: -1; - -webkit-filter: grayscale(100%); - -moz-filter: grayscale(100%); - -ms-filter: grayscale(100%); - -o-filter: grayscale(100%); - filter: grayscale(100%); - filter: gray; - } - - &.dark-theme { - background-color: $dark-background-color; - color: $dark-font-color; - } - } - - a { - color: $light-global-link-color; - text-decoration: none; - transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease, opacity 0.2s ease; - &:hover { - color: $light-global-link-hover-color; - text-decoration: none; - transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease, opacity 0.2s ease; - } - - .dark-theme & { - color: $dark-global-link-color; - text-decoration: none; - transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease, opacity 0.2s ease; - - &:hover{ - color: $dark-global-link-hover-color; - text-decoration: none; - transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease, opacity 0.2s ease; - } - } - } - - blockquote { - font-size: 1rem; - display: block; - border-width: 1px 0; - border-style: solid; - border-color: $light-border-color; - padding: 1.5em 1.2em 0.5em 1.2em; - margin: 0 0 2em 0; - position: relative; - - &:before { - content: '\201C'; - position: absolute; - top: 0em; - left: 50%; - transform: translate(-50%, -50%); - width: 3rem; - height: 2rem; - font: 6em/1.08em 'PT Sans', sans-serif; - color: $light-post-link-color; - text-align: center; - - .dark-theme &{ - color: $dark-post-link-color; - } - } - &:after { - content: "#blockquote" attr(cite); - display: block; - text-align: right; - font-size: 0.875em; - color: $light-post-link-color; - - .dark-theme &{ - color: $dark-post-link-color; - } - } - - .dark-theme & { - border-color: $dark-border-color; - } - } \ No newline at end of file diff --git a/assets/css/_common/_core/layout.scss b/assets/css/_common/_core/layout.scss deleted file mode 100644 index 8e77ed39..00000000 --- a/assets/css/_common/_core/layout.scss +++ /dev/null @@ -1,45 +0,0 @@ - /** Layout **/ - - .wrapper { - display: flex; - flex-direction: column; - min-height: 100vh; - width: 100%; - } - - .navbar { - height: 4rem; - line-height: 4rem; - width: 100%; - .container { - width: auto; - max-width: 1200px; - text-align: center; - margin: 0 auto; - display: flex; - justify-content: space-between; - } - } - - .main { - flex: 1 0 auto; - } - .container{ - padding-left: 1em; - padding-right: 1em; - } - - .footer { - height: 4rem; - width: 100%; - text-align: center; - line-height: 4rem; - padding-top: 2em; - } - - - .notfound { - font-size: 2em; - transform: translateY(35vh); - text-align: center; - } \ No newline at end of file diff --git a/assets/css/_common/_core/media.scss b/assets/css/_common/_core/media.scss deleted file mode 100644 index c4075578..00000000 --- a/assets/css/_common/_core/media.scss +++ /dev/null @@ -1,158 +0,0 @@ -@media only screen and (min-device-width: 320px) and (max-device-width: 480px) { - .navbar { - display: none; - } - - .navbar-mobile { - display: block !important; - position: fixed; - width: 100%; - z-index: 100; - transition: all 0.6s ease 0s; - .container { - padding: 0; - margin: 0; - height: 5em; - line-height: 5.5em; - background: $light-background-color; - - .navbar-header { - display: flex; - justify-content: space-between; - align-items: center; - width: 100%; - padding-right: 1em; - padding-left: 1em; - box-sizing: border-box; - - - .menu-toggle { - cursor: pointer; - line-height: 5.5em; - - span { - display: block; - background: #000; - width: 36px; - height: 2px; - -webkit-border-radius: 3px; - -moz-border-radius: 3px; - border-radius: 3px; - -webkit-transition: .25s margin .25s, .25s transform; - -moz-transition: .25s margin .25s, .25s transform; - transition: .25s margin .25s, .25s transform; - - .dark-theme & { - background: $dark-font-color; - } - } - - span:nth-child(1) { - margin-bottom: 8px; - } - span:nth-child(3) { - margin-top: 8px; - } - - &.active { - span { - -webkit-transition: .25s margin, .25s transform .25s; - -moz-transition: .25s margin, .25s transform .25s; - transition: .25s margin, .25s transform .25s; - } - span:nth-child(1) { - -moz-transform: rotate(45deg) translate(4px, 6px); - -ms-transform: rotate(45deg) translate(4px, 6px); - -webkit-transform: rotate(45deg) translate(4px, 6px); - transform: rotate(45deg) translate(4px, 6px); - } - - span:nth-child(2) { - opacity: 0 - } - - span:nth-child(3) { - -moz-transform: rotate(-45deg) translate(8px, -10px); - -ms-transform: rotate(-45deg) translate(8px, -10px); - -webkit-transform: rotate(-45deg) translate(8px, -10px); - transform: rotate(-45deg) translate(8px, -10px); - } - } - } - } - - .menu { - text-align: center; - background: #ffffff; - border-top: 2px solid #000000; - padding-top: 1em; - padding-bottom: 1em; - display: none; - box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1), 0px 4px 8px rgba(0, 0, 0, 0.1); - a { - display: block; - line-height: 2.5em; - } - - &.active { - display: block; - } - - .dark-theme & { - background: $dark-background-color; - border-top: 2px solid $dark-font-secondary-color; - } - } - .dark-theme & { - background: $dark-background-color !important; - } - } - } - - #dynamic-to-top { - display: none !important; - } - .footer { - height: 3rem; - width: 100%; - text-align: center; - line-height: 1.5rem; - padding-top: 2em; - } - - .post-warp { - padding-top: 6em; - .archive-item-date { - display: none; - } - .categories-card { - .card-item { - width: 95%; - } - } - } -} - - - -/* iPads (portrait and landscape) ----------- */ - -@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {} - - - -/* Desktops and laptops ----------- */ - -@media only screen and (min-width: 1224px) { - .navbar-mobile { - display: none; - } -} - - - -/* Large screens ----------- */ - -@media only screen and (min-width: 1824px) { - /* Styles */ -} \ No newline at end of file diff --git a/assets/css/_common/_core/normalize.scss b/assets/css/_common/_core/normalize.scss deleted file mode 100644 index 56010a8e..00000000 --- a/assets/css/_common/_core/normalize.scss +++ /dev/null @@ -1,356 +0,0 @@ -/*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */ - -/* Document - ========================================================================== */ - -/** - * 1. Correct the line height in all browsers. - * 2. Prevent adjustments of font size after orientation changes in iOS. - */ - @charset "UTF-8"; - html { - line-height: 1.15; /* 1 */ - -webkit-text-size-adjust: 100%; /* 2 */ - } - - /* Sections - ========================================================================== */ - - /** - * Remove the margin in all browsers. - */ - - html, - body, - main, - div, - span, - a, - li, - ul, - hr, - h1, - h2, - h3, - h4 { - padding: 0; - margin: 0; - } - /** - * Correct the font size and margin on `h1` elements within `section` and - * `article` contexts in Chrome, Firefox, and Safari. - */ - - h1 { - font-size: 2em; - margin: 0.67em 0; - } - - /* Grouping content - ========================================================================== */ - - /** - * 1. Add the correct box sizing in Firefox. - * 2. Show the overflow in Edge and IE. - */ - - hr { - box-sizing: content-box; /* 1 */ - height: 0; /* 1 */ - overflow: visible; /* 2 */ - } - - /** - * 1. Correct the inheritance and scaling of font size in all browsers. - * 2. Correct the odd `em` font sizing in all browsers. - */ - - pre { - font-family: monospace, monospace; /* 1 */ - font-size: 1em; /* 2 */ - } - - /* Text-level semantics - ========================================================================== */ - - /** - * Remove the gray background on active links in IE 10. - */ - - a { - background-color: transparent; - } - - /** - * 1. Remove the bottom border in Chrome 57- - * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. - */ - - abbr[title] { - border-bottom: none; /* 1 */ - text-decoration: underline; /* 2 */ - text-decoration: underline dotted; /* 2 */ - } - - /** - * Add the correct font weight in Chrome, Edge, and Safari. - */ - - b, - strong { - font-weight: bolder; - } - - /** - * 1. Correct the inheritance and scaling of font size in all browsers. - * 2. Correct the odd `em` font sizing in all browsers. - */ - - code, - kbd, - samp { - font-family: monospace, monospace; /* 1 */ - font-size: 1em; /* 2 */ - } - - /** - * Add the correct font size in all browsers. - */ - - small { - font-size: 80%; - } - - /** - * Prevent `sub` and `sup` elements from affecting the line height in - * all browsers. - */ - - sub, - sup { - font-size: 75%; - line-height: 0; - position: relative; - vertical-align: baseline; - } - - sub { - bottom: -0.25em; - } - - sup { - top: -0.5em; - } - - /* Embedded content - ========================================================================== */ - - /** - * Remove the border on images inside links in IE 10. - */ - - img { - border-style: none; - } - - /* Forms - ========================================================================== */ - - /** - * 1. Change the font styles in all browsers. - * 2. Remove the margin in Firefox and Safari. - */ - - button, - input, - optgroup, - select, - textarea { - font-family: inherit; /* 1 */ - font-size: 100%; /* 1 */ - line-height: 1.15; /* 1 */ - margin: 0; /* 2 */ - } - - /** - * Show the overflow in IE. - * 1. Show the overflow in Edge. - */ - - button, - input { - /* 1 */ - overflow: visible; - } - - /** - * Remove the inheritance of text transform in Edge, Firefox, and IE. - * 1. Remove the inheritance of text transform in Firefox. - */ - - button, - select { - /* 1 */ - text-transform: none; - } - - /** - * Correct the inability to style clickable types in iOS and Safari. - */ - - button, - [type="button"], - [type="reset"], - [type="submit"] { - -webkit-appearance: button; - } - - /** - * Remove the inner border and padding in Firefox. - */ - - button::-moz-focus-inner, - [type="button"]::-moz-focus-inner, - [type="reset"]::-moz-focus-inner, - [type="submit"]::-moz-focus-inner { - border-style: none; - padding: 0; - } - - /** - * Restore the focus styles unset by the previous rule. - */ - - button:-moz-focusring, - [type="button"]:-moz-focusring, - [type="reset"]:-moz-focusring, - [type="submit"]:-moz-focusring { - outline: 1px dotted ButtonText; - } - - /** - * Correct the padding in Firefox. - */ - - fieldset { - padding: 0.35em 0.75em 0.625em; - } - - /** - * 1. Correct the text wrapping in Edge and IE. - * 2. Correct the color inheritance from `fieldset` elements in IE. - * 3. Remove the padding so developers are not caught out when they zero out - * `fieldset` elements in all browsers. - */ - - legend { - box-sizing: border-box; /* 1 */ - color: inherit; /* 2 */ - display: table; /* 1 */ - max-width: 100%; /* 1 */ - padding: 0; /* 3 */ - white-space: normal; /* 1 */ - } - - /** - * Add the correct vertical alignment in Chrome, Firefox, and Opera. - */ - - progress { - vertical-align: baseline; - } - - /** - * Remove the default vertical scrollbar in IE 10+. - */ - - textarea { - overflow: auto; - } - - /** - * 1. Add the correct box sizing in IE 10. - * 2. Remove the padding in IE 10. - */ - - [type="checkbox"], - [type="radio"] { - box-sizing: border-box; /* 1 */ - padding: 0; /* 2 */ - } - - /** - * Correct the cursor style of increment and decrement buttons in Chrome. - */ - - [type="number"]::-webkit-inner-spin-button, - [type="number"]::-webkit-outer-spin-button { - height: auto; - } - - /** - * 1. Correct the odd appearance in Chrome and Safari. - * 2. Correct the outline style in Safari. - */ - - [type="search"] { - -webkit-appearance: textfield; /* 1 */ - outline-offset: -2px; /* 2 */ - } - - /** - * Remove the inner padding in Chrome and Safari on macOS. - */ - - [type="search"]::-webkit-search-decoration { - -webkit-appearance: none; - } - - /** - * 1. Correct the inability to style clickable types in iOS and Safari. - * 2. Change font properties to `inherit` in Safari. - */ - - ::-webkit-file-upload-button { - -webkit-appearance: button; /* 1 */ - font: inherit; /* 2 */ - } - - /* Interactive - ========================================================================== */ - - /* - * Add the correct display in Edge, IE 10+, and Firefox. - */ - - details { - display: block; - } - - /* - * Add the correct display in all browsers. - */ - - summary { - display: list-item; - } - - /* Misc - ========================================================================== */ - - /** - * Add the correct display in IE 10+. - */ - - template { - display: none; - } - - /** - * Add the correct display in IE 10. - */ - - [hidden] { - display: none; - } - \ No newline at end of file diff --git a/assets/css/_common/_page/home.scss b/assets/css/_common/_page/home.scss deleted file mode 100644 index 55f6c300..00000000 --- a/assets/css/_common/_page/home.scss +++ /dev/null @@ -1,54 +0,0 @@ - - /** Home **/ - - .intro { - transform: translateY(25vh); - text-align: center; - .avatar { - padding: 10px; - img { - width: 128px; - height: auto; - display: inline-block; - -webkit-border-radius: 100%; - border-radius: 100%; - -webkit-box-shadow: 0 0 0 0.3618em rgba(0, 0, 0, 0.05); - box-shadow: 0 0 0 0.3618em rgba(0, 0, 0, 0.05); - margin: 0 auto; - -webkit-transition: all ease 0.4s; - -moz-transition: all ease 0.4s; - -o-transition: all ease 0.4s; - transition: all ease 0.4s; - cursor: pointer; - &:hover { - position: relative; - -webkit-transform: translateY(-0.75em); - -moz-transform: translateY(-0.75em); - -ms-transform: translateY(-0.75em); - -o-transform: translateY(-0.75em); - transform: translateY(-0.75em); - cursor: pointer; - } - } - } - } - - h2.description { - font-size: 1em; - font-weight: normal; - padding: 5px; - } - - .social-links { - a { - - padding: 0 5px; - &:hover { - - background-color: transparent; - } - } - .iconfont { - font-size: 2em; - } - } \ No newline at end of file diff --git a/assets/css/_common/_page/home_post.scss b/assets/css/_common/_page/home_post.scss deleted file mode 100644 index 7808b133..00000000 --- a/assets/css/_common/_page/home_post.scss +++ /dev/null @@ -1,60 +0,0 @@ -.post-warp { - .intro { - transform: translateY(0); - margin: 2em 0 5em 0; - - .avatar { - img { - width: 96px; - } - } - } - - .post { - margin-bottom: 4em; - border-bottom: 1px dashed #ddd; - - .post-content { - padding-top: .5em; - } - - .post-footer { - display: flex; - justify-content: space-between; - align-items: center; - - .post-meta { - a { - color: rgba(85, 85, 85, 0.52941) !important; - .dark-theme & { - color: $dark-font-secondary-color !important; - } - - &:hover { - color: $light-font-secondary-color !important; - .dark-theme & { - color: $dark-font-secondary-color !important; - } - } - } - } - .post-tags { - span { - a { - color: rgba(85, 85, 85, 0.52941) !important; - .dark-theme & { - color: $dark-font-secondary-color !important; - } - - &:hover { - color: $light-font-secondary-color !important; - .dark-theme & { - color: $dark-font-secondary-color !important; - } - } - } - } - } - } - } -} \ No newline at end of file diff --git a/assets/css/_common/_page/post.scss b/assets/css/_common/_page/post.scss deleted file mode 100644 index e8aa31bc..00000000 --- a/assets/css/_common/_page/post.scss +++ /dev/null @@ -1,363 +0,0 @@ -/** Post **/ - -.post-warp { - position: relative; - width: 100%; - max-width: 780px; - margin: 0 auto; - padding-top: 2rem; - - .post-header h1 { - margin: 0 !important; - } - - .post-title { - font-size: 2em; - line-height: 1.5em; - } - - .post-meta { - color: rgba(85, 85, 85, 0.52941) !important; - .dark-theme & { - color: $dark-font-secondary-color !important; - } - - a { - color: $light-post-link-color; - .dark-theme & { - color: $dark-post-link-color; - } - - &:hover { - color: $light-post-link-hover-color; - .dark-theme & { - color: $dark-post-link-hover-color; - } - } - } - } - - .post-content { - padding-top: 1rem; - - h2, - h3, - h4, - h5, - h6 { - padding-top: .8em; - padding-bottom: .3em; - } - h2::before { - content: "#"; - margin-right: 5px; - color: $light-post-link-color; - .dark-theme & { - color: $dark-post-link-color; - } - } - - h3::before { - content: "|"; - margin-right: 5px; - color: $light-post-link-color; - - .dark-theme & { - color: $dark-post-link-color; - } - } - - a { - color: $light-post-link-color; - .dark-theme & { - color: $dark-post-link-color; - } - } - - a:hover { - color: $light-post-link-hover-color; - .dark-theme &:hover { - color: $dark-post-link-hover-color; - font-weight: bold; - text-decoration: underline; - } - } - - code, - pre { - padding: 7px; - font-size: 13px; - font-family: Consolas, Monaco, Menlo, Consolas, monospace; - word-break: break-all; - word-wrap: break-word; - } - - code:not([class]) { - padding: 5px 5px; - background: #fff; - border: 1px solid #ddd; - box-shadow: 1px 1px 0 #fff, 2px 2px 0 #ddd; - margin-left: 3px; - margin-right: 3px; - - .dark-theme &:not([class]) { - background: transparent; - box-shadow: 1px 1px 0 $dark-font-secondary-color, 2px 2px 0 $dark-font-secondary-color; - } - } - - ul { - padding-left: 2em; - } - - table { - max-width: 100%; - margin: 10px 0; - border-spacing: 0; - box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.125); - - th, - td { - padding: 5px 15px; - border: 1px double #ebe9f5; - } - } - - figure { - text-align: center; - img:hover{ - cursor: zoom-in; - } - } - - .image-caption:not(:empty) { - min-width: 20%; - max-width: 80%; - display: inline-block; - padding: 10px; - margin: 0 auto; - border-bottom: 1px solid #d9d9d9; - font-size: 14px; - color: #969696; - line-height: 1.7; - } - - img { - display: block; - max-width: 80%; - height: auto; - margin: 0 auto; - overflow: hidden; - } - - img[data-action="zoom"] { - cursor: zoom-in; - } - - .featured_image { - width: 100% !important; - max-width: 100% !important; - height: auto !important; - margin: 0 !important; - } - - div.typeit-code { - padding: 6px; - font-size: 14px; - font-family: Consolas, Monaco, Menlo, Consolas, monospace; - font-weight:bold; - word-break: break-all; - - .k { - color: #D371E3; - } - - .kt { - color: #D371E3; - } - - .kc { - color: #D371E3; - } - - .o { - color: #D371E3; - } - - .n { - color: #ECBF6F; - } - - .nf { - color: #F16473; - } - - .na { - color: #41B1F5; - } - - .s { - color: #8BC56F; - } - - .n { - color: #DB975C; - } - - .c1 { - color: #7E848F; - white-space: pre-wrap; - } - - .space { - white-space: pre; - } - } - - .align-center { - text-align: center; - } - - .align-right { - text-align: right; - } - - .align-left { - text-align: left; - } - - .float-right { - float: right; - } - } - - p { - font-size: 1em; - margin: .5em 0 .5em 0; - } - - .post-copyright { - margin-top: 5rem; - border-top: 1px solid $light-border-color; - border-bottom: 1px solid $light-border-color; - - .copyright-item { - margin: 5px 0; - } - - .dark-theme & { - border-top: 1px solid $dark-border-color; - border-bottom: 1px solid $dark-border-color; - } - } - - .post-tags { - padding: 1rem 0 1rem; - display: flex; - justify-content: space-between; - - } - - .post-nav { - - &:before, - &:after { - content: " "; - display: table; - } - - & a.prev, - & a.next { - font-weight: 600; - font-size: 16px; - - transition-property: transform; - transition-timing-function: ease-out; - transition-duration: 0.3s; - } - - & a.prev { - float: left; - } - - & a.prev:hover { - transform: translateX(-4px); - } - - & a.next { - float: right; - } - & a.next:hover { - transform: translateX(4px); - } - } - - .tag:not(:last-child) a::after { - content: " / "; - } - - .post-comment { - padding: 3em 0; - } -} - -/* Background */ .chroma { color: #f8f8f2; background-color: #282a36 } -/* LineTableTD */ .chroma .lntd { vertical-align: top; padding: 0; margin: 0; border: 0; } -/* LineTable */ .chroma .lntable { border-spacing: 0; padding: 0; margin: 0; border: 0; width: auto; overflow: auto; display: block; } -/* LineHighlight */ .chroma .hl { display: block; width: 100%;background-color: #ffffcc } -/* LineNumbersTable */ .chroma .lnt { margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #7f7f7f } -/* LineNumbers */ .chroma .ln { margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #7f7f7f } -/* Keyword */ .chroma .k { color: #ff79c6 } -/* KeywordConstant */ .chroma .kc { color: #ff79c6 } -/* KeywordDeclaration */ .chroma .kd { color: #8be9fd; font-style: italic } -/* KeywordNamespace */ .chroma .kn { color: #ff79c6 } -/* KeywordPseudo */ .chroma .kp { color: #ff79c6 } -/* KeywordReserved */ .chroma .kr { color: #ff79c6 } -/* KeywordType */ .chroma .kt { color: #8be9fd } -/* NameAttribute */ .chroma .na { color: #50fa7b } -/* NameBuiltin */ .chroma .nb { color: #8be9fd; font-style: italic } -/* NameClass */ .chroma .nc { color: #50fa7b } -/* NameFunction */ .chroma .nf { color: #50fa7b } -/* NameLabel */ .chroma .nl { color: #8be9fd; font-style: italic } -/* NameTag */ .chroma .nt { color: #ff79c6 } -/* NameVariable */ .chroma .nv { color: #8be9fd; font-style: italic } -/* NameVariableClass */ .chroma .vc { color: #8be9fd; font-style: italic } -/* NameVariableGlobal */ .chroma .vg { color: #8be9fd; font-style: italic } -/* NameVariableInstance */ .chroma .vi { color: #8be9fd; font-style: italic } -/* LiteralString */ .chroma .s { color: #f1fa8c } -/* LiteralStringAffix */ .chroma .sa { color: #f1fa8c } -/* LiteralStringBacktick */ .chroma .sb { color: #f1fa8c } -/* LiteralStringChar */ .chroma .sc { color: #f1fa8c } -/* LiteralStringDelimiter */ .chroma .dl { color: #f1fa8c } -/* LiteralStringDoc */ .chroma .sd { color: #f1fa8c } -/* LiteralStringDouble */ .chroma .s2 { color: #f1fa8c } -/* LiteralStringEscape */ .chroma .se { color: #f1fa8c } -/* LiteralStringHeredoc */ .chroma .sh { color: #f1fa8c } -/* LiteralStringInterpol */ .chroma .si { color: #f1fa8c } -/* LiteralStringOther */ .chroma .sx { color: #f1fa8c } -/* LiteralStringRegex */ .chroma .sr { color: #f1fa8c } -/* LiteralStringSingle */ .chroma .s1 { color: #f1fa8c } -/* LiteralStringSymbol */ .chroma .ss { color: #f1fa8c } -/* LiteralNumber */ .chroma .m { color: #bd93f9 } -/* LiteralNumberBin */ .chroma .mb { color: #bd93f9 } -/* LiteralNumberFloat */ .chroma .mf { color: #bd93f9 } -/* LiteralNumberHex */ .chroma .mh { color: #bd93f9 } -/* LiteralNumberInteger */ .chroma .mi { color: #bd93f9 } -/* LiteralNumberIntegerLong */ .chroma .il { color: #bd93f9 } -/* LiteralNumberOct */ .chroma .mo { color: #bd93f9 } -/* Operator */ .chroma .o { color: #ff79c6 } -/* OperatorWord */ .chroma .ow { color: #ff79c6 } -/* Comment */ .chroma .c { color: #6272a4 } -/* CommentHashbang */ .chroma .ch { color: #6272a4 } -/* CommentMultiline */ .chroma .cm { color: #6272a4 } -/* CommentSingle */ .chroma .c1 { color: #6272a4 } -/* CommentSpecial */ .chroma .cs { color: #6272a4 } -/* CommentPreproc */ .chroma .cp { color: #ff79c6 } -/* CommentPreprocFile */ .chroma .cpf { color: #ff79c6 } -/* GenericDeleted */ .chroma .gd { color: #8b080b } -/* GenericEmph */ .chroma .ge { text-decoration: underline } -/* GenericHeading */ .chroma .gh { font-weight: bold } -/* GenericInserted */ .chroma .gi { font-weight: bold } -/* GenericOutput */ .chroma .go { color: #44475a } -/* GenericSubheading */ .chroma .gu { font-weight: bold } -/* GenericUnderline */ .chroma .gl { text-decoration: underline } diff --git a/assets/css/_common/_page/tags.scss b/assets/css/_common/_page/tags.scss deleted file mode 100644 index df112001..00000000 --- a/assets/css/_common/_page/tags.scss +++ /dev/null @@ -1,32 +0,0 @@ -.tag-cloud-tags { - margin: 10px 0; - - a { - display: inline-block; - position: relative; - margin: 5px 10px; - word-wrap: break-word; - transition-duration: .3s; - transition-property: transform; - transition-timing-function: ease-out; - - &:active, - &:focus, - &:hover { - color: $light-global-link-hover-color; - transform: scale(1.1); - - .dark-theme &{ - color: $dark-global-link-hover-color; - } - } - - small { - color: $light-font-secondary-color; - - .dark-theme &{ - color: $dark-global-link-hover-color; - } - } - } -} \ No newline at end of file diff --git a/assets/css/_common/_page/terms.scss b/assets/css/_common/_page/terms.scss deleted file mode 100644 index 8f0620cb..00000000 --- a/assets/css/_common/_page/terms.scss +++ /dev/null @@ -1,82 +0,0 @@ -.post-warp { - - .archive-item { - margin-left: 2rem; - } - - .categories-card { - margin: 0 auto; - margin-top: 3em; - display: flex; - align-items: center; - justify-content: space-between; - flex-direction: row; - flex-wrap: wrap; - padding: 0 2.5em; - line-height: 1.6em; - - .card-item { - font-size: 14px; - text-align: left; - width: 45%; - display: flex; - align-items: flex-start; - margin-top:2em; - min-height: 16em; - padding: 0 2%; - position: relative; - - .categories{ - overflow: hidden; - } - } - } - - .archive-item-link { - display: inline-block; - text-decoration: none; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - max-width: 95%; - &:hover { - color: $light-global-link-hover-color; - background-color: transparent; - } - - .dark-theme & { - color: $dark-global-link-color; - text-decoration: none; - transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease, opacity 0.2s ease; - - &:hover { - color: $dark-global-link-hover-color; - text-decoration: none; - transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease, opacity 0.2s ease; - } - } - } - .archive-item-date { - float: right; - text-align: right; - color: $light-font-secondary-color; - - .dark-theme & { - color: $dark-font-secondary-color; - } - } - - .more-post { - text-align: right; - } -} - -.categories { - h3 { - display: inline-block; - } - span { - float: right; - padding-right: 1em; - } -} \ No newline at end of file diff --git a/assets/css/_common/_prettyprint/default.scss b/assets/css/_common/_prettyprint/default.scss deleted file mode 100644 index 29cf41a0..00000000 --- a/assets/css/_common/_prettyprint/default.scss +++ /dev/null @@ -1,118 +0,0 @@ -/* - * Derived from einaros's Sons of Obsidian theme at - * http://studiostyl.es/schemes/son-of-obsidian by - * Alex Ford of CodeTunnel: - * http://CodeTunnel.com/blog/post/71/google-code-prettify-obsidian-theme - */ - - .str - { - color: #EC7600; - } - .kwd - { - color: #93C763; - } - .com - { - color: #66747B; - } - .typ - { - color: #678CB1; - } - .lit - { - color: #FACD22; - } - .pun - { - color: #F1F2F3; - } - .pln - { - color: #F1F2F3; - } - .tag - { - color: #8AC763; - } - .atn - { - color: #E0E2E4; - } - .atv - { - color: #EC7600; - } - .dec - { - color: purple; - } - pre.prettyprint - { - border: 0px solid #888; - } - ol.linenums - { - margin-top: 0; - margin-bottom: 0; - } - .prettyprint { - background: #000; - } - li.L0, li.L1, li.L2, li.L3, li.L4, li.L5, li.L6, li.L7, li.L8, li.L9 - { - color: #555; - list-style-type: decimal; - } - li.L1, li.L3, li.L5, li.L7, li.L9 { - background: #111; - } - @media print - { - .str - { - color: #060; - } - .kwd - { - color: #006; - font-weight: bold; - } - .com - { - color: #600; - font-style: italic; - } - .typ - { - color: #404; - font-weight: bold; - } - .lit - { - color: #044; - } - .pun - { - color: #440; - } - .pln - { - color: #000; - } - .tag - { - color: #006; - font-weight: bold; - } - .atn - { - color: #404; - } - .atv - { - color: #060; - } - } diff --git a/assets/css/_common/_section/footer.scss b/assets/css/_common/_section/footer.scss deleted file mode 100644 index 03282195..00000000 --- a/assets/css/_common/_section/footer.scss +++ /dev/null @@ -1,49 +0,0 @@ - /**Footer**/ - - .copyright { - font-size: 14px; - } - - #dynamic-to-top { - display: none; - overflow: hidden; - width: auto; - z-index: 90; - position: fixed; - bottom: 2em; - right: 2em; - top: auto; - left: auto; - font-family: sans-serif; - font-size: 1em; - color: #fff; - text-decoration: none; - text-shadow: 0 1px 0 #333; - font-weight: bold; - padding: 17px 16px; - border: 1px solid $light-border-color; - background: #222; - &:hover { - background: #000; - cursor: pointer; - } - &:active { - background: #000; - outline: none; - } - outline: none; - &:focus, &:hover { - outline: none; - } - span { - display: block; - overflow: hidden; - width: 14px; - height: 12px; - background: url('data:image/png;base64,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') no-repeat center center; - } - - .dark-theme &{ - border: 1px solid $dark-border-color; - } - } \ No newline at end of file diff --git a/assets/css/_common/_section/navbar.scss b/assets/css/_common/_section/navbar.scss deleted file mode 100644 index 0e33d8de..00000000 --- a/assets/css/_common/_section/navbar.scss +++ /dev/null @@ -1,30 +0,0 @@ - - - - .header-logo a{ - padding: 0 ; - - i{ - line-height: 2em; - } - } - - - .navbar .menu a { - - padding: 0 8px; - } - - .navbar .menu .active{ - font-weight: 900; - color: $light-navbar-active-color; - - .dark-theme &{ - color: $dark-navbar-active-color; - } - } - - .navbar-header a:hover, .navbar .menu a:hover { - - background-color: transparent; - } diff --git a/assets/css/_common/_section/pagination.scss b/assets/css/_common/_section/pagination.scss deleted file mode 100644 index 2b386ed1..00000000 --- a/assets/css/_common/_section/pagination.scss +++ /dev/null @@ -1,83 +0,0 @@ - /** pagination **/ - - .pagination { - display: flex; - flex-direction: row; - justify-content: center; - list-style: none; - white-space: nowrap; - width: 100%; - padding-top: 2em; - a { - -webkit-font-smoothing: antialiased; - font-size: 12px; - color: #bfbfbf; - letter-spacing: 0.1em; - font-weight: 700; - padding: 5px 5px; - text-decoration: none; - transition: 0.3s; - } - li { - padding-bottom: 3px; - margin: 0 20px; - box-sizing: border-box; - position: relative; - display: inline; - &.disabled { - display: none; - } - &:hover a { - color: $light-pagination-link-active-color; - } - - .dark-theme &:hover a { - color: $dark-pagination-link-active-color; - } - - &:before, - &:after { - position: absolute; - content: ""; - width: 0; - height: 3px; - background: $light-pagination-link-active-color; - transition: 0.3s; - bottom: 0px; - } - .dark-theme &:before, - .dark-theme &:after{ - background: $dark-pagination-link-active-color; - } - - &:before .active, - &:after .active { - width: 100%; - } - &:before { - left: 50%; - } - &:after { - right: 50%; - } - &:hover { - &:before, - &:after { - width: 50%; - } - } - &.active { - a { - color: $light-pagination-link-active-color; - } - - .dark-theme & a { - color: $dark-pagination-link-active-color; - } - &:before, - &:after { - width: 60%; - } - } - } - } \ No newline at end of file diff --git a/assets/css/_core/base.scss b/assets/css/_core/base.scss new file mode 100644 index 00000000..b2b4755a --- /dev/null +++ b/assets/css/_core/base.scss @@ -0,0 +1,129 @@ +/** Font **/ +/* Lato */ +@import url(https://fonts.googleapis.com/css?family=Lato:100,300,400,700,900); + +/* Montserrat */ +@import url(https://fonts.googleapis.com/css?family=Montserrat:400,500,600,700,800); + +/* Roboto */ +@import url(https://fonts.googleapis.com/css?family=Roboto:400,900); + +html { + &::-webkit-scrollbar { + width: 8px; + height: 8px; + } + &::-webkit-scrollbar-thumb { + height: 40px; + background-color: #eee; + border-radius: 16px; + &:hover { + background-color: #ddd; + } + } +} + +::selection { + background: rgba(0, 149, 255, 0.1); +} + +html { + font-family: "Roboto", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "PingFang SC", "Hiragino Sans GB", STHeiti, "Microsoft Yahei", "WenQuanYi Micro Hei", Arial, Verdana, sans-serif; +} + +body { + font-size: 11pt; + font-weight: 400; + line-height: 2em; + background-color: $light-background-color; + color: $light-font-color; + &:before { + content: ""; + background-repeat: no-repeat; + background-position: center; + opacity: 0.05; + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + z-index: -1; + -webkit-filter: grayscale(100%); + -moz-filter: grayscale(100%); + -ms-filter: grayscale(100%); + -o-filter: grayscale(100%); + filter: grayscale(100%); + filter: gray; + } + + &.dark-theme { + background-color: $dark-background-color; + color: $dark-font-color; + } +} + +a { + color: $light-global-link-color; + text-decoration: none; + transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease, opacity 0.2s ease; + &:hover { + color: $light-global-link-hover-color; + text-decoration: none; + transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease, opacity 0.2s ease; + } + + .dark-theme & { + color: $dark-global-link-color; + text-decoration: none; + transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease, opacity 0.2s ease; + + &:hover { + color: $dark-global-link-hover-color; + text-decoration: none; + transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease, opacity 0.2s ease; + } + } +} + +blockquote { + font-size: 1rem; + display: block; + border-width: 1px 0; + border-style: solid; + border-color: $light-border-color; + padding: 1.5em 1.2em 0.5em 1.2em; + margin: 0 0 2em 0; + position: relative; + + &:before { + content: '\201C'; + position: absolute; + top: 0em; + left: 50%; + transform: translate(-50%, -50%); + width: 3rem; + height: 2rem; + font: 6em/1.08em 'PT Sans', sans-serif; + color: $light-post-link-color; + text-align: center; + + .dark-theme & { + color: $dark-post-link-color; + } + } + &:after { + content: "#blockquote" attr(cite); + display: block; + text-align: right; + font-size: 0.875em; + color: $light-post-link-color; + + .dark-theme & { + color: $dark-post-link-color; + } + } + + .dark-theme & { + border-color: $dark-border-color; + } +} diff --git a/assets/css/_core/layout.scss b/assets/css/_core/layout.scss new file mode 100644 index 00000000..6996b9a2 --- /dev/null +++ b/assets/css/_core/layout.scss @@ -0,0 +1,44 @@ + /** Layout **/ + +.wrapper { + display: flex; + flex-direction: column; + min-height: 100vh; + width: 100%; +} + +.navbar { + height: 4rem; + line-height: 4rem; + width: 100%; + .container { + width: auto; + max-width: 1200px; + text-align: center; + margin: 0 auto; + display: flex; + justify-content: space-between; + } +} + +.main { + flex: 1 0 auto; +} +.container{ + padding-left: 1em; + padding-right: 1em; +} + +.footer { + height: 4rem; + width: 100%; + text-align: center; + line-height: 4rem; + padding-top: 2em; +} + +.notfound { + font-size: 2em; + transform: translateY(35vh); + text-align: center; +} \ No newline at end of file diff --git a/assets/css/_core/media.scss b/assets/css/_core/media.scss new file mode 100644 index 00000000..756a6dd9 --- /dev/null +++ b/assets/css/_core/media.scss @@ -0,0 +1,159 @@ +@media only screen and (min-device-width: 320px) and (max-device-width: 480px) { + .navbar { + display: none; + } + + .navbar-mobile { + display: block !important; + position: fixed; + width: 100%; + z-index: 100; + transition: all 0.6s ease 0s; + + .container { + padding: 0; + margin: 0; + height: 5em; + line-height: 5.5em; + background: $light-background-color; + + .navbar-header { + display: flex; + justify-content: space-between; + align-items: center; + width: 100%; + padding-right: 1em; + padding-left: 1em; + box-sizing: border-box; + + .menu-toggle { + cursor: pointer; + line-height: 5.5em; + + span { + display: block; + background: #000; + width: 36px; + height: 2px; + -webkit-border-radius: 3px; + -moz-border-radius: 3px; + border-radius: 3px; + -webkit-transition: .25s margin .25s, .25s transform; + -moz-transition: .25s margin .25s, .25s transform; + transition: .25s margin .25s, .25s transform; + + .dark-theme & { + background: $dark-font-color; + } + } + + span:nth-child(1) { + margin-bottom: 8px; + } + + span:nth-child(3) { + margin-top: 8px; + } + + &.active { + span { + -webkit-transition: .25s margin, .25s transform .25s; + -moz-transition: .25s margin, .25s transform .25s; + transition: .25s margin, .25s transform .25s; + } + + span:nth-child(1) { + -moz-transform: rotate(45deg) translate(4px, 6px); + -ms-transform: rotate(45deg) translate(4px, 6px); + -webkit-transform: rotate(45deg) translate(4px, 6px); + transform: rotate(45deg) translate(4px, 6px); + } + + span:nth-child(2) { + opacity: 0 + } + + span:nth-child(3) { + -moz-transform: rotate(-45deg) translate(8px, -10px); + -ms-transform: rotate(-45deg) translate(8px, -10px); + -webkit-transform: rotate(-45deg) translate(8px, -10px); + transform: rotate(-45deg) translate(8px, -10px); + } + } + } + } + + .menu { + text-align: center; + background: #ffffff; + border-top: 2px solid #000000; + padding-top: 1em; + padding-bottom: 1em; + display: none; + box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1), 0px 4px 8px rgba(0, 0, 0, 0.1); + + a { + display: block; + line-height: 2.5em; + } + + &.active { + display: block; + } + + .dark-theme & { + background: $dark-background-color; + border-top: 2px solid $dark-font-secondary-color; + } + } + + .dark-theme & { + background: $dark-background-color !important; + } + } + } + + #dynamic-to-top { + display: none !important; + } + + .footer { + height: 3rem; + width: 100%; + text-align: center; + line-height: 1.5rem; + padding-top: 2em; + } + + .post-warp { + padding-top: 6em; + + .archive-item-date { + display: none; + } + + .categories-card { + .card-item { + width: 95%; + } + } + } +} + +/* iPads (portrait and landscape) ----------- */ + +@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {} + +/* Desktops and laptops ----------- */ + +@media only screen and (min-width: 1224px) { + .navbar-mobile { + display: none; + } +} + +/* Large screens ----------- */ + +@media only screen and (min-width: 1824px) { + /* Styles */ +} diff --git a/assets/css/_core/normalize.scss b/assets/css/_core/normalize.scss new file mode 100644 index 00000000..1ca48ae0 --- /dev/null +++ b/assets/css/_core/normalize.scss @@ -0,0 +1,355 @@ +/*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */ + +/* Document + ========================================================================== */ + +/** + * 1. Correct the line height in all browsers. + * 2. Prevent adjustments of font size after orientation changes in iOS. + */ + @charset "UTF-8"; + html { + line-height: 1.15; /* 1 */ + -webkit-text-size-adjust: 100%; /* 2 */ + } + +/* Sections + ========================================================================== */ + +/** +* Remove the margin in all browsers. +*/ + +html, +body, +main, +div, +span, +a, +li, +ul, +hr, +h1, +h2, +h3, +h4 { + padding: 0; + margin: 0; +} +/** +* Correct the font size and margin on `h1` elements within `section` and +* `article` contexts in Chrome, Firefox, and Safari. +*/ + +h1 { + font-size: 2em; + margin: 0.67em 0; +} + +/* Grouping content + ========================================================================== */ + +/** +* 1. Add the correct box sizing in Firefox. +* 2. Show the overflow in Edge and IE. +*/ + +hr { + box-sizing: content-box; /* 1 */ + height: 0; /* 1 */ + overflow: visible; /* 2 */ +} + +/** +* 1. Correct the inheritance and scaling of font size in all browsers. +* 2. Correct the odd `em` font sizing in all browsers. +*/ + +pre { + font-family: monospace, monospace; /* 1 */ + font-size: 1em; /* 2 */ +} + +/* Text-level semantics + ========================================================================== */ + +/** +* Remove the gray background on active links in IE 10. +*/ + +a { + background-color: transparent; +} + +/** +* 1. Remove the bottom border in Chrome 57- +* 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. +*/ + +abbr[title] { + border-bottom: none; /* 1 */ + text-decoration: underline; /* 2 */ + text-decoration: underline dotted; /* 2 */ +} + +/** +* Add the correct font weight in Chrome, Edge, and Safari. +*/ + +b, +strong { + font-weight: bolder; +} + +/** +* 1. Correct the inheritance and scaling of font size in all browsers. +* 2. Correct the odd `em` font sizing in all browsers. +*/ + +code, +kbd, +samp { + font-family: monospace, monospace; /* 1 */ + font-size: 1em; /* 2 */ +} + +/** +* Add the correct font size in all browsers. +*/ + +small { + font-size: 80%; +} + +/** +* Prevent `sub` and `sup` elements from affecting the line height in +* all browsers. +*/ + +sub, +sup { + font-size: 75%; + line-height: 0; + position: relative; + vertical-align: baseline; +} + +sub { + bottom: -0.25em; +} + +sup { + top: -0.5em; +} + +/* Embedded content + ========================================================================== */ + +/** +* Remove the border on images inside links in IE 10. +*/ + +img { + border-style: none; +} + +/* Forms + ========================================================================== */ + +/** +* 1. Change the font styles in all browsers. +* 2. Remove the margin in Firefox and Safari. +*/ + +button, +input, +optgroup, +select, +textarea { + font-family: inherit; /* 1 */ + font-size: 100%; /* 1 */ + line-height: 1.15; /* 1 */ + margin: 0; /* 2 */ +} + +/** +* Show the overflow in IE. +* 1. Show the overflow in Edge. +*/ + +button, +input { + /* 1 */ + overflow: visible; +} + +/** +* Remove the inheritance of text transform in Edge, Firefox, and IE. +* 1. Remove the inheritance of text transform in Firefox. +*/ + +button, +select { + /* 1 */ + text-transform: none; +} + +/** +* Correct the inability to style clickable types in iOS and Safari. +*/ + +button, +[type="button"], +[type="reset"], +[type="submit"] { + -webkit-appearance: button; +} + +/** +* Remove the inner border and padding in Firefox. +*/ + +button::-moz-focus-inner, +[type="button"]::-moz-focus-inner, +[type="reset"]::-moz-focus-inner, +[type="submit"]::-moz-focus-inner { + border-style: none; + padding: 0; +} + +/** +* Restore the focus styles unset by the previous rule. +*/ + +button:-moz-focusring, +[type="button"]:-moz-focusring, +[type="reset"]:-moz-focusring, +[type="submit"]:-moz-focusring { + outline: 1px dotted ButtonText; +} + +/** +* Correct the padding in Firefox. +*/ + +fieldset { + padding: 0.35em 0.75em 0.625em; +} + +/** +* 1. Correct the text wrapping in Edge and IE. +* 2. Correct the color inheritance from `fieldset` elements in IE. +* 3. Remove the padding so developers are not caught out when they zero out +* `fieldset` elements in all browsers. +*/ + +legend { + box-sizing: border-box; /* 1 */ + color: inherit; /* 2 */ + display: table; /* 1 */ + max-width: 100%; /* 1 */ + padding: 0; /* 3 */ + white-space: normal; /* 1 */ +} + +/** +* Add the correct vertical alignment in Chrome, Firefox, and Opera. +*/ + +progress { + vertical-align: baseline; +} + +/** +* Remove the default vertical scrollbar in IE 10+. +*/ + +textarea { + overflow: auto; +} + +/** +* 1. Add the correct box sizing in IE 10. +* 2. Remove the padding in IE 10. +*/ + +[type="checkbox"], +[type="radio"] { + box-sizing: border-box; /* 1 */ + padding: 0; /* 2 */ +} + +/** +* Correct the cursor style of increment and decrement buttons in Chrome. +*/ + +[type="number"]::-webkit-inner-spin-button, +[type="number"]::-webkit-outer-spin-button { + height: auto; +} + +/** +* 1. Correct the odd appearance in Chrome and Safari. +* 2. Correct the outline style in Safari. +*/ + +[type="search"] { + -webkit-appearance: textfield; /* 1 */ + outline-offset: -2px; /* 2 */ +} + +/** +* Remove the inner padding in Chrome and Safari on macOS. +*/ + +[type="search"]::-webkit-search-decoration { + -webkit-appearance: none; +} + +/** +* 1. Correct the inability to style clickable types in iOS and Safari. +* 2. Change font properties to `inherit` in Safari. +*/ + +::-webkit-file-upload-button { + -webkit-appearance: button; /* 1 */ + font: inherit; /* 2 */ +} + +/* Interactive + ========================================================================== */ + +/* +* Add the correct display in Edge, IE 10+, and Firefox. +*/ + +details { + display: block; +} + +/* +* Add the correct display in all browsers. +*/ + +summary { + display: list-item; +} + +/* Misc + ========================================================================== */ + +/** +* Add the correct display in IE 10+. +*/ + +template { + display: none; +} + +/** +* Add the correct display in IE 10. +*/ + +[hidden] { + display: none; +} diff --git a/assets/css/_iconfont.scss b/assets/css/_iconfont.scss new file mode 100644 index 00000000..833b6128 --- /dev/null +++ b/assets/css/_iconfont.scss @@ -0,0 +1,261 @@ +@font-face {font-family: "iconfont"; + src: url('../fonts/iconfont/iconfont.eot'); /* IE9 */ + src: url('../fonts/iconfont/iconfont.eot#iefix') format('embedded-opentype'), /* IE6-IE8 */ + url('../fonts/iconfont/iconfont.woff2') format('woff2'), + url('../fonts/iconfont/iconfont.woff') format('woff'), + url('../fonts/iconfont/iconfont.ttf') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+ */ + url('../fonts/iconfont/iconfont.svg#iconfont') format('svg'); /* iOS 4.1- */ +} + +.iconfont { + font-family: "iconfont" !important; + font-size: 16px; + font-style: normal; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +.icon-weibo:before { + content: "\e6c4"; +} + +.icon-codepen:before { + content: "\ea79"; +} + +.icon-spotify:before { + content: "\ebf4"; +} + +.icon-reddit:before { + content: "\e761"; +} + +.icon-dajiantou:before { + content: "\e642"; +} + +.icon-xiaojiantou:before { + content: "\e666"; +} + +.icon-deviantart:before { + content: "\e6c6"; +} + +.icon-dribbble:before { + content: "\e6d8"; +} + +.icon-zhihu:before { + content: "\e6ba"; +} + +.icon-wordpress:before { + content: "\e848"; +} + +.icon-twitter:before { + content: "\eb2a"; +} + +.icon-whatsapp:before { + content: "\eb92"; +} + +.icon-facebook:before { + content: "\e638"; +} + +.icon-gitlab:before { + content: "\e719"; +} + +.icon-medium:before { + content: "\e783"; +} + +.icon-steam:before { + content: "\e811"; +} + +.icon-jsfiddle:before { + content: "\e752"; +} + +.icon-soundcloud:before { + content: "\e81d"; +} + +.icon-ycombinator:before { + content: "\eb32"; +} + +.icon-linkedin:before { + content: "\e696"; +} + +.icon-pinterest:before { + content: "\e697"; +} + +.icon-500px:before { + content: "\e607"; +} + +.icon-bitbucket:before { + content: "\e645"; +} + +.icon-instagram:before { + content: "\e6b6"; +} + +.icon-slideshare:before { + content: "\e6fd"; +} + +.icon-twitch:before { + content: "\e72a"; +} + +.icon-vine:before { + content: "\e735"; +} + +.icon-xing:before { + content: "\e741"; +} + +.icon-snapchat:before { + content: "\e8b2"; +} + +.icon-douban:before { + content: "\e688"; +} + +.icon-github:before { + content: "\e691"; +} + +.icon-t:before { + content: "\e601"; +} + +.icon-mail:before { + content: "\e622"; +} + +.icon-behance:before { + content: "\e621"; +} + +.icon-POP_lastfm:before { + content: "\e681"; +} + +.icon-odnoklassniki:before { + content: "\e624"; +} + +.icon-strava:before { + content: "\e627"; +} + +.icon-goodreads:before { + content: "\e62a"; +} + +.icon-kickstarter:before { + content: "\e644"; +} + +.icon-bandcamp:before { + content: "\e64b"; +} + +.icon-flickr:before { + content: "\e660"; +} + +.icon-keybase:before { + content: "\e665"; +} + +.icon-paypal:before { + content: "\e667"; +} + +.icon-mastodon:before { + content: "\e94a"; +} + +.icon-folder:before { + content: "\e7d1"; +} + +.icon-skype:before { + content: "\e87d"; +} + +.icon-icon-tag:before { + content: "\e632"; +} + +.icon-sun:before { + content: "\e684"; +} + +.icon-timer:before { + content: "\e664"; +} + +.icon-researchgate:before { + content: "\e693"; +} + +.icon-angellist:before { + content: "\f163"; +} + +.icon-mix:before { + content: "\f1f5"; +} + +.icon-patreon:before { + content: "\f209"; +} + +.icon-quora:before { + content: "\f218"; +} + +.icon-stack-overflow:before { + content: "\f239"; +} + +.icon-telegram-plane:before { + content: "\f246"; +} + +.icon-tumblr:before { + content: "\f24a"; +} + +.icon-vk:before { + content: "\f25e"; +} + +.icon-youtube:before { + content: "\e765"; +} + +.icon-Googlescholar:before { + content: "\e736"; +} + +.icon-foursquare:before { + content: "\e8ed"; +} + diff --git a/assets/css/_page/home.scss b/assets/css/_page/home.scss new file mode 100644 index 00000000..67f3bee8 --- /dev/null +++ b/assets/css/_page/home.scss @@ -0,0 +1,58 @@ +/** Home **/ + +.intro { + transform: translateY(25vh); + text-align: center; + + .avatar { + padding: 10px; + + img { + width: 128px; + height: auto; + display: inline-block; + -webkit-border-radius: 100%; + border-radius: 100%; + -webkit-box-shadow: 0 0 0 0.3618em rgba(0, 0, 0, 0.05); + box-shadow: 0 0 0 0.3618em rgba(0, 0, 0, 0.05); + margin: 0 auto; + -webkit-transition: all ease 0.4s; + -moz-transition: all ease 0.4s; + -o-transition: all ease 0.4s; + transition: all ease 0.4s; + cursor: pointer; + + &:hover { + position: relative; + -webkit-transform: translateY(-0.75em); + -moz-transform: translateY(-0.75em); + -ms-transform: translateY(-0.75em); + -o-transform: translateY(-0.75em); + transform: translateY(-0.75em); + cursor: pointer; + } + } + } +} + +h2.description { + font-size: 1em; + font-weight: normal; + padding: 5px; +} + +.social-links { + a { + + padding: 0 5px; + + &:hover { + + background-color: transparent; + } + } + + .iconfont { + font-size: 2em; + } +} diff --git a/assets/css/_page/home_post.scss b/assets/css/_page/home_post.scss new file mode 100644 index 00000000..49ddd47a --- /dev/null +++ b/assets/css/_page/home_post.scss @@ -0,0 +1,65 @@ +.post-warp { + .intro { + transform: translateY(0); + margin: 2em 0 5em 0; + + .avatar { + img { + width: 96px; + } + } + } + + .post { + margin-bottom: 4em; + border-bottom: 1px dashed #ddd; + + .post-content { + padding-top: .5em; + } + + .post-footer { + display: flex; + justify-content: space-between; + align-items: center; + + .post-meta { + a { + color: rgba(85, 85, 85, 0.52941) !important; + + .dark-theme & { + color: $dark-font-secondary-color !important; + } + + &:hover { + color: $light-font-secondary-color !important; + + .dark-theme & { + color: $dark-font-secondary-color !important; + } + } + } + } + + .post-tags { + span { + a { + color: rgba(85, 85, 85, 0.52941) !important; + + .dark-theme & { + color: $dark-font-secondary-color !important; + } + + &:hover { + color: $light-font-secondary-color !important; + + .dark-theme & { + color: $dark-font-secondary-color !important; + } + } + } + } + } + } + } +} diff --git a/assets/css/_page/post.scss b/assets/css/_page/post.scss new file mode 100644 index 00000000..f325e921 --- /dev/null +++ b/assets/css/_page/post.scss @@ -0,0 +1,283 @@ +/** Post **/ + +.post-warp { + position: relative; + width: 100%; + max-width: 780px; + margin: 0 auto; + padding-top: 2rem; + + .post-header h1 { + margin: 0 !important; + } + + .post-title { + font-size: 2em; + line-height: 1.5em; + } + + .post-meta { + color: rgba(85, 85, 85, 0.52941) !important; + + .dark-theme & { + color: $dark-font-secondary-color !important; + } + + a { + color: $light-post-link-color; + + .dark-theme & { + color: $dark-post-link-color; + } + + &:hover { + color: $light-post-link-hover-color; + + .dark-theme & { + color: $dark-post-link-hover-color; + } + } + } + } + + .post-content { + padding-top: 1rem; + + h2, + h3, + h4, + h5, + h6 { + padding-top: .8em; + padding-bottom: .3em; + } + + h2::before { + content: "#"; + margin-right: 5px; + color: $light-post-link-color; + + .dark-theme & { + color: $dark-post-link-color; + } + } + + h3::before { + content: "|"; + margin-right: 5px; + color: $light-post-link-color; + + .dark-theme & { + color: $dark-post-link-color; + } + } + + a { + color: $light-post-link-color; + + .dark-theme & { + color: $dark-post-link-color; + } + } + + a:hover { + color: $light-post-link-hover-color; + + .dark-theme &:hover { + color: $dark-post-link-hover-color; + font-weight: bold; + text-decoration: underline; + } + } + + ul { + padding-left: 2em; + } + + table { + max-width: 100%; + margin: 10px 0; + border-spacing: 0; + box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.125); + + th, + td { + padding: 5px 15px; + border: 1px double #ebe9f5; + } + } + + figure { + text-align: center; + + img:hover { + cursor: zoom-in; + } + } + + .image-caption:not(:empty) { + min-width: 20%; + max-width: 80%; + display: inline-block; + padding: 10px; + margin: 0 auto; + border-bottom: 1px solid #d9d9d9; + font-size: 14px; + color: #969696; + line-height: 1.7; + } + + img { + display: block; + max-width: 80%; + height: auto; + margin: 0 auto; + overflow: hidden; + } + + img[data-action="zoom"] { + cursor: zoom-in; + } + + .featured_image { + width: 100% !important; + max-width: 100% !important; + height: auto !important; + margin: 0 !important; + } + + @import "../_partial/post/code.scss"; + + .typeit { + .code { + padding: 6px; + font-size: 14px; + font-family: Consolas, Monaco, Menlo, Consolas, monospace; + font-weight: bold; + word-break: break-all; + + .k { + color: #D371E3; + } + + .kt { + color: #D371E3; + } + + .kc { + color: #D371E3; + } + + .o { + color: #D371E3; + } + + .nf { + color: #F16473; + } + + .na { + color: #41B1F5; + } + + .s { + color: #8BC56F; + } + + .n { + color: #DB975C; + } + + .c1 { + color: #7E848F; + } + } + } + + .align-center { + text-align: center; + } + + .align-right { + text-align: right; + } + + .align-left { + text-align: left; + } + + .float-right { + float: right; + } + } + + p { + font-size: 1em; + margin: .5em 0 .5em 0; + } + + .post-copyright { + margin-top: 5rem; + border-top: 1px solid $light-border-color; + border-bottom: 1px solid $light-border-color; + + .copyright-item { + margin: 5px 0; + } + + .dark-theme & { + border-top: 1px solid $dark-border-color; + border-bottom: 1px solid $dark-border-color; + } + } + + .post-tags { + padding: 1rem 0 1rem; + display: flex; + justify-content: space-between; + + } + + .post-nav { + + &:before, + &:after { + content: " "; + display: table; + } + + & a.prev, + & a.next { + font-weight: 600; + font-size: 16px; + + transition-property: transform; + transition-timing-function: ease-out; + transition-duration: 0.3s; + } + + & a.prev { + float: left; + } + + & a.prev:hover { + transform: translateX(-4px); + } + + & a.next { + float: right; + } + + & a.next:hover { + transform: translateX(4px); + } + } + + .tag:not(:last-child) a::after { + content: " / "; + } + + .post-comment { + padding: 3em 0; + } +} diff --git a/assets/css/_page/tags.scss b/assets/css/_page/tags.scss new file mode 100644 index 00000000..960c781c --- /dev/null +++ b/assets/css/_page/tags.scss @@ -0,0 +1,32 @@ +.tag-cloud-tags { + margin: 10px 0; + + a { + display: inline-block; + position: relative; + margin: 5px 10px; + word-wrap: break-word; + transition-duration: .3s; + transition-property: transform; + transition-timing-function: ease-out; + + &:active, + &:focus, + &:hover { + color: $light-global-link-hover-color; + transform: scale(1.1); + + .dark-theme & { + color: $dark-global-link-hover-color; + } + } + + small { + color: $light-font-secondary-color; + + .dark-theme & { + color: $dark-global-link-hover-color; + } + } + } +} diff --git a/assets/css/_page/terms.scss b/assets/css/_page/terms.scss new file mode 100644 index 00000000..d0cd83e3 --- /dev/null +++ b/assets/css/_page/terms.scss @@ -0,0 +1,85 @@ +.post-warp { + + .archive-item { + margin-left: 2rem; + } + + .categories-card { + margin: 0 auto; + margin-top: 3em; + display: flex; + align-items: center; + justify-content: space-between; + flex-direction: row; + flex-wrap: wrap; + padding: 0 2.5em; + line-height: 1.6em; + + .card-item { + font-size: 14px; + text-align: left; + width: 45%; + display: flex; + align-items: flex-start; + margin-top: 2em; + min-height: 16em; + padding: 0 2%; + position: relative; + + .categories { + overflow: hidden; + } + } + } + + .archive-item-link { + display: inline-block; + text-decoration: none; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + max-width: 95%; + + &:hover { + color: $light-global-link-hover-color; + background-color: transparent; + } + + .dark-theme & { + color: $dark-global-link-color; + text-decoration: none; + transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease, opacity 0.2s ease; + + &:hover { + color: $dark-global-link-hover-color; + text-decoration: none; + transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease, opacity 0.2s ease; + } + } + } + + .archive-item-date { + float: right; + text-align: right; + color: $light-font-secondary-color; + + .dark-theme & { + color: $dark-font-secondary-color; + } + } + + .more-post { + text-align: right; + } +} + +.categories { + h3 { + display: inline-block; + } + + span { + float: right; + padding-right: 1em; + } +} diff --git a/assets/css/_partial/footer.scss b/assets/css/_partial/footer.scss new file mode 100644 index 00000000..3654ae06 --- /dev/null +++ b/assets/css/_partial/footer.scss @@ -0,0 +1,49 @@ +/**Footer**/ + +.copyright { + font-size: 14px; +} + +#dynamic-to-top { + display: none; + overflow: hidden; + width: auto; + z-index: 90; + position: fixed; + bottom: 2em; + right: 2em; + top: auto; + left: auto; + font-family: sans-serif; + font-size: 1em; + color: #fff; + text-decoration: none; + text-shadow: 0 1px 0 #333; + font-weight: bold; + padding: 17px 16px; + border: 1px solid $light-border-color; + background: #222; + &:hover { + background: #000; + cursor: pointer; + } + &:active { + background: #000; + outline: none; + } + outline: none; + &:focus, &:hover { + outline: none; + } + span { + display: block; + overflow: hidden; + width: 14px; + height: 12px; + background: url('data:image/png;base64,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') no-repeat center center; + } + + .dark-theme &{ + border: 1px solid $dark-border-color; + } +} diff --git a/assets/css/_partial/navbar.scss b/assets/css/_partial/navbar.scss new file mode 100644 index 00000000..1e915590 --- /dev/null +++ b/assets/css/_partial/navbar.scss @@ -0,0 +1,28 @@ +.header-logo a { + padding: 0; + + i { + line-height: 2em; + } +} + + +.navbar .menu a { + + padding: 0 8px; +} + +.navbar .menu .active { + font-weight: 900; + color: $light-navbar-active-color; + + .dark-theme & { + color: $dark-navbar-active-color; + } +} + +.navbar-header a:hover, +.navbar .menu a:hover { + + background-color: transparent; +} diff --git a/assets/css/_partial/pagination.scss b/assets/css/_partial/pagination.scss new file mode 100644 index 00000000..af94cbaf --- /dev/null +++ b/assets/css/_partial/pagination.scss @@ -0,0 +1,94 @@ + /** pagination **/ + +.pagination { + display: flex; + flex-direction: row; + justify-content: center; + list-style: none; + white-space: nowrap; + width: 100%; + padding-top: 2em; + + a { + -webkit-font-smoothing: antialiased; + font-size: 12px; + color: #bfbfbf; + letter-spacing: 0.1em; + font-weight: 700; + padding: 5px 5px; + text-decoration: none; + transition: 0.3s; + } + + li { + padding-bottom: 3px; + margin: 0 20px; + box-sizing: border-box; + position: relative; + display: inline; + + &.disabled { + display: none; + } + + &:hover a { + color: $light-pagination-link-active-color; + } + + .dark-theme &:hover a { + color: $dark-pagination-link-active-color; + } + + &:before, + &:after { + position: absolute; + content: ""; + width: 0; + height: 3px; + background: $light-pagination-link-active-color; + transition: 0.3s; + bottom: 0px; + } + + .dark-theme &:before, + .dark-theme &:after { + background: $dark-pagination-link-active-color; + } + + &:before .active, + &:after .active { + width: 100%; + } + + &:before { + left: 50%; + } + + &:after { + right: 50%; + } + + &:hover { + + &:before, + &:after { + width: 50%; + } + } + + &.active { + a { + color: $light-pagination-link-active-color; + } + + .dark-theme & a { + color: $dark-pagination-link-active-color; + } + + &:before, + &:after { + width: 60%; + } + } + } +} diff --git a/assets/css/_partial/post/code.scss b/assets/css/_partial/post/code.scss new file mode 100644 index 00000000..7d2f0887 --- /dev/null +++ b/assets/css/_partial/post/code.scss @@ -0,0 +1,244 @@ +code, +pre { + padding: 7px; + font-size: $code-font-size; + font-family: $code-font-family; + background: $l-code-background; + + .dark-theme & { + background: $d-code-background; + } +} + +code { + padding: 3px 5px; + border-radius: 4px; + color: $l-code-color; + background: $l-code-background; + + .dark-theme & { + color: $d-code-color; + background: $d-code-background; + } +} + +p > code { + background: darken($l-code-background, 3%); + + .dark-theme & { + color: $d-code-color; + background: darken($d-code-background, 3%); + } +} + +// chroma +.highlight > .chroma { + margin: 1em 0; + border-radius: 5px; + overflow-x: auto; + box-shadow: 1px 1px 2px rgba(0,0,0,0.125); + position: relative; + background: $l-code-background; + + code { + padding: 0; + } + + table { + position: relative; + + &::after { + position: absolute; + top: 0; + right: 0; + left: 0; + padding: 2px 7px; + font-size: $code-font-size; + font-weight: bold; + color: darken($gray, 10%); + background: darken($l-code-background, 3%); + content: 'Code'; + + .dark-theme & { + background: darken($d-code-background, 3%); + } + } + } + + @each $sign, $text in $code-type-list { + &.#{$sign} > table::after { + content: $text; + } + } + + .lntd { + // Fix code block null line height and + // Synchronous gutter and code line highly. + line-height: round($code-font-size * 1.5); + + &:first-child { + width: 10px; + + pre { + margin: 0; + padding: 40px 7px 10px; + } + } + + &:last-child { + vertical-align: top; + + pre { + margin: 0; + padding: 40px 10px 10px; + } + } + } + + table, tr, td { + margin: 0; + padding: 0; + width: 100%; + border-collapse: collapse; + border-color: $l-code-background; + + .dark-theme & { + border-color: $d-code-background; + } + } + + /* LineNumbersTable */ .lnt { color: $gray; } + /* LineHighlight */ .hl { display: block; width: 100%; background-color: #ffffcc } + /* P */ .chroma .p { color: #A9A9B3 } + + /* Keyword */ .k { color: #859900 } + /* KeywordConstant */ .kc { color: #859900; font-weight: bold } + /* KeywordDeclaration */ .kd { color: #859900 } + /* KeywordNamespace */ .kn { color: #dc322f; font-weight: bold } + /* KeywordPseudo */ .kp { color: #859900 } + /* KeywordReserved */ .kr { color: #859900 } + /* KeywordType */ .kt { color: #859900; font-weight: bold } + /* Name */ .n { color: #268bd2 } + /* NameAttribute */ .na { color: #268bd2 } + /* NameBuiltin */ .nb { color: #cb4b16 } + /* NameBuiltinPseudo */ .bp { color: #268bd2 } + /* NameClass */ .nc { color: #cb4b16 } + /* NameConstant */ .no { color: #268bd2 } + /* NameDecorator */ .nd { color: #268bd2 } + /* NameEntity */ .ni { color: #268bd2 } + /* NameException */ .ne { color: #268bd2 } + /* NameFunction */ .nf { color: #268bd2 } + /* NameFunctionMagic */ .fm { color: #268bd2 } + /* NameLabel */ .nl { color: #268bd2 } + /* NameNamespace */ .nn { color: #268bd2 } + /* NameOther */ .nx { color: #268bd2 } + /* NameProperty */ .py { color: #268bd2 } + /* NameTag */ .nt { color: #268bd2; font-weight: bold } + /* NameVariable */ .nv { color: #268bd2 } + /* NameVariableClass */ .vc { color: #268bd2 } + /* NameVariableGlobal */ .vg { color: #268bd2 } + /* NameVariableInstance */ .vi { color: #268bd2 } + /* NameVariableMagic */ .vm { color: #268bd2 } + /* Literal */ .l { color: #2aa198 } + /* LiteralDate */ .ld { color: #2aa198 } + /* LiteralString */ .s { color: #2aa198 } + /* LiteralStringAffix */ .sa { color: #2aa198 } + /* LiteralStringBacktick */ .sb { color: #2aa198 } + /* LiteralStringChar */ .sc { color: #2aa198 } + /* LiteralStringDelimiter */ .dl { color: #2aa198 } + /* LiteralStringDoc */ .sd { color: #2aa198 } + /* LiteralStringDouble */ .s2 { color: #2aa198 } + /* LiteralStringEscape */ .se { color: #2aa198 } + /* LiteralStringHeredoc */ .sh { color: #2aa198 } + /* LiteralStringInterpol */ .si { color: #2aa198 } + /* LiteralStringOther */ .sx { color: #2aa198 } + /* LiteralStringRegex */ .sr { color: #2aa198 } + /* LiteralStringSingle */ .s1 { color: #2aa198 } + /* LiteralStringSymbol */ .ss { color: #2aa198 } + /* LiteralNumber */ .m { color: #2aa198; font-weight: bold } + /* LiteralNumberBin */ .mb { color: #2aa198; font-weight: bold } + /* LiteralNumberFloat */ .mf { color: #2aa198; font-weight: bold } + /* LiteralNumberHex */ .mh { color: #2aa198; font-weight: bold } + /* LiteralNumberInteger */ .mi { color: #2aa198; font-weight: bold } + /* LiteralNumberIntegerLong */ .il { color: #2aa198; font-weight: bold } + /* LiteralNumberOct */ .mo { color: #2aa198; font-weight: bold } + /* OperatorWord */ .ow { color: #859900 } + /* Comment */ .c { color: #93a1a1; font-style: italic } + /* CommentHashbang */ .ch { color: #93a1a1; font-style: italic } + /* CommentMultiline */ .cm { color: #93a1a1; font-style: italic } + /* CommentSingle */ .c1 { color: #93a1a1; font-style: italic } + /* CommentSpecial */ .cs { color: #93a1a1; font-style: italic } + /* CommentPreproc */ .cp { color: #93a1a1; font-style: italic } + /* CommentPreprocFile */ .cpf { color: #93a1a1; font-style: italic } + /* Generic */ .g { color: #d33682 } + /* GenericDeleted */ .gd { color: #b58900 } + /* GenericEmph */ .ge { color: #d33682 } + /* GenericError */ .gr { color: #d33682 } + /* GenericHeading */ .gh { color: #d33682 } + /* GenericInserted */ .gi { color: #859900 } + /* GenericOutput */ .go { color: #d33682 } + /* GenericPrompt */ .gp { color: #d33682 } + /* GenericStrong */ .gs { color: #d33682 } + /* GenericSubheading */ .gu { color: #d33682 } + /* GenericTraceback */ .gt { color: #d33682 } + + .dark-theme & { + background: $d-code-background; + + /* Keyword */ .chroma .k { color: #D371E3 } + /* KeywordConstant */ .chroma .kc { color: #D371E3 } + /* KeywordDeclaration */ .chroma .kd { color: #D371E3 } + /* KeywordNamespace */ .chroma .kn { color: #D371E3 } + /* KeywordPseudo */ .chroma .kp { color: #D371E3 } + /* KeywordReserved */ .chroma .kr { color: #D371E3 } + /* KeywordType */ .chroma .kt { color: #8be9fd } + /* NameAttribute */ .chroma .na { color: #41B1F5 } + /* NameBuiltin */ .chroma .nb { color: #8be9fd; font-style: italic } + /* NameClass */ .chroma .nc { color: #E5BF78 } + /* NameFunction */ .chroma .nf { color: #19B8C0 } + /* NameX */ .chroma .nx { color: #F16473 } + /* NameLabel */ .chroma .nl { color: #8be9fd; font-style: italic } + /* NameTag */ .chroma .nt { color: #D371E3 } + /* NameVariable */ .chroma .nv { color: #8be9fd; font-style: italic } + /* NameVariableClass */ .chroma .vc { color: #8be9fd; font-style: italic } + /* NameVariableGlobal */ .chroma .vg { color: #8be9fd; font-style: italic } + /* NameVariableInstance */ .chroma .vi { color: #8be9fd; font-style: italic } + /* LiteralString */ .chroma .s { color: #8BC56F } + /* LiteralStringAffix */ .chroma .sa { color: #8BC56F } + /* LiteralStringBacktick */ .chroma .sb { color: #8BC56F } + /* LiteralStringChar */ .chroma .sc { color: #8BC56F } + /* LiteralStringDelimiter */ .chroma .dl { color: #8BC56F } + /* LiteralStringDoc */ .chroma .sd { color: #8BC56F } + /* LiteralStringDouble */ .chroma .s2 { color: #8BC56F } + /* LiteralStringEscape */ .chroma .se { color: #8BC56F } + /* LiteralStringHeredoc */ .chroma .sh { color: #8BC56F } + /* LiteralStringInterpol */ .chroma .si { color: #8BC56F } + /* LiteralStringOther */ .chroma .sx { color: #8BC56F } + /* LiteralStringRegex */ .chroma .sr { color: #8BC56F } + /* LiteralStringSingle */ .chroma .s1 { color: #8BC56F } + /* LiteralStringSymbol */ .chroma .ss { color: #8BC56F } + /* LiteralNumber */ .chroma .m { color: #bd93f9 } + /* LiteralNumberBin */ .chroma .mb { color: #bd93f9 } + /* LiteralNumberFloat */ .chroma .mf { color: #bd93f9 } + /* LiteralNumberHex */ .chroma .mh { color: #bd93f9 } + /* LiteralNumberInteger */ .chroma .mi { color: #bd93f9 } + /* LiteralNumberIntegerLong */ .chroma .il { color: #bd93f9 } + /* LiteralNumberOct */ .chroma .mo { color: #bd93f9 } + /* Operator */ .chroma .o { color: #D371E3 } + /* OperatorWord */ .chroma .ow { color: #D371E3 } + /* Comment */ .chroma .c { color: #7E848F } + /* CommentHashbang */ .chroma .ch { color: #7E848F } + /* CommentMultiline */ .chroma .cm { color: #7E848F } + /* CommentSingle */ .chroma .c1 { color: #7E848F } + /* CommentSpecial */ .chroma .cs { color: #7E848F } + /* CommentPreproc */ .chroma .cp { color: #D371E3 } + /* CommentPreprocFile */ .chroma .cpf { color: #D371E3 } + /* GenericDeleted */ .chroma .gd { color: #8b080b } + /* GenericEmph */ .chroma .ge { text-decoration: underline } + /* GenericHeading */ .chroma .gh { font-weight: bold } + /* GenericInserted */ .chroma .gi { font-weight: bold } + /* GenericOutput */ .chroma .go { color: #44475a } + /* GenericSubheading */ .chroma .gu { font-weight: bold } + /* GenericUnderline */ .chroma .gl { text-decoration: underline } + } +} diff --git a/assets/css/_variables.scss b/assets/css/_variables.scss new file mode 100644 index 00000000..06938d91 --- /dev/null +++ b/assets/css/_variables.scss @@ -0,0 +1,122 @@ +/** light theme **/ + +$light-background-color: #fff; + +$light-font-color: #161209; +$light-font-secondary-color: #a9a9b3; + +$light-navbar-active-color: #161209; + +$light-global-link-color: #161209; +$light-global-link-hover-color:#2d96bd; + +$light-post-link-color: #2d96bd; +$light-post-link-hover-color:#ef3982; + +$light-pagination-link-color : #2d96bd; +$light-pagination-link-active-color: #000; + +$light-border-color: #dcdcdc; + +/** dark theme **/ + +$dark-background-color: #292a2d; + +$dark-font-color: #a9a9b3; +$dark-font-secondary-color: #87878d; + +$dark-navbar-active-color: #fff; + +$dark-global-link-color: #a9a9b3; +$dark-global-link-hover-color:#fff; + +$dark-post-link-color: #eee; +$dark-post-link-hover-color:#fff; + +$dark-pagination-link-color : #a9a9b3; +$dark-pagination-link-active-color: #fff; + +$dark-border-color: #4a4b50; + +// ========== Color ========== // +$black: #0a0a0a !default; +$white: #fefefe !default; +$light-gray: #e6e6e6 !default; +$gray: #cacaca !default; +$dark-gray: #8a8a8a !default; + +// ========== Code ========== // +// Color of the code. +$l-code-color: #E74C3C !default; +$d-code-color: #E5BF78 !default; + +// Font size of code. +$code-font-size: 13px !default; + +// Font family of the code. +$code-font-family: Consolas, Monaco, Menlo, "DejaVu Sans Mono", + "Bitstream Vera Sans Mono", "Courier New", monospace !default; + +// Color of code highlight, solarized. +$code-highlight-color: ( + comment: #93a1a1, + keyword: #859900, + number: #2aa198, + title: #268bd2, + attribute: #b58900, + symbol: #cb4b16, + built_in: #dc322f, + formula: #eee8d5 +) !default; + +// Code type list. +$code-type-list: ( + // Custom code type + language-bash: "Bash", + language-c: "C", + language-cs: "C#", + language-cpp: "C++", + language-css: "CSS", + language-coffeescript: "CoffeeScript", + language-html: "HTML", + language-xml: "XML", + language-http: "HTTP", + language-json: "JSON", + language-java: "Java", + language-js: "JavaScript", + language-javascript: "JavaScript", + language-makefile: "Makefile", + language-markdown: "Markdown", + language-objectivec: "Objective-C", + language-php: "PHP", + language-perl: "Perl", + language-python: "Python", + language-ruby: "Ruby", + language-sql: "SQL", + language-shell: "Shell", + + language-erlang: "Erlang", + language-go: "Go", + language-go-html-template: "Go HTML Template", + language-groovy: "Groovy", + language-haskell: "Haskell", + language-kotlin: "Kotlin", + language-clojure: "Clojure", + language-less: "Less", + language-lisp: "Lisp", + language-lua: "Lua", + language-matlab: "Matlab", + language-rust: "Rust", + language-scss: "Scss", + language-scala: "Scala", + language-swift: "Swift", + language-typescript: "TypeScript", + language-yml: "YAML", + language-yaml: "YAML", + language-toml: "TOML", + language-diff: "Diff" +) !default; + +// Color of the code background. +$l-code-background: #F8F5EC !default; +$d-code-background: #272C34 !default; diff --git a/assets/css/_variables/default.scss b/assets/css/_variables/default.scss deleted file mode 100644 index c55151b6..00000000 --- a/assets/css/_variables/default.scss +++ /dev/null @@ -1,41 +0,0 @@ -/** light theme **/ - -$light-background-color: #fff; - -$light-font-color: #161209; -$light-font-secondary-color: #a9a9b3; - -$light-navbar-active-color: #161209; - -$light-global-link-color: #161209; -$light-global-link-hover-color:#2d96bd; - -$light-post-link-color: #2d96bd; -$light-post-link-hover-color:#ef3982; - -$light-pagination-link-color : #2d96bd; -$light-pagination-link-active-color: #000; - -$light-border-color: #dcdcdc; - - - -/** dark theme **/ - -$dark-background-color: #292a2d; - -$dark-font-color: #a9a9b3; -$dark-font-secondary-color: #87878d; - -$dark-navbar-active-color: #fff; - -$dark-global-link-color: #a9a9b3; -$dark-global-link-hover-color:#fff; - -$dark-post-link-color: #eee; -$dark-post-link-hover-color:#fff; - -$dark-pagination-link-color : #a9a9b3; -$dark-pagination-link-active-color: #fff; - -$dark-border-color: #4a4b50; \ No newline at end of file diff --git a/assets/css/main.scss b/assets/css/main.scss deleted file mode 100644 index aaf188f3..00000000 --- a/assets/css/main.scss +++ /dev/null @@ -1,23 +0,0 @@ -@import "_variables/default.scss"; - -@import "_common/_core/normalize.scss"; -@import "_common/_core/base.scss"; -@import "_common/_core/layout.scss"; - - -@import "_common/_page/home.scss"; -@import "_common/_page/terms.scss"; -@import "_common/_page/post.scss"; -@import "_common/_page/tags.scss"; -@import "_common/_page/home_post.scss"; - -@import "_common/_section/navbar.scss"; -@import "_common/_section/footer.scss"; -@import "_common/_section/pagination.scss"; - - -@import "_common/_prettyprint/default.scss"; - - -@import "_common/_core/media.scss"; -@import "custom" \ No newline at end of file diff --git a/assets/css/style.scss b/assets/css/style.scss new file mode 100644 index 00000000..f6d4afb6 --- /dev/null +++ b/assets/css/style.scss @@ -0,0 +1,20 @@ +@import "_variables"; + +@import "_iconfont"; + +@import "_core/normalize"; +@import "_core/base"; +@import "_core/layout"; + +@import "_page/home"; +@import "_page/home_post"; +@import "_page/post"; +@import "_page/tags"; +@import "_page/terms"; + +@import "_partial/navbar"; +@import "_partial/footer"; +@import "_partial/pagination"; + +@import "_core/media"; +@import "_custom"; diff --git a/assets/font/demo.css b/assets/font/demo.css deleted file mode 100644 index a67054a0..00000000 --- a/assets/font/demo.css +++ /dev/null @@ -1,539 +0,0 @@ -/* Logo 字体 */ -@font-face { - font-family: "iconfont logo"; - src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834'); - src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834#iefix') format('embedded-opentype'), - url('https://at.alicdn.com/t/font_985780_km7mi63cihi.woff?t=1545807318834') format('woff'), - url('https://at.alicdn.com/t/font_985780_km7mi63cihi.ttf?t=1545807318834') format('truetype'), - url('https://at.alicdn.com/t/font_985780_km7mi63cihi.svg?t=1545807318834#iconfont') format('svg'); -} - -.logo { - font-family: "iconfont logo"; - font-size: 160px; - font-style: normal; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; -} - -/* tabs */ -.nav-tabs { - position: relative; -} - -.nav-tabs .nav-more { - position: absolute; - right: 0; - bottom: 0; - height: 42px; - line-height: 42px; - color: #666; -} - -#tabs { - border-bottom: 1px solid #eee; -} - -#tabs li { - cursor: pointer; - width: 100px; - height: 40px; - line-height: 40px; - text-align: center; - font-size: 16px; - border-bottom: 2px solid transparent; - position: relative; - z-index: 1; - margin-bottom: -1px; - color: #666; -} - - -#tabs .active { - border-bottom-color: #f00; - color: #222; -} - -.tab-container .content { - display: none; -} - -/* 页面布局 */ -.main { - padding: 30px 100px; - width: 960px; - margin: 0 auto; -} - -.main .logo { - color: #333; - text-align: left; - margin-bottom: 30px; - line-height: 1; - height: 110px; - margin-top: -50px; - overflow: hidden; - *zoom: 1; -} - -.main .logo a { - font-size: 160px; - color: #333; -} - -.helps { - margin-top: 40px; -} - -.helps pre { - padding: 20px; - margin: 10px 0; - border: solid 1px #e7e1cd; - background-color: #fffdef; - overflow: auto; -} - -.icon_lists { - width: 100% !important; - overflow: hidden; - *zoom: 1; -} - -.icon_lists li { - width: 100px; - margin-bottom: 10px; - margin-right: 20px; - text-align: center; - list-style: none !important; - cursor: default; -} - -.icon_lists li .code-name { - line-height: 1.2; -} - -.icon_lists .icon { - display: block; - height: 100px; - line-height: 100px; - font-size: 42px; - margin: 10px auto; - color: #333; - -webkit-transition: font-size 0.25s linear, width 0.25s linear; - -moz-transition: font-size 0.25s linear, width 0.25s linear; - transition: font-size 0.25s linear, width 0.25s linear; -} - -.icon_lists .icon:hover { - font-size: 100px; -} - -.icon_lists .svg-icon { - /* 通过设置 font-size 来改变图标大小 */ - width: 1em; - /* 图标和文字相邻时,垂直对齐 */ - vertical-align: -0.15em; - /* 通过设置 color 来改变 SVG 的颜色/fill */ - fill: currentColor; - /* path 和 stroke 溢出 viewBox 部分在 IE 下会显示 - normalize.css 中也包含这行 */ - overflow: hidden; -} - -.icon_lists li .name, -.icon_lists li .code-name { - color: #666; -} - -/* markdown 样式 */ -.markdown { - color: #666; - font-size: 14px; - line-height: 1.8; -} - -.highlight { - line-height: 1.5; -} - -.markdown img { - vertical-align: middle; - max-width: 100%; -} - -.markdown h1 { - color: #404040; - font-weight: 500; - line-height: 40px; - margin-bottom: 24px; -} - -.markdown h2, -.markdown h3, -.markdown h4, -.markdown h5, -.markdown h6 { - color: #404040; - margin: 1.6em 0 0.6em 0; - font-weight: 500; - clear: both; -} - -.markdown h1 { - font-size: 28px; -} - -.markdown h2 { - font-size: 22px; -} - -.markdown h3 { - font-size: 16px; -} - -.markdown h4 { - font-size: 14px; -} - -.markdown h5 { - font-size: 12px; -} - -.markdown h6 { - font-size: 12px; -} - -.markdown hr { - height: 1px; - border: 0; - background: #e9e9e9; - margin: 16px 0; - clear: both; -} - -.markdown p { - margin: 1em 0; -} - -.markdown>p, -.markdown>blockquote, -.markdown>.highlight, -.markdown>ol, -.markdown>ul { - width: 80%; -} - -.markdown ul>li { - list-style: circle; -} - -.markdown>ul li, -.markdown blockquote ul>li { - margin-left: 20px; - padding-left: 4px; -} - -.markdown>ul li p, -.markdown>ol li p { - margin: 0.6em 0; -} - -.markdown ol>li { - list-style: decimal; -} - -.markdown>ol li, -.markdown blockquote ol>li { - margin-left: 20px; - padding-left: 4px; -} - -.markdown code { - margin: 0 3px; - padding: 0 5px; - background: #eee; - border-radius: 3px; -} - -.markdown strong, -.markdown b { - font-weight: 600; -} - -.markdown>table { - border-collapse: collapse; - border-spacing: 0px; - empty-cells: show; - border: 1px solid #e9e9e9; - width: 95%; - margin-bottom: 24px; -} - -.markdown>table th { - white-space: nowrap; - color: #333; - font-weight: 600; -} - -.markdown>table th, -.markdown>table td { - border: 1px solid #e9e9e9; - padding: 8px 16px; - text-align: left; -} - -.markdown>table th { - background: #F7F7F7; -} - -.markdown blockquote { - font-size: 90%; - color: #999; - border-left: 4px solid #e9e9e9; - padding-left: 0.8em; - margin: 1em 0; -} - -.markdown blockquote p { - margin: 0; -} - -.markdown .anchor { - opacity: 0; - transition: opacity 0.3s ease; - margin-left: 8px; -} - -.markdown .waiting { - color: #ccc; -} - -.markdown h1:hover .anchor, -.markdown h2:hover .anchor, -.markdown h3:hover .anchor, -.markdown h4:hover .anchor, -.markdown h5:hover .anchor, -.markdown h6:hover .anchor { - opacity: 1; - display: inline-block; -} - -.markdown>br, -.markdown>p>br { - clear: both; -} - - -.hljs { - display: block; - background: white; - padding: 0.5em; - color: #333333; - overflow-x: auto; -} - -.hljs-comment, -.hljs-meta { - color: #969896; -} - -.hljs-string, -.hljs-variable, -.hljs-template-variable, -.hljs-strong, -.hljs-emphasis, -.hljs-quote { - color: #df5000; -} - -.hljs-keyword, -.hljs-selector-tag, -.hljs-type { - color: #a71d5d; -} - -.hljs-literal, -.hljs-symbol, -.hljs-bullet, -.hljs-attribute { - color: #0086b3; -} - -.hljs-section, -.hljs-name { - color: #63a35c; -} - -.hljs-tag { - color: #333333; -} - -.hljs-title, -.hljs-attr, -.hljs-selector-id, -.hljs-selector-class, -.hljs-selector-attr, -.hljs-selector-pseudo { - color: #795da3; -} - -.hljs-addition { - color: #55a532; - background-color: #eaffea; -} - -.hljs-deletion { - color: #bd2c00; - background-color: #ffecec; -} - -.hljs-link { - text-decoration: underline; -} - -/* 代码高亮 */ -/* PrismJS 1.15.0 -https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript */ -/** - * prism.js default theme for JavaScript, CSS and HTML - * Based on dabblet (http://dabblet.com) - * @author Lea Verou - */ -code[class*="language-"], -pre[class*="language-"] { - color: black; - background: none; - text-shadow: 0 1px white; - font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace; - text-align: left; - white-space: pre; - word-spacing: normal; - word-break: normal; - word-wrap: normal; - line-height: 1.5; - - -moz-tab-size: 4; - -o-tab-size: 4; - tab-size: 4; - - -webkit-hyphens: none; - -moz-hyphens: none; - -ms-hyphens: none; - hyphens: none; -} - -pre[class*="language-"]::-moz-selection, -pre[class*="language-"] ::-moz-selection, -code[class*="language-"]::-moz-selection, -code[class*="language-"] ::-moz-selection { - text-shadow: none; - background: #b3d4fc; -} - -pre[class*="language-"]::selection, -pre[class*="language-"] ::selection, -code[class*="language-"]::selection, -code[class*="language-"] ::selection { - text-shadow: none; - background: #b3d4fc; -} - -@media print { - - code[class*="language-"], - pre[class*="language-"] { - text-shadow: none; - } -} - -/* Code blocks */ -pre[class*="language-"] { - padding: 1em; - margin: .5em 0; - overflow: auto; -} - -:not(pre)>code[class*="language-"], -pre[class*="language-"] { - background: #f5f2f0; -} - -/* Inline code */ -:not(pre)>code[class*="language-"] { - padding: .1em; - border-radius: .3em; - white-space: normal; -} - -.token.comment, -.token.prolog, -.token.doctype, -.token.cdata { - color: slategray; -} - -.token.punctuation { - color: #999; -} - -.namespace { - opacity: .7; -} - -.token.property, -.token.tag, -.token.boolean, -.token.number, -.token.constant, -.token.symbol, -.token.deleted { - color: #905; -} - -.token.selector, -.token.attr-name, -.token.string, -.token.char, -.token.builtin, -.token.inserted { - color: #690; -} - -.token.operator, -.token.entity, -.token.url, -.language-css .token.string, -.style .token.string { - color: #9a6e3a; - background: hsla(0, 0%, 100%, .5); -} - -.token.atrule, -.token.attr-value, -.token.keyword { - color: #07a; -} - -.token.function, -.token.class-name { - color: #DD4A68; -} - -.token.regex, -.token.important, -.token.variable { - color: #e90; -} - -.token.important, -.token.bold { - font-weight: bold; -} - -.token.italic { - font-style: italic; -} - -.token.entity { - cursor: help; -} diff --git a/assets/font/demo_index.html b/assets/font/demo_index.html deleted file mode 100644 index 0c3d3716..00000000 --- a/assets/font/demo_index.html +++ /dev/null @@ -1,1573 +0,0 @@ - - -
- -Unicode 是字体在网页端最原始的应用方式,特点是:
---注意:新版 iconfont 支持多色图标,这些多色图标在 Unicode 模式下将不能使用,如果有需求建议使用symbol 的引用方式
-
Unicode 使用步骤如下:
-@font-face
@font-face {
- font-family: 'iconfont';
- src: url('iconfont.eot');
- src: url('iconfont.eot?#iefix') format('embedded-opentype'),
- url('iconfont.woff2') format('woff2'),
- url('iconfont.woff') format('woff'),
- url('iconfont.ttf') format('truetype'),
- url('iconfont.svg#iconfont') format('svg');
-}
-
- .iconfont {
- font-family: "iconfont" !important;
- font-size: 16px;
- font-style: normal;
- -webkit-font-smoothing: antialiased;
- -moz-osx-font-smoothing: grayscale;
-}
-
-
-<span class="iconfont">3</span>
-
- --"iconfont" 是你项目下的 font-family。可以通过编辑项目查看,默认是 "iconfont"。
-
font-class 是 Unicode 使用方式的一种变种,主要是解决 Unicode 书写不直观,语意不明确的问题。
-与 Unicode 使用方式相比,具有如下特点:
-使用步骤如下:
-<link rel="stylesheet" href="./iconfont.css">
-
- <span class="iconfont icon-xxx"></span>
-
- --" - iconfont" 是你项目下的 font-family。可以通过编辑项目查看,默认是 "iconfont"。
-
这是一种全新的使用方式,应该说这才是未来的主流,也是平台目前推荐的用法。相关介绍可以参考这篇文章 - 这种用法其实是做了一个 SVG 的集合,与另外两种相比具有如下特点:
-font-size
, color
来调整样式。使用步骤如下:
-<script src="./iconfont.js"></script>
-
- <style>
-.icon {
- width: 1em;
- height: 1em;
- vertical-align: -0.15em;
- fill: currentColor;
- overflow: hidden;
-}
-</style>
-
- <svg class="icon" aria-hidden="true">
- <use xlink:href="#icon-xxx"></use>
-</svg>
-
-
-
-
{{ if and ( $.Param "socialShare" ) (gt (len ($.Param "share")) 0) }} {{ T "share" }}: - {{ partial "share-links.html" . }} + {{ partial "post/share-links.html" . }} {{ end }}
diff --git a/layouts/posts/summary.html b/layouts/posts/summary.html new file mode 100644 index 00000000..f3ac5ead --- /dev/null +++ b/layouts/posts/summary.html @@ -0,0 +1,46 @@ +{{ . }}
{{ end }} + {{ .Inner }} +{{ . }}
{{ end }} + {{ .Inner }} +\s*?(?s)(.*?)\s*?
\s*?