summaryrefslogtreecommitdiff
path: root/_sass
diff options
context:
space:
mode:
author裸奔狂甩丁丁 <30397306+StreakingMan@users.noreply.github.com>2022-04-05 22:51:38 +0800
committerGitHub <noreply@github.com>2022-04-05 22:51:38 +0800
commitffb0e94ff53d3585efd7acad7560dd11a153f5e6 (patch)
treef537f5827810c902830da5cc33255abaa47d792a /_sass
parentad83aa4302f035ab2f76f2f239e8748fa3e9f0c7 (diff)
feat: click to top (#84)
Diffstat (limited to '_sass')
-rw-r--r--_sass/misc/click-to-top.scss46
-rw-r--r--_sass/yat.scss3
2 files changed, 48 insertions, 1 deletions
diff --git a/_sass/misc/click-to-top.scss b/_sass/misc/click-to-top.scss
new file mode 100644
index 0000000..00f543c
--- /dev/null
+++ b/_sass/misc/click-to-top.scss
@@ -0,0 +1,46 @@
+.click-to-top {
+ transition: 0.3s;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ position: fixed;
+ width: 64px;
+ height: 64px;
+ border-radius: 32px;
+ right: 60px;
+ bottom: 48px;
+ background: white;
+ cursor: pointer;
+ opacity: 0;
+ transform: translateY(10px);
+ box-shadow: 0 2px 15px rgba(0, 0, 0, 0.15);
+ font-size: 24px;
+ user-select: none;
+
+ @include media-query(1024px) {
+ width: 48px;
+ height: 48px;
+ border-radius: 24px;
+ right: 35px;
+ font-size: 20px;
+ }
+
+ @include media-query($on-palm) {
+ width: 36px;
+ height: 36px;
+ border-radius: 18px;
+ right: 20px;
+ font-size: 16px;
+ }
+}
+
+.click-to-top.show {
+ opacity: 1;
+ transform: translateY(0);
+}
+
+html[data-theme="dark"] {
+ .click-to-top {
+ background: #34323D;
+ }
+}
diff --git a/_sass/yat.scss b/_sass/yat.scss
index 5d1a631..eda2d97 100644
--- a/_sass/yat.scss
+++ b/_sass/yat.scss
@@ -65,5 +65,6 @@ $on-laptop: 800px !default;
"misc/article-menu",
"misc/common-list",
"misc/google-translate",
- "misc/gitment"
+ "misc/gitment",
+ "misc/click-to-top"
;