Repos / hi.imnhan.com / 1392452749
commit 1392452749f3df9f2606c27906b3d1ad7ec479b1
Author: Bùi Thành Nhân <hi@imnhan.com>
Date: Sun Oct 10 12:39:19 2021 +0700
more theming tweaks
- change ::before link symbol to make sure it doesn't fall back to
another font, eliminating the vertical alignment problem.
- consistent 1px borders
- state-of-the-art gradient background
- make sure easter egg hint only shows up on javascript-enabled browsers
diff --git a/nhanb-theme/static/css/index.css b/nhanb-theme/static/css/index.css
index b0c9bdf..5591a94 100644
--- a/nhanb-theme/static/css/index.css
+++ b/nhanb-theme/static/css/index.css
@@ -22,9 +22,8 @@ .article-list time {
@media (min-width: 760px) {
.article:hover::before {
position: absolute;
- margin-left: -1.2rem;
- color: black;
- content: "➜";
- line-height: 1.1rem;
+ margin-left: -1rem;
+ color: var(--fg-color);
+ content: "$";
}
}
diff --git a/nhanb-theme/static/css/main.css b/nhanb-theme/static/css/main.css
index 43aa1c6..6e85f5c 100644
--- a/nhanb-theme/static/css/main.css
+++ b/nhanb-theme/static/css/main.css
@@ -1,11 +1,13 @@
html {
--bg-color: cornsilk;
+ --bg-color2: palegoldenrod;
--fg-color: black;
--link-color: black;
--hr-border: 2px solid var(--link-color);
font-size: 100%;
- background-color: var(--bg-color);
+ background-color: var(--bg-color2);
+ background: linear-gradient(var(--bg-color), var(--bg-color2));
color: var(--fg-color);
/* always show vertical scrollbar to avoid content shifting: */
overflow-y: scroll;
@@ -76,8 +78,7 @@ figcaption {
blockquote {
background-color: blanchedalmond;
- border: 2px solid burlywood;
- border-left: 1rem solid burlywood;
+ border: 1px solid burlywood;
padding: 5px;
padding-left: 7px;
margin-left: 2rem;
@@ -118,7 +119,6 @@ code {
p code,
li code {
- background-color: blanchedalmond;
border: 1px solid #aaa;
padding: 0 3px;
}
diff --git a/nhanb-theme/templates/base.html b/nhanb-theme/templates/base.html
index 69f32d2..c3ce938 100644
--- a/nhanb-theme/templates/base.html
+++ b/nhanb-theme/templates/base.html
@@ -47,9 +47,14 @@ <h2 id="site-subtitle">{{ SITESUBTITLE}}</h2>
{{ AUTHOR }}
<br>
{{ FOOTER_TEXT }}
- <p style="color: beige; font-size: .7rem; margin: 0;">
- Bored? Try entering the Konami code (PC only).
+ <p
+ class="easter-egg"
+ style="display: none; font-size: .7em; margin: 0; color: var(--bg-color2);">
+ Bored? Try entering the Konami code from your keyboard.
</p>
+ <script>
+ document.querySelector('.easter-egg').style.display = 'block';
+ </script>
</footer>
</div>