obsidian-plugin/prncc_obsidian-repeat-plugin
1
0
Fork 0
mirror of https://github.com/prncc/obsidian-repeat-plugin.git synced 2026-07-22 06:50:25 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions
prncc_obsidian-repeat-plugin/styles.css

265 lines
5 KiB
CSS
Raw Permalink Normal View History

Update status message styles and wording
2022-09-25 05:33:22 +00:00
.repeat-message {
text-align: center;
Add a message setter so that element is hidden until used
2022-10-03 02:25:45 +00:00
margin-top: 24px;
Update status message styles and wording
2022-09-25 05:33:22 +00:00
}
Center buttons and make them full width on tiny screens
2022-09-25 05:47:04 +00:00
.repeat-buttons {
text-align: center;
Refresh button margins after Obsidian's 1.0.0 update
2022-10-23 00:40:55 +00:00
margin-bottom: 24px;
Center buttons and make them full width on tiny screens
2022-09-25 05:47:04 +00:00
}
.repeat-buttons > button {
Refresh button margins after Obsidian's 1.0.0 update
2022-10-23 00:40:55 +00:00
margin-top: 16px;
margin-left: 16px;
Center buttons and make them full width on tiny screens
2022-09-25 05:47:04 +00:00
}
Add a refresh button when reviews are done
2022-11-13 01:52:43 +00:00
.repeat-buttons > button:first-child {
margin-left: 0;
}
Center buttons and make them full width on tiny screens
2022-09-25 05:47:04 +00:00
/* Make buttons legible on mobile. */
@media (max-width: 450px) {
.repeat-buttons > button {
width: 100%;
Refresh button margins after Obsidian's 1.0.0 update
2022-10-23 00:40:55 +00:00
margin-left: 0;
Center buttons and make them full width on tiny screens
2022-09-25 05:47:04 +00:00
}
}
Implement a sketch of the repetition interface
2022-09-19 02:33:16 +00:00
.repeat-embedded_note {
padding: 15px 30px;
Limit the width of the note being reviewed This addresses #4 by always making the note narrow. It would be better to only apply this style if Editor > Readable line length is toggled on, if it's posible to inspect user settings.
2022-11-02 04:03:11 +00:00
max-width: var(--file-line-width);
margin-left: auto;
margin-right: auto;
Implement a sketch of the repetition interface
2022-09-19 02:33:16 +00:00
}
Add a reactive datetime picker to the repeat setup modal
2022-09-30 03:57:41 +00:00
Move title element's custom styles to a class so they can be user-overriden
2022-10-03 02:29:16 +00:00
.repeat-markdown_embed_title {
text-overflow: inherit;
white-space: normal;
}
Add small margin to top of repeat setup modal
2022-10-03 03:03:13 +00:00
.repeat-setup_modal {
margin-top: 24px;
}
Add the hidden frontmatter field (#18) * Support the hidden Repetition field * Blur notes with hidden: true in the repeat view * Allow empty repetition in getRepeatChoices * Rename replaceOrInsertFields -> updateRepetitionMetadata About to change the logic to be repetition-specific, so this will better reflect the semantics. * Parse the hidden field in every X commands * Add a toggle for the hidden field to the repetition modal * Serialize repetition fully and update metadata writing logic * Parse hidden field as a boolean * Refactor 'hidden' field parsing into utility function * Remove unused imports * Use constant for serialized hidden value
2023-02-21 01:00:53 +00:00
.repeat-markdown_blurred {
filter: blur(5px);
}
Add a reactive datetime picker to the repeat setup modal
2022-09-30 03:57:41 +00:00
/* 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;
Fix CSS comments
2022-10-03 03:05:59 +00:00
height: 39px; /* Deduced experimentally. */
Add a reactive datetime picker to the repeat setup modal
2022-09-30 03:57:41 +00:00
}
.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);
}
Add mostly tag-based filtering to review interface (#46) * 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
2026-01-06 05:22:04 +00:00
/* 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%;
}
}
Reference in a new issue Copy permalink