test
All checks were successful
Docker Build & Deploy / Build Docker Image (push) Successful in 19s
Docker Build & Deploy / Deploy to Production (push) Successful in 7s
Docker Build & Deploy / Cleanup Dangling Images (push) Successful in 1s
Docker Build & Deploy / WeChat Notification (push) Successful in 1s
All checks were successful
Docker Build & Deploy / Build Docker Image (push) Successful in 19s
Docker Build & Deploy / Deploy to Production (push) Successful in 7s
Docker Build & Deploy / Cleanup Dangling Images (push) Successful in 1s
Docker Build & Deploy / WeChat Notification (push) Successful in 1s
This commit is contained in:
@@ -69,8 +69,8 @@ const totalCount = ref(0);
|
||||
const scrollContainer = ref(null);
|
||||
const thresholds = ref([2, 4, 7]); // Default thresholds
|
||||
|
||||
const CELL_SIZE = 10;
|
||||
const CELL_GAP = 2;
|
||||
const CELL_SIZE = 15;
|
||||
const CELL_GAP = 3;
|
||||
const WEEK_WIDTH = CELL_SIZE + CELL_GAP;
|
||||
|
||||
const formatDate = (d) => {
|
||||
@@ -310,11 +310,10 @@ onMounted(() => {
|
||||
.weekday-col-fixed {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
padding-top: 19px; /* Align with cells (month row height 15px + margin 4px) */
|
||||
margin-right: 6px;
|
||||
font-size: 9px;
|
||||
height: 101px; /* Total height: 15 (month) + 4 (margin) + 82 (grid) */
|
||||
height: 142px; /* Total height: 15 (month) + 4 (margin) + 123 (grid) */
|
||||
color: var(--van-text-color-2);
|
||||
flex-shrink: 0;
|
||||
z-index: 10;
|
||||
@@ -322,26 +321,58 @@ onMounted(() => {
|
||||
}
|
||||
|
||||
.weekday-label {
|
||||
height: 10px;
|
||||
line-height: 10px;
|
||||
margin-top: 10px;
|
||||
height: 15px;
|
||||
line-height: 15px;
|
||||
margin-top: 15px; /* (15 cell + 3 gap)*2 - 15 height - previous margin? No. */
|
||||
/*
|
||||
Row 0: 0px top
|
||||
Row 1: 18px top (15+3) - Label "二" aligns here? No, "二" is usually row 1 (index 1, 2nd row)
|
||||
If we want to align with 2nd, 4th, 6th rows (indices 1, 3, 5):
|
||||
|
||||
Row 0: y=0
|
||||
Row 1: y=18
|
||||
Row 2: y=36
|
||||
Row 3: y=54
|
||||
Row 4: y=72
|
||||
Row 5: y=90
|
||||
Row 6: y=108
|
||||
|
||||
Label 1 ("二") at Row 1 (y=18)
|
||||
Label 2 ("四") at Row 3 (y=54)
|
||||
Label 3 ("六") at Row 5 (y=90)
|
||||
|
||||
Padding-top of container is 19px.
|
||||
First label margin-top: 18px
|
||||
Second label margin-top: (54 - (18+15)) = 21px
|
||||
Third label margin-top: (90 - (54+15)) = 21px
|
||||
|
||||
Let's try standard spacing.
|
||||
Gap between tops is 36px (2 rows).
|
||||
Height of label is 15px.
|
||||
Margin needed is 36 - 15 = 21px.
|
||||
|
||||
First label top needs to be at 18px relative to grid start.
|
||||
Container padding-top aligns with grid start (row 0 top).
|
||||
So first label margin-top should be 18px.
|
||||
*/
|
||||
margin-top: 21px;
|
||||
}
|
||||
.weekday-label:first-child { margin-top: 14px; }
|
||||
.weekday-label:first-child { margin-top: 18px; }
|
||||
|
||||
.heatmap-grid {
|
||||
display: flex;
|
||||
gap: 2px;
|
||||
gap: 3px;
|
||||
}
|
||||
|
||||
.heatmap-week {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 2px;
|
||||
gap: 3px;
|
||||
}
|
||||
|
||||
.heatmap-cell {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
border-radius: 2px;
|
||||
background-color: var(--van-gray-2);
|
||||
box-sizing: border-box;
|
||||
@@ -404,12 +435,12 @@ onMounted(() => {
|
||||
.legend {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 2px;
|
||||
gap: 3px;
|
||||
}
|
||||
|
||||
.legend-item {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
border-radius: 2px;
|
||||
}
|
||||
</style>
|
||||
@@ -78,7 +78,7 @@ onMounted(async () => {
|
||||
await nextTick();
|
||||
setTimeout(() => {
|
||||
// 计算页面高度,滚动3/4高度以显示更多日期
|
||||
const height = document.querySelector(".calendar-container").clientHeight * 0.50;
|
||||
const height = document.querySelector(".calendar-container").clientHeight * 0.43;
|
||||
document.querySelector(".van-calendar__body").scrollBy({
|
||||
top: -height,
|
||||
behavior: "smooth",
|
||||
@@ -315,7 +315,7 @@ onBeforeUnmount(() => {
|
||||
}
|
||||
|
||||
.calendar-container :deep(.van-calendar) {
|
||||
height: calc(auto + 20px) !important;
|
||||
height: calc(auto + 40px) !important;
|
||||
flex: 1;
|
||||
overflow: auto;
|
||||
margin: 0;
|
||||
|
||||
Reference in New Issue
Block a user