diff options
Diffstat (limited to 'tiddlers/日历.tid')
| -rw-r--r-- | tiddlers/日历.tid | 198 |
1 files changed, 198 insertions, 0 deletions
diff --git a/tiddlers/日历.tid b/tiddlers/日历.tid new file mode 100644 index 0000000..0879c6a --- /dev/null +++ b/tiddlers/日历.tid @@ -0,0 +1,198 @@ +created: 20260726115524737 +modified: 20260726115525862 +tags: 🍀 +title: 日历 +type: text/vnd.tiddlywiki + +<style> +.tc-journal-calendar { + width: 100%; +} + +.tc-journal-calendar-view-switcher, +.tc-journal-calendar-month-controls { + display: flex; + flex-wrap: wrap; + justify-content: center; + gap: 0.5rem; + margin-bottom: 1rem; +} + +.tc-journal-calendar-switch, +.tc-journal-calendar-nav { + padding: 0.35rem 0.8rem; + border: 1px solid <<colour tiddler-border>>; + border-radius: 999px; +} + +.tc-journal-calendar-switch.tc-selected { + color: <<colour background>>; + background: <<colour primary>>; +} + +.tc-journal-calendar-month { + margin-bottom: 2rem; +} + +.tc-journal-calendar-month-title { + margin: 0 0 0.75rem; + text-align: center; +} + +.tc-journal-calendar-viewport { + width: 100%; + overflow-x: auto; + overscroll-behavior-x: contain; +} + +.tc-journal-calendar-grid { + display: grid; + grid-template-columns: repeat(7,minmax(5.5rem,1fr)); + min-width: 38.5rem; + gap: 1px; + background: <<colour tiddler-border>>; + border: 1px solid <<colour tiddler-border>>; + border-radius: 0.5rem; + overflow: hidden; +} + +.tc-journal-calendar-weekday { + padding: 0.55rem 0.25rem; + font-weight: 600; + text-align: center; + background: <<colour sidebar-tab-background>>; +} + +.tc-journal-calendar-day { + min-height: 6rem; + padding: 0.45rem; + background: <<colour tiddler-background>>; +} + +.tc-journal-calendar-day-empty { + background: <<colour sidebar-tab-background>>; +} + +.tc-journal-calendar-day-has-journal { + background: <<colour tiddler-background>>; +} + +.tc-journal-calendar-day-link { + display: inline-flex; + align-items: center; + justify-content: center; + min-width: 1.7rem; + height: 1.7rem; + color: <<colour background>>; + background: <<colour primary>>; + border-radius: 50%; +} + +.tc-journal-calendar-day-link:hover, +.tc-journal-calendar-day-link:focus { + text-decoration: underline; +} + +.tc-journal-calendar-day-today .tc-journal-calendar-day-number { + box-shadow: 0 0 0 2px <<colour primary>>; + border-radius: 50%; +} + +.tc-journal-calendar-day-number { + margin-bottom: 0.35rem; + font-weight: 600; +} + +.tc-journal-calendar-tag { + display: block; + max-width: 100%; + width: 100%; + margin-top: 0.25rem; + padding: 0.25rem 0.35rem; + text-align: left; + line-height: 1.25; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + border-radius: 0.3rem; + background: <<colour sidebar-tab-background>>; +} + +.tc-journal-calendar-tag:hover, +.tc-journal-calendar-tag:focus { + text-decoration: underline; +} + +.tc-journal-calendar-empty { + padding: 2rem; + color: <<colour muted-foreground>>; + text-align: center; +} + +@media (max-width: 600px) { + .tc-journal-calendar-view-switcher { + display: grid; + grid-template-columns: repeat(2,minmax(0,1fr)); + gap: 0.35rem; + } + + .tc-journal-calendar-month-controls { + display: grid; + grid-template-columns: repeat(3,minmax(0,1fr)); + gap: 0.35rem; + } + + .tc-journal-calendar-switch, + .tc-journal-calendar-nav { + min-height: 2.75rem; + padding: 0.35rem 0.25rem; + } + + .tc-journal-calendar-month { + margin-bottom: 1.25rem; + } + + .tc-journal-calendar-month-title { + font-size: 1.25rem; + } + + .tc-journal-calendar-viewport { + overflow-x: visible; + } + + .tc-journal-calendar-grid { + grid-template-columns: repeat(7,minmax(0,1fr)); + min-width: 0; + } + + .tc-journal-calendar-weekday { + padding: 0.45rem 0; + font-size: 0.8rem; + } + + .tc-journal-calendar-day { + min-width: 0; + min-height: 4.5rem; + padding: 0.2rem; + } + + .tc-journal-calendar-day-number { + margin-bottom: 0.2rem; + font-size: 0.85rem; + } + + .tc-journal-calendar-day-link { + min-width: 1.75rem; + height: 1.75rem; + } + + .tc-journal-calendar-tag { + margin-top: 0.15rem; + padding: 0.15rem 0.2rem; + font-size: 0.7rem; + text-align: center; + } +} +</style> + +<$journal-calendar tag="日志" view="switchable"/> |