jiazhizhong/OpenIsle
1
0
Fork 0
mirror of https://github.com/nagisa77/OpenIsle.git synced 2026-06-09 11:39:31 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: scroller ui

Browse Source
This commit is contained in:
tim
2025-07-03 19:52:08 +08:00
parent e184afae9b
commit 31f1aa2145
2 changed files with 18 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
open-isle-cli/src/assets/global.css
View File

@@ -6,6 +6,7 @@
--menu-background-color: white; --menu-background-color: white;
--menu-border-color: lightgray; --menu-border-color: lightgray;
--menu-selected-background-color: rgba(208, 250, 255, 0.659); --menu-selected-background-color: rgba(208, 250, 255, 0.659);
--scroller-background-color: rgba(130, 175, 180, 0.5);
--normal-background-color: lightgrrgb(208, 246, 255) --normal-background-color: lightgrrgb(208, 246, 255)
--menu-width: 200px; --menu-width: 200px;
--page-max-width: 1200px; --page-max-width: 1200px;

32
open-isle-cli/src/views/PostPageView.vue
View File

@@ -258,22 +258,24 @@ export default {
.post-page-scroller-container { .post-page-scroller-container {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center;
justify-content: center;
width: 15%; width: 15%;
background-color: #f0f0f0; }
.scroller {
margin-top: 20px;
margin-left: 20px;
} }
.scroller-time { .scroller-time {
font-size: 14px; font-size: 14px;
opacity: 0.7; opacity: 0.5;
} }
.scroller-middle { .scroller-middle {
margin: 10px 0; margin: 10px 0;
margin-left: 10px;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center;
gap: 8px; gap: 8px;
} }
@@ -287,20 +289,19 @@ export default {
} }
.scroller-range::-webkit-slider-runnable-track { .scroller-range::-webkit-slider-runnable-track {
width: 2px; width: 1px;
height: 100%; height: 100%;
background-color: #ccc; background-color: var(--scroller-background-color);
border-radius: 1px;
} }
.scroller-range::-webkit-slider-thumb { .scroller-range::-webkit-slider-thumb {
-webkit-appearance: none; -webkit-appearance: none;
width: 10px; width: 6px;
height: 10px; height: 60px;
background-color: #333; right: 2px;
border-radius: 50%; border-radius: 3px;
background-color: var(--scroller-background-color);
cursor: pointer; cursor: pointer;
margin-top: -4px;
} }
.scroller-range::-moz-range-track { .scroller-range::-moz-range-track {
@@ -319,8 +320,9 @@ export default {
} }
.scroller-index { .scroller-index {
font-size: 14px; font-size: 17px;
opacity: 0.7; font-weight: bold;
margin-top: 10px;
} }
.article-title-container { .article-title-container {