Compare commits

..

No commits in common. "38c6090edc2d083fbd445ea51949943251895257" and "c0e7882278ab307efe5340ae2c41cf2a65b18733" have entirely different histories.

4 changed files with 11 additions and 61 deletions

View file

@ -31,8 +31,6 @@ const data = Astro.props;
list-style: none; list-style: none;
margin: 0 0 1rem 0; margin: 0 0 1rem 0;
padding-left: 0; padding-left: 0;
padding-bottom: 1.7rem;
padding-top: 1.7rem;
} }
.post-link { .post-link {
@ -55,18 +53,7 @@ const data = Astro.props;
} }
.post-title { .post-title {
font-family: font-family: "Maple Mono", "Maple Mono CN";
sans-serif,
system-ui,
-apple-system,
BlinkMacSystemFont,
"Segoe UI",
Roboto,
Oxygen,
Ubuntu,
Cantarell,
"Open Sans",
"Helvetica Neue";
color: inherit; color: inherit;
font-weight: 700; font-weight: 700;
font-size: 1.34rem; font-size: 1.34rem;

View file

@ -95,11 +95,11 @@ const {
#back-to-top { #back-to-top {
width: 3rem; width: 3rem;
height: 3rem; height: 3rem;
border: #a7a7a7 1.5px solid; border: #a7a7a7 2px solid;
border-radius: 999px; border-radius: 999px;
background: rgba(255, 255, 255, 0.92); background: rgba(255, 255, 255, 0.92);
color: #222; color: #222;
/* box-shadow: 0 4px 14px rgba(0, 0, 0, 0.16); */ box-shadow: 0 4px 14px rgba(0, 0, 0, 0.16);
cursor: pointer; cursor: pointer;
display: flex; display: flex;
align-items: center; align-items: center;
@ -151,12 +151,12 @@ const {
#theme-toggle-fab, #theme-toggle-fab,
#back-to-top { #back-to-top {
/* opacity: 0; */ opacity: 0;
visibility: hidden; visibility: hidden;
transform: translateY(150px); transform: translateY(10px);
transition: transition:
opacity 0.2s ease, opacity 0.2s ease,
transform 0.27s ease, transform 0.2s ease,
visibility 0.2s ease; visibility 0.2s ease;
} }

View file

@ -14,7 +14,6 @@ const t = getTranslations(lang);
description={frontmatter.description} description={frontmatter.description}
image={frontmatter.image?.url} image={frontmatter.image?.url}
> >
<div id="reading-progress" aria-hidden="true"></div>
<a <a
href="/" href="/"
class="back-button" class="back-button"
@ -131,39 +130,11 @@ const t = getTranslations(lang);
backButton.dataset.bound = "true"; backButton.dataset.bound = "true";
} }
}; };
const updateProgress = () => {
const doc = document.documentElement;
const scrollTop = window.scrollY || doc.scrollTop;
const scrollHeight = doc.scrollHeight - window.innerHeight;
const progress = scrollHeight > 0 ? (scrollTop / scrollHeight) * 100 : 0;
const bar = document.getElementById("reading-progress");
if (bar) {
bar.style.width = `${Math.min(progress, 100)}%`;
}
};
updateProgress();
window.addEventListener("scroll", updateProgress, { passive: true });
window.addEventListener("resize", updateProgress);
initFloatingActions(); initFloatingActions();
document.addEventListener("astro:page-load", initFloatingActions); document.addEventListener("astro:page-load", initFloatingActions);
</script> </script>
<style> <style>
#reading-progress {
position: fixed;
top: 0;
left: 0;
z-index: 9999;
width: 0;
height: 3px;
background: #5a89ff;
transition: width 0.08s linear;
pointer-events: none;
}
.back-button { .back-button {
position: fixed; position: fixed;
top: 1.25rem; top: 1.25rem;
@ -175,18 +146,18 @@ const t = getTranslations(lang);
align-items: center; align-items: center;
justify-content: center; justify-content: center;
text-decoration: none; text-decoration: none;
border: #285ee9 1.5px solid; border: #285ee9 2px solid;
background: rgba(255, 255, 255, 0.92); background: rgba(255, 255, 255, 0.92);
color: #222; color: #222;
/* box-shadow: 0 4px 14px rgba(0, 0, 0, 0.16); */ box-shadow: 0 4px 14px rgba(0, 0, 0, 0.16);
backdrop-filter: blur(6px); backdrop-filter: blur(6px);
z-index: 1000; z-index: 1000;
visibility: hidden; visibility: hidden;
transform: translateY(-80px); transform: translateY(10px);
/* opacity: 0; */ opacity: 0;
transition: transition:
opacity 0.2s ease, opacity 0.2s ease,
transform 0.27s ease, transform 0.2s ease,
visibility 0.2s ease; visibility 0.2s ease;
box-shadow 0.2s ease, box-shadow 0.2s ease,
background 0.2s ease, background 0.2s ease,

View file

@ -93,14 +93,6 @@ html.dark body::after {
} }
@media (max-width: 700px) { @media (max-width: 700px) {
code {
font-size: 0.92rem;
}
body {
font-size: 1rem;
}
body::after { body::after {
opacity: 0; opacity: 0;
} }