Synchronizing the site and the new theme

Signed-off-by: Valentin Popov <valentin@popov.link>
author: Valentin Popov <valentin@popov.link> 2022-08-02 11:43:45 +0300
committer: Valentin Popov <valentin@popov.link> 2022-08-02 11:43:45 +0300
commit: ff92c125d478426c3f97d2532879651c44f124b7 (patch)
tree: fcf60cc24367effa1dc729d6b5cb76df209a28ff /sass
parent: 38e48011bcedffb897cab53c350f1fbe50b58389 (diff)
download: popov.link-ff92c125d478426c3f97d2532879651c44f124b7.tar.xz
popov.link-ff92c125d478426c3f97d2532879651c44f124b7.zip
18 files changed, 445 insertions, 1154 deletions
diff --git a/sass/_framework.scss b/sass/_framework.scss
new file mode 100644
index 0000000..ef5d832
--- /dev/null
+++ b/sass/_framework.scss
@@ -0,0 +1,247 @@
+*,
+*::after,
+*::before {
+ box-sizing: border-box;
+ text-size-adjust: 100%;
+}
+
+html {
+ font-family: $font-family-base;
+ font-size: 62.5%;
+ overflow-y: scroll;
+}
+
+body {
+ background-color: $color-bg;
+ color: $color-text;
+ direction: ltr;
+ font-size: $font-size-base;
+ font-synthesis: none;
+ line-height: 1.4em;
+ margin: auto;
+ max-width: 60em;
+ padding: 4em;
+ text-rendering: "optimizeLegibility";
+}
+
+@media (max-width: 684px) {
+ body {
+ font-size: $font-size-base * 0.85;
+ padding: 2em;
+ }
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+ @include word-wrap;
+
+ font-weight: 700;
+ line-height: 1.1;
+ margin-bottom: 1.5rem;
+ margin-top: 3rem;
+}
+
+h1 {
+ font-size: 2.35em;
+}
+
+h2 {
+ font-size: 2em;
+}
+
+h3 {
+ font-size: 1.75em;
+}
+
+h4 {
+ font-size: 1.5em;
+}
+
+h5 {
+ font-size: 1.25em;
+}
+
+h6 {
+ font-size: 1em;
+}
+
+p {
+ margin-bottom: 2.5rem;
+ margin-top: 0;
+}
+
+small,
+sub,
+sup {
+ font-size: 75%;
+}
+
+hr {
+ border-color: $color-blossom;
+}
+
+a {
+ color: $color-blossom;
+ text-decoration: inherit;
+ transition: color 0.25s;
+
+ &:visited {
+ color: $color-blossom;
+ }
+
+ &:active,
+ &:focus,
+ &:hover {
+ color: $color-fade;
+ }
+}
+
+ul {
+ margin-bottom: 2.5rem;
+ margin-top: 0;
+ padding-left: 1.4em;
+}
+
+li {
+ margin-bottom: 0.4em;
+}
+
+blockquote {
+ background-color: $color-bg-alt;
+ border-left: 5px solid $color-blossom;
+ margin-bottom: 2.5rem;
+ margin-left: 0;
+ margin-right: 0;
+ padding: 0.8em 0.8em 0.8em 1em;
+}
+
+blockquote p {
+ margin-bottom: 0;
+}
+
+img,
+video {
+ height: auto;
+ margin-bottom: 2.5rem;
+ margin-top: 0;
+ max-width: 100%;
+}
+
+pre {
+ background-color: $color-bg-alt;
+ border-radius: 4px;
+ border: 1px solid $color-bg-alt;
+ display: block;
+ font-size: 0.9em;
+ margin-bottom: 2.5rem;
+ margin-top: 0;
+ overflow-x: auto;
+ padding: 1em;
+}
+
+code,
+kbd,
+samp {
+ background-color: $color-bg-code;
+ border-radius: 4px;
+ font-size: 0.9em;
+ padding: 0 0.2em;
+ white-space: pre-wrap;
+}
+
+pre > code {
+ background-color: transparent;
+ font-size: 1em;
+ padding: 0;
+ white-space: pre;
+}
+
+table {
+ border-collapse: collapse;
+ text-align: justify;
+ width: 100%;
+}
+
+td,
+th {
+ border-bottom: 1px dashed $color-blossom;
+ padding: 0.5em;
+}
+
+input,
+textarea {
+ border: 1px solid $color-text;
+
+ &:focus {
+ border: 1px solid $color-blossom;
+ }
+}
+
+textarea {
+ width: 100%;
+}
+
+.button,
+button,
+input[type="submit"],
+input[type="reset"],
+input[type="button"] {
+ background-color: $color-blossom;
+ border: 1px solid $color-blossom;
+ border-radius: 1px;
+ box-sizing: border-box;
+ color: $color-bg;
+ cursor: pointer;
+ display: inline-block;
+ padding: 5px 10;
+ text-align: center;
+ text-decoration: none;
+ white-space: nowrap;
+
+ &[disabled] {
+ cursor: default;
+ opacity: 0.5;
+ }
+
+ &:focus:enabled,
+ &:hover:enabled {
+ background-color: $color-fade;
+ border-color: $color-fade;
+ color: $color-bg;
+ outline: 0;
+ }
+}
+
+textarea,
+select,
+input {
+ background-color: $color-bg-alt;
+ border: 1px solid $color-bg-alt;
+ border-radius: 4px;
+ box-shadow: none;
+ box-sizing: border-box;
+ color: $color-text;
+ margin-bottom: 10;
+ padding: 6px 10;
+
+ &:focus {
+ border: 1px solid $color-blossom;
+ outline: 0;
+ }
+}
+
+input[type="checkbox"]:focus {
+ outline: 1px dotted $color-blossom;
+}
+
+label,
+legend,
+fieldset {
+ display: block;
+ font-weight: 600;
+ margin-bottom: 0.5rem;
+}
diff --git a/sass/_mixins.scss b/sass/_mixins.scss
new file mode 100644
index 0000000..076cfc4
--- /dev/null
+++ b/sass/_mixins.scss
@@ -0,0 +1,6 @@
+@mixin word-wrap() {
+ hyphens: auto;
+ overflow-wrap: break-word;
+ word-break: break-word;
+ word-wrap: break-word;
+}
diff --git a/sass/_reset.scss b/sass/_reset.scss
new file mode 100644
index 0000000..5fa39f8
--- /dev/null
+++ b/sass/_reset.scss
@@ -0,0 +1,179 @@
+html {
+ line-height: 1.15;
+ -webkit-text-size-adjust: 100%;
+}
+
+body {
+ margin: 0;
+}
+
+main {
+ display: block;
+}
+
+h1 {
+ font-size: 2em;
+ margin: 0.67em 0;
+}
+
+hr {
+ box-sizing: content-box;
+ height: 0;
+ overflow: visible;
+}
+
+pre {
+ font-family: monospace, monospace;
+ font-size: 1em;
+}
+
+a {
+ background-color: transparent;
+}
+
+abbr[title] {
+ border-bottom: none;
+ text-decoration: underline;
+ text-decoration: underline dotted;
+}
+
+b,
+strong {
+ font-weight: bolder;
+}
+
+code,
+kbd,
+samp {
+ font-family: monospace, monospace;
+ font-size: 1em;
+}
+
+small {
+ font-size: 80%;
+}
+
+sub,
+sup {
+ font-size: 75%;
+ line-height: 0;
+ position: relative;
+ vertical-align: baseline;
+}
+
+sub {
+ bottom: -0.25em;
+}
+
+sup {
+ top: -0.5em;
+}
+
+img {
+ border-style: none;
+}
+
+button,
+input,
+optgroup,
+select,
+textarea {
+ font-family: inherit;
+ font-size: 100%;
+ line-height: 1.15;
+ margin: 0;
+}
+
+button,
+input {
+ overflow: visible;
+}
+
+button,
+select {
+ text-transform: none;
+}
+
+button,
+[type="button"],
+[type="reset"],
+[type="submit"] {
+ -webkit-appearance: button;
+}
+
+button::-moz-focus-inner,
+[type="button"]::-moz-focus-inner,
+[type="reset"]::-moz-focus-inner,
+[type="submit"]::-moz-focus-inner {
+ border-style: none;
+ padding: 0;
+}
+
+button:-moz-focusring,
+[type="button"]:-moz-focusring,
+[type="reset"]:-moz-focusring,
+[type="submit"]:-moz-focusring {
+ outline: 1px dotted ButtonText;
+}
+
+fieldset {
+ padding: 0.35em 0.75em 0.625em;
+}
+
+legend {
+ box-sizing: border-box;
+ color: inherit;
+ display: table;
+ max-width: 100%;
+ padding: 0;
+ white-space: normal;
+}
+
+progress {
+ vertical-align: baseline;
+}
+
+textarea {
+ overflow: auto;
+}
+
+[type="checkbox"],
+[type="radio"] {
+ box-sizing: border-box;
+ padding: 0;
+}
+
+[type="number"]::-webkit-inner-spin-button,
+[type="number"]::-webkit-outer-spin-button {
+ height: auto;
+}
+
+[type="search"] {
+ -webkit-appearance: textfield;
+ outline-offset: -2px;
+}
+
+[type="search"]::-webkit-search-decoration {
+ -webkit-appearance: none;
+}
+
+::-webkit-file-upload-button {
+ -webkit-appearance: button;
+ font: inherit;
+}
+
+details {
+ display: block;
+}
+
+summary {
+ display: list-item;
+}
+
+template {
+ display: none;
+}
+
+[hidden] {
+ display: none;
+}
diff --git a/sass/common/_404.scss b/sass/common/_404.scss
deleted file mode 100644
index 44512ae..0000000
--- a/sass/common/_404.scss
+++ /dev/null
@@ -1,11 +0,0 @@
-.not-found {
- position: absolute;
- left: 0;
- right: 0;
- display: flex;
- align-items: center;
- justify-content: center;
- height: 80%;
- font-size: 160px;
- font-weight: 700;
-}
diff --git a/sass/common/_archive.scss b/sass/common/_archive.scss
deleted file mode 100644
index 0046cf7..0000000
--- a/sass/common/_archive.scss
+++ /dev/null
@@ -1,44 +0,0 @@
-.archive-posts {
- width: 100%;
- font-size: 16px;
-}
-
-.archive-year {
- margin-top: 40px;
-}
-
-.archive-year:not(:last-of-type) {
- border-bottom: 2px solid var(--border);
-}
-
-.archive-month {
- display: flex;
- align-items: flex-start;
- padding: 10px 0;
-}
-
-.archive-month-header {
- margin: 25px 0;
- width: 200px;
-}
-
-.archive-month:not(:last-of-type) {
- border-bottom: 1px solid var(--border);
-}
-
-.archive-entry {
- position: relative;
- padding: 5px;
- margin: 10px 0;
-}
-
-.archive-entry-title {
- margin: 5px 0;
- font-weight: 400;
-}
-
-.archive-count,
-.archive-meta {
- color: var(--secondary);
- font-size: 14px;
-}
diff --git a/sass/common/_footer.scss b/sass/common/_footer.scss
deleted file mode 100644
index d09a307..0000000
--- a/sass/common/_footer.scss
+++ /dev/null
@@ -1,60 +0,0 @@
-.footer,
-.top-link {
- font-size: 12px;
- color: var(--secondary);
-}
-
-.footer {
- max-width: calc(var(--main-width) + var(--gap) * 2);
- margin: auto;
- padding: calc((var(--footer-height) - var(--gap)) / 2) var(--gap);
- text-align: center;
- line-height: 24px;
-}
-
-.footer span {
- margin-inline-start: 1px;
- margin-inline-end: 1px;
-}
-
-.footer span:last-child {
- white-space: nowrap;
-}
-
-.footer a {
- color: inherit;
- border-bottom: 1px solid var(--secondary);
-}
-
-.footer a:hover {
- border-bottom: 1px solid var(--primary);
-}
-
-.top-link {
- visibility: hidden;
- position: fixed;
- bottom: 60px;
- right: 30px;
- z-index: 99;
- background: var(--tertiary);
- width: 42px;
- height: 42px;
- padding: 12px;
- border-radius: 64px;
- transition: visibility 0.5s, opacity 0.8s linear;
-}
-
-.top-link,
-.top-link svg {
- filter: drop-shadow(0px 0px 0px var(--theme));
-}
-
-.footer a:hover,
-.top-link:hover {
- color: var(--primary);
-}
-
-.top-link:focus,
-#theme-toggle:focus {
- outline: 0;
-}
diff --git a/sass/common/_header.scss b/sass/common/_header.scss
deleted file mode 100644
index f3ebeff..0000000
--- a/sass/common/_header.scss
+++ /dev/null
@@ -1,93 +0,0 @@
-.nav {
- display: flex;
- flex-wrap: wrap;
- justify-content: space-between;
- max-width: calc(var(--nav-width) + var(--gap) * 2);
- margin-inline-start: auto;
- margin-inline-end: auto;
- line-height: var(--header-height);
-}
-
-.nav a {
- display: block;
-}
-
-.logo,
-#menu {
- display: flex;
- margin: auto var(--gap);
-}
-
-.logo {
- flex-wrap: inherit;
-}
-
-.logo a {
- font-size: 24px;
- font-weight: 700;
-}
-
-.logo a img {
- display: inline;
- vertical-align: middle;
- pointer-events: none;
- transform: translate(0, -10%);
- border-radius: 6px;
- margin-inline-end: 8px;
-}
-
-button#theme-toggle {
- font-size: 26px;
- margin: auto 4px;
-}
-
-body.dark #moon {
- vertical-align: middle;
- display: none;
-}
-
-body:not(.dark) #sun {
- display: none;
-}
-
-#menu {
- list-style: none;
- word-break: keep-all;
- overflow-x: auto;
- white-space: nowrap;
-}
-
-#menu li + li {
- margin-inline-start: var(--gap);
-}
-
-#menu a {
- font-size: 16px;
-}
-
-#menu .active {
- font-weight: 500;
- border-bottom: 2px solid currentColor;
-}
-
-.lang-switch li,
-.lang-switch ul,
-.logo-switches {
- display: inline-flex;
- margin: auto 4px;
-}
-
-.lang-switch {
- display: flex;
- flex-wrap: inherit;
-}
-
-.lang-switch a {
- margin: auto 3px;
- font-size: 16px;
- font-weight: 500;
-}
-
-.logo-switches {
- flex-wrap: inherit;
-}
diff --git a/sass/common/_main.scss b/sass/common/_main.scss
deleted file mode 100644
index 660c576..0000000
--- a/sass/common/_main.scss
+++ /dev/null
@@ -1,68 +0,0 @@
-.main {
- position: relative;
- min-height: calc(100vh - var(--header-height) - var(--footer-height));
- max-width: calc(var(--main-width) + var(--gap) * 2);
- margin: auto;
- padding: var(--gap);
-}
-
-.page-header h1 {
- font-size: 40px;
-}
-
-.pagination {
- display: flex;
-}
-
-.pagination a {
- color: var(--theme);
- font-size: 13px;
- line-height: 36px;
- background: var(--primary);
- border-radius: calc(36px / 2);
- padding: 0 16px;
-}
-
-.pagination .next {
- margin-inline-start: auto;
-}
-
-.social-icons {
- padding: 12px 0;
-}
-
-.social-icons a:not(:last-of-type) {
- margin-inline-end: 12px;
-}
-
-.social-icons a svg {
- height: 26px;
- width: 26px;
-}
-
-code {
- direction: ltr;
-}
-
-div.highlight,
-pre {
- position: relative;
-}
-
-.copy-code {
- display: none;
- position: absolute;
- top: 4px;
- right: 4px;
- color: rgba(255, 255, 255, 0.8);
- background: rgba(78, 78, 78, 0.8);
- border-radius: var(--radius);
- padding: 0 5px;
- font-size: 14px;
- user-select: none;
-}
-
-div.highlight:hover .copy-code,
-pre:hover .copy-code {
- display: block;
-}
diff --git a/sass/common/_post-entry.scss b/sass/common/_post-entry.scss
deleted file mode 100644
index 7813225..0000000
--- a/sass/common/_post-entry.scss
+++ /dev/null
@@ -1,104 +0,0 @@
-.first-entry {
- position: relative;
- display: flex;
- flex-direction: column;
- justify-content: center;
- min-height: 320px;
- margin: var(--gap) 0 calc(var(--gap) * 2) 0;
-}
-
-.first-entry .entry-header {
- overflow: hidden;
- display: -webkit-box;
- -webkit-box-orient: vertical;
- -webkit-line-clamp: 3;
-}
-
-.first-entry .entry-header h1 {
- font-size: 34px;
- line-height: 1.3;
-}
-
-.first-entry .entry-content {
- margin: 14px 0;
- font-size: 16px;
- -webkit-line-clamp: 3;
-}
-
-.first-entry .entry-footer {
- font-size: 14px;
-}
-
-.home-info .entry-content {
- -webkit-line-clamp: unset;
-}
-
-.post-entry {
- position: relative;
- margin-bottom: var(--gap);
- padding: var(--gap);
- background: var(--entry);
- border-radius: var(--radius);
- transition: transform 0.1s;
- border: 1px solid var(--border);
-}
-
-.post-entry:active {
- transform: scale(0.96);
-}
-
-.tag-entry .entry-cover {
- display: none;
-}
-
-.entry-header h2 {
- font-size: 24px;
- line-height: 1.3;
-}
-
-.entry-content {
- margin: 8px 0;
- color: var(--secondary);
- font-size: 14px;
- line-height: 1.6;
- overflow: hidden;
- display: -webkit-box;
- -webkit-box-orient: vertical;
- -webkit-line-clamp: 2;
-}
-
-.entry-footer {
- color: var(--secondary);
- font-size: 13px;
-}
-
-.entry-link {
- position: absolute;
- left: 0;
- right: 0;
- top: 0;
- bottom: 0;
-}
-
-.entry-cover,
-.entry-isdraft {
- font-size: 14px;
- color: var(--secondary);
-}
-
-.entry-cover {
- margin-bottom: var(--gap);
- text-align: center;
-}
-
-.entry-cover img {
- border-radius: var(--radius);
- pointer-events: none;
- width: 100%;
- height: auto;
-}
-
-.entry-cover a {
- color: var(--secondary);
- box-shadow: 0 1px 0 var(--primary);
-}
diff --git a/sass/common/_post-single.scss b/sass/common/_post-single.scss
deleted file mode 100644
index f0cf046..0000000
--- a/sass/common/_post-single.scss
+++ /dev/null
@@ -1,401 +0,0 @@
-.page-header,
-.post-header {
- margin: 24px auto var(--content-gap) auto;
-}
-
-.post-title {
- margin-bottom: 2px;
- font-size: 40px;
-}
-
-.post-description {
- margin-top: 10px;
- margin-bottom: 5px;
-}
-
-.post-meta,
-.breadcrumbs {
- color: var(--secondary);
- font-size: 14px;
- display: flex;
- flex-wrap: wrap;
-}
-
-.post-meta .i18n_list li {
- display: inline-flex;
- list-style: none;
- margin: auto 3px;
- box-shadow: 0 1px 0 var(--secondary);
-}
-
-.breadcrumbs a {
- font-size: 16px;
-}
-
-.post-content {
- color: var(--content);
-}
-
-.post-content h3,
-.post-content h4,
-.post-content h5,
-.post-content h6 {
- margin: 24px 0 16px;
-}
-
-.post-content h1 {
- margin: 40px auto 32px;
- font-size: 40px;
-}
-
-.post-content h2 {
- margin: 32px auto 24px;
- font-size: 32px;
-}
-
-.post-content h3 {
- font-size: 24px;
-}
-
-.post-content h4 {
- font-size: 16px;
-}
-
-.post-content h5 {
- font-size: 14px;
-}
-
-.post-content h6 {
- font-size: 12px;
-}
-
-.post-content a,
-.toc a:hover {
- box-shadow: 0 1px 0;
-}
-
-.post-content a code {
- margin: auto 0;
- border-radius: 0;
- box-shadow: 0 -1px 0 var(--primary) inset;
-}
-
-.post-content del {
- text-decoration: none;
- background: linear-gradient(to right, var(--primary) 100%, transparent 0) 0 50%/1px 1px repeat-x;
-}
-
-.post-content dl,
-.post-content ol,
-.post-content p,
-.post-content figure,
-.post-content ul {
- margin-bottom: var(--content-gap);
-}
-
-.post-content ol,
-.post-content ul {
- padding-inline-start: 20px;
-}
-
-.post-content li {
- margin-top: 5px;
-}
-
-.post-content li p {
- margin-bottom: 0;
-}
-
-.post-content dl {
- display: flex;
- flex-wrap: wrap;
- margin: 0;
-}
-
-.post-content dt {
- width: 25%;
- font-weight: 700;
-}
-
-.post-content dd {
- width: 75%;
- margin-inline-start: 0;
- padding-inline-start: 10px;
-}
-
-.post-content dd ~ dd,
-.post-content dt ~ dt {
- margin-top: 10px;
-}
-
-.post-content table {
- margin-bottom: 32px;
-}
-
-.post-content table th,
-.post-content table:not(.highlighttable, .highlight table, .gist .highlight) td {
- min-width: 80px;
- padding: 12px 8px;
- line-height: 1.5;
- border-bottom: 1px solid var(--border);
-}
-
-.post-content table th {
- font-size: 14px;
- text-align: start;
-}
-
-.post-content table:not(.highlighttable) td code:only-child {
- margin: auto 0;
-}
-
-.post-content .highlight table {
- border-radius: var(--radius);
-}
-
-.post-content .highlight:not(table) {
- margin: 10px auto;
- background: var(--hljs-bg) !important;
- border-radius: var(--radius);
- direction: ltr;
-}
-
-.post-content li > .highlight {
- margin-inline-end: 0;
-}
-
-.post-content ul pre {
- margin-inline-start: calc(var(--gap) * -2);
-}
-
-.post-content .highlight pre {
- margin: 0;
-}
-
-.post-content .highlighttable {
- table-layout: fixed;
-}
-
-.post-content .highlighttable td:first-child {
- width: 40px;
-}
-
-.post-content .highlighttable td .linenodiv {
- padding-inline-end: 0 !important;
-}
-
-.post-content .highlighttable td .highlight,
-.post-content .highlighttable td .linenodiv pre {
- margin-bottom: 0;
-}
-
-.post-content code {
- margin: auto 4px;
- padding: 4px 6px;
- font-size: 0.78em;
- line-height: 1.5;
- background: var(--code-bg);
- border-radius: 2px;
-}
-
-.post-content pre code {
- display: block;
- margin: auto 0;
- padding: 10px;
- color: rgb(213, 213, 214);
- background: var(--hljs-bg) !important;
- border-radius: var(--radius);
- overflow-x: auto;
- word-break: break-all;
-}
-
-.post-content blockquote {
- margin: 20px 0;
- padding: 0 14px;
- border-inline-start: 3px solid var(--primary);
-}
-
-.post-content hr {
- margin: 30px 0;
- height: 2px;
- background: var(--tertiary);
- border: 0;
-}
-
-.post-content iframe {
- max-width: 100%;
-}
-
-.post-content img {
- border-radius: 4px;
- margin: 1rem 0;
-}
-
-.post-content img[src*="#center"] {
- margin: 1rem auto;
-}
-
-.post-content figure.align-center {
- text-align: center;
-}
-
-.post-content figure > figcaption {
- color: var(--primary);
- font-size: 16px;
- font-weight: bold;
- margin: 8px 0 16px;
-}
-
-.post-content figure > figcaption > p {
- color: var(--secondary);
- font-size: 14px;
- font-weight: normal;
-}
-
-.toc {
- margin: 0 2px 40px 2px;
- border: 1px solid var(--border);
- background: var(--code-bg);
- border-radius: var(--radius);
- padding: 0.4em;
-}
-
-.dark .toc {
- background: var(--entry);
-}
-
-.toc details summary {
- cursor: zoom-in;
- margin-inline-start: 20px;
-}
-
-.toc details[open] summary {
- cursor: zoom-out;
-}
-
-.toc .details {
- display: inline;
- font-weight: 500;
-}
-
-.toc .inner {
- margin: 0 20px;
- padding: 10px 20px;
-}
-
-.toc li ul {
- margin-inline-start: var(--gap);
-}
-
-.toc summary:focus {
- outline: 0;
-}
-
-.post-footer {
- margin-top: 56px;
-}
-
-.post-tags li {
- display: inline-block;
- margin-inline-end: 3px;
- margin-bottom: 5px;
-}
-
-.post-tags a,
-.share-buttons,
-.paginav {
- border-radius: var(--radius);
- background: var(--code-bg);
- border: 1px solid var(--border);
-}
-
-.post-tags a {
- display: block;
- padding-inline-start: 14px;
- padding-inline-end: 14px;
- color: var(--secondary);
- font-size: 14px;
- line-height: 34px;
- background: var(--code-bg);
-}
-
-.post-tags a:hover,
-.paginav a:hover {
- background: var(--border);
-}
-
-.share-buttons {
- margin: 14px 0;
- padding-inline-start: var(--radius);
- display: flex;
- justify-content: center;
- overflow-x: auto;
-}
-
-.share-buttons a {
- margin-top: 10px;
-}
-
-.share-buttons a:not(:last-of-type) {
- margin-inline-end: 12px;
-}
-
-h1:hover .anchor,
-h2:hover .anchor,
-h3:hover .anchor,
-h4:hover .anchor,
-h5:hover .anchor,
-h6:hover .anchor {
- display: inline-flex;
- color: var(--secondary);
- margin-inline-start: 8px;
- font-weight: 500;
- user-select: none;
-}
-
-.paginav {
- margin: 10px 0;
- display: flex;
- line-height: 30px;
- border-radius: var(--radius);
-}
-
-.paginav a {
- padding-inline-start: 14px;
- padding-inline-end: 14px;
- border-radius: var(--radius);
-}
-
-.paginav .title {
- letter-spacing: 1px;
- text-transform: uppercase;
- font-size: small;
- color: var(--secondary);
-}
-
-.paginav .prev,
-.paginav .next {
- width: 50%;
-}
-
-.paginav span:hover:not(.title) {
- box-shadow: 0 1px 0;
-}
-
-.paginav .next {
- margin-inline-start: auto;
- text-align: right;
-}
-
-[dir="rtl"] .paginav .next {
- text-align: left;
-}
-
-h1 > a > svg {
- display: inline;
-}
-
-img.in-text {
- display: inline;
- margin: auto;
-}
diff --git a/sass/common/_profile-mode.scss b/sass/common/_profile-mode.scss
deleted file mode 100644
index 214fbc8..0000000
--- a/sass/common/_profile-mode.scss
+++ /dev/null
@@ -1,42 +0,0 @@
-.buttons,
-.main .profile {
- display: flex;
- justify-content: center;
-}
-
-.main .profile {
- align-items: center;
- min-height: calc(100vh - var(--header-height) - var(--footer-height) - (var(--gap) * 2));
- text-align: center;
-}
-
-.profile .profile_inner h1 {
- padding: 12px 0;
-}
-
-.profile img {
- display: inline-table;
- border-radius: 50%;
-}
-
-.buttons {
- flex-wrap: wrap;
- max-width: 400px;
- margin: 0 auto;
-}
-
-.button {
- background: var(--tertiary);
- border-radius: var(--radius);
- margin: 8px;
- padding: 6px;
- transition: transform 0.1s;
-}
-
-.button-inner {
- padding: 0 8px;
-}
-
-.button:active {
- transform: scale(0.96);
-}
diff --git a/sass/common/_search.scss b/sass/common/_search.scss
deleted file mode 100644
index fdab46c..0000000
--- a/sass/common/_search.scss
+++ /dev/null
@@ -1,45 +0,0 @@
-#searchbox input {
- padding: 4px 10px;
- width: 100%;
- color: var(--primary);
- font-weight: bold;
- border: 2px solid var(--tertiary);
- border-radius: var(--radius);
-}
-
-#searchbox input:focus {
- border-color: var(--secondary);
-}
-
-#searchResults li {
- list-style: none;
- border-radius: var(--radius);
- padding: 10px;
- margin: 10px 0;
- position: relative;
- font-weight: 500;
-}
-
-#searchResults {
- margin: 10px 0;
- width: 100%;
-}
-
-#searchResults li:active {
- transition: transform 0.1s;
- transform: scale(0.98);
-}
-
-#searchResults a {
- position: absolute;
- width: 100%;
- height: 100%;
- top: 0px;
- left: 0px;
- outline: none;
-}
-
-#searchResults .focus {
- transform: scale(0.98);
- border: 2px solid var(--tertiary);
-}
diff --git a/sass/common/_terms.scss b/sass/common/_terms.scss
deleted file mode 100644
index 884309e..0000000
--- a/sass/common/_terms.scss
+++ /dev/null
@@ -1,18 +0,0 @@
-.terms-tags li {
- display: inline-block;
- margin: 10px;
- font-weight: 500;
-}
-
-.terms-tags a {
- display: block;
- padding: 3px 10px;
- background: var(--tertiary);
- border-radius: 6px;
- transition: transform 0.1s;
-}
-
-.terms-tags a:active {
- background: var(--tertiary);
- transform: scale(0.96);
-}
diff --git a/sass/core/_reset.scss b/sass/core/_reset.scss
deleted file mode 100644
index a822e80..0000000
--- a/sass/core/_reset.scss
+++ /dev/null
@@ -1,116 +0,0 @@
-*,
-::after,
-::before {
- box-sizing: border-box;
-}
-
-html {
- -webkit-tap-highlight-color: transparent;
- overflow-y: scroll;
-}
-
-a,
-button,
-body,
-h1,
-h2,
-h3,
-h4,
-h5,
-h6 {
- color: var(--primary);
-}
-
-body {
- font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
- font-size: 18px;
- line-height: 1.6;
- word-break: break-word;
- background: var(--theme);
-}
-
-article,
-aside,
-figcaption,
-figure,
-footer,
-header,
-hgroup,
-main,
-nav,
-section,
-table {
- display: block;
-}
-
-h1,
-h2,
-h3,
-h4,
-h5,
-h6 {
- line-height: 1.2;
-}
-
-h1,
-h2,
-h3,
-h4,
-h5,
-h6,
-p {
- margin-top: 0;
- margin-bottom: 0;
-}
-
-ul {
- padding: 0;
-}
-
-a {
- text-decoration: none;
-}
-
-body,
-figure,
-ul {
- margin: 0;
-}
-
-table {
- width: 100%;
- border-collapse: collapse;
- border-spacing: 0;
- overflow-x: auto;
- word-break: keep-all;
-}
-
-button,
-input,
-textarea {
- padding: 0;
- font: inherit;
- background: 0 0;
- border: 0;
-}
-
-input,
-textarea {
- outline: 0;
-}
-
-button,
-input[type="button"],
-input[type="submit"] {
- cursor: pointer;
-}
-
-input:-webkit-autofill,
-textarea:-webkit-autofill {
- box-shadow: 0 0 0 50px var(--theme) inset;
-}
-
-img {
- display: block;
- max-width: 100%;
-}
diff --git a/sass/core/_theme-vars.scss b/sass/core/_theme-vars.scss
deleted file mode 100644
index b731300..0000000
--- a/sass/core/_theme-vars.scss
+++ /dev/null
@@ -1,38 +0,0 @@
-:root {
- --gap: 24px;
- --content-gap: 20px;
- --nav-width: 1024px;
- --main-width: 720px;
- --header-height: 60px;
- --footer-height: 60px;
- --radius: 8px;
- --theme: rgb(255, 255, 255);
- --entry: rgb(255, 255, 255);
- --primary: rgb(30, 30, 30);
- --secondary: rgb(108, 108, 108);
- --tertiary: rgb(214, 214, 214);
- --content: rgb(31, 31, 31);
- --hljs-bg: rgb(28, 29, 33);
- --code-bg: rgb(245, 245, 245);
- --border: rgb(238, 238, 238);
-}
-
-.dark {
- --theme: rgb(29, 30, 32);
- --entry: rgb(46, 46, 51);
- --primary: rgb(218, 218, 219);
- --secondary: rgb(155, 156, 157);
- --tertiary: rgb(65, 66, 68);
- --content: rgb(196, 196, 197);
- --hljs-bg: rgb(46, 46, 51);
- --code-bg: rgb(55, 56, 62);
- --border: rgb(51, 51, 51);
-}
-
-.list {
- background: var(--code-bg);
-}
-
-.dark.list {
- background: var(--theme);
-}
diff --git a/sass/core/_zmedia.scss b/sass/core/_zmedia.scss
deleted file mode 100644
index ccf0ae5..0000000
--- a/sass/core/_zmedia.scss
+++ /dev/null
@@ -1,42 +0,0 @@
-@media screen and (max-width: 768px) {
- :root {
- --gap: 14px;
- }
-
- .profile img {
- transform: scale(0.85);
- }
-
- .first-entry {
- min-height: 260px;
- }
-
- .archive-month {
- flex-direction: column;
- }
-
- .archive-year {
- margin-top: 20px;
- }
-
- .footer {
- padding: calc((var(--footer-height) - var(--gap) - 10px) / 2) var(--gap);
- }
-}
-
-@media screen and (max-width: 900px) {
- .list .top-link {
- transform: translateY(-5rem);
- }
-}
-
-@media (prefers-reduced-motion) {
- .terms-tags a:active,
- .button:active,
- .post-entry:active,
- .top-link,
- #searchResults .focus,
- #searchResults li:active {
- transform: none;
- }
-}
diff --git a/sass/includes/_scrollbar.scss b/sass/includes/_scrollbar.scss
deleted file mode 100644
index 3400ceb..0000000
--- a/sass/includes/_scrollbar.scss
+++ /dev/null
@@ -1,58 +0,0 @@
-::-webkit-scrollbar-track {
- background: 0 0;
-}
-
-.list:not(.dark)::-webkit-scrollbar-track {
- background: var(--code-bg);
-}
-
-::-webkit-scrollbar-thumb {
- background: var(--tertiary);
- border: 5px solid var(--theme);
- border-radius: var(--radius);
-}
-
-.list:not(.dark)::-webkit-scrollbar-thumb {
- border: 5px solid var(--code-bg);
-}
-
-::-webkit-scrollbar-thumb:hover {
- background: var(--secondary);
-}
-
-::-webkit-scrollbar:not(.highlighttable, .highlight table, .gist .highlight) {
- background: var(--theme);
-}
-
-.post-content .highlighttable td .highlight pre code::-webkit-scrollbar {
- display: none;
-}
-
-.post-content :not(table) ::-webkit-scrollbar-thumb {
- border: 2px solid var(--hljs-bg);
- background: rgb(113, 113, 117);
-}
-
-.post-content :not(table) ::-webkit-scrollbar-thumb:hover {
- background: rgb(163, 163, 165);
-}
-
-.gist table::-webkit-scrollbar-thumb {
- border: 2px solid rgb(255, 255, 255);
- background: rgb(173, 173, 173);
-}
-
-.gist table::-webkit-scrollbar-thumb:hover {
- background: rgb(112, 112, 112);
-}
-
-.post-content table::-webkit-scrollbar-thumb {
- border-width: 2px;
-}
-
-@media screen and (min-width: 768px) {
- ::-webkit-scrollbar {
- width: 19px;
- height: 11px;
- }
-}
diff --git a/sass/styles.scss b/sass/styles.scss
index eb8af2d..4af19b1 100644
--- a/sass/styles.scss
+++ b/sass/styles.scss
@@ -1,15 +1,14 @@
-@import "includes/scrollbar";
-@import "core/theme-vars";
-@import "core/reset";
-@import "core/zmedia";
+@charset "utf-8";
+@import "reset";
 
