mirror of
https://github.com/prncc/obsidian-repeat-plugin.git
synced 2026-07-22 06:50:25 +00:00
a71dc21494
* Add tag-based filtering to review interface Filter due notes using Dataview FROM expressions. Features: - Collapsible filter drawer with tag shortcuts showing counts - Custom query input supporting tags, folders, and complex expressions - Save/load/delete named filter presets - Filter state persists between sessions - Shows filtered vs total count in header * Limit tag display to 6 with expandable +N more button - Show only 6 tags by default in filter shortcuts - Add clickable '+N more' button that loads 6 more tags each click - Style the button with dashed border and hover effect - Reset displayed count when view refreshes - Show filter name in count when using saved filters * Document tag filtering feature in README * Make status bar clickable and load faster - Click status bar item to open Repeat view - Show 'Repeat' text immediately, update count when Dataview ready - Check if Dataview index already initialized to avoid waiting * Update README with new screenshots and documentation - Replace old screenshots with new webp images - Simplify and reorganize documentation - Add filtering feature documentation
264 lines
5 KiB
CSS
264 lines
5 KiB
CSS
.repeat-message {
|
|
text-align: center;
|
|
margin-top: 24px;
|
|
}
|
|
|
|
.repeat-buttons {
|
|
text-align: center;
|
|
margin-bottom: 24px;
|
|
}
|
|
|
|
.repeat-buttons > button {
|
|
margin-top: 16px;
|
|
margin-left: 16px;
|
|
}
|
|
|
|
.repeat-buttons > button:first-child {
|
|
margin-left: 0;
|
|
}
|
|
|
|
/* Make buttons legible on mobile. */
|
|
@media (max-width: 450px) {
|
|
.repeat-buttons > button {
|
|
width: 100%;
|
|
margin-left: 0;
|
|
}
|
|
}
|
|
|
|
.repeat-embedded_note {
|
|
padding: 15px 30px;
|
|
max-width: var(--file-line-width);
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
|
|
.repeat-markdown_embed_title {
|
|
text-overflow: inherit;
|
|
white-space: normal;
|
|
}
|
|
|
|
.repeat-setup_modal {
|
|
margin-top: 24px;
|
|
}
|
|
|
|
.repeat-markdown_blurred {
|
|
filter: blur(5px);
|
|
}
|
|
|
|
/* Transferred from Obsidian's input[] styles. */
|
|
.repeat-date_picker {
|
|
background: var(--background-modifier-form-field);
|
|
border: 1px solid var(--background-modifier-border);
|
|
color: var(--text-normal);
|
|
font-family: inherit;
|
|
padding: 5px 14px;
|
|
font-size: 16px;
|
|
border-radius: 4px;
|
|
outline: none;
|
|
height: 39px; /* Deduced experimentally. */
|
|
}
|
|
.repeat-date_picker:hover {
|
|
background-color: var(--background-modifier-form-field-highlighted);
|
|
}
|
|
.repeat-date_picker:focus {
|
|
border-color: var(--interactive-accent);
|
|
}
|
|
.repeat-date_picker:::placeholder {
|
|
color: var(--text-faint);
|
|
}
|
|
|
|
/* Filter UI */
|
|
.repeat-filter {
|
|
padding: 8px 30px;
|
|
max-width: var(--file-line-width);
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
border-bottom: 1px solid var(--background-modifier-border);
|
|
}
|
|
|
|
.repeat-filter-header {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 8px;
|
|
cursor: pointer;
|
|
padding: 4px 0;
|
|
user-select: none;
|
|
}
|
|
|
|
.repeat-filter-header:hover {
|
|
color: var(--text-accent);
|
|
}
|
|
|
|
.repeat-filter-toggle-icon {
|
|
display: flex;
|
|
align-items: center;
|
|
color: var(--text-muted);
|
|
transition: color 0.15s ease;
|
|
}
|
|
|
|
.repeat-filter-toggle-icon svg {
|
|
width: 16px;
|
|
height: 16px;
|
|
}
|
|
|
|
.repeat-filter-expanded .repeat-filter-toggle-icon {
|
|
color: var(--text-normal);
|
|
}
|
|
|
|
.repeat-filter-content {
|
|
padding-top: 12px;
|
|
}
|
|
|
|
.repeat-filter-row {
|
|
display: flex;
|
|
gap: 8px;
|
|
align-items: center;
|
|
margin-bottom: 8px;
|
|
}
|
|
|
|
.repeat-filter-row:last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
/* Query Input */
|
|
.repeat-filter-query-input {
|
|
flex: 1;
|
|
background: var(--background-modifier-form-field);
|
|
border: 1px solid var(--background-modifier-border);
|
|
color: var(--text-normal);
|
|
font-family: inherit;
|
|
padding: 5px 10px;
|
|
font-size: 14px;
|
|
border-radius: 4px;
|
|
outline: none;
|
|
}
|
|
|
|
.repeat-filter-query-input:hover {
|
|
background-color: var(--background-modifier-form-field-highlighted);
|
|
}
|
|
|
|
.repeat-filter-query-input:focus {
|
|
border-color: var(--interactive-accent);
|
|
}
|
|
|
|
.repeat-filter-query-input::placeholder {
|
|
color: var(--text-faint);
|
|
}
|
|
|
|
/* Tag Shortcuts */
|
|
.repeat-filter-tags {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: 6px;
|
|
margin: 8px 0;
|
|
min-height: 28px;
|
|
}
|
|
|
|
.repeat-filter-tag {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
background: var(--background-secondary);
|
|
color: var(--text-normal);
|
|
padding: 4px 10px;
|
|
border-radius: 12px;
|
|
font-size: 12px;
|
|
border: 1px solid var(--background-modifier-border);
|
|
cursor: pointer;
|
|
}
|
|
|
|
.repeat-filter-tag:hover {
|
|
background: var(--interactive-accent);
|
|
color: var(--text-on-accent);
|
|
border-color: var(--interactive-accent);
|
|
}
|
|
|
|
.repeat-filter-tag-more {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
background: transparent;
|
|
border: 1px dashed var(--background-modifier-border);
|
|
color: var(--text-muted);
|
|
padding: 4px 10px;
|
|
border-radius: 12px;
|
|
font-size: 12px;
|
|
font-style: italic;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.repeat-filter-tag-more:hover {
|
|
background: var(--background-secondary);
|
|
color: var(--text-normal);
|
|
border-color: var(--text-muted);
|
|
}
|
|
|
|
/* Dropdowns */
|
|
.repeat-filter-dropdown {
|
|
flex: 1;
|
|
background: var(--background-modifier-form-field);
|
|
border: 1px solid var(--background-modifier-border);
|
|
color: var(--text-normal);
|
|
font-family: inherit;
|
|
padding: 5px 10px;
|
|
font-size: 14px;
|
|
border-radius: 4px;
|
|
outline: none;
|
|
}
|
|
|
|
.repeat-filter-dropdown:hover {
|
|
background-color: var(--background-modifier-form-field-highlighted);
|
|
}
|
|
|
|
.repeat-filter-dropdown:focus {
|
|
border-color: var(--interactive-accent);
|
|
}
|
|
|
|
/* Buttons */
|
|
.repeat-filter-btn {
|
|
padding: 5px 12px;
|
|
font-size: 13px;
|
|
background: var(--background-modifier-border);
|
|
border: none;
|
|
border-radius: 4px;
|
|
cursor: pointer;
|
|
color: var(--text-normal);
|
|
}
|
|
|
|
.repeat-filter-btn:hover {
|
|
background: var(--background-modifier-hover);
|
|
}
|
|
|
|
.repeat-filter-btn-danger:hover {
|
|
background: var(--background-modifier-error);
|
|
color: var(--text-on-accent);
|
|
}
|
|
|
|
/* Filter Count */
|
|
.repeat-filter-count {
|
|
font-size: 13px;
|
|
color: var(--text-muted);
|
|
}
|
|
|
|
/* Filter Error */
|
|
.repeat-filter-error {
|
|
text-align: center;
|
|
font-size: 12px;
|
|
color: var(--text-error);
|
|
margin-top: 4px;
|
|
}
|
|
|
|
/* Mobile responsiveness */
|
|
@media (max-width: 450px) {
|
|
.repeat-filter-row {
|
|
flex-direction: column;
|
|
align-items: stretch;
|
|
}
|
|
|
|
.repeat-filter-query-input,
|
|
.repeat-filter-dropdown {
|
|
width: 100%;
|
|
}
|
|
|
|
.repeat-filter-btn {
|
|
width: 100%;
|
|
}
|
|
}
|