refactor; linting

assets/style.css

@@ -28,6 +28,7 @@
   --code-bg: #f5f5f5;
   --border: #eee;
 }
+
 .dark {
   --theme: #1d1e20;
   --entry: #2e2e33;
@@ -40,12 +41,15 @@
   --code-bg: #37383e;
   --border: #5b5d67;
 }
+
 .list {
   background: var(--code-bg);
 }
+
 .dark.list {
   background: var(--theme);
 }
+
 /* Reset
 -------------------------------------------------- */
 *,
@@ -53,9 +57,11 @@
 *::after {
   box-sizing: border-box;
 }
+
 html {
   -webkit-tap-highlight-color: transparent;
 }
+
 body {
   margin: 0;
   color: var(--primary);
@@ -66,6 +72,7 @@ body {
   word-break: break-word;
   background: var(--theme);
 }
+
 article,
 aside,
 figcaption,
@@ -78,6 +85,7 @@ nav,
 section {
   display: block;
 }
+
 h1,
 h2,
 h3,
@@ -89,30 +97,37 @@ h6 {
   color: var(--primary);
   line-height: 1.2;
 }
+
 p {
   margin-top: 0;
   margin-bottom: 0;
 }
+
 strong,
 b {
   font-weight: 500;
 }
+
 ul {
   margin: 0;
   padding: 0;
 }
+
 a {
   color: var(--primary);
   text-decoration: none;
 }
+
 figure {
   margin: 0;
 }
+
 table {
   width: 100%;
   border-collapse: collapse;
   border-spacing: 0;
 }
+
 button,
 input,
 textarea {
@@ -122,25 +137,30 @@ textarea {
   border: 0;
   -webkit-appearance: none;
 }
+
 button,
 input[type='button'],
 input[type='submit'] {
   cursor: pointer;
 }
+
 input,
 textarea {
   padding: 0;
   border: 0;
   outline: 0;
 }
+
 input:-webkit-autofill,
 textarea:-webkit-autofill {
   box-shadow: 0 0 0 50px var(--theme) inset;
 }
+
 img {
   display: block;
   max-width: 100%;
 }
+
 /* Header
 -------------------------------------------------- */
 .nav {
@@ -151,31 +171,38 @@ img {
   margin-left: auto;
   margin-right: auto;
 }
+
 .nav a {
   display: block;
   line-height: var(--header-height);
 }
+
 .logo,
 .menu {
   margin-left: var(--gap);
   margin-right: var(--gap);
 }
+
 .logo a {
   font-size: 24px;
   font-weight: 700;
 }
+
 .menu {
   display: flex;
   list-style: none;
   word-break: keep-all;
   overflow-x: auto;
 }
+
 .menu li+li {
   margin-left: var(--gap);
 }
+
 .menu a {
   font-size: 16px;
 }
+
 /* Main
 -------------------------------------------------- */
 .main {
@@ -186,15 +213,19 @@ img {
   margin-right: auto;
   padding: var(--gap);
 }
+
 .page-header {
   margin-bottom: 24px;
 }
+
 .page-header h1 {
   font-size: 40px;
 }
+
 .pagination {
   display: flex;
 }
+
 .pagination a {
   color: var(--theme);
   font-size: 13px;
@@ -202,15 +233,18 @@ img {
   background: var(--primary);
   border-radius: calc(36px / 2);
 }
+
 .pagination .prev {
   padding-left: 16px;
   padding-right: 18px;
 }
+
 .pagination .next {
   margin-left: auto;
   padding-left: 18px;
   padding-right: 16px;
 }
+
 /* Post entry
 -------------------------------------------------- */
 .first-entry {
@@ -221,24 +255,29 @@ img {
   height: 320px;
   margin-bottom: var(--header-height);
 }
+
 .first-entry .entry-header {
   overflow: hidden;
   display: -webkit-box;
   -webkit-box-orient: vertical;
   -webkit-line-clamp: 3;
 }
+
 .first-entry .entry-header h2 {
   font-size: 40px;
 }
+
 .first-entry .entry-content {
   margin-top: 14px;
   margin-bottom: 14px;
   font-size: 16px;
   -webkit-line-clamp: 3;
 }
+
 .first-entry .entry-footer {
   font-size: 14px;
 }
+
 .post-entry {
   position: relative;
   margin-bottom: var(--gap);
@@ -247,16 +286,20 @@ img {
   border-radius: var(--radius);
   transition: transform 0.1s;
 }
+
 .post-entry:active {
   transform: scale(0.96);
 }
+
 .tag-entry .entry-content,
 .tag-entry .entry-footer {
   display: none;
 }
+
 .entry-header h2 {
   font-size: 24px;
 }
+
 .entry-content {
   margin-top: 8px;
   margin-bottom: 8px;
@@ -268,10 +311,12 @@ img {
   -webkit-box-orient: vertical;
   -webkit-line-clamp: 2;
 }
+
 .entry-footer {
   color: var(--secondary);
   font-size: 13px;
 }
+
 .entry-link {
   position: absolute;
   left: 0;
@@ -279,32 +324,39 @@ img {
   top: 0;
   bottom: 0;
 }
+
 /* Post single
 -------------------------------------------------- */
 .post-header {
   margin-top: 24px;
   margin-bottom: var(--content-gap);
 }
+
 .post-title {
   margin-bottom: 2px;
   font-size: 40px;
   transform: translateX(-2px);
 }
+
 .post-meta {
   color: var(--secondary);
   font-size: 14px;
 }
+
 .post-content {
   color: var(--content);
 }
+
 .post-content h1 {
   margin-top: 40px;
   margin-bottom: 32px;
 }
+
 .post-content h2 {
   margin-top: 32px;
   margin-bottom: 24px;
 }
+
 .post-content h3,
 .post-content h4,
 .post-content h5,
@@ -312,74 +364,93 @@ img {
   margin-top: 24px;
   margin-bottom: 16px;
 }
+
 .post-content h1 {
   font-size: 40px;
 }
+
 .post-content h2 {
   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 {
   box-shadow: 0 1px 0 var(--primary);
 }
+
 .post-content a code {
   margin-left: 0;
   margin-right: 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 p,
 .post-content ul,
 .post-content ol,
 .post-content dl {
   margin-bottom: var(--content-gap);
 }
+
 .post-content ul,
 .post-content ol {
   padding-left: 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-left: 0;
   padding-left: 10px;
 }
+
 .post-content dt~dt,
 .post-content dd~dd {
   margin-top: 10px;
 }
+
 .post-content table {
   margin-bottom: 32px;
 }
+
 .post-content table th,
 .post-content table:not(.highlighttable) td {
   min-width: 80px;
@@ -387,14 +458,17 @@ img {
   line-height: 1.5;
   border-bottom: 1px solid var(--border);
 }
+
 .post-content table th {
   font-size: 14px;
   text-align: left;
 }
+
 .post-content table:not(.highlighttable) td code:only-child {
   margin-left: 0;
   margin-right: 0;
 }
+
 .post-content .highlight,
 .post-content pre {
   margin-left: calc(var(--gap) * -1);
@@ -403,31 +477,39 @@ img {
   background: var(--hljs-bg) !important;
   border-radius: var(--radius);
 }
+
 .post-content ul pre {
   margin-left: calc(var(--gap) * -2);
 }
+
 .post-content .highlight pre {
   margin-left: 0;
   margin-right: 0;
   margin-bottom: 0;
 }
+
 /* table */
 .post-content .highlighttable {
   table-layout: fixed;
 }
+
 .post-content .highlighttable td:first-child {
   width: 40px;
 }
+
 .post-content .highlighttable td .linenodiv {
   padding-right: 0 !important;
 }
+
 .post-content .highlighttable td .linenodiv pre,
 .post-content .highlighttable td .highlight {
   margin-bottom: 0;
 }
+
 .post-content .highlighttable td .highlight pre code::-webkit-scrollbar {
   display: none;
 }
+
 /* inline */
 .post-content .highlight span {
   background: transparent !important;
@@ -443,6 +525,7 @@ img {
   background: var(--code-bg);
   border-radius: 2px;
 }
+
 .post-content pre code {
   display: block;
   margin-left: 0;
@@ -452,11 +535,13 @@ img {
   background: transparent;
   border-radius: 0;
 }
+
 .post-content blockquote {
   margin: 0 0 0 calc(var(--gap) * -1);
   padding: 0 0 0 21px;
   border-left: 3px solid var(--primary);
 }
+
 .post-content hr {
   height: 1px;
   margin-top: 56px;
@@ -465,18 +550,23 @@ img {
   border-top: 0;
   border-bottom: 0;
 }
+
 .post-content iframe {
   max-width: 100%;
 }
+
 .post-footer {
   margin-top: 56px;
 }
+
 .post-tags li {
   display: inline-block;
 }
+
 .post-tags li+li {
   margin-left: 3px;
 }
+
 .post-tags a {
   display: block;
   padding-left: 14px;
@@ -487,9 +577,11 @@ img {
   background: var(--code-bg);
   border-radius: 4px;
 }
+
 .post-tags a:hover {
   background: var(--border);
 }
+
 /* Footer
 -------------------------------------------------- */
 .footer {
@@ -502,17 +594,21 @@ img {
   text-align: center;
   line-height: 24px;
 }
+
 .footer span {
   margin-left: 1px;
   margin-right: 1px;
 }
+
 .footer a {
   color: inherit;
 }
+
 .footer a:hover {
   color: var(--primary);
   border-bottom: 1px solid var(--primary);
 }
+
 /* 404
 -------------------------------------------------- */
 .not-found {