-@import "common/404";
-@import "common/archive";
-@import "common/footer";
-@import "common/header";
-@import "common/main";
-@import "common/post-entry";
-@import "common/post-single";
-@import "common/profile-mode";
-@import "common/search";
-@import "common/terms";
+$color-bg: #242424;
+$color-bg-alt: hwb(0deg 0% 100% / 20%);
+$color-bg-code: #3a3a3a;
+$color-blossom: #6da13f;
+$color-fade: #668d11;
+$color-text: hwb(0deg 100% 0% / 87%);
+$font-family-base: "Inter var experimental", "Inter var", -apple-system, "BlinkMacSystemFont", "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+$font-size-base: 1.8rem;
+
+@import "mixins";
+@import "framework";
author	Valentin Popov <valentin@popov.link>	2022-08-02 11:43:45 +0300
committer	Valentin Popov <valentin@popov.link>	2022-08-02 11:43:45 +0300
commit	ff92c125d478426c3f97d2532879651c44f124b7 (patch)
tree	fcf60cc24367effa1dc729d6b5cb76df209a28ff /sass
parent	38e48011bcedffb897cab53c350f1fbe50b58389 (diff)
download	popov.link-ff92c125d478426c3f97d2532879651c44f124b7.tar.xz popov.link-ff92c125d478426c3f97d2532879651c44f124b7.zip