Repos / pytaku / 33f6f97ff0
commit 33f6f97ff0d59dec604ce289d170d5f1f1feb82a
Author: Nhân <hi@imnhan.com>
Date: Sun Jan 7 11:48:31 2024 +0700
dark mode: make link buttons dark
Latest version of `prettier` auto-inserts trailing comma in arg list,
which is an ES8 feature so jshintrc needed a config update too.
Removed unnecessary `.follows--chapter` class and the unused `::after`
rule.
diff --git a/.jshintrc b/.jshintrc
index d46f595..d969b63 100644
--- a/.jshintrc
+++ b/.jshintrc
@@ -1,6 +1,6 @@
{
"laxbreak": true,
- "esversion": 6,
+ "esversion": 8,
"strict": "implied",
"browser": true,
"globals": {
diff --git a/src/pytaku/js-src/routes/follows.js b/src/pytaku/js-src/routes/follows.js
index 1e39485..8663319 100644
--- a/src/pytaku/js-src/routes/follows.js
+++ b/src/pytaku/js-src/routes/follows.js
@@ -17,27 +17,37 @@ const Title = {
href: `/m/${title.site}/${title.id}`,
title: `${title.name} - ${title.site}`,
},
- [m("img.follows--cover", { src: title.thumbnail, alt: title.name })]
+ [
+ m("img.follows--cover", {
+ src: title.thumbnail,
+ alt: title.name,
+ }),
+ ],
),
]),
m("div.follows--chapters", [
title.chapters.length > numChaptersToDisplay
- ? m(
- m.route.Link,
- {
- href: `/m/${title.site}/${title.id}`,
- class: "follows--chapter follows--more",
- },
- `and ${title.chapters.length - numChaptersToDisplay} more...`
- )
+ ? m("div.utils--chapter", [
+ m(
+ m.route.Link,
+ {
+ href: `/m/${title.site}/${title.id}`,
+ style: {
+ "font-style": "italic",
+ },
+ class: "touch-friendly",
+ },
+ `and ${title.chapters.length - numChaptersToDisplay} more...`,
+ ),
+ ])
: "",
title.chapters
.slice(-numChaptersToDisplay)
.map((chapter) =>
- m(Chapter, { site: title.site, titleId: title.id, chapter })
+ m(Chapter, { site: title.site, titleId: title.id, chapter }),
),
]),
- ]
+ ],
);
},
};
diff --git a/src/pytaku/static/darkmode.css b/src/pytaku/static/darkmode.css
index 1af0e15..bb94d4e 100644
--- a/src/pytaku/static/darkmode.css
+++ b/src/pytaku/static/darkmode.css
@@ -14,4 +14,8 @@ @media (prefers-color-scheme: dark) {
.title--descriptions {
background-color: #555;
}
+
+ a.touch-friendly {
+ background-color: silver;
+ }
}
diff --git a/src/pytaku/static/spa.css b/src/pytaku/static/spa.css
index 808fe1e..e385799 100644
--- a/src/pytaku/static/spa.css
+++ b/src/pytaku/static/spa.css
@@ -256,25 +256,6 @@ .follows--chapters {
padding: 0.5rem 0.5rem 0.5rem 0;
}
-.follows--chapter {
- display: block;
- margin-bottom: 0.5rem;
- background-color: white;
- border: 1px solid #999;
- padding: 6px;
- border-radius: 5px;
- text-decoration: none;
- color: black;
-}
-.follows--chapter:hover {
- background-color: #eee;
-}
-.follows--chapter:last-child::after {
- content: "← resume here";
- background-color: cornsilk;
- white-space: nowrap;
-}
-
.follows--group {
font-size: 0.9em;
background-color: #ddd;
@@ -283,11 +264,6 @@ .follows--group {
padding: 2px 5px;
}
-.follows--more {
- display: inline-block;
- font-style: italic;
-}
-
@media (max-width: 399px) {
.follows--title {
flex-direction: column;