├── .gitignore ├── Calendar.css ├── CardBoard.css ├── Checklist - Ultra compact.css ├── Custom Frames - Duotone.css ├── Custom Frames.css ├── Daily Note Outline.css ├── Database Folder.css ├── Day Planner (Ivan Lednev).css ├── Day Planner (old version).css ├── Excalidraw - Compact.css ├── Excel.css ├── Full Calendar (abandoned).css ├── Heatmap Calendar.css ├── MakeMD Inline Context - Duotone banner.css ├── MakeMD Inline Context - Faded banner.css ├── MakeMD Inline Context.css ├── MetaBind Compact.css ├── MySnippets.css ├── Obsidian Buttons (abandoned).css ├── Omnisearch.css ├── Outline.css ├── Quiet Outline.css ├── README.md ├── SheetsPlus - Darkmode.css ├── Smart2ndBrain.css ├── Task Progressbars.css ├── Tasks - Compact.css ├── Tasks - Expand dates on hover.css ├── Tasks - Mono Icons (lucide2).css ├── Tracker.css ├── [editor] Compact Right Sidebar notes.css ├── [editor] Custom Tag styles.css ├── [editor] Editor fixes.css ├── [editor] Frontmatter tweaks.css ├── [editor] Mono Emojis everywhere.css ├── [editor] Table tweaks.css ├── [editor] Typography fixes.css ├── [editor] debug.css ├── [font] Mono Emojis.css ├── [ui] Collapsible Right Headers.css ├── [ui] Compact File Explorer Legacy.css ├── [ui] Compact File Explorer.css ├── [ui] Compact Properties.css ├── [ui] Compact Sidebar.css ├── [ui] Compact Tab Header.css ├── [ui] Compact Tabs (classic).css ├── [ui] Compact Tabs.css ├── [ui] Custom Separators (gradient).css ├── [ui] Custom Separators.css ├── [ui] File Explorer Folder Icons (replace chevrons).css ├── [ui] File Explorer Folder Icons.css ├── [ui] File Explorer Header Autohide.css ├── [ui] Floating Tab Header mini.css ├── [ui] Floating Tab Header.css ├── [ui] Native Scrollbar styles.css ├── [ui] Resize Handles tweaks.css ├── [ui] Restrict last right sidebar panel.css ├── [ui] Statusbar tweaks.css ├── [ui] Tab Header on bottom.css ├── [ui] Tab Header show path and title.css ├── [ui] Top fade.css ├── [ui] Translucent Tab Header.css ├── [ui] Ultra Compact Sidebar.css ├── [ui] Ultra Compact Tab Header.css ├── [ui] Ultra Compact.css ├── [user] Daily Note - Sticky Headings.css ├── [user] Daily Note styles.css ├── [user] Lighter Banner images.css ├── [user] Scratchpad styles.css ├── [user] Themed colours.css ├── dummy.css └── screenshots ├── accents.gif ├── calendar.png ├── cardboard.png ├── checklist.png ├── collapsible-header.gif ├── compact-file-explorer-new.png ├── compact-file-explorer.png ├── compact-properties.gif ├── compact-sidebar-footer.png ├── compact-sidebar-header.png ├── compact-tab-header-plus.png ├── compact-tab-header.png ├── compact-tabs-classic.png ├── compact-tabs.png ├── custom-frames-duotone.png ├── custom-separators-gradient.png ├── custom-separators.png ├── custom-tags.png ├── daily-note-outline.png ├── dailynote-sticky.png ├── dayplanner-ivanlednev.png ├── dayplanner.png ├── dbfolder.png ├── excalidraw-compact.png ├── excel.png ├── file-explorer-folder-icons.png ├── file-explorer-header-autohide.gif ├── floating-tab-header-mini.gif ├── floating-tab-header.gif ├── makemd-duotone-fade-2025.png ├── makemdcontexts.png ├── makemdcontextsautohide.gif ├── makemdcontextsbannerduotone.png ├── makemdcontextsbannergradient.png ├── makemdinlinecontexts.gif ├── monoemojis.png ├── mysnippets.png ├── mysnippets_tweaks.png ├── omnisearch.png ├── outline.png ├── quietoutline.png ├── restrict-last-right-sidebar-panel.png ├── screenshot.png ├── sheets-plus.png ├── smart2ndbrain.png ├── tab-header-bottom.png ├── tab-header-translucent.png ├── taskprogressbars.png ├── tasks-compact.gif ├── tasks-dates-on-hover.gif ├── tasks-icons-lucide2.png ├── top-fade.png ├── typography-fixes.png ├── ultra-compact.png └── ultra.png /.gitignore: -------------------------------------------------------------------------------- 1 | vendor.*.css 2 | -------------------------------------------------------------------------------- /Calendar.css: -------------------------------------------------------------------------------- 1 | /* 2 | Calendar plugin tweaks 3 | https://github.com/replete/obsidian-minimal-theme-css-snippets 4 | */ 5 | 6 | .view-content:has(#calendar-container) { 7 | padding:0; 8 | } 9 | 10 | #calendar-container { 11 | padding:0 8px 8px 8px; 12 | } 13 | 14 | #calendar-container .year { 15 | color:var(--text-muted); 16 | } 17 | #calendar-container td, 18 | #calendar-container .day { 19 | border-radius:0 !important; 20 | } 21 | #calendar-container .day { 22 | padding-top:0; 23 | padding-bottom:0; 24 | } 25 | #calendar-container .day.active { 26 | outline:1px solid var(--tx3); 27 | } 28 | #calendar-container .day.active .filled, 29 | #calendar-container .day.today.active .filled { 30 | fill:var(--tx1, var(--text-normal)) !important; 31 | } 32 | #calendar-container .day.active .hollow, 33 | #calendar-container .day.today.active .hollow { 34 | stroke:var(--tx1, var(--text-normal)) !important; 35 | } 36 | #calendar-container .day.today .filled { 37 | fill:var(--text-muted) !important; 38 | } 39 | #calendar-container .day.today .hollow { 40 | stroke:var(--text-muted) !important; 41 | } 42 | 43 | #calendar-container .day.today { 44 | color:var(--text-bold); 45 | font-weight:700; 46 | outline:2px solid var(--color-background-day-active); 47 | } 48 | .theme-dark #calendar-container .day.today { 49 | /* outline:2px solid var(--tx3); */ 50 | } 51 | 52 | #calendar-container .day.today.active { 53 | /* color:var(--text-bright); */ 54 | } 55 | #calendar-container .day:active { 56 | background:var(--tx2, var(--text-muted)); 57 | } 58 | #calendar-container .day.adjacent-month { 59 | /* color:var(--tx2) */ 60 | } 61 | 62 | #calendar-container .weekend { 63 | background: var(--bg2, var(--background-primary)); 64 | } 65 | -------------------------------------------------------------------------------- /CardBoard.css: -------------------------------------------------------------------------------- 1 | /* 2 | Card Board plugin styles 3 | https://github.com/replete/obsidian-minimal-theme-css-snippets 4 | */ 5 | 6 | .card-board-tab-list { 7 | padding-top:6px !important; 8 | } 9 | 10 | .card-board-tab-icon { 11 | transform: translate(0, 2px); 12 | position:absolute; 13 | right:5px; 14 | height:30px !important; 15 | } 16 | 17 | .card-board-tabs-inner { 18 | color: var(--tx3) !important 19 | } 20 | 21 | .card-board-tabs-inner:hover { 22 | color: var(--tx1) !important 23 | } 24 | 25 | .card-board-tab-title.is-active .card-board-tabs-inner { 26 | color:var(--tx2) !important; 27 | } 28 | 29 | .card-board-boards { 30 | padding-top:5px; 31 | } -------------------------------------------------------------------------------- /Checklist - Ultra compact.css: -------------------------------------------------------------------------------- 1 | /* 2 | Checklists plugin Ultra Compact styles 3 | Targeting 'classic' style option in UI with 'tags' mode 4 | https://github.com/replete/obsidian-minimal-theme-css-snippets 5 | */ 6 | 7 | .workspace .view-content:has(.checklist-plugin-main) { 8 | padding:0 9 | } 10 | 11 | .workspace .view-content .checklist-plugin-main { 12 | padding:0 6px 0 8px; 13 | } 14 | 15 | .workspace .view-content .checklist-plugin-main .group { 16 | margin-bottom:0; 17 | border:none 18 | } 19 | 20 | .workspace .view-content .checklist-plugin-main .group-header { 21 | padding-left:8px; 22 | margin-bottom:0; 23 | } 24 | 25 | .workspace .view-content .checklist-plugin-main .group-header .space { 26 | /* order:3; */ 27 | display:none 28 | } 29 | 30 | .workspace .view-content .checklist-plugin-main .group-header .collapse { 31 | margin-left:-2px 32 | } 33 | 34 | .workspace .view-content .checklist-plugin-main .group-header .count { 35 | display:none; 36 | } 37 | 38 | .workspace .view-content .checklist-plugin-main .group-header .title { 39 | font-size:13px; 40 | } 41 | 42 | .workspace .view-content .checklist-plugin-main .group-header .title span { 43 | color:var(--tx2) 44 | } 45 | .workspace .view-content .checklist-plugin-main .group-header .title span:last-of-type { 46 | color:var(--tx1); 47 | font-weight:600; 48 | text-indent:0.1em 49 | } 50 | 51 | .workspace .view-content .checklist-plugin-main .settings-container svg { 52 | transform: scale(0.75); 53 | opacity:0.3; 54 | } 55 | 56 | 57 | .workspace .view-content .checklist-plugin-main .group-header:has(.left) { 58 | opacity:0.5 59 | } 60 | 61 | .workspace .view-content .checklist-plugin-main ul li { 62 | align-items:flex-start; 63 | margin: 8px 0; 64 | } 65 | 66 | .workspace .view-content .checklist-plugin-main ul p { 67 | margin:0; 68 | font-size:13px; 69 | color: var(--tx2); 70 | line-height:1.35em; 71 | padding-bottom:4px; 72 | color:var(--tx1) 73 | } 74 | 75 | .workspace .view-content .checklist-plugin-main ul .toggle { 76 | padding:0 6px 0 8px; 77 | margin:0; 78 | height:auto !important; 79 | } 80 | 81 | .workspace .view-content .checklist-plugin-main .toggle .checkbox { 82 | border-color:var(--tx2); 83 | height:16px !important; 84 | width:16px !important; 85 | min-height:auto; 86 | min-width:auto; 87 | transform:translate(0,0px) 88 | } 89 | 90 | .workspace .view-content .checklist-plugin-main input.search { 91 | margin:0 92 | } 93 | 94 | .workspace .view-content .checklist-plugin-main input.search { 95 | } 96 | 97 | .workspace .view-content .checklist-plugin-main input.search:focus { 98 | box-shadow: none !important 99 | } 100 | 101 | .workspace .view-content .checklist-plugin-main input.search::placeholder { 102 | color:var(--tx3); 103 | opacity:0.4; 104 | } 105 | 106 | .workspace .view-content .checklist-plugin-main > .container { 107 | margin-bottom:0; 108 | } -------------------------------------------------------------------------------- /Custom Frames.css: -------------------------------------------------------------------------------- 1 | /* 2 | Custom Frames plugin tweaks 3 | Pretty much just removing the frame padding... 4 | https://github.com/replete/obsidian-minimal-theme-css-snippets 5 | */ 6 | 7 | .custom-frames-view webview { 8 | padding:0 !important; 9 | } -------------------------------------------------------------------------------- /Daily Note Outline.css: -------------------------------------------------------------------------------- 1 | /* 2 | Daily Note Outline 3 | Visual tweaks 4 | https://github.com/replete/obsidian-minimal-theme-css-snippets 5 | */ 6 | 7 | /* Container */ 8 | .workspace-leaf-content[data-type="daily-note-outline"] .view-content { 9 | padding-bottom:0; 10 | } 11 | 12 | /* Compact header */ 13 | .workspace-leaf-content[data-type="daily-note-outline"] .nav-header { 14 | padding:4px 2px 4px 2px; 15 | transform:scale(0.85); 16 | transform-origin:0 0; 17 | text-align: left; 18 | } 19 | /* Date range buttons styling */ 20 | .workspace-leaf-content[data-type="daily-note-outline"] .nav-date-range { 21 | color: var(--tx2); 22 | line-height:1em; 23 | padding: 4px 6px; 24 | border-radius: 10px; 25 | opacity:0.7 26 | } 27 | 28 | .workspace-leaf-content[data-type="daily-note-outline"] .nav-buttons-container + .nav-date-range { 29 | margin-right: 4px; 30 | margin-left: 4px 31 | } 32 | 33 | /* Files container */ 34 | .workspace-leaf-content[data-type="daily-note-outline"] .nav-files-container { 35 | padding:4px 0 0 4px; 36 | border-top:1px solid var(--divider-color); 37 | margin-top:-6px; 38 | 39 | /* file title */ 40 | > .nav-folder .nav-folder-title { 41 | /* Fix indentation of first heading */ 42 | padding-left:8px; 43 | } 44 | 45 | } 46 | 47 | /* Note detail suffix styling */ 48 | .workspace-leaf-content[data-type="daily-note-outline"] .nav-folder-title::after { 49 | padding-left: 4px; 50 | opacity: 0.7; 51 | } 52 | 53 | /* Files preview */ 54 | .workspace-leaf-content[data-type="daily-note-outline"] .nav-file-title-preview { 55 | color: var(--tx2); 56 | opacity:0.7; 57 | padding-left:8px; 58 | font-style:italic; 59 | } 60 | .workspace-leaf-content[data-type="daily-note-outline"] .nav-file-title-preview::after { 61 | content:''; 62 | background:linear-gradient(to right, transparent, var(--bg1)); 63 | width:1.5em; 64 | height:1.5em; 65 | position:absolute; 66 | right:0; 67 | top:5px; 68 | display:block; 69 | } -------------------------------------------------------------------------------- /Database Folder.css: -------------------------------------------------------------------------------- 1 | /* 2 | Database Folders visual tweaks 3 | (alignments, compact density, a few interactive bugs) 4 | https://github.com/replete/obsidian-minimal-theme-css-snippets 5 | */ 6 | 7 | 8 | /* Header */ 9 | 10 | .database-plugin__header-menu { 11 | transform:scale(0.75) translate(5px, 4px) 12 | } 13 | 14 | .database-plugin__header-menu .svg-icon svg { 15 | fill:var(--tx2) 16 | } 17 | 18 | .database-plugin__th .svg-icon { 19 | display:none !important; 20 | } 21 | 22 | .database-plugin__th > .database-plugin__header-menu .svg-icon { 23 | display:block !important 24 | } 25 | 26 | .database-plugin__th-content { 27 | transform:translate(0,-7px); 28 | width:100%; 29 | text-align:center !important; 30 | justify-content:center; 31 | font-size:12px; 32 | } 33 | 34 | /* main */ 35 | 36 | .database-plugin__th { 37 | overflow: hidden !important; 38 | } 39 | .database-plugin__tr:nth-of-type(2n-1) .database-plugin__td:last-child { 40 | background: linear-gradient(to right, var(--background-secondary), var(--tab-container-background)) 41 | } 42 | 43 | .database-plugin__tr.database-plugin__footer-group:last-child .database-plugin__td:last-child { 44 | background:var(--tab-container-background); 45 | } 46 | 47 | .database-plugin__td.database-plugin__footer { 48 | border:none 49 | } 50 | 51 | .database-plugin__tbody .database-plugin__tr:last-child .database-plugin__td { 52 | border-bottom:1px solid var(--background-modifier-border); 53 | } 54 | 55 | 56 | 57 | .database-plugin__td { 58 | padding:0 !important 59 | } 60 | 61 | /* Fix target/focus outlines */ 62 | .database-plugin__td:hover { 63 | box-shadow:none !important 64 | } 65 | 66 | .database-plugin__td > span:focus { 67 | box-shadow:none !important; 68 | } 69 | 70 | .database-plugin__td:hover { 71 | outline:none 72 | } 73 | 74 | .database-plugin__tr .database-plugin__td:last-child:hover { 75 | outline:none; 76 | background:inherit 77 | } 78 | 79 | .database-plugin__td:focus-within { 80 | outline: 1px solid var(--tx3); 81 | background-color:inherit; 82 | } 83 | 84 | .database-plugin__td a[href] { 85 | color:var(--tx2); 86 | text-decoration:none; 87 | } 88 | 89 | .database-plugin__td a[href*='.md']::after { 90 | content:'MD'; 91 | color:var(--tx3); 92 | display:inline-block; 93 | font-size:8px; 94 | font-weight:bold; 95 | padding:2px; 96 | margin-left:2px; 97 | background:var(--bg2); 98 | border-radius: 4px; 99 | line-height:1em; 100 | transform:translate(0,-2px) 101 | 102 | } 103 | 104 | /* partial fix of outline hover issue */ 105 | .database-plugin__tr:hover, 106 | .database-plugin__tr:hover .database-plugin__td { 107 | z-index:500 108 | } 109 | 110 | .database-plugin__tr .database-plugin__td:first-child .database-plugin__relationship[style] { 111 | background-color:transparent !important 112 | } 113 | 114 | .database-plugin__tr .database-plugin__td:first-child p { 115 | color: var(--tx2) !important; 116 | opacity:.6; 117 | } 118 | 119 | 120 | .database-plugin__tr:nth-of-type(2n-1) .database-plugin__td:first-child { 121 | background:var(--background-secondary) 122 | } 123 | 124 | /* checkbox */ 125 | .theme-light .database-plugin__td input[type=checkbox]{ 126 | border-color:var(--tx3) !important; 127 | } 128 | 129 | .database-plugin__td input[type=checkbox]{ 130 | border-color:var(--tx2); 131 | transform:translate(0,0px) 132 | } 133 | .database-plugin__td input[type=checkbox]:checked { 134 | border:none; 135 | background-color:var(--tx2) 136 | } 137 | 138 | .theme-light .database-plugin__td input[type=checkbox]:checked { 139 | background-color:var(--tx3) 140 | } 141 | 142 | .database-plugin__td input[type=checkbox]:focus { 143 | outline:none 144 | } 145 | 146 | .database-plugin__td.data-input textarea.database-plugin__editor-cell { 147 | /* resize:none; */ 148 | border-radius:0; 149 | margin-bottom:-2px; 150 | } 151 | 152 | 153 | 154 | /* Header search */ 155 | .database-plugin__th input[type=text] { 156 | border-radius:0 !important; 157 | border-left:0; 158 | border-right:0; 159 | } 160 | 161 | .database-plugin__th input[type=text]::placeholder { 162 | font-size:11px; 163 | } 164 | 165 | 166 | /* Footer */ 167 | 168 | .database-plugin__tfoot .database-plugin__footer-group .database-plugin__td { 169 | border-right-color: transparent !important; 170 | } 171 | 172 | .database-plugin__tfoot { 173 | box-shadow: 0 -5px 5px -4px var(--background-secondary) 174 | } 175 | 176 | .database-plugin__table { 177 | border-bottom-color:transparent !important 178 | } 179 | 180 | /* Pagination */ 181 | .database-plugin__pagination { 182 | right:auto; 183 | left:10px; 184 | transform:scale(0.8); 185 | } 186 | .database-plugin__pagination-button { 187 | border:1px solid var(--background-modifier-border) !important; 188 | padding:4px !important; 189 | } 190 | 191 | -------------------------------------------------------------------------------- /Day Planner (Ivan Lednev).css: -------------------------------------------------------------------------------- 1 | /* 2 | Day Planner (Ivan Lednev version) 3 | Ivan has done an amazing job with this plugin. THANK YOU. 4 | This snippet just makes the toolbar a little bit more compact. 5 | https://github.com/replete/obsidian-minimal-theme-css-snippets 6 | */ 7 | .workspace-leaf-content[data-type=timeline] { 8 | .view-content { 9 | > .controls > .controls { 10 | padding:4px; 11 | .header { 12 | .clickable-icon:not(:is( 13 | [aria-label="Go to previous day"], 14 | [aria-label="Go to next day"] 15 | )) { 16 | padding-left:0px !important; 17 | padding-right:0px !important; 18 | } 19 | } 20 | } 21 | } 22 | } -------------------------------------------------------------------------------- /Day Planner (old version).css: -------------------------------------------------------------------------------- 1 | /* 2 | Day Planner visual changes 3 | This is for the abandoned plugin. 4 | These styles will be ported over to my forked plugin: 5 | https://github.com/replete/obsidian-day-planner 6 | 7 | https://github.com/replete/obsidian-minimal-theme-css-snippets 8 | */ 9 | 10 | /* Container max size */ 11 | .mod-right-split [data-type=timeline] .view-content { 12 | padding:0; 13 | } 14 | .mod-right-split [data-type=timeline] .events { 15 | padding-bottom: 0 !important 16 | } 17 | 18 | /* Planner box styling - hide timeline bar, minimal styles */ 19 | .mod-right-split [data-type=timeline] .aside { 20 | width:30px !important; 21 | opacity:0.75 !important; 22 | } 23 | .mod-right-split [data-type=timeline] .aside__line { 24 | left:20px !important; 25 | display:none; 26 | } 27 | .mod-right-split [data-type=timeline] .event_item_contents { 28 | padding-left:30px !important; 29 | } 30 | .mod-right-split [data-type=timeline] .event_item .ei_Dot { 31 | display:none; 32 | } 33 | .mod-right-split [data-type=timeline] .event_item .ei_Title { 34 | margin-left:-5px; 35 | font-size:11px; 36 | line-height:1em; 37 | } 38 | .mod-right-split [data-type=timeline] .event_item .ei_Copy { 39 | margin-left:10px; 40 | } 41 | 42 | /* Fix 'hour quarters' bg in dark themes */ 43 | .mod-right-split [data-type=timeline] .aside, 44 | .mod-right-split [data-type=timeline] .aside .aside__line { 45 | filter:invert(100%); 46 | mix-blend-mode:overlay; 47 | } 48 | 49 | /* Make colours fit minimal theme */ 50 | .mod-right-split [data-type=timeline] .event_item { 51 | /* background-color:var(--background-modifier-hover) !important; */ 52 | /* background: linear-gradient(0deg, var(--background-primary), transparent); */ 53 | /* border-bottom-color: var(--tx3) !important; */ 54 | } 55 | .theme-light .mod-right-split [data-type=timeline] .event_item { 56 | filter:brightness(2) saturate(0.4); 57 | } 58 | .mod-right-split [data-type=timeline] .event_item:hover { 59 | box-shadow:none !important; 60 | background-color: var(--tx2) !important; 61 | } 62 | 63 | .theme-light .mod-right-split [data-type=timeline] .event_item:hover { 64 | background-color: var(--color-red) !important; 65 | } 66 | .theme-light .mod-right-split [data-type=timeline] .event_item { 67 | border-bottom-color: var(--tx2) !important; 68 | 69 | } 70 | 71 | .mod-right-split [data-type=timeline] .event_item .ei_Title { 72 | color: var(--tx1) !important; 73 | opacity:0.8; 74 | text-shadow: 1px 1px 1px var(--progress-outline) 75 | } 76 | 77 | .theme-light .mod-right-split [data-type=timeline] .event_item .ei_Title, 78 | .theme-light .mod-right-split [data-type=timeline] .event_item .ei_Copy { 79 | color:var(--tx3) !important 80 | } 81 | 82 | .theme-dark .mod-right-split [data-type=timeline] .event_item .ei_Title, 83 | .theme-dark .mod-right-split [data-type=timeline] .event_item .ei_Copy{ 84 | color: var(--tx1) !important 85 | } 86 | 87 | /* Cleverer colours (limited to theme, but better than nothing) */ 88 | .mod-right-split [data-type=timeline] .event_item:nth-of-type(2n-1) { 89 | /* background-color:var(--color-green) !important; */ 90 | 91 | } 92 | .mod-right-split [data-type=timeline] .event_item_color1 { 93 | /* background-color:red !important; */ 94 | } 95 | 96 | /* Now line overlay */ 97 | 98 | .mod-right-split [data-type=timeline] #now-line { 99 | /* background-color:var(--interactive-accent) !important; */ 100 | /* height:1px !important; */ 101 | } 102 | .mod-right-split [data-type=timeline] #now-line .timeline-time { 103 | left: 80% !important; 104 | position: absolute !important; 105 | font-size:12px; 106 | padding-bottom:0 !important; 107 | } 108 | 109 | 110 | 111 | /* Planner box timeline line colors */ 112 | .mod-right-split [data-type=timeline] #day-planner-timeline-container .aside__line, 113 | .mod-right-split [data-type=timeline] #day-planner-timeline-container .ei_Dot { 114 | background-color: var(--tx3); 115 | } 116 | 117 | /* Hide autoscroll label */ 118 | .mod-right-split [data-type=timeline] label[for=auto-scroll] { 119 | display:none !important; 120 | } 121 | 122 | /* Restyle autoscroll checkbox and place over the planner top right */ 123 | .mod-right-split [data-type=timeline] #scroll-controls { 124 | position: fixed !important; 125 | top:0 !important; 126 | margin-top:-10px !important; 127 | background:transparent !important 128 | } 129 | .mod-right-split [data-type=timeline] #auto-scroll { 130 | position:absolute !important; 131 | right:-4px; 132 | top: 10px; 133 | transform:scale(0.8); 134 | transform-origin: 0 0; 135 | opacity:0.5; 136 | background-color: var(--tx2) !important; 137 | } 138 | .mod-right-split [data-type=timeline] #auto-scroll:hover { 139 | opacity:1; 140 | } 141 | .mod-right-split [data-type=timeline] #auto-scroll::before { 142 | content: 'time time' !important; 143 | } 144 | .mod-right-split [data-type=timeline] #auto-scroll:not(:checked)::before { 145 | text-indent:-33px !important 146 | } 147 | 148 | .mod-right-split [data-type=timeline] .empty-timeline { 149 | color: var(--tx3) !important; 150 | } 151 | 152 | #day-planner-timeline-container::after { 153 | content:''; 154 | display:block; 155 | background: linear-gradient(to bottom, transparent, rgba(0,0,0,0.6)); 156 | width:100%; 157 | height:8px; 158 | position: fixed; 159 | bottom:0; 160 | pointer-events:none; 161 | } 162 | 163 | /* Hide scrollbar */ 164 | 165 | .view-content:has(#day-planner-timeline-container) { 166 | outline: 2px solid red !important; 167 | } 168 | 169 | .view-content:has(#day-planner-timeline-container)::-webkit-scrollbar { 170 | scrollbar-width: 0 !important; 171 | width:0 172 | } 173 | 174 | 175 | /* status bar fixes */ 176 | 177 | .status-bar-item.plugin-obsidian-day-planner .progress-pie { 178 | background-image:linear-gradient(to right,transparent 50%, var(--tx1) 0) 179 | } 180 | .status-bar-item.plugin-obsidian-day-planner .progress-pie::before { 181 | background-color:var(--tx1); 182 | } 183 | 184 | .status-bar-item.plugin-obsidian-day-planner .day-planner-status-bar-text { 185 | transform: translate(0, 3px) 186 | } 187 | 188 | .status-bar-item.plugin-obsidian-day-planner .day-planner-progress-bar { 189 | background:var(--background-modifier-border); 190 | transform:translate(0, -1px); 191 | } -------------------------------------------------------------------------------- /Excalidraw - Compact.css: -------------------------------------------------------------------------------- 1 | /* 2 | Excalidraw plugin 3 | Compact layout. Only tested on Desktop. 4 | 5 | https://github.com/replete/obsidian-minimal-theme-css-snippets 6 | */ 7 | 8 | .excalidraw { 9 | 10 | /* Fix illegible island contrast */ 11 | --island-bg-color:#dde4eb !important; 12 | &.theme--dark { 13 | --island-bg-color:#292929 !important; 14 | } 15 | 16 | /* Better looking floating utility island */ 17 | > .Island:not(.sidebar) { 18 | width:180px !important; 19 | 20 | > div:first-child { 21 | border-bottom-left-radius: 0 !important; 22 | svg { 23 | opacity:0.2; 24 | /* height:16px; */ 25 | 26 | > path { 27 | display:none 28 | } 29 | } 30 | } 31 | > .Island { 32 | padding:4px; 33 | border-top-left-radius: 0 !important; 34 | border-top-right-radius: 0 !important; 35 | margin-top:-4px; 36 | border-top:1px solid rgba(255,255,255,.2); 37 | 38 | legend { 39 | opacity:0.5; 40 | margin:4px 0 -2px 5px; 41 | /* text-align:center; */ 42 | text-transform:uppercase; 43 | letter-spacing:0.04em; 44 | font-size:10px; 45 | /* border-bottom:1px solid rgba(255,255,255,0.5); */ 46 | width:100%; 47 | } 48 | 49 | .buttonList { 50 | gap:2px 51 | } 52 | 53 | .ToolIcon_type_button { 54 | padding:2px !important; 55 | border-radius:0 !important; 56 | background:none; 57 | 58 | .ToolIcon__icon { 59 | transform: scale(1.3) !important; 60 | } 61 | } 62 | } 63 | } 64 | 65 | .App-toolbar { 66 | padding:0; 67 | 68 | /* Increase icon size toolbar */ 69 | .ToolIcon { 70 | .ToolIcon__icon svg { 71 | transform:scale(1.4) !important; 72 | } 73 | } 74 | 75 | /* make keyboard shortcut numbers more visible */ 76 | .ToolIcon__keybinding { 77 | font-size:8px !important; 78 | top:30px; 79 | left:12px; 80 | } 81 | 82 | .App-toolbar__divider { 83 | margin-right:0; 84 | margin-left:0; 85 | } 86 | } 87 | 88 | .HintViewer { 89 | margin-top:20px 90 | } 91 | 92 | /* Remove padding around canvas UI */ 93 | .FixedSideContainer.FixedSideContainer_side_top { 94 | padding:0; 95 | top:2px !important; 96 | left:10px !important; 97 | bottom:0 !important; 98 | right:2px !important; 99 | } 100 | .App-menu_top__left, 101 | .layer-ui__wrapper__top-right { 102 | margin-top:4px !important; 103 | } 104 | 105 | .dropdown-menu .Island /* desktop */, 106 | .dropdown-menu--mobile > .Stack /*mobile*/{ 107 | padding:0 !important; 108 | 109 | [data-testid=canvas-background-label] { 110 | padding-left:8px; 111 | opacity:0.5; 112 | margin-bottom:0px !important; 113 | } 114 | 115 | .dropdown-menu-item { 116 | margin:0; 117 | height:1.5rem !important; 118 | font-size:0.85rem; 119 | 120 | + div[style]:empty { 121 | margin:4px 0 !important; 122 | } 123 | } 124 | } 125 | 126 | .dropdown-menu-container { 127 | gap:0; /* mobile */ 128 | } 129 | 130 | .sidebar-trigger { 131 | padding-top:12px; 132 | } 133 | 134 | [role=contentinfo] { 135 | bottom:-1px !important; 136 | left:0 !important; 137 | padding-left:34px; 138 | 139 | .help-icon { 140 | position:fixed; 141 | bottom: -1px; 142 | padding:0; 143 | left: 2px; 144 | opacity:0.8; 145 | } 146 | 147 | .reset-zoom-button { 148 | font-size:75% !important; 149 | opacity: 0.8; 150 | } 151 | } 152 | 153 | /* Library sidebar */ 154 | .Island.sidebar { 155 | width:400px; 156 | background: var(--island-bg-color); 157 | 158 | .sidebar-tabs-root { 159 | padding-top:4px; 160 | } 161 | 162 | .sidebar__header { 163 | padding-bottom:0; 164 | } 165 | 166 | .library-menu-items-container__items { 167 | padding-top:0; 168 | } 169 | 170 | .library-menu-dropdown-container { 171 | margin-top:-14px; 172 | } 173 | 174 | .library-menu-items-container__grid { 175 | width:100%; 176 | gap:5px; 177 | 178 | .library-unit { 179 | width:100%; 180 | } 181 | 182 | .library-unit__active { 183 | border-radius:2px; 184 | } 185 | 186 | .library-unit__dragger { 187 | width:100%; 188 | height:100%; 189 | } 190 | } 191 | 192 | .library-menu-control-buttons--at-bottom[style] { 193 | padding-top:4px !important; 194 | width:40%; 195 | 196 | } 197 | } 198 | 199 | /* Smaller on mobile */ 200 | &.excalidraw--mobile .Island.sidebar { 201 | width:250px !important; 202 | 203 | .Checkbox-box { 204 | width:12px; 205 | height:12px; 206 | border-radius:2px; 207 | } 208 | 209 | .library-menu-control-buttons--at-bottom[style] { 210 | width:60%; 211 | } 212 | } 213 | 214 | /* Fix sidebar trigger bg color */ 215 | .sidebar-trigger:not(:hover) { 216 | background-color:transparent !important 217 | } 218 | 219 | /* Tray mode - sidebar*/ 220 | .mobile-misc-tools-container { 221 | right:0; 222 | 223 | .ToolIcon { 224 | svg { 225 | transform:scale(1.4) 226 | } 227 | } 228 | } 229 | 230 | /* Tray mode - bottom bar */ 231 | .App-bottom-bar[style] { 232 | margin-bottom:0 !important; 233 | 234 | .Island { 235 | padding:0; 236 | background-color:transparent; 237 | 238 | > .Stack > .Stack { 239 | padding:0 !important; 240 | } 241 | } 242 | 243 | .App-toolbar-content { 244 | padding:0; 245 | } 246 | 247 | .dropdown-menu-container { 248 | background:var(--island-bg-color); 249 | margin-bottom:-20px; 250 | } 251 | 252 | 253 | } 254 | } 255 | 256 | /* Show excalidraw right footer help icon above minimal statusbar */ 257 | /* @container style(--status-bar-position: fixed) { 258 | .excalidraw-container { 259 | [role=contentinfo] { 260 | .help-icon { 261 | margin-top:-40px; 262 | } 263 | } 264 | } 265 | } */ 266 | -------------------------------------------------------------------------------- /Excel.css: -------------------------------------------------------------------------------- 1 | /* 2 | Excel plugin 3 | Colours inherit from minimal theme and various adjustments 4 | Limitations: 5 | - Cannot adjust spreadsheet editor colours as it is rendered in 6 | - Cannot set dark/light mode automatically based on minimal theme dark/light mode 7 | 8 | https://github.com/replete/obsidian-minimal-theme-css-snippets 9 | */ 10 | 11 | /* Colors */ 12 | .x-spreadsheet { 13 | --sheet-iframe-border-color: var(--bg2); 14 | --sheet-iframe-background-color: var(--bg1); 15 | --sheet-toolbar-background-color: var(--bg1); 16 | --sheet-toolbar-divider-color: var(--tab-outline-color); 17 | --sheet-dropdown-content-background-color: var(--bg1); 18 | --sheet-dropdown-content-color: var(--icon-color); 19 | --sheet-dropdown-title-color: var(--icon-color); 20 | --sheet-menu-color: var(--tx1); 21 | --sheet-menu-active-background-color: var(--tx3); 22 | --sheet-header-background-color: red; 23 | --sheet-checked-before: #025492; 24 | 25 | /* Note: Actual table is inside so colours aren't changeable by CSS override */ 26 | } 27 | 28 | /* Chrome */ 29 | .workspace-leaf-content[data-type=excel-view] { 30 | 31 | .view-content { 32 | border-top:1px solid var(--tab-outline-color); 33 | } 34 | 35 | .x-spreadsheet-toolbar { 36 | padding-left:16px; 37 | border-bottom-color: var(--divider-color); 38 | 39 | .x-spreadsheet-dropdown-content { 40 | border:1px solid var(--divider-color); 41 | box-shadow: -2px 2px 6px -2px var(--divider-color); 42 | padding-bottom:4px; 43 | border-top: 0; 44 | } 45 | } 46 | 47 | .x-spreadsheet-toolbar-btns { 48 | margin-top:-2px; 49 | } 50 | 51 | .x-spreadsheet-icon-img { 52 | background-image:none !important; 53 | background: var(--icon-color); 54 | opacity: 1 !important; 55 | /* 56 | This is a hack to colorize the toolbar icons, this property value will need to be copied 57 | from x-spreadsheet CSS if they update it because they hardcoded it >:| 58 | */ 59 | -webkit-mask-image: url("data:image/svg+xml,%3Csvg width='249' height='69' viewBox='0 0 249 69' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cpath d='M4.434 9.434L7 12H0V5l2.958 2.958A8.287 8.287 0 0 1 8.32 6c3.459 0 6.424 2.11 7.68 5l-2 1c-.937-2.39-3.13-3.92-5.68-4a6.572 6.572 0 0 0-3.886 1.434zM29.566 9.434L27 12h7V5l-2.958 2.958A8.287 8.287 0 0 0 25.68 6C22.22 6 19.256 8.11 18 11l2 1c.937-2.39 3.13-3.92 5.68-4 1.469.053 2.82.579 3.886 1.434zM46.114 11.226a4.778 4.778 0 0 1-3.166 1.208c-2.733 0-4.948-2.336-4.948-5.217S40.215 2 42.948 2c2.733 0 4.948 2.336 4.948 5.217 0 1.27-.43 2.433-1.145 3.338l.228.238h.71l3.59 3.794L49.94 16l-3.6-3.785v-.749l-.225-.24zm-3.166-.215c1.988 0 3.599-1.699 3.599-3.794 0-2.096-1.611-3.794-3.599-3.794-1.987 0-3.598 1.698-3.598 3.794 0 2.095 1.61 3.794 3.598 3.794zM65 2h-8c-.55 0-1 .45-1 1v3c0 .55.45 1 1 1h8c.55 0 1-.45 1-1V5h1v3h-7v8h2v-6h7V4h-3V3c0-.55-.45-1-1-1zM73.27 4.55l5.16 5.15L76 15h2.5l1.64-3.58L84.73 16 86 14.73 74.55 3.27l-1.28 1.28zM76.82 3l2 2h1.76l-.55 1.21 1.71 1.71L83.08 5H87V3H76.82zM102 6.5c0-1.93-1.57-3.5-3.5-3.5H93v12h6.25c1.79 0 3.25-1.46 3.25-3.25 0-1.3-.77-2.41-1.87-2.93.83-.58 1.37-1.44 1.37-2.32zM98 5c.83 0 1.5.67 1.5 1.5S98.83 8 98 8h-2V5h2zm-2 8v-3h2.5c.83 0 1.5.67 1.5 1.5s-.67 1.5-1.5 1.5H96zM114 3v2h2.58l-3.66 8H110v2h8v-2h-2.58l3.66-8H122V3z' fill='%23000'/%3E%3Cpath d='M134 15c2.76 0 5-2.24 5-5V3h-2v7c0 1.75-1.5 3-3 3s-3-1.242-3-3V3h-2v7c0 2.76 2.24 5 5 5zm-6 1v2h12v-2h-12z' fill='%23000' fill-rule='nonzero'/%3E%3Cpath d='M147.887 6.06c0-.457.098-.874.297-1.252.198-.38.476-.702.836-.968s.784-.472 1.279-.619A5.712 5.712 0 0 1 151.926 3c.608 0 1.159.083 1.654.251.495.169.919.402 1.271.705.353.3.623.657.814 1.073.191.412.285.866.285 1.357h-2.257a1.85 1.85 0 0 0-.11-.637 1.26 1.26 0 0 0-.333-.506 1.535 1.535 0 0 0-.563-.327 2.425 2.425 0 0 0-.798-.116c-.297 0-.552.034-.773.098a1.52 1.52 0 0 0-.54.27 1.144 1.144 0 0 0-.431.9c0 .36.184.663.551.907l.065.042c.262.172.739.483 1.239.983h-3s-.786-.624-.824-.691c-.191-.357-.288-.773-.288-1.249zM159 9h-14v2h7.219c.135.053.3.105.412.154.278.123.495.255.653.382.157.132.262.274.319.424.056.154.082.326.082.514 0 .176-.034.341-.101.491a1.018 1.018 0 0 1-.311.394 1.603 1.603 0 0 1-.533.258 2.71 2.71 0 0 1-.761.094c-.326 0-.623-.034-.889-.097a1.797 1.797 0 0 1-.679-.312 1.446 1.446 0 0 1-.438-.558c-.105-.229-.192-.574-.192-.744h-2.231c0 .252.06.688.176 1.025a3.15 3.15 0 0 0 1.223 1.598c.281.195.585.36.915.487.33.131.671.229 1.035.289.36.064.724.094 1.084.094.6 0 1.147-.068 1.635-.207a3.879 3.879 0 0 0 1.252-.592 2.69 2.69 0 0 0 .803-.953c.19-.378.28-.806.28-1.286 0-.45-.078-.855-.232-1.211a2.258 2.258 0 0 0-.127-.252L159 11V9z' fill='%23010101'/%3E%3Cpath d='M171 1h-2l-4.5 12h2l1.12-3h4.75l1.12 3h2L171 1zm-2.62 7L170 3.67 171.62 8h-3.24z' fill='%23000'/%3E%3Cpath d='M193.5 8.87s-1.5 1.62-1.5 2.62c0 .83.67 1.5 1.5 1.5s1.5-.67 1.5-1.5c0-.99-1.5-2.62-1.5-2.62zm-1.79-2.08L184.91 0l-1.06 1.06 1.59 1.59-4.15 4.14a.996.996 0 0 0 0 1.41l4.5 4.5c.2.2.45.3.71.3.26 0 .51-.1.71-.29l4.5-4.5c.39-.39.39-1.03 0-1.42zm-8.5.21l3.29-3.29L189.79 7h-6.58z' fill='%23000' fill-rule='nonzero'/%3E%3Cpath d='M200 6h-2V2h7v2h-5v2zm7-2V2h7v4h-2V4h-5zm0 10h5v-2h2v4h-7v-2zm-9-2h2v2h5v2h-7v-4zm0-4h4V6l3 3-3 3v-2h-4V8zm9 1l3-3v2h4v2h-4v2l-3-3zM217 16h10v-2h-10v2zm10-10h-10v2h10V6zm-10-4v2h14V2h-14zm0 10h14v-2h-14v2zM237 14v2h10v-2h-10zm0-8v2h10V6h-10zm-2 6h14v-2h-14v2zm0-10v2h14V2h-14zM5 34h10v-2H5v2zm-4-4h14v-2H1v2zm0-10v2h14v-2H1zm4 6h10v-2H5v2zM20 20v2h12v-2H20zm2.5 7H25v7h2v-7h2.5L26 23.5 22.5 27zM47.5 21H45v-3h-2v3h-2.5l3.5 3.5 3.5-3.5zM38 26v2h12v-2H38zm2.5 7H43v3h2v-3h2.5L44 29.5 40.5 33zM65.5 27H63v-7h-2v7h-2.5l3.5 3.5 3.5-3.5zM56 32v2h12v-2H56zM87 21H73v2h14v-2zM73 33h4v-2h-4v2zm11.5-7H73v2h11.75c.83 0 1.5.67 1.5 1.5s-.67 1.5-1.5 1.5H82v-2l-3 3 3 3v-2h2.5c1.93 0 3.5-1.57 3.5-3.5S86.43 26 84.5 26zM91 21v1l6 6v5l2-1v-4l6-6v-1H91zm4 3h6l-3 3-3-3zM121 20h-10v1.8l5.5 5.2-5.5 5.2V34h10v-2h-6.9l4.9-5-4.9-5h6.9zM130 25l4 4 4-4zM150 31l4-4-4-4zM162.9 27c0-1.16.94-2.1 2.1-2.1h4V23h-4c-2.21 0-4 1.79-4 4s1.79 4 4 4h4v-1.9h-4a2.1 2.1 0 0 1-2.1-2.1zm12.1-4h-4v1.9h4a2.1 2.1 0 1 1 0 4.2h-4V31h4c2.21 0 4-1.79 4-4s-1.79-4-4-4zm-8 5h6v-2h-6v2zM195 19c.55 0 1 .45 1 1v14c0 .55-.45 1-1 1h-14c-.55 0-1-.45-1-1V20c0-.55.45-1 1-1h14zm-13 2v12h12V21h-12zm4 10h-2v-5h2v5zm3 0h-2v-8h2v8zm3 0h-2v-4h2v4z' fill='%23000'/%3E%3Cpath stroke='%23000' d='M198.5 21.5h15v12h-15z'/%3E%3Cpath fill='%23000' fill-rule='nonzero' d='M203 26h1v7h-1z'/%3E%3Cpath fill='%23D8D8D8' fill-rule='nonzero' d='M199 22h14v3h-14z'/%3E%3Cpath d='M199 25h14v1h-14v-1zm0 4h14v1h-14v-1z' fill='%23000' fill-rule='nonzero'/%3E%3Cpath d='M219 25.5c-.83 0-1.5.67-1.5 1.5s.67 1.5 1.5 1.5 1.5-.67 1.5-1.5-.67-1.5-1.5-1.5zm10 0c-.83 0-1.5.67-1.5 1.5s.67 1.5 1.5 1.5 1.5-.67 1.5-1.5-.67-1.5-1.5-1.5zm-5 0c-.83 0-1.5.67-1.5 1.5s.67 1.5 1.5 1.5 1.5-.67 1.5-1.5-.67-1.5-1.5-1.5zM243 26v-4h-2v4h-4v2h4v4h2v-4h4v-2zM1 38v14h14V38H1zm6 12H3v-4h4v4zm0-6H3v-4h4v4zm6 6H9v-4h4v4zm0-6H9v-4h4v4z' fill='%23000'/%3E%3Cg fill='%23000'%3E%3Cpath d='M19 52h2v-2h-2v2zm2-11h-2v2h2v-2zm1 11h2v-2h-2v2zm8-14h-2v2h2v-2zm-9 0h-2v2h2v-2zm3 0h-2v2h2v-2zm-5 11h2v-2h-2v2zm9 3h2v-2h-2v2zm3-14v2h2v-2h-2zm0 5h2v-2h-2v2zm0 9h2v-2h-2v2zm0-3h2v-2h-2v2z' opacity='.54'/%3E%3Cpath d='M27 38h-2v6h-6v2h6v6h2v-6h6v-2h-6z'/%3E%3C/g%3E%3Cg fill='%23000'%3E%3Cpath d='M43 52h2v-2h-2v2zm-3-12h2v-2h-2v2zm3 9h2v-2h-2v2zm-3 3h2v-2h-2v2zm-3-9h2v-2h-2v2zm0 9h2v-2h-2v2zm0-12h2v-2h-2v2zm0 9h2v-2h-2v2zm12 0h2v-2h-2v2zm0 3h2v-2h-2v2zm0-9h2v-2h-2v2zm0-5v2h2v-2h-2zm-6 2h2v-2h-2v2zm3 0h2v-2h-2v2zm-3 3h2v-2h-2v2zm3 9h2v-2h-2v2z' opacity='.54'/%3E%3Cpath d='M37 46h14v-2H37z'/%3E%3C/g%3E%3Cg fill='%23000'%3E%3Cpath d='M58 52h2v-2h-2v2zm-3-9h2v-2h-2v2zm0-3h2v-2h-2v2zm3 6h2v-2h-2v2zm0-6h2v-2h-2v2zm-3 12h2v-2h-2v2zm0-6h2v-2h-2v2zm0 3h2v-2h-2v2zm12-11v2h2v-2h-2zm0 8h2v-2h-2v2zm0 6h2v-2h-2v2zm0-9h2v-2h-2v2zm0 6h2v-2h-2v2zm-3 3h2v-2h-2v2zm0-6h2v-2h-2v2zm0-6h2v-2h-2v2z' opacity='.54'/%3E%3Cpath d='M61 52h2V38h-2z'/%3E%3C/g%3E%3Cg fill='%23000'%3E%3Cpath d='M81 41h-2v2h2v-2zm3 3h-2v2h2v-2zm-3 0h-2v2h2v-2zm0 3h-2v2h2v-2zm-3-3h-2v2h2v-2z' opacity='.54'/%3E%3Cpath d='M73 38h14v14H73V38zm12 12V40H75v10h10z'/%3E%3C/g%3E%3Cg fill='%23000'%3E%3Cpath d='M97 46h2v-2h-2v2zm0-3h2v-2h-2v2zm0 6h2v-2h-2v2zm0 3h2v-2h-2v2zm-3 0h2v-2h-2v2zm0-12h2v-2h-2v2zm0 6h2v-2h-2v2zm9 6h2v-2h-2v2zm0-6h2v-2h-2v2zm0 3h2v-2h-2v2zm0-6h2v-2h-2v2zm-6-3h2v-2h-2v2zm6-2v2h2v-2h-2zm-3 14h2v-2h-2v2zm0-6h2v-2h-2v2zm0-6h2v-2h-2v2z' opacity='.54'/%3E%3Cpath d='M91 52h2V38h-2z'/%3E%3C/g%3E%3Cg fill='%23000'%3E%3Cpath d='M112 46h2v-2h-2v2zm-3 6h2v-2h-2v2zm6 0h2v-2h-2v2zm0-3h2v-2h-2v2zm-3 3h2v-2h-2v2zm-3-3h2v-2h-2v2zm6-3h2v-2h-2v2zm-6-3h2v-2h-2v2zm0 3h2v-2h-2v2zm12 0h2v-2h-2v2zm0 3h2v-2h-2v2zm0-6h2v-2h-2v2zm-6 0h2v-2h-2v2zm3 9h2v-2h-2v2zm0-6h2v-2h-2v2zm3 6h2v-2h-2v2z' opacity='.54'/%3E%3Cpath d='M109 38v2h14v-2z'/%3E%3C/g%3E%3Cg fill='%23000'%3E%3Cpath d='M127 40h2v-2h-2v2zm3 0h2v-2h-2v2zm0 6h2v-2h-2v2zm0 6h2v-2h-2v2zm-3-9h2v-2h-2v2zm0 3h2v-2h-2v2zm0 6h2v-2h-2v2zm0-3h2v-2h-2v2zm9-3h2v-2h-2v2zm-3 6h2v-2h-2v2zm3 0h2v-2h-2v2zm-3-12h2v-2h-2v2zm3 0h2v-2h-2v2zm-3 9h2v-2h-2v2zm0-6h2v-2h-2v2zm0 3h2v-2h-2v2z' opacity='.54'/%3E%3Cpath d='M139 38v14h2V38z'/%3E%3C/g%3E%3Cg fill='%23000'%3E%3Cpath d='M150 38h-2v2h2v-2zm3 6h-2v2h2v-2zm0 3h-2v2h2v-2zm3-3h-2v2h2v-2zm-6 0h-2v2h2v-2zm6-6h-2v2h2v-2zm-3 3h-2v2h2v-2zm0-3h-2v2h2v-2zm-6 9h-2v2h2v-2zm10 2h2v-2h-2v2zm0-6h2v-2h-2v2zm0 3h2v-2h-2v2zm0-8v2h2v-2h-2zm-10 0h-2v2h2v-2zm0 3h-2v2h2v-2zm0 3h-2v2h2v-2z' opacity='.54'/%3E%3Cpath d='M145 52h14v-2h-14z'/%3E%3C/g%3E%3Cpath d='M169 52h2v-2h-2v2zm-3-6h2v-2h-2v2zm0-6h2v-2h-2v2zm3 9h2v-2h-2v2zm-3 3h2v-2h-2v2zm-3-9h2v-2h-2v2zm0 9h2v-2h-2v2zm0-12h2v-2h-2v2zm0 6h2v-2h-2v2zm6 0h2v-2h-2v2zm-6 3h2v-2h-2v2zm12 0h2v-2h-2v2zm0 3h2v-2h-2v2zm0-6h2v-2h-2v2zm0-3h2v-2h-2v2zm0-5v2h2v-2h-2zm-6 2h2v-2h-2v2zm3 0h2v-2h-2v2zm-3 3h2v-2h-2v2zm3 9h2v-2h-2v2zm0-6h2v-2h-2v2z' fill='%23000' opacity='.54'/%3E%3Cpath d='M189.5 39.62l-6.5 6.5V49h2.88l6.5-6.5-2.88-2.88zm5.35.4c.2-.2.2-.51 0-.71l-2.17-2.17c-.2-.2-.51-.2-.71 0l-1.35 1.36 2.88 2.88 1.35-1.36zM199 40h14v2h-14v-2zm0 4h6v2h-6v-2zm0 4h2v2h-2v-2zm8-4h6v2h-6v-2zm-4 4h2v2h-2v-2zm4 0h2v2h-2v-2zm4 0h2v2h-2v-2zM226 41l-4 4 4 4zM245.53 42.53l-1.06-1.06-2.47 2.47-2.47-2.47-1.06 1.06 2.47 2.47-2.47 2.47 1.06 1.06 2.47-2.47 2.47 2.47 1.06-1.06-2.47-2.47zM11.44 60.44L8 63.88l-3.44-3.44L3.5 61.5 8 66l4.5-4.5zM26 60l-4.5 4.5 1.06 1.06L26 62.12l3.44 3.44 1.06-1.06zM46.56 66.44L43.12 63l3.44-3.44-1.06-1.06L41 63l4.5 4.5z' fill='%23000'/%3E%3Cg fill='%23000'%3E%3Cpath d='M65 63l-4.5-4.5-1.06 1.06L62.88 63l-3.44 3.44 1.06 1.06z'/%3E%3C/g%3E%3Cg fill='%23000'%3E%3Cpath d='M74 62h8.875l-3.935-3.94L80 57l6 6-6 6-1.06-1.06L82.875 64H74z'/%3E%3C/g%3E%3Cg fill='%23000'%3E%3Cpath d='M104 62h-8.875l3.935-3.94L98 57l-6 6 6 6 1.06-1.06L95.125 64H104z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); 60 | } 61 | 62 | .x-spreadsheet-icon .x-spreadsheet-icon-img.add { 63 | left:-232px; /* icon mask fix */ 64 | } 65 | 66 | .x-spreadsheet-scrollbar { 67 | background:var(--bg2); 68 | 69 | > div { 70 | background:var(--bg2); 71 | } 72 | } 73 | 74 | .x-spreadsheet-bottombar { 75 | border-top-color:var(--tab-outline-color); 76 | 77 | .x-spreadsheet-dropdown-content { 78 | border:1px solid var(--divider-color); 79 | box-shadow: -2px 0 6px -2px var(--divider-color); 80 | padding-bottom:4px; 81 | border-bottom: 0; 82 | margin-bottom:-6px 83 | } 84 | } 85 | 86 | } 87 | 88 | -------------------------------------------------------------------------------- /Full Calendar (abandoned).css: -------------------------------------------------------------------------------- 1 | /* 2 | Full Calendar plugin tweaks 3 | This is more condensed but obviously pretty hacky to achieve the result 4 | https://github.com/replete/obsidian-minimal-theme-css-snippets 5 | */ 6 | 7 | /* Full Calendar in right sidebar */ 8 | .mod-right-split [data-type="full-calendar-view"] .fc { 9 | --link-color:var(--text-normal); 10 | --fc-button-active-bg-color: var(--background-modifier-hover); 11 | font-size:75% 12 | } 13 | 14 | .mod-right-split [data-type="full-calendar-view"] .fc a:hover { 15 | color:var(--text-on-accent) 16 | } 17 | 18 | /* Header toolbar */ 19 | 20 | .mod-right-split [data-type="full-calendar-view"] .fc-header-toolbar { 21 | margin-bottom:6px 22 | } 23 | .mod-right-split [data-type="full-calendar-view"] .fc-header-toolbar .fc-button { 24 | padding: 4px !important; 25 | } 26 | 27 | /* List table styling */ 28 | .mod-right-split [data-type="full-calendar-view"] .fc-list { 29 | border:none 30 | } 31 | .mod-right-split [data-type="full-calendar-view"] .fc-list-day-side-text { 32 | float:left; 33 | font-weight:normal; 34 | } 35 | .mod-right-split [data-type="full-calendar-view"] .fc-list-day-side-text::before { 36 | content:' '; 37 | padding-left:.4em; 38 | } 39 | 40 | .mod-right-split [data-type="full-calendar-view"] .fc td { 41 | padding:4px 4px 0px 0; 42 | } 43 | 44 | .mod-right-split [data-type="full-calendar-view"] .fc .fc-list-day-cushion { 45 | padding:8px 4px 4px 0; 46 | background:transparent; 47 | margin-bottom:4px; 48 | margin-top:4px; 49 | } 50 | 51 | .mod-right-split [data-type="full-calendar-view"] .fc-toolbar-title { 52 | font-size:11px 53 | } 54 | 55 | .mod-right-split [data-type="full-calendar-view"] .fc-button { 56 | font-size:10px 57 | } 58 | 59 | .mod-right-split [data-type="full-calendar-view"] .fc-col-header-cell { 60 | font-size:9px; 61 | font-weight: 600; 62 | } -------------------------------------------------------------------------------- /Heatmap Calendar.css: -------------------------------------------------------------------------------- 1 | /* 2 | Heatmap calendar tweaks 3 | Very basic styling tweaks, likely to change as I use it more 4 | https://github.com/replete/obsidian-minimal-theme-css-snippets 5 | */ 6 | 7 | .cm-s-obsidian .heatmap-calendar-boxes li { 8 | color:#000; 9 | text-align:center; 10 | font-size:9px; 11 | font-weight:bold; 12 | padding-top:2px; 13 | } 14 | .cm-s-obsidian .heatmap-calendar-boxes li.today { 15 | border:none; 16 | box-shadow:inset 0 0 1px 0 rgba(255,255,255,1); 17 | } 18 | 19 | /* colour fixes */ 20 | .heatmap-calendar-boxes .isEmpty { 21 | background-color: var(--bg3) !important; 22 | } -------------------------------------------------------------------------------- /MakeMD Inline Context - Duotone banner.css: -------------------------------------------------------------------------------- 1 | /* 2 | Make.MD Contexts: Duotone Banners 3 | Duotone banner images to match each minimal theme 4 | 5 | https://i.imgur.com/fvLOHfA.png 6 | https://github.com/replete/obsidian-minimal-theme-css-snippets 7 | */ 8 | 9 | 10 | .mk-space-banner { 11 | /* fade image out slightly to improve text contrast */ 12 | opacity:0.75; 13 | } 14 | 15 | /* Light themes */ 16 | 17 | .theme-light.minimal-default-light .mk-space-banner { 18 | filter: url('data:image/svg+xml,\ 19 | \ 20 | \ 21 | \ 26 | \ 27 | \ 28 | \ 29 | \ 30 | \ 31 | \ 32 | \ 33 | \ 34 | #filter'); 35 | } 36 | 37 | .theme-light.minimal-atom-light .mk-space-banner { 38 | filter: url('data:image/svg+xml,\ 39 | \ 40 | \ 41 | \ 46 | \ 47 | \ 48 | \ 49 | \ 50 | \ 51 | \ 52 | \ 53 | \ 54 | #filter'); 55 | } 56 | 57 | .theme-light.minimal-ayu-light .mk-space-banner { 58 | filter: url('data:image/svg+xml,\ 59 | \ 60 | \ 61 | \ 66 | \ 67 | \ 68 | \ 69 | \ 70 | \ 71 | \ 72 | \ 73 | \ 74 | #filter'); 75 | } 76 | 77 | .theme-light.minimal-catppuccin-light .mk-space-banner { 78 | filter: url('data:image/svg+xml,\ 79 | \ 80 | \ 81 | \ 86 | \ 87 | \ 88 | \ 89 | \ 90 | \ 91 | \ 92 | \ 93 | \ 94 | #filter'); 95 | } 96 | 97 | .theme-light.minimal-everforest-light .mk-space-banner { 98 | filter: url('data:image/svg+xml,\ 99 | \ 100 | \ 101 | \ 106 | \ 107 | \ 108 | \ 109 | \ 110 | \ 111 | \ 112 | \ 113 | \ 114 | #filter'); 115 | } 116 | 117 | .theme-light.minimal-gruvbox-light .mk-space-banner { 118 | filter: url('data:image/svg+xml,\ 119 | \ 120 | \ 121 | \ 126 | \ 127 | \ 128 | \ 129 | \ 130 | \ 131 | \ 132 | \ 133 | \ 134 | #filter'); 135 | } 136 | 137 | .theme-light.minimal-macos-light .mk-space-banner { 138 | filter: url('data:image/svg+xml,\ 139 | \ 140 | \ 141 | \ 146 | \ 147 | \ 148 | \ 149 | \ 150 | \ 151 | \ 152 | \ 153 | \ 154 | #filter'); 155 | } 156 | 157 | .theme-light.minimal-nord-light .mk-space-banner { 158 | filter: url('data:image/svg+xml,\ 159 | \ 160 | \ 161 | \ 166 | \ 167 | \ 168 | \ 169 | \ 170 | \ 171 | \ 172 | \ 173 | \ 174 | #filter'); 175 | } 176 | 177 | .theme-light.minimal-notion-light .mk-space-banner { 178 | filter: url('data:image/svg+xml,\ 179 | \ 180 | \ 181 | \ 186 | \ 187 | \ 188 | \ 189 | \ 190 | \ 191 | \ 192 | \ 193 | \ 194 | #filter'); 195 | } 196 | 197 | .theme-light.minimal-rose-pine-light .mk-space-banner { 198 | filter: url('data:image/svg+xml,\ 199 | \ 200 | \ 201 | \ 206 | \ 207 | \ 208 | \ 209 | \ 210 | \ 211 | \ 212 | \ 213 | \ 214 | #filter'); 215 | } 216 | 217 | .theme-light.minimal-solarized-light .mk-space-banner { 218 | filter: url('data:image/svg+xml,\ 219 | \ 220 | \ 221 | \ 226 | \ 227 | \ 228 | \ 229 | \ 230 | \ 231 | \ 232 | \ 233 | \ 234 | #filter'); 235 | } 236 | 237 | .theme-light.minimal-things-light .mk-space-banner { 238 | filter: url('data:image/svg+xml,\ 239 | \ 240 | \ 241 | \ 246 | \ 247 | \ 248 | \ 249 | \ 250 | \ 251 | \ 252 | \ 253 | \ 254 | #filter'); 255 | } 256 | 257 | 258 | /* Dark themes */ 259 | 260 | .theme-dark.minimal-default-dark .mk-space-banner { 261 | filter: url('data:image/svg+xml,\ 262 | \ 263 | \ 264 | \ 269 | \ 270 | \ 271 | \ 272 | \ 273 | \ 274 | \ 275 | \ 276 | \ 277 | #filter'); 278 | } 279 | 280 | .theme-dark.minimal-atom-dark .mk-space-banner { 281 | filter: url('data:image/svg+xml,\ 282 | \ 283 | \ 284 | \ 289 | \ 290 | \ 291 | \ 292 | \ 293 | \ 294 | \ 295 | \ 296 | \ 297 | #filter'); 298 | } 299 | 300 | .theme-dark.minimal-ayu-dark .mk-space-banner { 301 | filter: url('data:image/svg+xml,\ 302 | \ 303 | \ 304 | \ 309 | \ 310 | \ 311 | \ 312 | \ 313 | \ 314 | \ 315 | \ 316 | \ 317 | #filter'); 318 | } 319 | 320 | .theme-dark.minimal-catppuccin-dark .mk-space-banner { 321 | filter: url('data:image/svg+xml,\ 322 | \ 323 | \ 324 | \ 329 | \ 330 | \ 331 | \ 332 | \ 333 | \ 334 | \ 335 | \ 336 | \ 337 | #filter'); 338 | /* removed .2 from light values text overlay legibility */ 339 | } 340 | 341 | .theme-dark.minimal-dracula-dark .mk-space-banner { 342 | filter: url('data:image/svg+xml,\ 343 | \ 344 | \ 345 | \ 350 | \ 351 | \ 352 | \ 353 | \ 354 | \ 355 | \ 356 | \ 357 | \ 358 | #filter'); 359 | } 360 | 361 | .theme-dark.minimal-everforest-dark .mk-space-banner { 362 | filter: url('data:image/svg+xml,\ 363 | \ 364 | \ 365 | \ 370 | \ 371 | \ 372 | \ 373 | \ 374 | \ 375 | \ 376 | \ 377 | \ 378 | #filter'); 379 | } 380 | 381 | .theme-dark.minimal-gruvbox-dark .mk-space-banner { 382 | filter: url('data:image/svg+xml,\ 383 | \ 384 | \ 385 | \ 390 | \ 391 | \ 392 | \ 393 | \ 394 | \ 395 | \ 396 | \ 397 | \ 398 | #filter'); 399 | } 400 | 401 | .theme-dark.minimal-macos-dark .mk-space-banner { 402 | filter: url('data:image/svg+xml,\ 403 | \ 404 | \ 405 | \ 410 | \ 411 | \ 412 | \ 413 | \ 414 | \ 415 | \ 416 | \ 417 | \ 418 | #filter'); 419 | } 420 | 421 | .theme-dark.minimal-nord-dark .mk-space-banner { 422 | filter: url('data:image/svg+xml,\ 423 | \ 424 | \ 425 | \ 430 | \ 431 | \ 432 | \ 433 | \ 434 | \ 435 | \ 436 | \ 437 | \ 438 | #filter'); 439 | } 440 | 441 | .theme-dark.minimal-notion-dark .mk-space-banner { 442 | filter: url('data:image/svg+xml,\ 443 | \ 444 | \ 445 | \ 450 | \ 451 | \ 452 | \ 453 | \ 454 | \ 455 | \ 456 | \ 457 | \ 458 | #filter'); 459 | } 460 | 461 | .theme-dark.minimal-rose-pine-dark .mk-space-banner { 462 | filter: url('data:image/svg+xml,\ 463 | \ 464 | \ 465 | \ 470 | \ 471 | \ 472 | \ 473 | \ 474 | \ 475 | \ 476 | \ 477 | \ 478 | #filter'); 479 | } 480 | 481 | .theme-dark.minimal-solarized-dark .mk-space-banner { 482 | filter: url('data:image/svg+xml,\ 483 | \ 484 | \ 485 | \ 490 | \ 491 | \ 492 | \ 493 | \ 494 | \ 495 | \ 496 | \ 497 | \ 498 | #filter'); 499 | } 500 | 501 | .theme-dark.minimal-things-dark .mk-space-banner { 502 | filter: url('data:image/svg+xml,\ 503 | \ 504 | \ 505 | \ 510 | \ 511 | \ 512 | \ 513 | \ 514 | \ 515 | \ 516 | \ 517 | \ 518 | #filter'); 519 | } 520 | 521 | -------------------------------------------------------------------------------- /MakeMD Inline Context - Faded banner.css: -------------------------------------------------------------------------------- 1 | /* 2 | Make.MD Contexts: Gradient Banners 3 | Gradient Banners 4 | 5 | https://i.imgur.com/o3e6GTa.png 6 | https://github.com/replete/obsidian-minimal-theme-css-snippets 7 | */ 8 | :root { 9 | --make-md-configured-banner-height: 200px; 10 | --replete-banner-fade-height: 130px; 11 | --replete-banner-fade-offset: 10; 12 | } 13 | .mk-inline-context { 14 | .mk-path-context-component { 15 | &:has(.mk-space-banner) { 16 | /* Moves the note text above the fade of the banner */ 17 | height:calc(var(--replete-banner-height) / var(--replete-banner-fade-offset)); 18 | } 19 | } 20 | 21 | &::after { 22 | content:''; 23 | display: block; 24 | width:100%; 25 | position: absolute; 26 | left:0; 27 | height:var(--replete-banner-fade-height); 28 | top:calc(var(--make-md-configured-banner-height) - (20px + var(--replete-banner-fade-height))); 29 | 30 | background: 31 | linear-gradient(to bottom, transparent 10%, var(--background-primary)), 32 | linear-gradient(to bottom, transparent 20%, var(--background-primary)); 33 | pointer-events:none; 34 | } 35 | } 36 | 37 | 38 | -------------------------------------------------------------------------------- /MakeMD Inline Context.css: -------------------------------------------------------------------------------- 1 | /* 2 | Make.MD Banners 3 | 4 | The only thing I use Make.MD for now is the banner functionality. 5 | This base snippet hides inline-contexts altogether - we only want it for the banners. 6 | https://github.com/replete/obsidian-minimal-theme-css-snippets 7 | */ 8 | :root { 9 | --replete-banner-height: 180px; /* Set banner height here */ 10 | } 11 | .mk-inline-context { 12 | 13 | .mk-path-context-component { 14 | /* Hide inline context entirely */ 15 | display:none; 16 | 17 | &:has(.mk-space-banner) { 18 | /* ...Except if there's a banner displaying... */ 19 | display:inherit; 20 | 21 | /* ...and we hide it this way */ 22 | .mk-props-contexts { 23 | display:none; 24 | } 25 | } 26 | } 27 | 28 | .mk-space-banner { 29 | height: var(--replete-banner-height); 30 | :is(img) { 31 | height: var(--replete-banner-height); 32 | /* Disable magnify cursor */ 33 | cursor:default !important 34 | } 35 | } 36 | } 37 | 38 | /* Hide banner in hover popover */ 39 | .hover-popover .mk-space-banner { 40 | display:none; 41 | } 42 | -------------------------------------------------------------------------------- /MetaBind Compact.css: -------------------------------------------------------------------------------- 1 | /* 2 | Metabind compact editor styles 3 | https://github.com/replete/obsidian-minimal-theme-css-snippets 4 | */ 5 | 6 | /* Inline controls styles */ 7 | /* .cm-line { 8 | background:rgba(0,255,0,0.1); 9 | box-shadow: inset 0 -2px 3px rgba(255,255,255,.2); 10 | } */ 11 | 12 | .markdown-source-view.is-live-preview .cm-editor { 13 | /* Only apply to live preview view editor */ 14 | 15 | /* inline styling */ 16 | .mb-input-inline { 17 | .mb-input-type-inlineSelect { 18 | .dropdown { 19 | height:calc(1rem + 6px); 20 | vertical-align: bottom; 21 | padding-left:6px; 22 | padding-right:18px; 23 | font-family:var(--font-interface) !important; 24 | background-position-x: calc(100% - 6px); 25 | } 26 | } 27 | .mb-input-type-number { 28 | [type=number] { 29 | height:calc(1rem + 6px); 30 | font-family:var(--font-interface) !important; 31 | padding-left:6px; 32 | padding-right:6px; 33 | } 34 | } 35 | .mb-input-type-time { 36 | :is([type=time]) { 37 | height:calc(1rem + 6px); 38 | vertical-align: bottom; 39 | padding-left:6px; 40 | padding-right:0px; 41 | font-family:var(--font-interface) !important; 42 | background-image:none; 43 | box-shadow: var(--input-shadow); 44 | border-radius: var(--input-radius); 45 | background-color: var(--interactive-normal); 46 | 47 | /* theme icon color */ 48 | &::-webkit-calendar-picker-indicator { 49 | background-image:none; 50 | background-color:var(--tx1); 51 | mask-image: url('data:image/svg+xml;utf8,'); 52 | mask-repeat:no-repeat; 53 | mask-position:center center; 54 | mask-size:65%; 55 | } 56 | } 57 | 58 | /* meta-bind updated recently and now uses a real 'time' input type, so this is deprecated: */ 59 | /* .mb-input-element-group { 60 | position:relative; 61 | &::after { 62 | content: ':'; 63 | display:block; 64 | position:absolute; 65 | left:50%; 66 | width:1rem; 67 | text-align:center; 68 | margin-left:-.5rem; 69 | color: var(--tx2); 70 | user-select:none; 71 | } 72 | } 73 | .dropdown { 74 | height:calc(1rem + 6px); 75 | vertical-align: bottom; 76 | padding-left:6px; 77 | padding-right:6px; 78 | font-family:var(--font-interface) !important; 79 | background-image:none; 80 | 81 | &:nth-of-type(1) { 82 | padding-right:4px; 83 | } 84 | &:nth-of-type(2) { 85 | padding-left:4px; 86 | } 87 | } 88 | */ 89 | } 90 | .mb-input-type-toggle { 91 | .checkbox-container { 92 | transform: scale(0.8) translateY(3px) !important; 93 | transform-origin:left center; 94 | 95 | /* unchecked button */ 96 | &::after { 97 | background-color: var(--tx1); 98 | } 99 | 100 | /* checked button */ 101 | &:has(input:checked)::after { 102 | background-color:var(--bg1); 103 | } 104 | } 105 | } 106 | .mb-slider-input { 107 | transform:translate(-4px, -5px) !important; 108 | 109 | &::-webkit-slider-thumb { 110 | transform:scale(0.75); 111 | background: var(--tx1) 112 | } 113 | } 114 | 115 | .em2 > * {width: 2rem} 116 | .em3 > * {width: 3rem} 117 | .em4 > * {width: 4rem} 118 | .em5 > * {width: 5rem} 119 | .em6 > * {width: 6rem} 120 | .em7 > * {width: 7rem} 121 | .em8 > * {width: 8rem} 122 | .em9 > * {width: 9rem} 123 | .em10 > * {width: 10rem} 124 | } 125 | } 126 | 127 | 128 | 129 | -------------------------------------------------------------------------------- /MySnippets.css: -------------------------------------------------------------------------------- 1 | /* 2 | MySnippets plugin tweaks 3 | https://github.com/replete/obsidian-minimal-theme-css-snippets 4 | */ 5 | 6 | /* Embiggen menu width for longer filenames */ 7 | .MySnippets-statusbar-menu { 8 | width:420px; 9 | } 10 | 11 | /* Re-order menu item */ 12 | .MySnippets-statusbar-menu .menu-item .checkbox-container { 13 | order:1 14 | } 15 | 16 | /* Make code button less prominent */ 17 | .MySnippets-statusbar-menu .MS-OpenSnippet { 18 | box-shadow:none; 19 | background:transparent; 20 | } 21 | .MySnippets-statusbar-menu .MS-OpenSnippet:hover svg path{ 22 | fill:var(--interactive-accent) !important; 23 | } 24 | 25 | /* Fix open snippet button on light themes */ 26 | .theme-light .MS-OpenSnippet svg path{ 27 | fill:var(--tx3) !important; 28 | } -------------------------------------------------------------------------------- /Obsidian Buttons (abandoned).css: -------------------------------------------------------------------------------- 1 | /* 2 | Obsidian Buttons tweaks 3 | https://github.com/replete/obsidian-minimal-theme-css-snippets 4 | 5 | (I abandoned this plugin for time being, but whatever) 6 | */ 7 | 8 | .block-language-button { 9 | padding-left:0 10 | } 11 | 12 | .block-language-button button[class*=button-] { 13 | margin-left:0; 14 | margin-right:0; 15 | } -------------------------------------------------------------------------------- /Omnisearch.css: -------------------------------------------------------------------------------- 1 | /* 2 | Omnisearch 3 | Cleaner and less jank, essential fixes to be honest it was noisy on the eyes 4 | 5 | https://github.com/replete/obsidian-minimal-theme-css-snippets 6 | */ 7 | 8 | .omnisearch-modal.prompt { 9 | 10 | .prompt-results { 11 | 12 | } 13 | 14 | :has(> .omnisearch-result__title-container) { 15 | width:100%; 16 | } 17 | 18 | .omnisearch-result__title { 19 | display:flex; 20 | width:100%; 21 | font-size:1rem; 22 | font-weight:500; 23 | margin-bottom:3px; 24 | 25 | :has(svg) { 26 | display:none; 27 | margin-left:-2px; 28 | transform:scale(0.9) translate(0, 2px) 29 | } 30 | } 31 | 32 | .omnisearch-result { 33 | } 34 | 35 | .omnisearch-result__folder-path { 36 | /* font-style:italic; */ 37 | font-size:11px; 38 | margin-top:-5px; 39 | margin-bottom:3px; 40 | 41 | /* > span { 42 | background: var(--bg3); 43 | padding:0px 4px; 44 | border-radius:2px; 45 | 46 | &::before { 47 | content:'/'; 48 | } 49 | } */ 50 | 51 | :has(svg) { 52 | /* display:none; */ 53 | /* icon resized inline with text: */ 54 | transform: scale(0.7) translate(0,2px); 55 | transform-origin: left center; 56 | margin-right:-7px; 57 | } 58 | } 59 | 60 | .omnisearch-result__extension { 61 | display:none; 62 | transform: translate(-4px,2px); 63 | font-weight:500; 64 | } 65 | 66 | .omnisearch-result__counter { 67 | margin-left: auto; 68 | 69 | /* &::before { 70 | content:'(' 71 | } 72 | &::after { 73 | content:')' 74 | } */ 75 | } 76 | 77 | .omnisearch-result__body { 78 | margin-left:0; 79 | font-style:italic; 80 | } 81 | 82 | .omnisearch-result { 83 | padding-top:var(--size-4-3); 84 | padding-bottom:var(--size-4-3); 85 | margin-top:calc( (-1 * var(--size-4-3)) / 2); 86 | } 87 | 88 | .omnisearch-highlight { 89 | text-decoration-color:var(--accent-color); 90 | text-underline-offset:3px; 91 | text-decoration-thickness:1px; 92 | } 93 | 94 | } 95 | -------------------------------------------------------------------------------- /Outline.css: -------------------------------------------------------------------------------- 1 | /* 2 | Compact outline panel 3 | This makes the outline view far more condensed and shifts the chevrons to where I prefer them on the right 4 | https://github.com/replete/obsidian-minimal-theme-css-snippets 5 | */ 6 | 7 | 8 | .outline .tree-item-children { 9 | --nav-item-children-padding-left:4px; 10 | --nav-item-children-margin-left:5px; 11 | border-left-color:transparent 12 | } 13 | 14 | .outline .tree-item-icon.collapse-icon { 15 | order:2; 16 | padding-left:2px; 17 | transform:scale(0.8) translate(0, -1px) 18 | } 19 | 20 | .outline .tree-item-inner { 21 | flex:0 1 auto 22 | } 23 | 24 | /* First item (page h1) */ 25 | .outline > .tree-item > .tree-item-self { 26 | font-weight:500; 27 | } 28 | 29 | .outline > .tree-item > .tree-item-children { 30 | padding-left:4px; 31 | margin-left:5px; 32 | --nav-item-children-padding-left:0px; 33 | --nav-item-children-margin-left:0px; 34 | } 35 | 36 | /* .mod-right-split .outline > .tree-item > .tree-item-children .mod-collapsible{ 37 | text-transform:uppercase; 38 | font-size:75%; 39 | font-weight:500; 40 | margin-top:5px 41 | } */ -------------------------------------------------------------------------------- /Quiet Outline.css: -------------------------------------------------------------------------------- 1 | /* 2 | Quiet Outline plugin tweaks 3 | https://github.com/replete/obsidian-minimal-theme-css-snippets 4 | */ 5 | 6 | .quiet-outline { 7 | padding-bottom:0; 8 | } 9 | 10 | .view-content:has(.quiet-outline) { 11 | padding:0 !important 12 | } 13 | 14 | .quiet-outline .function-bar .n-button { 15 | order:2 !important 16 | } 17 | 18 | .quiet-outline .n-input-wrapper { 19 | } 20 | 21 | .quiet-outline .n-slider { 22 | width: calc(100% - 20px); 23 | margin-left:10px !important; 24 | margin-bottom:8px !important; 25 | margin-top:12px !important; 26 | } 27 | 28 | .quiet-outline .function-bar .n-input { 29 | background-color: var(--background-secondary) !important; 30 | } 31 | .quiet-outline .function-bar .n-input__border, 32 | .quiet-outline .function-bar .n-input__state-border { 33 | border:none !important; 34 | box-shadow:none !important; 35 | } 36 | 37 | .quiet-outline .function-bar input { 38 | box-shadow:none; 39 | } 40 | 41 | .quiet-outline .function-bar { 42 | /* background: var(--background-secondary) !important; */ 43 | background: linear-gradient(to bottom, transparent 1%, var(--background-secondary) 15%); 44 | position: fixed; 45 | bottom:0; 46 | padding: 6px 0; 47 | z-index:1; 48 | width:100%; 49 | margin-bottom:0; 50 | } 51 | 52 | .quiet-outline .function-bar .n-button { 53 | box-shadow:none !important; 54 | opacity: 0.6; 55 | transform: scale(0.8); 56 | } 57 | 58 | .quiet-outline .function-bar .n-button__border { 59 | border:0 !important; 60 | } 61 | 62 | .quiet-outline .n-tree { 63 | padding: 2px; 64 | padding-bottom: 40px; 65 | } 66 | 67 | .quiet-outline .n-config-provider { 68 | display: flex; 69 | } 70 | 71 | .quiet-outline code { 72 | padding-left: 10px; 73 | font-size: 13px; 74 | } 75 | 76 | .quiet-outline .n-tree-node.located p { 77 | color: var(--tx1) 78 | } 79 | 80 | /* Make bright colours fit theme instead of user-selectable */ 81 | .quiet-outline .n-slider[style] { 82 | --replete-subdued-color: hsla(var(--base-h), var(--base-s), calc(var(--base-l) - 10%), 0.7) !important; 83 | --n-fill-color: var(--tx3) !important; 84 | --n-fill-color-hover: var(--tx3) !important; 85 | --n-dot-border: 2px solid var(--replete-subdued-color) !important; 86 | --n-dot-border-active: 2px solid var(--tx3) !important; 87 | --n-rail-color: var(--replete-subdued-color) !important; 88 | --n-dot-color: var(--background-primary) !important; 89 | --n-handle-color: var(--tx2) !important; 90 | } 91 | 92 | .theme-dark .quiet-outline .n-slider[style] { 93 | --replete-subdued-color: hsla(var(--base-h), var(--base-s), calc(var(--base-l) + 20%), 1) !important; 94 | } 95 | 96 | .quiet-outline .n-input__placeholder { 97 | color: var(--tx3); 98 | opacity:0.6 99 | } 100 | 101 | .quiet-outline .n-tree-node-indent { 102 | border-right-color: hsla(var(--base-h), var(--base-s), calc(var(--base-l) - 5%), 1) !important; 103 | } 104 | 105 | .theme-dark .quiet-outline .n-tree-node-indent { 106 | border-right-color: hsla(var(--base-h), var(--base-s), calc(var(--base-l) + 15%), 1) !important; 107 | } -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Obsidian CSS snippets for Minimal Theme 2 | 3 | ![Screenshot](screenshots/screenshot.png) 4 | 5 | My working folder of CSS snippets for Obsidian configured with the [Minimal Theme](https://github.com/kepano/obsidian-minimal). The purpose is to extend Obsidian UI possibilities and also visually harmonize the style of various plugins with `Minimal Theme`, with a preference for compact UI. Updated regularly. Screenshots below. Some snippets will probably work fine on default or other themes. 6 | 7 | ## How to use 8 | 9 | Clone/[fork](https://github.com/replete/obsidian-minimal-theme-css-snippets/fork)/[unzip](https://github.com/replete/obsidian-minimal-theme-css-snippets/archive/refs/heads/main.zip) into `/.obsidian/snippets` or use 'Snippet Downloader' plugin. I recommend installing the [MySnippets plugin](https://github.com/chetachiezikeuzor/MySnippets-Plugin) via 'Community plugins' to easily manage snippets with a statusbar popup menu: 10 | ![MySnippets plugin screenshot](screenshots/mysnippets.png) 11 | 12 | ## Support development 13 | 14 | 15 | 16 | 17 | 18 | ## Updates (scroll to next section for snippet details) 19 | - **2025-03-28** Fixed Make.MD Inline Context - Faded banners and duotone scripts now work again - hoorah! 20 | ![ Make.MD Inline Context - Faded banners screenshot](screenshots/makemd-duotone-fade-2025.png) 21 | - **2025-03-28** Made Ultra Compact Sidebar expand on hover. 22 | - **2025-03-22** Added File Explorer Folder Icons. Harmonizes with the Iconize plugin if you use that. 23 | ![ File Explorer Folder Icons screenshot](screenshots/file-explorer-folder-icons.png) 24 | - **2025-03-22** Added File Explorer Header Autohide snippet. Hides the file explorer header until hovered over (I never use this and it looks better without it). 25 | ![ File Explorer Header Autohide screenshot](screenshots/file-explorer-header-autohide.gif) 26 | - **2025-03-21** New Compact File Explorer snippet (renamed old to 'Legacy'). No more jankiness. Chevrons hidden at top level, made subtle and other tweaks. Much better. Tweaked 'Compact Sidebar' snippet also, both pictured below. 27 | ![New Compact File Explorer screenshot](screenshots/compact-file-explorer-new.png) 28 | - **2024-12-20** Added SheetsPlus - Dark Mode snippet. Mega hacky as JS spreadsheets are usually canvas-based, but it's better than being flashbanged by a screen of pure white. Only applies if a dark theme is active. 29 | ![SheetsPlus Dark mode screenshot](screenshots/sheets-plus.png) 30 | - **2024-11-05** Version bump to 1.7.5. Installed from Obsidian Installer to get Electron 32 (=Chromium v120 features like `color-mix`,`color-contrast`, and css container queries) 31 | - **2024-10-17** Fixed Compact File Explorer for Obsidian 1.7x 32 | - **2024-09-19** Renamed Compacter Tab Header to Ultra Compact Tab Header. What was I thinking when I named that one... 33 | - **2024-09-06** Fixed Excalidraw Compact. Fixed Ultra Compact. Added Ultra Compact Sidebar. ![Ultra](screenshots/ultra.png) 34 | - **2024-09-05** Compact File Explorer refactor and bugfix. Notes on startup padding JS fix in snippet header comment. 35 | - **2024-09-05** Added Ultra Compact snippet. Ultra Compact Sidebar snippet. ![Ultra Compact screenshot](screenshots/ultra-compact.png) 36 | - **2024-09-05** Added Excalidraw - Compact Snippet. Added Compact-er Tab Header. ![Compact Tab Header screenshot](screenshots/compact-tab-header-plus.png) 37 | - **2024-08-31** Renamed `[ui] Compact Sidebar Header.css` to `[ui] Compact Sidebar.css`. Made vault selector compact. 38 | ![compact vault sidebar screenshot](screenshots/compact-sidebar-footer.png) 39 | - **2024-06-11** Obsidian 1.6 fixes: Fixed Custom Separators and Compact File Explorer snippets 40 | - **2024-05-17** Added [Sticky Headings for Daily Note](#user-snippets) 41 | - **2024-04-09** MakeMD banners broke for me again. Might be a conflict of some kind. I've submitted an [issue on their github](https://github.com/Make-md/makemd/issues/297) so chip in if you also have the same problem. 42 | - **2024-03-20** MakeMD Banners are back. Thankfully they've sorted out whatever was going on, so I've refactored the snippets entirely, and it works much better with less code. 43 | - **2024-03-17** Added new Omnisearch plugin visual fixes. I've made a number of changes in recent commits but haven't updated notes. At some point I'll update screenshots and things. 44 | - **2024-02-21** Disabled a number of plugins for performance reasons. Trying out ollama embeddings plugin, but its early days. 45 | - **2024-02-21** Works on mobile. MakeMD banners stopped working again, combined with the broken inline file context I've chosen to just give up and disable MakeMD for now. I'll live without the pretty banners, it's a shame to lose this nice functionality but there are no other banner plugin alternatives that work and MakeMD is no longer worth dealing with. I'll leave the banner functionality here but if it works for you now, updating it may cause you problems. 46 | - **2024-02-08**: MakeMD's inline context (filename in editor) has broken for a while, I've refactored CSS and reinstalled MakeMD but ths bug remains, so for some new files the inline context filename does not show. Reinstalling MakeMD did make my banner show again however and I've fixed the CSS for it. If you have problems, try uninstalling and reinstalling the plugin and reseting the options (disable everything but `Sync Context Fields..., Flow (beta), Inline Context, Flow Block, Open Flow Blocks...` if you wish to replicate my setup, which these snippets are configured for). I only use MakeMD for the banner functionality as there's no other option right now, and look forward to getting rid of this plugin entirely in the future. 47 | 48 | ## My environment 49 | 50 | - `MacOS`, `Android`, `Windows 11` 51 | - Windows 11 and Linux might need little tweaks in snippets that deal with native titlebar controls, welcome fixes if needed but probably only an issue in a few snippets 52 | - `Obsidian v1.8.10 (installer v1.8.9)` Desktop 53 | - NOTE: If your installer version is less than 1.1.8, you _must_ reinstall from official installer to update electron for updated CSS features like `:has()` 54 | - `Minimal Theme v7.7.19` 55 | ```js 56 | // plugins I have enabled (33): 57 | ['obsidian-advanced-uri', 'auto-class', 'calendar', 'cmdr', 'hotkeysplus-obsidian', 'obsidian-icon-folder', 'obsidian-excalidraw-plugin', 'cm-editor-syntax-highlight-obsidian', 'obsidian-minimal-settings', 'obsidian-meta-bind-plugin', 'open-vscode', 'periodic-notes', 'quickadd', 'obsidian-task-progress-bar', 'templater-obsidian', 'mysnippets-plugin', 'no-dupe-leaves', 'file-explorer-note-count', 'easy-toggle-sidebars', 'settings-search', 'custom-sort', 'obsidian-shortcut-launcher', 'obsidian-contextual-typography', 'open-in-new-tab', 'obsidian-tracker', 'omnisearch', 'snippet-commands-obsidian', 'dataview', 'meld-encrypt', 'obsidian-day-planner', 'sticky-heading', 'sheet-plus', 'make-md'] 58 | // [...new Set(app.plugins.enabledPlugins)] 59 | ``` 60 | 61 | > ⭐ A star beside the follow snippet titles indicate I have it enabled in my vault (and should work well for you too as a default configuration) 62 | ## Editor Snippets 63 | - **Custom Tag Styles** ⭐ - I'm not using tags much at the moment, but prefer the more compact look than the pill shaped. If I use tags more I'll extend this. 64 | ![Custom tag styles screenshot](screenshots/custom-tags.png) 65 | - **Compact Right Sidebar notes** ⭐ - This shortens the margins and enables a duotone when not hovering for when a note is open in the right panel workspace (reading view atm) 66 | - **Editor fixes** ⭐ - gutter component alignments, general editor fixes, less visible indentation guide 67 | - **Frontmatter tweaks** ⭐ - styling, fixes for `editor syntax highlighter plugin` 68 | - **Table tweaks** ⭐ - WIP, still waiting for a good table editing plugin... 69 | - **Top Fade** - Remove harsh edge of content when using "Compact Tabs (classic)" with one of the positional Tab Header snippets (I prefer the Translucent Tab Header) 70 | ![Top fade screenshot](screenshots/top-fade.png) 71 | - **Typography fixes** ⭐ - alignment fixes for editor, headings, list items quotes etc (WIP) 72 | ![Typography fixes](screenshots/typography-fixes.png) 73 | ## UI snippets: 74 | - **Collapsible Right Headers** ⭐ - Hide panel headers until hover in the right sidebar. 75 | ![Collapsible right headers screenshot](screenshots/collapsible-header.gif) 76 | - **Compact File Explorer (new)** ⭐ - Compact styles, hidden top-level chevrons, jankiness fully removed. 77 | ![New Compact File Explorer screenshot](screenshots/compact-file-explorer-new.png) 78 | - **Compact Properties (+autohide)** ⭐ - Compact Properties (Obsidian 1.4.5 feature) with hover autohide, just like the Make.MD snippet [note: I keep the Make.MD + snippets enabled for the banner functionality] 79 | ![Compact Properties screenshot](screenshots/compact-properties.gif) 80 | - **Compact Tab Header** - Compact icons in toolbar, also fixes `Commander` plugin icon colours 81 | ![Compact Tab Header screenshot](screenshots/compact-tab-header.png) 82 | - **Ultra Compact Tab Header** ⭐ - Compact icons in ultra toolbar, also fixes `Commander` plugin icon colours 83 | ![Compact Tab Header screenshot](screenshots/compact-tab-header-plus.png) 84 | - **Compact Sidebar** ⭐ - Compact top sidebar nav, file explorer nav header, and make vault selector footer compact. 85 | ![New Compact File Explorer screenshot](screenshots/compact-file-explorer-new.png) 86 | - **Compact Tabs** ⭐ - Compact firefox-style pill tabs, better for smaller screens 87 | ![Compact Tabs screenshot](screenshots/compact-tabs.png) 88 | - **Compact Tabs (classic)** - Compact classic tabs, better for smaller screens 89 | ![Compact Tabs classic screenshot](screenshots/compact-tabs-classic.png) 90 | - **Custom Separators** ⭐ - user-configurable CSS for separators, works well with `File Explorer Custom Sorting` plugin 91 | ![Custom Separator screenshot](screenshots/custom-separators.png) 92 | - **Custom Separators (gradient)** - user-configurable CSS for separators, works well with `File Explorer Custom Sorting` plugin 93 | ![Custom Separators (gradient) screenshot](screenshots/custom-separators-gradient.png) 94 | - **File Explorer Header Autohide** ⭐ - Hides the file explorer header until hovered over (I never use this and it looks better without it) 95 | ![ File Explorer Header Autohide screenshot](screenshots/file-explorer-header-autohide.gif) 96 | - **File Explorer Folder Icons** ⭐ - File Explorer Folder Icons, with an expand icon. Harmonizes with the Iconize plugin if you use that. It's a little weird, but it works - I think I actually want file explorer to be more like vscode's explorer... 97 | ![ File Explorer Folder Icons screenshot](screenshots/file-explorer-folder-icons.png) 98 | - **Floating Tab Header** - Save space with this float right leaf tab header (show navigation, breadcrumb on hover/focus) 99 | ![Floating Tab Header screenshot](screenshots/floating-tab-header.gif) 100 | - **Floating Tab Header (mini)** - Save even more space with this float right leaf tab header (show navigation, breadcrumb on hover/focus) 101 | ![Floating Tab Header (mini) screenshot](screenshots/floating-tab-header-mini.gif) 102 | - **Native Scrollbar styles** ⭐ - make scrollbars way nicer and color themed 103 | - **Resize Handles** ⭐ - prefer more muted theme colours 104 | - **Restrict Last Right Sidebar Panel** ⭐ - Sets max-height on last bottom right sidebar panel, saving you from constantly resizing the panel when resizing windows (e.g. for the calendar plugin panel, which is to me essential) 105 | ![Restrict last right sidebar panel screenshot](screenshots/restrict-last-right-sidebar-panel.png) 106 | - **Status bar tweaks** ⭐ - more visible text on dark theme 107 | - **Tab Header on bottom** - Move the tab title bar to the bottom, vertical statusbar when right sidedock closed 108 | ![Tab Header on Bottom screenshot](screenshots/tab-header-bottom.png) 109 | - **Tab Header show path and title** ⭐ - I've disabled inline context filename editing and rely on this now, this shows the filename always without hover and allows rename with one click 110 | - **Translucent Tab Header** - Classic style tab header showing blurred document content underneath (NOTE: its pretty, but on large documents causes performance issues delaying text due to the constant reflows caused by the graphical effect) 111 | ![Translucent Tab Header screenshot](screenshots/tab-header-translucent.png) 112 | - **Ultra Compact** - Super small navigation tabs, smaller toolbar icons, shorter file explorer. Usecase: tiny screen 113 | ![ultra compact screenshot](screenshots/ultra-compact.png) 114 | - **Ultra Compact Sidebar** - Hardcodes sidebar to 135px. Goes well with Ultra Compact snippet. Caveats: mouse resize not possible, resize animation broken 115 | ![ultra compact screenshot](screenshots/ultra-compact.png) 116 | ### User Snippets: 117 | - **Daily Note styles** ⭐ - supporting styles for my daily note template, scoped to notes with `cssclass: dailynote` in frontmatter 118 | - **Daily Note (Sticky Headings)** ⭐ - requires 'Sticky Headings' plugin, and disables the stick view for anything other than `cssclass: dailynote` 119 | ![Daily Note Sticky Headings](screenshots/dailynote-sticky.png) 120 | - **Themed colours** ⭐ - Custom accent colours for each minimal theme subtheme, I like switchng minimal colour theme ocassionally and this ensures the accent color is overridden with a color that makes sense for the theme without needing to manually set it 121 | ![Themed Accents screenshot](screenshots/accents.gif) 122 | 123 | ### Plugin snippets 124 | - **Calendar** ⭐ - Compact, weekend, day styles, colours, essential plugin for me 125 | ![Calendar screenshot](screenshots/calendar.png) 126 | - **Custom Frames** ⭐ - Compact panel 127 | - **Custom Frames (Duotone)** ⭐ - blend custom frames content in with theme until hover 128 | ![Custom Frames - Duotone screenshot](screenshots/custom-frames-duotone.png) 129 | - **Day Planner (Ivan Lednev's version)** ⭐ - Ivan has done an amazing job at reviving this plugin. I think this version is the best of those available on Community Plugins. This snippet makes the header a little more compact (I am a compact UI fiend) 130 | ![Daily Note Outline screenshot](screenshots/dayplanner-ivanlednev.png) 131 | - **Daily Note Outline** ⭐ - Compact, visual tweaks, works with compact file explorer snippet 132 | ![Daily Note Outline screenshot](screenshots/daily-note-outline.png) 133 | - **Database Folder (Compact)** - compact view 134 | ![Database Folder screenshot](screenshots/dbfolder.png) 135 | - **Excalidraw (Compact)** ⭐ - Controls more compact, bigger icons, bigger library, tidier floating utilities island, colour fixes. Note: Screens are bright nowadays so I use dark mode exclusively, light mode works but I hardcoded a colour for control backgrounds that you might not like, designed for a white canvas...). Not tested on mobile, but probably fine... 136 | ![Excalidraw compact screenshot](screenshots/excalidraw-compact.png) 137 | - **Make.MD Inline Context** ⭐ - Only used for banner functionality, inline context components are hidden. To use, add a `banner` property to a note's frontmatter directly or via Properties (see Autohide snippet) 138 | ![Make.MD Contexts screenshot](screenshots/makemdinlinecontexts.gif) 139 | - **Make.MD Inline Context: Duotone Banner** ⭐- Makes all banner images duotone to match minimal theme 140 | ![Make.MD Contexts Duotone banners screenshot](screenshots/makemdcontextsbannerduotone.png) 141 | - **Make.MD Inline Context: Faded Banner** ⭐ Fade images to background with a gradient, and offsets text 142 | ![Make.MD Contexts Gradient banners screenshot](screenshots/makemdcontextsbannergradient.png) 143 | - **Meta Bind (Compact)** ⭐ - Inline controls are more compact, with customizations to some controls 144 | - **MySnippets** ⭐ - make menu wider and fix button style/order 145 | ![MySnippets tweaks screenshot](screenshots/mysnippets_tweaks.png) 146 | - **Omnisearch** ⭐ - Cleaner styles, less visual noise 147 | ![Omnisearch screenshot](screenshots/omnisearch.png) 148 | - **Outline** - chevron on right, compact 149 | ![Outline tweaks screenshot](screenshots/outline.png) 150 | - **Quiet Outline** - Remove rainbow colours to theme colors, re-arrange layout (I use this instead of Outline panel) 151 | ![Quiet Outline plugin tweaks screenshot](screenshots/quietoutline.png) 152 | - **Sheets Plus Dark Mode** ⭐ - Dark mode hack for spreadsheets. Only applies if a dark theme is active. 153 | ![SheetsPlus Dark mode screenshot](screenshots/sheets-plus.png) 154 | - **Task progressbars** ⭐ - alignments and themed colours 155 | ![Task Progressbars plugin tweaks screenshot](screenshots/taskprogressbars.png) 156 | - **Tracker** ⭐ - cleaner styles and duotone on hover 157 | 158 | ## No longer developed (I don't use these styles anymore) 159 | - **Compact File Explorer Legacy** - Compact styles, chevrons on right, makes attachment folders less visible. A bit janky and now redundant. 160 | ![Compact File Explorer Legacy screenshot](screenshots/compact-file-explorer.png) 161 | - **Mono Emojis everywhere** - uses mono emoji font (activate separately) for everything in an editor (this is actually pretty ugly and I don't use it) 162 | - **Heatmap Calendar** - colours and text styles for habit type use-case [(imgur screenshot)](https://i.imgur.com/ndvRLIC.png) 163 | - **Full Calendar** - pretty hacky due to limits of styling hooks 164 | - **Obsidian Buttons** - alignments 165 | - **Excel** - Follows minimal colour theme for plugin UI (excluding spreadsheet editor, which is a rendered canvas), tidy up some UI metrics 166 | ![Excel screenshot](screenshots/excel.png) 167 | - **Day Planner (old version)** - ~~I'm using [my own fork](https://github.com/replete/obsidian-day-planner) of this abandoned plugin for more features but the styles here are not dependent on fork changes, yes its still buggy~~ Apparantly this plugin has a new maintainer, but I've stopped using it so these styles are for an older v 168 | ![Day Planner screenshot](screenshots/dayplanner.png) 169 | - **Tasks - Mono Icons (lucide2)** - Lucide2 Monotone icon set for Tasks Emoji Format, generated by [this tool I made](https://github.com/replete/obsidian-tasks-custom-icons) 170 | ![Tasks - Mono Icons (lucide2) screenshot](screenshots/tasks-icons-lucide2.png) 171 | - **Tasks - Compact** - Dates/backlink as tooltip. Colour-based priority. Incudes ['lucide2' monochrome tasks emojis](https://github.com/replete/obsidian-tasks-custom-icons). 172 | ![Tasks - Compact](screenshots/tasks-compact.gif) 173 | - **Checklist (Ultra compact)** - Compact view (for tag mode users) 174 | ![Checklist (ultra compact) screenshot](screenshots/checklist.png) 175 | - **CardBoard** - Compact styles, waiting on feature update so WIP 176 | ![CardBoard screenshot](screenshots/cardboard.png) 177 | - **Smart 2nd Brain (compact)** - Some basic styles to fix some of the UX of this plugin, there are no class selectors in the plugin UI so its extremely hacky but makes it more compact 178 | ![Smart second brain screenshot](screenshots/smart2ndbrain.png) 179 | - **Mono Emojis** - embedded Noto Emoji variable font (2MB snippet!) - not recommended 180 | 181 | ## Deprecated snippets (deleted from repo) 182 | - **Hide Ribbon** - built-in to Obsidian now in settings 183 | - **Hide Vault Title in Sidebar** - hide the vault name in the left, makes sense if you only ever use one vault (removed from obsidian) 184 | - ~~[Make.MD Banner](https://i.imgur.com/bn5bfMS.gif) - Mostly banner cssclass overrides, gradient, blur, tall, short etc - I refactored/improved this into separate snippets above~~ 185 | - ~~Make.MD Compact Spaces - use less space, like Compact File Explorer snippet (deprecated)~~ 186 | - ~~Make.MD Inline Context - Autohide meta ~~ 187 | 188 | ## Support development 189 | 190 | 191 | ## TODO 192 | - [x] Test/fix for Mobile Obsidian 193 | - [x] Fix the weird list item alignments that vary depending on file length 194 | - [x] Fix colour inconsistencies across light/dark themes 195 | - [x] Test/fix for Windows (no fixes needed at time) 196 | - [x] Test/fix for Linux (no fixes needed at time) 197 | 198 | -------------------------------------------------------------------------------- /SheetsPlus - Darkmode.css: -------------------------------------------------------------------------------- 1 | /* 2 | Sheets Plus - Dark mode 3 | https://github.com/replete/obsidian-minimal-theme-css-snippets 4 | */ 5 | 6 | [data-type=excel-pro-view] { 7 | /* compact mode bonus */ 8 | .my-univer { 9 | border:0; 10 | } 11 | .view-content { 12 | padding:0 !important; 13 | padding-bottom:32px !important; /* accomodate floating statusbar */ 14 | } 15 | } 16 | 17 | .theme-dark [data-type=excel-pro-view] { 18 | /* &::after { 19 | content:''; 20 | width:100%; 21 | height:100%; 22 | display:block; 23 | background:var(--bg2); 24 | position: absolute; 25 | z-index:20; 26 | user-select:none; 27 | pointer-events:none; 28 | opacity:0.2; 29 | filter:saturate(2); 30 | } */ 31 | 32 | /* Dark mode hack */ 33 | /* for the love of God, do not ever do something like this in production */ 34 | 35 | header, 36 | footer { 37 | filter: invert() contrast(0.78); 38 | 39 | .univer-toolbar-item-select-arrow, 40 | .univer-toolbar-item-select-button-arrow, 41 | svg { 42 | filter:brightness(.2); 43 | } 44 | .univer-toolbar-group::after { 45 | filter:brightness(.8); 46 | } 47 | 48 | .univer-slide-tab-div { 49 | /* border:1px solid black; */ 50 | border-bottom:0; 51 | box-shadow: 0 -3px 8px -2px rgba(0,0,0,0.7); 52 | } 53 | 54 | .univer-sheet-container { 55 | padding:0; 56 | } 57 | } 58 | 59 | footer { 60 | .univer-slider-handle { 61 | filter:invert() 62 | } 63 | } 64 | 65 | canvas[id^=univer-sheet-main-canvas] { 66 | filter: invert() contrast(1.6); 67 | } 68 | .univer-workbench-container-canvas { 69 | background:var(--bg1) !important; 70 | } 71 | [id=__INTERNAL_EDITOR__DOCS_NORMAL] { 72 | canvas { 73 | filter:invert(); 74 | } 75 | } 76 | 77 | } 78 | 79 | .univer-dropdown { 80 | filter: invert() contrast(.78); 81 | 82 | .univer-toolbar-item-select-arrow, 83 | .univer-toolbar-item-select-button-arrow, 84 | svg { 85 | filter:brightness(.2); 86 | } 87 | .univer-toolbar-group::after { 88 | filter:brightness(.8); 89 | } 90 | 91 | .univer-slide-tab-div { 92 | /* border:1px solid black; */ 93 | border-bottom:0; 94 | box-shadow: 0 -3px 8px -2px rgba(0,0,0,0.7); 95 | } 96 | 97 | .univer-menu-item-content { 98 | color:black; 99 | } 100 | } 101 | -------------------------------------------------------------------------------- /Smart2ndBrain.css: -------------------------------------------------------------------------------- 1 | /* 2 | Smart Second Brain 3 | This plugin is early and there are no CSS classes really being used so this is extremely hacky, but improves the UX a bit. 4 | The plugin isn't quite practical enough for me just yet, so I'll revisit this another time in the future. 5 | https://github.com/replete/obsidian-minimal-theme-css-snippets 6 | */ 7 | 8 | .workspace-leaf { 9 | 10 | [data-type=chat-view] .view-content:has(.chat-window) { 11 | /* selectors aren't great in this plugin right now */ 12 | padding:0; 13 | 14 | output { 15 | font-size:13px; 16 | } 17 | 18 | [aria-label="Open quick settings"] { 19 | transform:translate(0, 7px) !important; 20 | opacity: 0.7; 21 | } 22 | 23 | textarea { 24 | margin-left: 16px; 25 | margin-right: 12px; 26 | 27 | + button { 28 | padding-left:8px; 29 | padding-right:8px; 30 | margin-right:12px; 31 | } 32 | } 33 | 34 | :is(.min-h-\[33\%\]) { 35 | padding:10px; 36 | min-height: 20% !important; 37 | height:auto; 38 | font-size:13px; 39 | } 40 | 41 | .chat-window { 42 | border-radius:0; 43 | border:0; 44 | 45 | .group { 46 | margin:4px; 47 | margin-left:12px; 48 | padding-left:12px; 49 | font-size:13px; 50 | } 51 | } 52 | 53 | > div:first-child { 54 | padding-bottom:0 !important; 55 | } 56 | } 57 | } -------------------------------------------------------------------------------- /Task Progressbars.css: -------------------------------------------------------------------------------- 1 | /* 2 | Task Progress bars 3 | I really like this plugin. This aligns them to my typography and makes them less ugly 4 | https://github.com/replete/obsidian-minimal-theme-css-snippets 5 | */ 6 | 7 | .markdown-source-view:not(.is-live-preview) { 8 | .cm-task-progress-bar { 9 | display:none; 10 | } 11 | } 12 | 13 | .cm-task-progress-bar.with-number .progress-status { 14 | color:var(--tx2); 15 | font-weight:400; 16 | font-size:10px; 17 | position:absolute; 18 | transform:translate(-4px,-12px); 19 | width:4em; 20 | } 21 | 22 | .HyperMD-header .cm-task-progress-bar { 23 | pointer-events:none; 24 | position: absolute; 25 | margin-top:calc(.5em + 1px); 26 | margin-left:10px; 27 | } 28 | 29 | 30 | /* colors */ 31 | /* .cm-task-progress-bar .progress-bar-inline-1 { background-color:var(--color-red) } 32 | .cm-task-progress-bar .progress-bar-inline-2 { background-color:var(--color-yellow) } 33 | .cm-task-progress-bar .progress-bar-inline-3 { background-color:var(--color-green) } */ 34 | .cm-task-progress-bar .progress-bar-inline-4 { background-color:#6BCB77 } 35 | 36 | /* background color */ 37 | .HyperMD-header .cm-task-progress-bar .progress-bar-inline-background { 38 | background-color: hsla(var(--base-h), var(--base-s), calc(var(--base-l) - 10%), 0.8) !important; 39 | opacity:0.5 40 | } 41 | 42 | .theme-dark .HyperMD-header .cm-task-progress-bar .progress-bar-inline-background { 43 | background-color: hsla(var(--base-h), var(--base-s), calc(var(--base-l) + 25%), 0.8) !important; 44 | } 45 | 46 | /* complete checkmark state */ 47 | .cm-task-progress-bar .progress-bar-inline-4 { 48 | display:none; 49 | } 50 | .cm-task-progress-bar:has(.progress-bar-inline-4)::after { 51 | content:'✓'; 52 | position:absolute; 53 | top:50%; 54 | color: var(--tx2); 55 | font-size:24px; 56 | line-height: 1em; 57 | transform:translate(-4px, -8px) 58 | } -------------------------------------------------------------------------------- /Tasks - Compact.css: -------------------------------------------------------------------------------- 1 | /* 2 | Tasks: Compact 3 | Colour-based priority status. Show dates on hover. Monochrome emojis. 4 | 5 | Original credit to @sunb_mn on Obsidian's discord server for 6 | the basis of these styles which saved me a bit of time: 7 | https://discord.com/channels/686053708261228577/744933215063638183/1108617092137226320 8 | 9 | https://github.com/replete/obsidian-minimal-theme-css-snippets 10 | */ 11 | 12 | /*! 13 | Included icons were modified from https://lucide.dev 14 | License reproduced from https://lucide.dev/license 15 | 16 | ISC License 17 | Copyright (c) for portions of Lucide are held by Cole Bemis 2013-2022 as part of Feather (MIT). All other copyright (c) for Lucide are held by Lucide Contributors 2022. 18 | Permission to use, copy, modify, and/or distribute this software for any purpose with or without fee is hereby granted, provided that the above copyright notice and this permission notice appear in all copies. 19 | THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE. 20 | */ 21 | @font-face { 22 | font-family: 'TasksMonoEmojis'; 23 | src: url('data:@file/octet-stream;base64,d09GMgABAAAAAAigAAsAAAAAFDwAAAhQAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHII0BmAAhjIKlESRPgs+AAE2AiQDeAQgBYRqB4FSG7ERURRTn+xnQku4P6KzXOMyqnXpGLBdz7XMv/0vGIOvZdDav87c7u0hfSBSAQSHwA5VNIOuSupYyFa/qZzaBgAdtwoAGKHsSeQAmySzTFBCeRIVAAP4LB2DpCMAHngu929aa+qBp1uk+F50z8N4WiQBRYHFPS/bVvzft/Zqb5JMiFV0NnTREQZcnMPJflq4CxBtCD6oYFkCybpqVmWHKFQ9sdB9vsJXqKoKL7u/d/ZSU5g413AsNZt8lxP9LUGArc8o2mzSRhikF8s9dlBMAgCAEK5lsR7VgER3hCQBzI/td4ZUlwkG7cQD/KBRQg6pUiJAgi9AksYSiPhCoVgiRZLLEApUKxfwCKZcHYtSqUqgTDlB0k1OETLezFROMqAvVVDA9IpctbyCzRI5xuPL9jc36MpVC5Xjt6G4UTjmq8CX9YQimUKZCjKs5TWggxzq+wDYhZ8vzlaEsYBGj8CeYM5SpgePWP43XgE8M09NYgC+AlgAHSAAXQAJvCAA+EQgoItgAy+kWwByIUFZzsAE4+XPvi3/pVVvvV0CLKeDsnDxZ9/ItoQuyu3CFWq06IruiQSqRTzBJE7FcplrEpXCCf6P7atistgcLjAF452RJUd2nMlWcQ4DeM3dIu+vwBJc2SwQX81d7kM1roQIV4GHqyHAtZDiOihwPcS4EXLcBBluhgrcAgluhUrcASHuhDLcBeW4G3zca1UlN97jYSY3PuJhJTc+42EntybxcJJbjza4+HqyGEB82wEN3wV2QOCbbQckvrl2QMc3zw4o/HyTARiRQA0AGHGMhMgB5AqAJa9iBNK2UyRpHOThCaxoUz95wbDWPFF5UsIZ2pJXlIfdIukvLgknRx1/cOEd4AavZm9IEqg1RaVEF3+9EWUcp+lACjj2/uJH0tvfq3PxPhAHxx/uD/EP1BN57N7Bn3Q/T4DJFjimnGBtfQLZ0eHteDDzLj7MTtr24l9vBOkUpSaCh+v+POIs3vnkHjDuT6dcLLjVeg25Jozn38xV93Dt7fei+amvZd8VTwtO3S0GXn8jVzhNquDb+IfjnTQCznnNIbcrXiAdON1r1KEO6i84c/nVj+LHMkHkxuPHU/gV0iYW9EbfwGzk/bG2ywiYDOM38wOIviKBIpWsNdzZWXP8+mCpoVLDyyYiN/IMaPl1eGcdMuMe5qlbU334bQv2KQ5ro1u883YccARpxpJL987VmVN5/GGK6T2d5nGaTu6Lcoq7buzBdtaqT+SdSInUn7p0MX8ch0kSJnfeah15HPSuu6A5gD8+atetVBFL7oR/gnw4F5nh/hn8XisWn7gRuVWAzsYt4fRXvPRDiOlLVHCQoSYaksniHh6YMM8IXBGmThAKCBH6IMXcPl6EBBNcTU+3hvsl12vSdLsEPoEwIxYShJLQqJzbJ/iEr4GA/BDtpyFUuNf/JYRAe/x7IB/QrhZlEPt/dg7bhg5W76maSrYmGxsn6wYVo+qkotd+LHZNbHQiAVwajzybede/3SyXcS4q4SRH8lv81UOdSIc29xPem7JhBWrgjHV5Mt2pNsi0dj7SqenWp7rXf8o4PsZI3cfzcVyPzQWaws17GY+0VBAZP+8fdgyZqg9U7QH8Xd/lXc4k+5LWNcjrWkW/TS2++et3vLdxqsH2+vUX1lG0ovxotjxXiZmIch7kCQRh1gwL3gWpVFaGmWFiWJQu6lOtwUostuW4PEU/vzl2a03rt6pz/L/QbCbG/JMFAzAsc6VgKWidpUE28uv04pu/vi9nShinsr67fneYopTlR3PkOUrMSFQQFZ5gQMq6w5YGAz9shjasBa1lpzPNM21t7W0y1gxLZtBLWbBeL2NJZ0Lpv9inBn750jatpesyTbanCQLChBripeyhIJB/noccpw1I0gKzVEuls0Gglk3NLAjd+RlWxMxvvA+gpwTn44fabnHmNCduB84PxvP/6+f++m54I/JnM00tBaklddSqTtlMMMe2pMNYMH74u9mfWV2KiJBSJg2h0P2qLe3Vlgf6ELgPv/i7gBH5+K5d6qe70PKYWX1mZZlf1fkeQr51vgYdrRqqPHSuaahq9KUV7ehEl/RSvOTDYEwzVMKSy8fvXKrrbd7S1KRq7n1iRTs60aV40txLlYKqFyy43gTLV7Y5v0AAwp09kREl+Jbmr78ZHb2/w6en778pnjtTxTQNGFYlRlyhr45IuX9VXOTUKp/wN2o2fXLlytVAETvw86oIOq/Uo8jlwI4fQOmvKngEAKiB/q/YaVVV2xUgFmqXmyN4QJP2hSr3pzpV9YicAgD9sIi0VMFNqykgdhPWP67jtvrHRAb3f9MxfuNZJaKnb1K7VsCkgeOlNKmTwiqdAFGYUwOBNBdiXtogbqLe8yyeTI0bkACatDkDSsyGfiBtNgDQkYbgdZgQyEFiM9M5hpgSGM1snWaR8laJ/WIwtkA1LgHT+J4yocYrkPiT6XL/MaUmsJltUVBjHC3BkW9e3WATZsdkNsxscv/c72aSzVKf3v9ErU0t0g2f51jq9qFtHg+yiM+/usR1af4/efAtnbqIw3UPQQCm4WZZF7IJxv7rkLHBmJm49TJAeVlpuGg7UUz1M3A50aazA+nXo48OCm0vUljDw0A/tUIQBFM+qDZJhgci16iXY2wgk6rgRGnlBgPZJpdmU+rMnibrClyaA1uvXmviniYrK2mNxiqQehNqAo2CkjoVDZq0aNOhS48+A4aMGDNhyow5C5axnBWsZBWrWcNaiHy3Iem///jilIrV+bgJOjEnfpHFxFi3+uO0LyoWlfGXlqEhaQlJxeqI3ASNjIjiz++lgS7qaKKdKK200Eg3PbQRo58aAAAA') format('woff2'); 24 | unicode-range: U+1F4C5, U+1F501, U+1F517, U+1F53A, U+1F53C, U+1F53D, U+1F6EB, U+23EB, U+23EC, U+23F3, U+2705, U+2795; 25 | /* 📅, 🔁, 🔗, 🔺, 🔼, 🔽, 🛫, ⏫, ⏬, ⏳, ✅, ➕ */ 26 | /*! Generator: obsidian-tasks-custom-icons v1.0.3 https://github.com/replete/obsidian-tasks-custom-icons */ 27 | } 28 | 29 | span.tasks-list-text, 30 | .cm-line:has(.task-list-label) [class^=cm-list-] { 31 | font-family: 'TasksMonoEmojis', var(--font-text); 32 | } 33 | 34 | span.tasks-list-text, 35 | .cm-line:has(.task-list-label) [class^=cm-list-] { 36 | font-family: 'TasksMonoEmojis', var(--font-text); 37 | } 38 | 39 | /* Priority as colour */ 40 | .task-list-item[data-task-priority=highest] input[type=checkbox] { 41 | box-shadow: 0px 0px 1px 1px var(--color-red); 42 | border-color: var(--color-red); 43 | } 44 | .task-list-item[data-task-priority=high] input[type=checkbox] { 45 | box-shadow: 0px 0px 1px 1px var(--color-orange); 46 | border-color: var(--color-orange); 47 | } 48 | .task-list-item[data-task-priority=medium] input[type=checkbox] { 49 | box-shadow: 0px 0px 1px 1px var(--color-yellow); 50 | border-color: var(--color-yellow); 51 | } 52 | .task-list-item[data-task-priority=low] input[type=checkbox] { 53 | box-shadow: 0px 0px 1px 1px var(--color-cyan); 54 | border-color: var(--color-cyan); 55 | } 56 | .task-list-item[data-task-priority=lowest] input[type=checkbox] { 57 | box-shadow: 0px 0px 1px 1px var(--color-cyan); 58 | border-color: var(--color-cyan); 59 | opacity:0.6 60 | } 61 | .task-list-item[data-task-priority=lowest] .task-description { 62 | opacity:0.6 63 | } 64 | .task-priority { 65 | display: none; 66 | } 67 | input[type=checkbox]:checked { 68 | box-shadow: none !important; 69 | border-color: var(--checkbox-border-color) !important; 70 | } 71 | 72 | .task-description { 73 | margin-right:3px; 74 | } 75 | 76 | /* Show dates hover */ 77 | :is(.task-recurring, .task-start, .task-scheduled, .task-done, .task-created, .task-due) { 78 | font-size: 1px; 79 | letter-spacing: -1px; 80 | color: transparent; 81 | background-color: transparent; 82 | } 83 | :is(.task-recurring, .task-start, .task-scheduled,.task-done, .task-created, .task-due)::after { 84 | letter-spacing: 0px; 85 | font-size: var(--font-adaptive-normal, 1rem); 86 | line-height: var(--line-height); 87 | color: var(--tx1, var(--text-normal)); 88 | margin-left: 3px; 89 | } 90 | .task-recurring::after { 91 | content: "🔁"; 92 | } 93 | .task-start::after { 94 | content: "🛫"; 95 | } 96 | .task-scheduled::after { 97 | content: "⏳"; 98 | } 99 | .task-done::after { 100 | content: "✅"; 101 | } 102 | .task-created::after { 103 | content: "➕"; 104 | } 105 | .task-due::after { 106 | content: "📅"; 107 | } 108 | 109 | .plugin-tasks-query-result [class^=task-]::after { 110 | cursor: default !important; 111 | opacity:0.6 112 | } 113 | 114 | :is(.task-recurring, .task-start, .task-scheduled, .task-done, .task-created, .task-due):hover::after { 115 | opacity:1; 116 | } 117 | 118 | :is(.task-recurring, .task-start, .task-scheduled, .task-done, .task-created, .task-due):hover span { 119 | position:absolute; 120 | display:inline-block; 121 | flex-grow:1; 122 | letter-spacing: 0px; 123 | font-size: var(--font-adaptive-small, 0.8rem); 124 | line-height: var(--line-height, 20px); 125 | color: var(--tx1, var(--text-normal)); 126 | background:var(--bg2, var(--background-primary)); 127 | border-radius:4px; 128 | outline:1px solid var(--tx3, var(--text-faint)); 129 | margin-left:10px; 130 | padding-left:2px; 131 | padding-right:4px; 132 | min-width:7rem; 133 | width: fit-content; 134 | pointer-events:none; 135 | z-index:1000; 136 | box-shadow:2px 2px 3px var(--bg2, var(--background-primary)), 0 0 7px var(--bg2, var(--background-primary)); 137 | line-height:1.2em; 138 | margin-top:1.5rem; 139 | margin-left:2px; 140 | } 141 | 142 | /* File backlink */ 143 | .plugin-tasks-query-result .tasks-backlink { 144 | font-size: 1px; 145 | letter-spacing: -1px; 146 | color: transparent; 147 | background-color: transparent; 148 | width:1.5rem; 149 | height: 1.5rem; 150 | align-self:baseline; 151 | } 152 | 153 | .plugin-tasks-query-result .tasks-backlink::before { 154 | content:'... '; 155 | font-size: var(--font-adaptive-normal, 1rem); 156 | line-height: var(--line-height, 1rem); 157 | color: var(--tx1, var(--text-faint)); 158 | transform: translateX(6px); 159 | display:inline-flex; 160 | opacity:0.6; 161 | } 162 | 163 | .plugin-tasks-query-result .tasks-backlink:hover { 164 | font-size: var(--font-adaptive-normal, 0.8rem); 165 | line-height: var(--line-height, 1rem); 166 | letter-spacing:0; 167 | width:inherit; 168 | } 169 | 170 | .plugin-tasks-query-result .tasks-backlink:hover::before { 171 | content:'' 172 | } 173 | 174 | /* Edit button */ 175 | .tasks-edit { 176 | background-color: var(--tx1, var(--text-normal)); 177 | /* https://caniuse.com/?search=mask-image */ 178 | -webkit-mask-image: url('data:image/svg+xml,'); 179 | -webkit-mask-size: 85%; 180 | -webkit-mask-position: 0 -3px; 181 | -webkit-mask-repeat: no-repeat; 182 | transform: translate(0,-1px); 183 | opacity:0.6; 184 | margin-left:5px; 185 | } 186 | 187 | .tasks-edit:hover { 188 | opacity: 1; 189 | } 190 | 191 | .plugin-tasks-query-result .tasks-backlink { 192 | float:right; 193 | } -------------------------------------------------------------------------------- /Tasks - Expand dates on hover.css: -------------------------------------------------------------------------------- 1 | /* 2 | Tasks: Expand dates on hover (WIP) 3 | Color priority markers and dates that expand on hover. 4 | 5 | Original credit to @sunb_mn on Obsidian's discord server for 6 | the basis of this styles which I've tweaked and extended a little, 7 | he also quotes @SlRvb and @esm7 for help with code: 8 | https://discord.com/channels/686053708261228577/744933215063638183/1108617092137226320 9 | 10 | https://github.com/replete/obsidian-minimal-theme-css-snippets 11 | */ 12 | 13 | /* Priority as Checkbox Color and Remove the Emoji */ 14 | .task-list-item[data-task-priority=high] input[type=checkbox] { 15 | box-shadow: 0px 0px 1px 1px var(--color-red); 16 | border-color: var(--color-red); 17 | } 18 | .task-list-item[data-task-priority=medium] input[type=checkbox] { 19 | box-shadow: 0px 0px 1px 1px var(--color-orange); 20 | border-color: var(--color-orange); 21 | } 22 | .task-list-item[data-task-priority=low] input[type=checkbox] { 23 | box-shadow: 0px 0px 1px 1px var(--color-cyan); 24 | border-color: var(--color-cyan); 25 | } 26 | 27 | .task-priority { 28 | display: none; 29 | } 30 | 31 | input[type=checkbox]:checked { 32 | box-shadow: none !important; 33 | border-color: var(--checkbox-border-color) !important; 34 | } 35 | 36 | .tasks-list-text { 37 | display: inline-flex; 38 | max-width: 100%; 39 | } 40 | 41 | .task-description { 42 | flex: 2; 43 | min-width: 0; 44 | width: 350px; 45 | white-space: nowrap; 46 | display: block; 47 | overflow: hidden; 48 | text-overflow: ellipsis; 49 | } 50 | 51 | /* Show dates on emoji hover */ 52 | :is(.task-recurring, .task-start, .task-scheduled, .task-done, .task-created) { 53 | font-size: 1px; 54 | letter-spacing: -1px; 55 | color: transparent; 56 | background-color: transparent; 57 | } 58 | :is(.task-recurring, .task-start, .task-scheduled,.task-done, .task-created)::after { 59 | letter-spacing: 0px; 60 | font-size: var(--font-adaptive-normal); 61 | line-height: var(--line-height); 62 | color: var(--tx1); 63 | margin-left: 5px; 64 | } 65 | .task-recurring::after { 66 | content: "🔁"; 67 | } 68 | .task-start::after { 69 | content: "🛫"; 70 | } 71 | .task-scheduled::after { 72 | content: "⏳"; 73 | } 74 | .task-done::after { 75 | content: "✅"; 76 | } 77 | .task-created::after { 78 | content: "➕"; 79 | } 80 | :is(.task-recurring, .task-start, .task-scheduled, .task-done, .task-created):hover::after { 81 | content: ""; 82 | } 83 | 84 | :is(.task-recurring, .task-start, .task-scheduled, .task-done, .task-created):hover { 85 | letter-spacing: 0px; 86 | font-size: var(--font-adaptive-normal); 87 | line-height: var(--line-height); 88 | color: var(--tx1); 89 | margin-left: 5px; 90 | background:var(--bg2); 91 | border-radius:4px; 92 | outline:1px solid var(--tx3); 93 | margin-left:10px; 94 | padding-left:4px; 95 | /* transform: translateX(-4px); */ 96 | } 97 | 98 | /* Due date on right */ 99 | .task-due { 100 | width: fit-content; 101 | margin-left: 5px; 102 | order: 5; 103 | font-weight: var(--bold-weight); 104 | } 105 | 106 | .plugin-tasks-query-result li { 107 | display:inline-flex; 108 | width:100%; 109 | } 110 | 111 | .plugin-tasks-query-result .task-list-item-checkbox { 112 | transform: translateY(6px); 113 | } 114 | 115 | .plugin-tasks-query-result .tasks-list-text { 116 | flex-grow:1; 117 | } 118 | 119 | .plugin-tasks-query-result .task-extras{ 120 | display:flex; 121 | justify-self: flex-end; 122 | height:1em; 123 | } 124 | 125 | /* File backlink */ 126 | .plugin-tasks-query-result .tasks-backlink { 127 | font-size: 1px; 128 | letter-spacing: -1px; 129 | color: transparent; 130 | background-color: transparent; 131 | width:1.5rem; 132 | height: 1.5rem; 133 | align-self:baseline; 134 | } 135 | 136 | .plugin-tasks-query-result .tasks-backlink::before { 137 | content:'📄'; 138 | font-size: var(--font-adaptive-normal); 139 | line-height: var(--line-height); 140 | color: var(--tx1); 141 | transform: translateX(6px); 142 | display:inline-block; 143 | opacity:0.5; 144 | } 145 | 146 | .plugin-tasks-query-result .tasks-backlink:hover { 147 | font-size: var(--font-adaptive-normal); 148 | line-height: var(--line-height); 149 | letter-spacing:0; 150 | width:inherit; 151 | opacity:1; 152 | transform: translateX(8px); 153 | } 154 | 155 | /* Show all text on edit hover */ 156 | .tasks-edit { 157 | transform:translate(0,3px) 158 | } 159 | 160 | .plugin-tasks-query-result li:has(.tasks-edit:hover) :is(.task-recurring, .task-start, .task-scheduled, .task-done, .task-created) { 161 | letter-spacing: 0px; 162 | font-size: var(--font-adaptive-normal); 163 | line-height: var(--line-height); 164 | color: var(--tx1); 165 | margin-left: 5px; 166 | } 167 | 168 | .plugin-tasks-query-result li:has(.tasks-edit:hover) :is(.task-recurring, .task-start, .task-scheduled, .task-done, .task-created)::after { 169 | content:''; 170 | } -------------------------------------------------------------------------------- /Tasks - Mono Icons (lucide2).css: -------------------------------------------------------------------------------- 1 | /*! 2 | Included icons were modified from https://lucide.dev 3 | License reproduced from https://lucide.dev/license 4 | 5 | ISC License 6 | Copyright (c) for portions of Lucide are held by Cole Bemis 2013-2022 as part of Feather (MIT). All other copyright (c) for Lucide are held by Lucide Contributors 2022. 7 | Permission to use, copy, modify, and/or distribute this software for any purpose with or without fee is hereby granted, provided that the above copyright notice and this permission notice appear in all copies. 8 | THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE. 9 | */ 10 | @font-face { 11 | font-family: 'TasksMonoEmojis'; 12 | src: url('data:@file/octet-stream;base64,d09GMgABAAAAAA44AAsAAAAAHpAAAA3oAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHINuBmAAh04KpSifTQtSAAE2AiQDgSAEIAWEageCMBucGqOinJLCJPvrBCpyFqTdASEptM06uwu9Ql5BBQ+aeb7pbX3NqaRjffCXK4V2jpBk1v//tf/tM/7MRvS+uWPYV024ti8qq9NYhM4iayQRIiERIv0TEGtt3wzXkNwiQ+cbmq5BiniJhIJH2g+J6FKP53nu3bt/tBcm2PEokbBNgZdbRFncEG7r/Er8KOSdOpBPyhogP/iNMBKsxJFGbfJRGMk+ItGviPkVNairJf+eglf+mMVsUumlL+pdGtgS2Np7EZnAT3CJ9D++P8AyAMxXrdy/5j5tXq87kysAH6aAnl2dw5fdg91s/jXHvz9HnAMu0L8CsKyrZoWAFkiYjq+qMB1fWSkrjO5TnKEctt6ZKVT/37v9YdEqsxqvd9EMsT7hVfyUIEBelwnC/P7RK5SD4+46bBIAAAjCyhScFqagubotJUPRLinykufr8MGlQxeuvUb4BjxhRt1aItMZTBaBwibLYVwhg0HniJRpGM8saGOMAVTQjZ9g2kLBYsw8mYUzmOWOuKs8h8vm8WG0XCwt1CUHEpmAdN+gMjCc7rL0tkbZOLqQdyAKjbRrLHwWDiOKPDrX9ZHY0k0t9YEslWSnGNpWSK1wYjkii+bmaZJyD+VBQVWNlKsQxQ4xBFpOXovV/tlbXMNdqFKgiyRlQDFkVxDKFi7Z5vLgdNu4hBT9RqZKgDRVHwbUsPj04omVaLtAIMdCT+fZxu1Z/LYcSl0C39KVxF+FqHlHlgEi4CZAAnqGxT9DkttQlH8Ucb+Aq0pUNGXJpj0H3U/8lX/yn6SUJtKD/85/YMqMFdtA/16mkbqJSxqZHkN9jzgA58qWbHGsR10s4HFcPpd3HUoVFJWUVQT0j65rACVDWc3+T+hkrSjREbd7ju3DaLBCpIhvUSO6VZACpnzgZAZcMgttMgeMzEOLLEBEFiEhS6CTFYjJKgRkDTyyDg7ZAJtsgk+2wSA7YJJdsMgehORASWvxJxWFWvxFRbEWf1VRqsU/VZRr8R8VlVpJSUW1VppQUauVLqio10p3NGigr20tEPo51YKAfi+1IKLfKy1I6C+iBWT0V68FFPQ3qgVU9DeuBTT0N6EFcuj/RQt5ldp3fWjaQObCs9xhUGrLqEgB8EWiLI9ALJ0tgIQkIKBJJBCnn56E1eR3NEf8yM6nm1bp1a6nRXl8zBNno6LhWD1Wm1J5Om+USLuast/Gttt2uVyjpExi+dBR6tXscViIZg9szvkjRbiqpFvSI5xFadwdwbI7mVh9O53TWCgwApBU9+N2iM6aEV6njXnx6a6YALP6waP3L7Nz5vUr/taoL6LUPxgxB2EyGVqaCydpbI5ldbOtJQXJ/vj2Z8idfaLr01ufHP2A6KVn+LTEElH7w8lp3e8HPWMsAZNVCTnhq+KiWD6K8/nMnNU3BNNJ9zR+9tRz9uAiSOI0CkBxgdFT4hwohLaRKQXTiZTdGsg8Fq418H0KMQDqkCR6NtA4TN2c4kV7WpAq70ksaHp3XH3Q9th/7PaavaEApAuLBEQhvZviX6Ne5Lmt2Ak23F4u5dwTgilF4obro7Ccou3kmo6ZNABGoMGgH89YyxIkjlCp1OGCWSxxEj6oe6aj4Bj6Mhqz5naogh2XmrMmdAJTrz+GVq6+vPjx8ucLfX2W818VjSv5HXuexskeHAKNacFl5rf+4M20obpqVvn7HRh/8WnLOyz5Dd/X7T/8iv8x1H1nicW8nUcsKePSWbOyPCdepQzhrooFb6c/nT3A3gG6ZYrYjFFRlb2uu3dXLjbL2TfXn8t/eNVOyS1Ncg+RUmZjiV63XSGAnPfSKEgjvCDqZkoc5a9LRpeirWexz4+inM6ai2SPgxdJgu2qCAa8fr3cn2739LVm7nlN9L6MdmXPe7uCGY3NWY5o3coJH/VH2hLZjS8vH2m2X5LA2FAHSY9GNElS/ICRJqN3ke7Mklp4UXswj3IYFNWEOBQibxtcA0lC42Xoej2JlEgchpbe1XaMZv6RjEBje/rGRs3C+wyzQm8TH9m3M8PvWEmRQSg0C62jP+JOsFit3VG8iuw4dWf2zvLKo3EV5VyNq6ro7Gh3XVITPMamg1/V1s9jby1GIjSP6uH9wri8ffcXlvxOt9+vZ/ePEJ+JjFnG+iyXEOhMKNcjoaTsLs7rCju+bmNnSYldC6EBMJDVv8eKnxQVyaaHNAVS97IZDx9Ol7lCAtDhhkeOGAoSePrDR9OlLoQjuJ0QvTk1lRKUjvzddU8Jdu4UUCNLfyPgFk0JGeh46v9CkoTkyOI/I8uEFSHLlc96K/j5ugXdOlbl8xW9T/ffv0C7PLtPt/m6An95tGSluOn3u5/DHQl+wEtlU5DcA+Z77kdPvj6OPcRZ2W/SQ4m+3E/dfYSo25E+8/S3VLmL6Y70ksX7GKm4X94JaM72UacWSUFqX0ZX8/+zRXQh+8nETQNG9/8QAys94/vpibje928evNu8uif5CUSiBHQ5yXe8ZDxf1R+k8JbE9os3xYLf+7Z5ds/i0E6fs9b/uBMpdqUuVpLLPprkl97XBP26Y6BnZtEaiEBJSNMyq0piTFqeHRKcLX8hbyOzgyeEsJ0yISqUprUIS9sy+5Lo+0ZDFNRKtUImtJJ6ARGQk3JCJAgCHXNbc5791cpW5xMGc3H9KGfk0mmVYkpQsnlziYASdSRFpYJNm4UlIqpyWsTSUc7ieoM5n9ihlf1tzdkKVs0k0njJcF0dN5mXZppudEc5qxoTUnLixEpM+ViRzps13WRacHIUMzBrux1KPSNVvK9clKdc0OHEvx6KFih5KHcPN3xbkc2ocHmkR+KRnnNX4F4ayNk6sCdd/ak4JT+51t/Ja+oSdDGPyBqapEkzdG7mro+0I9q16d0OvPLpQJw+eN/fRKlx2WKtvnNRl5uKrXWBREBOn8ehN/AUjSlPlh5Uxirtlg9ZvNc3BGYHG7uVhj1hz0xnd6sKJWUlR1oqRo4VVLIPCWG653d1RckW/xqeEygmv+27lHUtvrNuuHqoSPm1yY0vb0Nv1TPD86+uPKdjWjV+03up+2gLLbSfjFFW4dAjbkQ/jRETY2db2Rb2A38l4mMGF3rZSCnaPtN6NqrdOL7oTcwCxU+1EaeQ8ztLD0AKXtK1sKtpqG04nvrF5caXe2rOaPYcz7cr96YwjNZvem91b22hmYZpuMxRgSHrpJij4n0UFO4NRL5zWVa3WCwR44gbwfOMGKI3GnEEc4/p8dleN/D5he2IfHQsi83KEHkaNzgVk6Y6gPpZCbIpJmhE6xGoNNbsAAa8SQYBda2XRZOWUW+JhZA+ZI8O5gSrWC6GnBbyoeyz/4wtP98C/SUg7zhVuRXcKrxDgQE5+BFk/yuDgpgpcohATZAcMqFEKKfnGDeG4K9fvX6NSdchGIfjnu09x83xcls5l64+zbJ0AWAKZhogN+52FEwTszIIwDtUkuKbawfOAp4FNqriHI7IqHlnupbsd5IjTmWELbyC4gu6aKzC0XJvxTBI08kp42Cjv6WgjVNCiko3byoVUGJyym0GSQqXn/c44WZxk678gje5Nx8jCqzCybZ0Spu7yUUOZq12u1zz9vTfsw6TYnxJsgHBWxkcwdbt7b933ionbOphhnFuN2KY3PP2DlBKYQjIcP0Sxafk+BBKwofTCpmgh4209aFp653puHvxXxWOklSUTIZPYRHviNUwb0tWD96wu8S1mwsHm1rSsBZOxgk32j7lgkgyqnOBC0nb71CanBsniB45MkYQd6zDCTc88uM4S8wIYv5q8CTavmihezYLIqBMiESpMd9zD9Azt4JCDlyLl/wuL+p6gKd41RdwP9FpaXcZJsK0M/O8ODtlgOzK8zEOKcUJ/6z39Nkao0cmaPzhn507Ho5gQMqi5ZlJur8G+YshP7Ju3GNUDZ3Ix8tcdGDQc6BYXs8R7fIxoQTIKr8zXtsV71I3vJ3s6jEx42urRVf/X7Sw+tZau5xOkcQHAQBqapwX67Awb6KLXZIz+toloFGDL1+fYQyGvLz5tHJzG9DF9bluOyufnbHm6ky4CENLXD2Z3+BBB4m7SRiZke2VeJLkBIAy2DAWt+cgl0MsNiYvWpShQVTxHKsmhzGzEVx/Tq+aMORBlpLACLdFvcvEGoArA5AXq9sQY7UrbviG6OTjCTddx5kV+U/r2vygmM1w408GGgGICUykchRRwjWEUDMj0zBqJS79eUVeu9Nm/EFUUg3tTxJmrgDIix9wNQVVf0RwBRUAOYmqysZPVKGDRGI/WUGfUCwy6Zd3w5MjFzQcEVG8HeL7SPwEZV+FCOSXkID89ZPp/vsp/EjeL+9NhO8UJJHzt4Hv4fHG+sbttY3lpZ3vHphSNKVR6IsQ1tTT0cWs8uLS0pvkQs9W2fwrCuj7qKliL+wbp0L1uK55hypCxsIrU3as9O0f27D+47htzYZlS3a8MGfBnlVTtnHTA+S+MWebfZY2DtOtQxce7sr1NEGn7JozmzvtCIPcfQt6jPq75sV8vOyGNcydPChSrIqzgdlki2UUM2h3WEyxbZtGdOo0P7A7zOQSI6CD0fQqZhFBqVJraGpp6+jq6RsYGqmpa2hq0RlMFpvD5fEFmLYQF4klUplrkb/dMa7wrv0pFI3POU2BFJH72mKqVzMkdZVLVeeZin7IEe2PA1lxZGiqJfSe9TkJFIqlzHGtkOqmkue2c9+HyVRSrDhD0n3Nlvvf7brpUnVOhqTOG5MIFiVKrRdXqECufEXs8hiVy2ZiY0YFAA==') format('woff2'); 13 | unicode-range: U+1F194, U+1F3C1, U+1F4C5, U+1F4CD, U+1F501, U+1F517, U+1F53A, U+1F53C, U+1F53D, U+1F6EB, U+23E9, U+23EB, U+23EC, U+23F0, U+23F3, U+26D4, U+2705, U+274C, U+2795, U+F1589; 14 | /* 🆔, 🏁, 📅, 📍, 🔁, 🔗, 🔺, 🔼, 🔽, 🛫, ⏩, ⏫, ⏬, ⏰, ⏳, ⛔, ✅, ❌, ➕, 󱖉 */ 15 | /*! Generator: obsidian-tasks-custom-icons v1.0.4 https://github.com/obsidian-tasks-group/obsidian-tasks-custom-icons */ 16 | } 17 | 18 | span.tasks-list-text, 19 | .cm-line:has(.task-list-label) [class^=cm-list-] { 20 | font-family: 'TasksMonoEmojis', var(--font-text); 21 | } -------------------------------------------------------------------------------- /[editor] Custom Tag styles.css: -------------------------------------------------------------------------------- 1 | /* 2 | Custom tag styles 3 | https://github.com/replete/obsidian-minimal-theme-css-snippets 4 | */ 5 | 6 | :root { 7 | --replete-tag-border: none; 8 | --replete-tag-radius: 3px; 9 | } 10 | 11 | /* --- Clean style tags --- */ 12 | /* .cm-hashtag { 13 | border-radius:0 !important; 14 | border:var(--replete-tag-border); 15 | } 16 | .cm-hashtag-begin { 17 | padding-left:var(--replete-tag-padding-horizontal) !important; 18 | border:var(--replete-tag-border) !important; 19 | } 20 | 21 | .cm-hashtag-end { 22 | padding-right:var(--replete-tag-padding-horizontal) !important; 23 | border:var(--replete-tag-border) !important; 24 | } */ 25 | 26 | /* --- Box styling if tag is in a list --- */ 27 | .HyperMD-list-line .cm-hashtag { 28 | border:var(--replete-tag-border) !important; 29 | background-color: hsla(var(--base-h), var(--base-s), calc(var(--base-l) - 20%), 0.3); 30 | color:var(--tx4); 31 | display: inline-block; 32 | line-height:1em; 33 | transform: translate(0,-2px); 34 | } 35 | .theme-dark .HyperMD-list-line .cm-hashtag { 36 | background-color: hsla(var(--base-h), var(--base-s), calc(var(--base-l) + 40%), 0.4); 37 | } 38 | 39 | /* Hide pound sign without breaking dropdown UI hook */ 40 | .HyperMD-list-line .cm-hashtag-begin { 41 | width:0; 42 | visibility:hidden; 43 | display:none; 44 | font-size:10px; 45 | } 46 | 47 | /* main hashtag styling */ 48 | .HyperMD-list-line .cm-hashtag-end { 49 | border:var(--replete-tag-border) !important; 50 | border-radius: var(--replete-tag-radius) !important; 51 | padding: 3px 3px 3px 4px !important; 52 | text-transform: uppercase !important; 53 | font-weight:600; 54 | font-size:10px; 55 | letter-spacing: 0.04em; 56 | } 57 | 58 | /* alternate styles when line is active for editing */ 59 | .HyperMD-list-line.cm-active .cm-hashtag-end { 60 | text-transform:none !important; 61 | font-weight:500 !important; 62 | font-size:11px; 63 | letter-spacing:normal; 64 | border-top-left-radius:0 !important; 65 | border-bottom-left-radius:0 !important; 66 | } 67 | 68 | .HyperMD-list-line.cm-active .cm-hashtag-begin { 69 | width:0.6em; 70 | font-size:11px; 71 | font-weight:500 !important; 72 | visibility: visible; 73 | display:inline-block; 74 | border-top-left-radius: var(--replete-tag-radius); 75 | border-bottom-left-radius: var(--replete-tag-radius); 76 | padding: 3px !important; 77 | opacity:0.8; 78 | } 79 | 80 | /* Boxed style for Tasks dataviews */ 81 | .plugin-tasks-list-item .tag { 82 | border:var(--replete-tag-border) !important; 83 | background-color: hsla(var(--base-h), var(--base-s), calc(var(--base-l) - 20%), 0.3); 84 | border-radius: var(--replete-tag-radius) !important; 85 | padding: 3px 2px 3px 2px !important; 86 | text-transform: uppercase !important; 87 | font-weight:600; 88 | font-size:10px; 89 | letter-spacing: 0.04em; 90 | transform: translate(0,-2px); 91 | display:inline-block; 92 | } 93 | .theme-dark .plugin-tasks-list-item .tag { 94 | background-color: hsla(var(--base-h), var(--base-s), calc(var(--base-l) + 40%), 0.4); 95 | } 96 | 97 | /* GTD tags */ 98 | .cm-tag-next { 99 | color:var(--color-accent-1) !important; 100 | } 101 | 102 | .cm-tag-someday { 103 | color:var(--color-orange) !important; 104 | } 105 | 106 | .cm-tag-waiting { 107 | color:var(--color-pink) !important; 108 | } 109 | 110 | .cm-tag-blocked { 111 | color:var(--color-red) !important; 112 | } 113 | 114 | .cm-tag-done { 115 | color:var(--color-green) !important; 116 | } -------------------------------------------------------------------------------- /[editor] Editor fixes.css: -------------------------------------------------------------------------------- 1 | /* 2 | Editor fixes 3 | https://github.com/replete/obsidian-minimal-theme-css-snippets 4 | */ 5 | 6 | /* Make collapse icon less colorful */ 7 | .cm-s-obsidian .collapse-indicator.collapse-icon svg{ 8 | stroke: var(--tx2) 9 | } 10 | 11 | /* Fix edit block alignment in gutter */ 12 | .cm-s-obsidian .edit-block-button { 13 | left: calc(max(calc(50% + var(--folding-offset) - var(--line-width-adaptive)/ 2),calc(50% + var(--folding-offset) - var(--max-width)/ 2)) - 30px )!important; 14 | } 15 | .markdown-source-view.mod-cm6.is-live-preview.is-readable-line-width .cm-embed-block>.edit-block-button { 16 | opacity:1 !important; 17 | } 18 | 19 | /* Make indentation guides less visible */ 20 | .cm-indent { 21 | opacity:0.4 22 | } 23 | 24 | .theme-dark .cm-indent { 25 | opacity: 0.5 26 | } 27 | 28 | /* theme audio controls */ 29 | audio { 30 | opacity:1; 31 | transition: .2s opacity ease-in-out; 32 | 33 | &:not(:hover,:focus-within) { 34 | opacity:0.6; 35 | } 36 | } 37 | -------------------------------------------------------------------------------- /[editor] Frontmatter tweaks.css: -------------------------------------------------------------------------------- 1 | /* 2 | Frontmatter tweaks 3 | Styling frontmatter in preview views is tricky, and the opinion I have is that I want frontmatter to be less prominent than the body of the note 4 | https://github.com/replete/obsidian-minimal-theme-css-snippets 5 | */ 6 | 7 | :not(.is-live-preview) { 8 | /* Editor: Override Syntax Highlighter Frontmatter styles */ 9 | 10 | .cm-s-obsidian .cm-line .cm-hmd-frontmatter.cm-atom { 11 | color: var(--text-normal); 12 | } 13 | .cm-s-obsidian .cm-line .cm-hmd-frontmatter ~ .cm-hmd-frontmatter{ 14 | color: var(--blockquote-color); 15 | } 16 | } 17 | 18 | .is-live-preview { 19 | .cm-s-obsidian .cm-def:nth-of-type(1){ 20 | /* both --- */ 21 | /* font-size:50%; */ 22 | } 23 | .cm-s-obsidian .cm-line:nth-of-type(1) .cm-def { 24 | /* first --- */ 25 | /* background:blue; */ 26 | color: var(--blockquote-color); 27 | } 28 | .cm-s-obsidian .cm-line:nth-of-type(1) ~.cm-line .cm-def { 29 | /* last --- */ 30 | color: var(--blockquote-color); 31 | } 32 | 33 | .cm-s-obsidian .cm-hmd-frontmatter { 34 | font-size:75%; 35 | } 36 | .cm-s-obsidian span.cm-meta { 37 | /* opacity:0.5 */ 38 | } 39 | } -------------------------------------------------------------------------------- /[editor] Mono Emojis everywhere.css: -------------------------------------------------------------------------------- 1 | /* 2 | Monotone Emojis (override all) 3 | Apply monotone emoji font to all editor instances 4 | https://github.com/replete/obsidian-minimal-theme-css-snippets 5 | */ 6 | .cm-s-obsidian, .markdown-source-view, .markdown-source-view.mod-cm6 .cm-scroller { 7 | font-family: var(--font-emojis), var(--font-text); 8 | } -------------------------------------------------------------------------------- /[editor] Table tweaks.css: -------------------------------------------------------------------------------- 1 | /* 2 | Tables tweaks 3 | WIP 4 | https://github.com/replete/obsidian-minimal-theme-css-snippets 5 | */ 6 | :root { 7 | --table-border-color: var(--text-faint); 8 | } 9 | 10 | /* Border color */ 11 | .cm-s-obsidian .cm-table-widget th, 12 | .cm-s-obsidian .cm-table-widget td{ 13 | border-color: var(--table-border-color); 14 | } 15 | 16 | /* Bold header row */ 17 | .cm-s-obsidian .cm-table-widget th { 18 | font-weight:bold; 19 | } -------------------------------------------------------------------------------- /[editor] Typography fixes.css: -------------------------------------------------------------------------------- 1 | /* 2 | Typography 3 | WIP. Loosely following github markdown styles, but will change over time 4 | https://github.com/replete/obsidian-minimal-theme-css-snippets 5 | */ 6 | 7 | /* Markdown source view (not live preview) */ 8 | .markdown-source-view:not(.is-live-preview) { 9 | 10 | /* Set source view to monospace font */ 11 | font-family: JetBrains Mono,Menlo, Monaco, 'Courier New', monospace; 12 | 13 | /* Reset header font sizes */ 14 | .cm-header { 15 | font-size:1rem; 16 | font-variant:normal; 17 | } 18 | 19 | /* Fix footnote indent */ 20 | .HyperMD-footnote { 21 | font-size:inherit; 22 | padding-left:0; 23 | text-indent:0; 24 | } 25 | 26 | .cm-inline-code { 27 | font-size:inherit; 28 | } 29 | 30 | /* Fix heading font-size */ 31 | .cm-line[class*=HyperMD-header-] { 32 | font-size:inherit; 33 | line-height:inherit; 34 | } 35 | } 36 | 37 | .markdown-source-view.is-live-preview { 38 | 39 | /* unordered list item children alignment (to match checkbox size metrics) */ 40 | .cm-formatting-list-ul { 41 | 42 | .list-bullet { 43 | transform: translateX(-1px); 44 | margin-right: 7px; 45 | } 46 | } 47 | 48 | /* unordered list item alignment and style */ 49 | .cm-formatting-list-ol { 50 | padding:0; 51 | min-width:2rem !important; 52 | display:inline-flex; 53 | 54 | .list-number { 55 | text-align:center !important; 56 | display:inline-flex; 57 | font-size:0.85em; 58 | text-align:center !important; 59 | min-width:var(--checkbox-size) !important; 60 | margin:0 auto; /* centered */ 61 | } 62 | } 63 | 64 | /* list and blockquote colors */ 65 | .cm-s-obsidian .cm-formatting-quote { 66 | color: var(--tx2) 67 | } 68 | 69 | .cm-s-obsidian .cm-formatting-quote { 70 | transform:translate(-3px,0); 71 | display: inline-block; 72 | } 73 | 74 | /* Headings */ 75 | &.cm-s-obsidian { 76 | --h1-size:2em !important; 77 | --h2-size:1.5em !important; 78 | --h3-size:1.25em !important; 79 | --h3-weight:600 !important; 80 | --h4-size:1em !important; 81 | --h4-weight:600 !important; 82 | --h4-variant: normal !important; 83 | --h5-size:0.875em !important; 84 | --h5-weight:600 !important; 85 | --h5-variant: normal !important; 86 | --h6-size:0.75em !important; 87 | --h6-weight:600 !important; 88 | --h6-variant: normal !important; 89 | } 90 | 91 | /* Quotes */ 92 | .HyperMD-quote { 93 | display:block !important; 94 | } 95 | .HyperMD-quote::before { 96 | opacity:0; 97 | } 98 | .HyperMD-quote::after { 99 | content:''; 100 | display:block; 101 | background:var(--bg3); 102 | width:1px; 103 | height:100%; 104 | position: absolute; 105 | top:0; 106 | left:0; 107 | } 108 | 109 | .HyperMD-quote.cm-active { 110 | border-color:transparent; 111 | } 112 | .HyperMD-quote.cm-active::after{ 113 | display:none; 114 | } 115 | 116 | .HyperMD-quote cite { 117 | color:var(--tx3); 118 | display: inline-block; 119 | } 120 | 121 | /* fix is-flashing display */ 122 | .cm-editor .is-flashing { 123 | background:hsla(var(--base-h), var(--base-s), calc(var(--base-l) + 30%),0.5); 124 | } 125 | 126 | 127 | /* Footnote styles */ 128 | .HyperMD-footnote { 129 | color:var(--tx2); 130 | padding-left:0 !important; 131 | 132 | .cm-hmd-internal-link > *{ 133 | color:var(--tx2) !important; 134 | text-decoration-color:var(--tx2) !important; 135 | opacity:1 !important; 136 | } 137 | } 138 | } -------------------------------------------------------------------------------- /[editor] debug.css: -------------------------------------------------------------------------------- 1 | .cm-line { 2 | background:rgba(0,255,0,0.1); 3 | box-shadow: inset 0 -2px 3px rgba(255,255,255,.2); 4 | background-position:right !important; 5 | background-image: repeating-linear-gradient(270deg, #00FFFF2E 0em, #073AFF00 9px); 6 | /* FIX? */ 7 | } -------------------------------------------------------------------------------- /[ui] Collapsible Right Headers.css: -------------------------------------------------------------------------------- 1 | /* 2 | Collapsible Right Headers 3 | Save some space in the right headers 4 | https://github.com/replete/obsidian-minimal-theme-css-snippets 5 | */ 6 | 7 | /* header container on right */ 8 | .mod-right-split .workspace-tabs + .workspace-tabs .workspace-tab-header-container { 9 | background: 10 | repeating-linear-gradient( 11 | 135deg, 12 | var(--background-modifier-border) 0px, 13 | transparent 1px, 14 | transparent 10px, 15 | var(--background-modifier-border) 11px, 16 | transparent 11px 17 | ) !important; 18 | height:8px; 19 | transition:.2s all ease-in; 20 | border-bottom-color:transparent; 21 | } 22 | .mod-right-split .workspace-tabs + .workspace-tabs .workspace-tab-header-container::before { 23 | content:''; 24 | background:linear-gradient(to top, var(--background-primary), transparent); 25 | display:block; 26 | position:absolute; 27 | left:0; 28 | width:100%; 29 | height:100%; 30 | top: 0; 31 | } 32 | 33 | 34 | .mod-right-split .workspace-tabs + .workspace-tabs .workspace-tab-header-container:hover, 35 | .mod-right-split .workspace-tabs + .workspace-tabs .workspace-tab-header-container:focus-within, 36 | body.is-grabbing .mod-right-split .workspace-tabs + .workspace-tabs .workspace-tab-header-container { 37 | /* is-grabbing visibility is to make dragging panels around usable */ 38 | height:var(--header-height); 39 | background:var(--background-primary) !important; 40 | } 41 | -------------------------------------------------------------------------------- /[ui] Compact File Explorer Legacy.css: -------------------------------------------------------------------------------- 1 | /* 2 | Compact File Explorer Legacy 3 | I prefer a condensed view with the chevron on the right. 4 | 5 | NOTE: Fix padding bug on startup 6 | -------------------------------- 7 | 8 | Obsidian calculates paddings via JS and there is a bug sometimes 9 | with the wrong indents appearing on startup. 10 | 11 | The fix for this is to turn dummy.css snippet on and off. 12 | 13 | To automate this fix (KLUDGE incoming): 14 | - Install 'Snippet Commands' by death_au from Community Plugins 15 | - Install 'Templater' plugin 16 | - Create a new startup script in your vault containing this code: 17 | <%* app.commands.executeCommandById('snippet-commands-obsidian:snippet-command-dummy'); %> 18 | 19 | Now, the padding will be reset on startup. Even with this fix, sometimes 20 | large folders have incorrect padding offsets further down. 21 | 22 | https://github.com/replete/obsidian-minimal-theme-css-snippets 23 | */ 24 | 25 | /* Workspace: Sidebar navigation */ 26 | [data-type=file-explorer] { 27 | .nav-header { 28 | padding-left:14px; 29 | padding-bottom:3px; 30 | padding-top: 6px; 31 | 32 | .nav-buttons-container { 33 | opacity:0.7; 34 | transition: .2s opacity ease-in; 35 | 36 | &:hover { 37 | opacity:1; 38 | } 39 | } 40 | 41 | .clickable-icon { 42 | padding-left:4px; 43 | } 44 | } 45 | 46 | .nav-files-container { 47 | padding-left: 9px; 48 | padding-right: 9px; 49 | } 50 | 51 | .collapse-icon { 52 | position:relative !important; 53 | margin-left:0 !important; 54 | order:4; 55 | padding-left:3px; 56 | 57 | svg { 58 | stroke:var(--text-faint); 59 | margin-top:1px; 60 | } 61 | } 62 | 63 | /* Fix Folder Note Count display */ 64 | .nav-folder-title-content { 65 | flex-grow:0 !important; 66 | } 67 | 68 | /* Fix flashing color */ 69 | .is-flashing { 70 | background-color: var(--tx3) 71 | } 72 | 73 | /* We're fighting obsidians JS on calculated paddings here, fix left margin */ 74 | .tree-item-self[style] { 75 | padding-left:8px !important; 76 | } 77 | 78 | /* Disable sliding animation */ 79 | * { 80 | transition: none !important; 81 | } 82 | 83 | /* tree trunk */ 84 | .tree-item-children { 85 | border-inline-start:none; 86 | position:relative; 87 | 88 | &::before { 89 | content:''; 90 | position:absolute; 91 | top:0; 92 | left:-1px; 93 | bottom:12px; 94 | width:1px; 95 | background:var(--nav-indentation-guide-color); 96 | } 97 | } 98 | 99 | /* tree branches */ 100 | .nav-file, 101 | .nav-folder { 102 | position:relative; 103 | z-index:1; 104 | } 105 | .nav-folder-children .nav-file-title::before, 106 | .nav-folder-children .nav-folder-title::before { 107 | content:''; 108 | display:block; 109 | width:8px; 110 | height:1px; 111 | background-color: var(--nav-indentation-guide-color); 112 | position:absolute; 113 | margin-left:-13px; 114 | z-index:-1; 115 | } 116 | .nav-folder.mod-root .nav-folder > .nav-folder-children { 117 | margin-left:8px; 118 | position:relative; 119 | padding-left:7px; 120 | } 121 | .nav-folder.mod-root .nav-file:hover .nav-file-title::before, 122 | .nav-folder.mod-root .nav-file-title.is-active::before { 123 | width:8px; 124 | } 125 | 126 | /* overflowing title alignment fix */ 127 | .nav-file-title, 128 | .nav-folder-title { 129 | padding-right:4px; 130 | z-index:2; 131 | } 132 | 133 | /* .nav-folder.mod-root .nav-folder > .nav-folder-children { 134 | margin-left:13px !important; 135 | outline:1px solid red; 136 | } */ 137 | 138 | /* .nav-folder.mod-root .nav-folder > .nav-folder-children:has([class*=nav-])::after { 139 | background-color:var(--bg2, var(--background-primary)); 140 | } */ 141 | 142 | /* Fix Folder Note Count display */ 143 | .nav-folder-title-content { 144 | flex-grow:0 !important; 145 | } 146 | 147 | /* Folder Count plugin alignment */ 148 | .nav-folder-title[data-count]::after { 149 | color: var(--tx3, var(--text-faint)); 150 | position:absolute; 151 | right:0; 152 | transform: translate(0, 1px); 153 | opacity:0; 154 | transition: .2s opacity ease-in; 155 | padding-right:3px; 156 | } 157 | 158 | .nav-files-container:hover .nav-folder-title[data-count]::after { 159 | opacity:1; 160 | } 161 | 162 | /* Make attachment folders less visible */ 163 | .nav-files-container [data-path*=attachments], 164 | .nav-files-container [data-path*=Assets] { 165 | opacity:0.6; 166 | } 167 | 168 | /* style file tag */ 169 | .nav-file-tag { 170 | /* Here be dragons! */ 171 | margin-left:0; 172 | margin-right:3px; 173 | text-shadow: 0.5px 0 0 black; 174 | text-indent:-5px; 175 | overflow:visible; 176 | font-weight:bold; 177 | line-height:10px; 178 | width:13px; 179 | height:13px; 180 | font-size: 11px; 181 | letter-spacing:-0.5px; 182 | vertical-align:middle; 183 | text-rendering: geometricPrecision; 184 | /* font-family: "JetBrains Mono", monospace; */ 185 | font-family: "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace; 186 | border-radius:0; 187 | 188 | /* suffix file tag styling */ 189 | .nav-file-title-content + & { 190 | margin-left: .5rem; 191 | letter-spacing: 0; 192 | } 193 | } 194 | 195 | /* Hide file tag when an icon is set */ 196 | .nav-file:has(.nav-file-tag):has(.iconize-icon) { 197 | .nav-file-tag {display:none} 198 | } 199 | 200 | /* Fix weird indent on root vault files */ 201 | .nav-files-container .nav-folder.mod-root > .nav-folder-children > .tree-item.nav-file { 202 | 203 | .nav-file-title.is-active::before { 204 | /* fix indent on active file in root */ 205 | display:none; 206 | } 207 | 208 | &:hover .nav-file-title::before { 209 | /* fix indent on hovered file in root */ 210 | display:none !important; 211 | } 212 | } 213 | 214 | } 215 | 216 | /* Align vault title */ 217 | body:not(.is-mobile) .nav-folder.mod-root>.nav-folder-title .nav-folder-title-content { 218 | margin-left:-3px; 219 | } 220 | 221 | -------------------------------------------------------------------------------- /[ui] Compact File Explorer.css: -------------------------------------------------------------------------------- 1 | /* 2 | Compact File Explorer Minimal 3 | This is tweak of the file explorer that avoids messing with the chevrons, to avoid the 4 | janky problematic padding calculations issue 5 | 6 | https://github.com/replete/obsidian-minimal-theme-css-snippets 7 | */ 8 | 9 | [data-type=file-explorer] { 10 | 11 | .nav-files-container { 12 | /* compact file explorer */ 13 | padding: 0; 14 | margin-left: -12px; 15 | 16 | .nav-file-title, 17 | .nav-folder-title { 18 | padding-top:3px; 19 | padding-bottom:3px; 20 | } 21 | 22 | /* hide root chevrons */ 23 | > div > .nav-folder { 24 | > .mod-collapsible .collapse-icon { 25 | visibility:hidden; 26 | } 27 | } 28 | 29 | /* collapse chevrons more subtle*/ 30 | .collapse-icon { 31 | opacity:0.4; 32 | transition: opacity 0.2s ease-in-out; 33 | } 34 | .nav-folder:not(.is-collapsed) > .mod-collapsible > .collapse-icon { 35 | opacity:1; 36 | } 37 | 38 | /* Make some folders appear more subtle */ 39 | > div > .nav-folder.is-collapsed:has(> [data-path=Assets]), 40 | .nav-folder:not(:not(.is-collapsed)):has(> [data-path*="/attachments"]) { 41 | opacity:0.6; 42 | } 43 | 44 | /* Folder Count plugin count appear on hover and more subtle */ 45 | .nav-folder-title[data-count]::after { 46 | color: var(--tx3, var(--text-faint)); 47 | position:absolute; 48 | right:0; 49 | transform: translate(0, 1px); 50 | opacity:0; 51 | transition: .2s opacity ease-in; 52 | padding-right:3px; 53 | } 54 | &:hover { 55 | .nav-folder-title[data-count]::after { 56 | opacity:1; 57 | } 58 | } 59 | 60 | /* remove border-radius */ 61 | .nav-file-title, 62 | .nav-folder-title { 63 | border-radius:0; 64 | } 65 | 66 | /* style file tag */ 67 | .nav-file-tag { 68 | /* Here be dragons! */ 69 | margin-left:0; 70 | margin-right:3px; 71 | text-shadow: 0.5px 0 0 black; 72 | text-indent:-5px; 73 | overflow:visible; 74 | font-weight:bold; 75 | line-height:10px; 76 | width:13px; 77 | height:13px; 78 | font-size: 11px; 79 | letter-spacing:-0.5px; 80 | vertical-align:middle; 81 | text-rendering: geometricPrecision; 82 | font-family: "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace; 83 | border-radius:0; 84 | 85 | /* suffix file tag styling */ 86 | .nav-file-title-content + & { 87 | margin-left: .5rem; 88 | letter-spacing: 0; 89 | } 90 | } 91 | 92 | /* Hide file tag when an icon is set */ 93 | .nav-file:has(.nav-file-tag):has(.iconize-icon) { 94 | .nav-file-tag {display:none} 95 | } 96 | } 97 | } 98 | -------------------------------------------------------------------------------- /[ui] Compact Properties.css: -------------------------------------------------------------------------------- 1 | 2 | /* 3 | Compact Properties 4 | https://github.com/replete/obsidian-minimal-theme-css-snippets 5 | */ 6 | 7 | /* Compact style */ 8 | .cm-editor .metadata-container { 9 | padding-top:0; 10 | padding-bottom:6px; 11 | } 12 | 13 | .cm-editor .metadata-properties-heading { 14 | display:none; 15 | } 16 | 17 | /* Autohide on hover for desktop */ 18 | body:not(.is-mobile) { 19 | .cm-editor .metadata-container { 20 | height:.5em; 21 | margin-bottom:0; 22 | 23 | .metadata-content { 24 | display:none; 25 | } 26 | 27 | &::before { 28 | content:'⋯'; 29 | display:block; 30 | position:absolute; 31 | height:100%; 32 | width:100%; 33 | line-height:1em; 34 | text-indent:3px; 35 | top:-4px; 36 | pointer-events:none; 37 | } 38 | 39 | &:is(:hover,:focus-within) { 40 | height:auto; 41 | background: inherit; 42 | 43 | &::before { 44 | display:none; 45 | } 46 | 47 | .metadata-content { 48 | display:inherit; 49 | } 50 | } 51 | 52 | } 53 | } 54 | 55 | /* Hide properties on mobile */ 56 | body:is(.is-mobile) { 57 | --metadata-display-editing: none; 58 | } 59 | 60 | /* Properties panel fixes */ 61 | .workspace-leaf-content[data-type=all-properties] { 62 | 63 | .nav-header { 64 | padding-top:6px; 65 | padding-bottom:0; 66 | 67 | .nav-buttons-container { 68 | margin-right:0 !important; 69 | padding-left:2px 70 | } 71 | 72 | /* correct icon alignment */ 73 | .clickable-icon svg { 74 | transform: translate(-2px,0); 75 | } 76 | 77 | .search-input-container { 78 | outline:2px solid red; 79 | 80 | } 81 | } 82 | 83 | .tree-item { 84 | /* fix properties panel item alignment */ 85 | padding-left: 15px; 86 | /* more compact */ 87 | margin-top:-5px; 88 | } 89 | } 90 | 91 | /* Hide banner in hover popover */ 92 | .hover-popover .metadata-container { 93 | display:none !important; 94 | outline: 2px solid red; 95 | } -------------------------------------------------------------------------------- /[ui] Compact Sidebar.css: -------------------------------------------------------------------------------- 1 | /* 2 | Compact Sidebar 3 | Make icons in sidebar tab headers more compact, for smaller screens 4 | Make Vault selector sidebar footer more compact 5 | https://github.com/replete/obsidian-minimal-theme-css-snippets 6 | */ 7 | 8 | /* Compact Top sidebar navigation */ 9 | .workspace-tab-header-inner{ 10 | padding-left:3px; 11 | padding-right:3px; 12 | } 13 | 14 | /* Compact File Explorer Header */ 15 | [data-type=file-explorer] { 16 | .nav-header { 17 | padding:5px 12px 4px 12px; 18 | 19 | .nav-buttons-container { 20 | margin-left:-4px; 21 | /* justify-content:flex-end; */ 22 | 23 | &:hover { 24 | .clickable-icon { 25 | opacity:0.7; 26 | } 27 | } 28 | 29 | .clickable-icon { 30 | padding:2px; 31 | color:var(--tx2, var(--text-normal)) !important; 32 | transition: .2s color ease-in; 33 | opacity:0.45; 34 | background:transparent; 35 | transition: .1s all ease-in; 36 | 37 | &:hover { 38 | background-color:transparent; 39 | opacity:1; 40 | } 41 | 42 | svg { 43 | width:18px; 44 | height:18px; 45 | } 46 | } 47 | 48 | .view-actions:hover .clickable-icon { 49 | color: var(--tx1, var(--text-faint)) !important; 50 | } 51 | } 52 | } 53 | } 54 | 55 | 56 | /* Compact Vault selector sidebar footer */ 57 | body:not(.is-mobile) .workspace-split.mod-left-split .workspace-sidedock-vault-profile { 58 | padding: 0; 59 | gap:0; 60 | 61 | .workspace-drawer-vault-switcher { 62 | border-top-right-radius: 0; 63 | border-bottom-right-radius: 0; 64 | padding-left: 12px; 65 | margin-top:-1px; 66 | } 67 | 68 | .clickable-icon { 69 | border-radius:0; 70 | 71 | &:last-of-type { 72 | padding-right:12px 73 | } 74 | } 75 | 76 | svg { 77 | width:16px !important; 78 | height:16px !important; 79 | 80 | } 81 | 82 | .workspace-drawer-vault-name { 83 | margin-left:-5px; 84 | } 85 | } 86 | -------------------------------------------------------------------------------- /[ui] Compact Tab Header.css: -------------------------------------------------------------------------------- 1 | /* 2 | Compact Tab Header 3 | Make main tab header items more compact 4 | https://github.com/replete/obsidian-minimal-theme-css-snippets 5 | */ 6 | 7 | /* Make header title left justified */ 8 | .view-header-title-container { 9 | justify-content:start; 10 | } 11 | .view-header-title-container .view-header-title { 12 | color:var(--tx2) !important; 13 | } 14 | .view-header-title-container .view-header-title:hover, 15 | .view-header-title-container .view-header-title:focus { 16 | color:var(--tx1) !important 17 | } 18 | 19 | /* Condensed Icon spacing */ 20 | .view-header .view-actions .clickable-icon{ 21 | color:var(--tx2) !important; 22 | transition: .2s color ease-in; 23 | padding-left:2px; 24 | padding-right:2px; 25 | } 26 | 27 | .view-header .view-actions:hover .clickable-icon { 28 | color: var(--tx1) !important; 29 | } 30 | -------------------------------------------------------------------------------- /[ui] Compact Tabs (classic).css: -------------------------------------------------------------------------------- 1 | /* 2 | Commpact Tabs 3 | Cleaner, smaller tabs with hidden buttons 4 | https://github.com/replete/obsidian-minimal-theme-css-snippets 5 | */ 6 | 7 | .workspace-tabs:not([class*=-right], [class*=-left]) .workspace-tab-header { 8 | padding-left:3px; 9 | padding-right:3px; 10 | } 11 | .workspace-tabs:not([class*=-right], [class*=-left]) .workspace-tab-header .workspace-tab-header-inner { 12 | gap:0 !important; 13 | } 14 | 15 | /* Hide tab separator bar */ 16 | .workspace .mod-root .workspace-tab-header-inner::after { 17 | display:none; 18 | } 19 | 20 | /* Hover tab styles */ 21 | .workspace-tabs:not([class*=-right], [class*=-left]) .workspace-tab-header:not(.is-active):hover .workspace-tab-header-inner { 22 | background: var(--bg2); 23 | } 24 | 25 | /* Hide buttons until hover */ 26 | .workspace-tabs:not([class*=-right], [class*=-left]) .workspace-tab-header:not(.is-active) .workspace-tab-header-inner-close-button, 27 | .workspace-tabs:not([class*=-right], [class*=-left]) .workspace-tab-header:not(.is-active) .workspace-tab-header-status-icon { 28 | opacity:0; 29 | } 30 | .workspace-tabs:not([class*=-right], [class*=-left]) .workspace-tab-header:not(.is-active):hover .workspace-tab-header-inner-close-button, 31 | .workspace-tabs:not([class*=-right], [class*=-left]) .workspace-tab-header:not(.is-active):hover .workspace-tab-header-status-icon { 32 | opacity:1; 33 | } 34 | 35 | /* Less prominent pinned icon */ 36 | .workspace-tabs:not([class*=-right], [class*=-left]) .workspace-tab-header.is-active .workspace-tab-header-status-icon { 37 | opacity:0.6 !important; 38 | } 39 | 40 | /* Variable width tabs WIP */ 41 | .workspace-tabs:not([class*=-right], [class*=-left]) .workspace-tab-header-inner { 42 | /* width:auto; */ 43 | } 44 | .workspace-tabs:not([class*=-right], [class*=-left]) .workspace-tab-header { 45 | /* width:auto; 46 | flex: none; 47 | flex-shrink: 1; 48 | max-width:25% */ 49 | } 50 | 51 | .workspace-tabs:not([class*=-right], [class*=-left]) .workspace-tab-header-inner { 52 | } 53 | 54 | .workspace-tabs:not([class*=-right], [class*=-left]) .workspace-tab-header:not(.is-active) .workspace-tab-header-inner-close-button { 55 | position:absolute; 56 | right:6px; 57 | margin-top:0px; 58 | } 59 | 60 | .workspace-tabs:not([class*=-right], [class*=-left]) .workspace-tab-header:not(.is-active):hover .workspace-tab-header-inner-close-button { 61 | background:var(--bg2); 62 | } 63 | 64 | /* Fade graphic to make hover close button look less harsh */ 65 | .workspace-tabs:not([class*=-right], [class*=-left]) .workspace-tab-header:not(.is-active):hover .workspace-tab-header-inner-close-button::before { 66 | content:''; 67 | display:block; 68 | position:absolute; 69 | background:linear-gradient(to right, transparent, var(--bg2)) !important; 70 | right:100%; 71 | height:1em; 72 | width: 1em; 73 | pointer-events:none; 74 | } 75 | 76 | 77 | /* Smaller buttons */ 78 | .workspace .mod-root .workspace-tab-header-inner-close-button, 79 | .workspace .mod-root .workspace-tab-header-status-icon { 80 | transform:scale(0.9) translate(2px,1px); 81 | transform-origin:center; 82 | } 83 | 84 | /* Smaller new tab button */ 85 | .workspace .mod-root .workspace-tab-header-new-tab { 86 | margin-left:4px; 87 | } 88 | .workspace .mod-root .workspace-tab-header-new-tab .clickable-icon { 89 | transform:scale(0.8) translate(0,1px); 90 | } -------------------------------------------------------------------------------- /[ui] Compact Tabs.css: -------------------------------------------------------------------------------- 1 | /* 2 | Commpact Tabs 3 | Cleaner, smaller tabs with hidden buttons 4 | https://github.com/replete/obsidian-minimal-theme-css-snippets 5 | */ 6 | 7 | .workspace .mod-root .workspace-tab-header-container { 8 | /* border-bottom:0 */ 9 | } 10 | 11 | .workspace .mod-root .workspace-tab-header-container-inner { 12 | padding: 0; 13 | margin: 5px 0 2px -2px; 14 | } 15 | .workspace .mod-root .workspace-tab-header.is-active { 16 | background: none; 17 | box-shadow: none; 18 | } 19 | .workspace .mod-root .workspace-tab-header.is-active::before, 20 | .workspace .mod-root .workspace-tab-header.is-active::after { 21 | display:none; 22 | } 23 | 24 | .workspace .mod-root .workspace-tab-header.is-active .workspace-tab-header-inner { 25 | background: var(--background-modifier-hover); 26 | } 27 | /* Theme-specific colour tweaks */ 28 | /* .theme-light.minimal-atom-light .workspace .mod-root .is-active .workspace-tab-header-inner, 29 | .theme-light.minimal-catppuccin-light .workspace .mod-root .is-active .workspace-tab-header-inner { 30 | background: hsl(var(--base-h), var(--base-s), calc(var(--base-l) - 6%)) 31 | } */ 32 | 33 | .workspace .mod-root .workspace-tab-header { 34 | padding-left:2px; 35 | padding-right:2px; 36 | 37 | &:first-of-type { 38 | padding-left:0; 39 | } 40 | } 41 | .workspace .mod-root .workspace-tab-header .workspace-tab-header-inner { 42 | gap:0 !important; 43 | } 44 | 45 | /* Hide tab separator bar */ 46 | .workspace .mod-root .workspace-tab-header-inner::after { 47 | display:none; 48 | } 49 | 50 | /* Hover tab styles */ 51 | .workspace .mod-root .workspace-tab-header:not(.is-active):hover .workspace-tab-header-inner { 52 | background: var(--bg2); 53 | } 54 | 55 | /* Hide buttons until hover */ 56 | .workspace .mod-root .workspace-tab-header:not(.is-active) .workspace-tab-header-inner-close-button, 57 | .workspace .mod-root .workspace-tab-header:not(.is-active) .workspace-tab-header-status-icon { 58 | opacity:0; 59 | } 60 | .workspace .mod-root .workspace-tab-header:not(.is-active):hover .workspace-tab-header-inner-close-button, 61 | .workspace .mod-root .workspace-tab-header:not(.is-active):hover .workspace-tab-header-status-icon { 62 | opacity:1; 63 | } 64 | 65 | /* Less prominent pinned icon */ 66 | .workspace .mod-root .workspace-tab-header.is-active .workspace-tab-header-status-icon { 67 | opacity:0.6 !important; 68 | } 69 | 70 | .workspace .mod-root .workspace-tab-header:not(.is-active) .workspace-tab-header-inner-close-button { 71 | position:absolute; 72 | right:6px; 73 | margin-top:0px; 74 | } 75 | 76 | .workspace .mod-root .workspace-tab-header:not(.is-active):hover .workspace-tab-header-inner-close-button { 77 | background:var(--bg2); 78 | } 79 | 80 | /* Fade graphic to make hover close button look less harsh */ 81 | .workspace .mod-root .workspace-tab-header:not(.is-active):hover .workspace-tab-header-inner-close-button::before { 82 | content:''; 83 | display:block; 84 | position:absolute; 85 | background:linear-gradient(to right, transparent, var(--bg2)) !important; 86 | right:100%; 87 | height:1em; 88 | width: 1em; 89 | pointer-events:none; 90 | } 91 | 92 | /* Smaller buttons */ 93 | .workspace .mod-root .workspace-tab-header-inner-close-button, 94 | .workspace .mod-root .workspace-tab-header-status-icon { 95 | transform:scale(0.9) translate(2px,1px); 96 | transform-origin:center; 97 | } 98 | 99 | /* Smaller new tab button */ 100 | .workspace .mod-root .workspace-tab-header-new-tab { 101 | margin-left:4px; 102 | } 103 | .workspace .mod-root .workspace-tab-header-new-tab .clickable-icon { 104 | transform:scale(0.8) translate(0,1px); 105 | } 106 | 107 | 108 | /* Variable width tabs WIP */ 109 | .workspace .mod-root .workspace-tab-header-inner { 110 | /* width:auto; */ 111 | } 112 | .workspace .mod-root .workspace-tab-header { 113 | /* width:auto; 114 | flex: none; 115 | flex-shrink: 1; 116 | max-width:25% */ 117 | } 118 | -------------------------------------------------------------------------------- /[ui] Custom Separators (gradient).css: -------------------------------------------------------------------------------- 1 | /* 2 | File Explorer Separators 3 | So this is super handy, I found a way to add visual separators below and above navigation items in the file explorer. 4 | This works nicely along side the 'Custom File Explorer Sorting' plugin, and there's a thread on their github about my solution. 5 | You need to customize the rule below in accordance with your file structure. 6 | These styles go with 7 | https://github.com/replete/obsidian-minimal-theme-css-snippets 8 | */ 9 | :root { 10 | --replete-custom-separators-vertical-padding: 4px; 11 | --replete-custom-separators-left-margin: -12px; 12 | } 13 | 14 | /* Separator below */ 15 | .nav-files-container [class*=nav-]:has(:is( 16 | [data-path="Areas.md"], 17 | [data-path="Meetings"], 18 | [data-path="Sundown"], 19 | [data-path="Thoughts"], 20 | [data-path="Meditations"] 21 | ))::after { 22 | content:''; 23 | display:block; 24 | height:1px; 25 | width:calc(100% + 32px); 26 | background:linear-gradient(to right, var(--tab-outline-color), transparent); 27 | margin:var(--replete-custom-separators-vertical-padding) 0 var(--replete-custom-separators-vertical-padding) var(--replete-custom-separators-left-margin); 28 | } -------------------------------------------------------------------------------- /[ui] Custom Separators.css: -------------------------------------------------------------------------------- 1 | /* 2 | File Explorer Separators 3 | So this is super handy, I found a way to add visual separators below and above navigation items in the file explorer. 4 | This works nicely along side the 'Custom File Explorer Sorting' plugin, and there's a thread on their github about my solution. 5 | You need to customize the rule below in accordance with your file structure. 6 | These styles go with 7 | https://github.com/replete/obsidian-minimal-theme-css-snippets 8 | */ 9 | :root { 10 | --replete-custom-separators-vertical-padding: 6px; 11 | --replete-custom-separators-left-margin: -12px; 12 | } 13 | 14 | /* Separator below */ 15 | .nav-files-container [class*=nav-]:has(:is( 16 | [data-path="Thoughts"], 17 | [data-path="Reports"], 18 | [data-path="Sundown"], 19 | [data-path="Meditations"], 20 | [data-path="Areas.md"] 21 | ))::after { 22 | content:''; 23 | display:block; 24 | height:1px; 25 | width:calc(100% + 32px); 26 | background:var(--tab-outline-color); 27 | margin:var(--replete-custom-separators-vertical-padding) 0 var(--replete-custom-separators-vertical-padding) var(--replete-custom-separators-left-margin); 28 | } 29 | 30 | /* Separator above */ 31 | /* .nav-files-container [class*=nav-]:has(:is( 32 | [data-path="Notes"] 33 | ))::before { 34 | content:''; 35 | display:block; 36 | height:1px; 37 | width:calc(100% + 32px); 38 | background:var(--tab-outline-color); 39 | margin:var(--replete-custom-separators-vertical-padding) 0 var(--replete-custom-separators-vertical-padding) var(--replete-custom-separators-left-margin); 40 | } */ 41 | -------------------------------------------------------------------------------- /[ui] File Explorer Folder Icons (replace chevrons).css: -------------------------------------------------------------------------------- 1 | /* 2 | File Explorer Folder icons (replace chevrons 3 | This adds a folder icon to folders that do not have an icon set 4 | by the 'Iconize' plugin, and will follow the same size. 5 | 6 | This makes it easier (for me) to see I'm in a nested folder 7 | 8 | https://github.com/replete/obsidian-minimal-theme-css-snippets 9 | */ 10 | 11 | :root { 12 | --replete-folder-closed-icon-data: url('data:image/svg+xml,'); 13 | --replete-folder-open-icon-data: url('data:image/svg+xml,'); 14 | } 15 | 16 | /* this version has folder icons appear beside the chevrons */ 17 | .workspace-leaf-content[data-type=file-explorer] { 18 | .nav-folder-title { 19 | &:not(:has(> [data-icon])) { 20 | .nav-folder-title-content { 21 | &::before { 22 | content: ''; 23 | display:inline-block; 24 | width:13px; 25 | height:13px; 26 | background-color:var(--tx2); 27 | mask-image: var(--replete-folder-closed-icon-data); 28 | mask-size: contain; 29 | mask-repeat: no-repeat; 30 | mask-position: center; 31 | margin-right:4px; 32 | transform:translate(-1px,2px); 33 | } 34 | } 35 | &:has(> .collapse-icon:not(.is-collapsed)) { 36 | .nav-folder-title-content::before { 37 | mask-image: var(--replete-folder-open-icon-data); 38 | } 39 | } 40 | } 41 | } 42 | } 43 | /* 44 | File Explorer Folder icons 45 | This adds a folder icon to folders that do not have an icon set 46 | by the 'Iconize' plugin, and will follow the same size. 47 | 48 | This makes it easier (for me) to see I'm in a nested folder 49 | 50 | https://github.com/replete/obsidian-minimal-theme-css-snippets 51 | */ 52 | 53 | :root { 54 | --replete-folder-closed-icon-data: url('data:image/svg+xml,'); 55 | --replete-folder-open-icon-data: url('data:image/svg+xml,'); 56 | } 57 | 58 | /* this version has folder icons that replace the chevrons */ 59 | .workspace-leaf-content[data-type=file-explorer] { 60 | .nav-folder-title { 61 | &:not(:has(> [data-icon])) { 62 | .nav-folder-title-content { 63 | &::before { 64 | content: ''; 65 | display:block; 66 | position:absolute; 67 | width:13px; 68 | height:13px; 69 | background-color:var(--tx2); 70 | mask-image: var(--replete-folder-closed-icon-data); 71 | mask-size: contain; 72 | mask-repeat: no-repeat; 73 | mask-position: center; 74 | margin-right:4px; 75 | transform:translate(-19px,2px); 76 | } 77 | } 78 | &:has(> .collapse-icon:not(.is-collapsed)) { 79 | .nav-folder-title-content::before { 80 | mask-image: var(--replete-folder-open-icon-data); 81 | } 82 | } 83 | } 84 | } 85 | .collapse-icon { 86 | visibility:hidden; 87 | } 88 | } 89 | -------------------------------------------------------------------------------- /[ui] File Explorer Folder Icons.css: -------------------------------------------------------------------------------- 1 | /* 2 | File Explorer Folder icons 3 | This adds a folder icon to folders that do not have an icon set 4 | by the 'Iconize' plugin, and will follow the same size. 5 | 6 | This makes it easier (for me) to see I'm in a nested folder 7 | 8 | https://github.com/replete/obsidian-minimal-theme-css-snippets 9 | */ 10 | 11 | :root { 12 | --replete-folder-closed-icon-data: url('data:image/svg+xml,'); 13 | --replete-folder-open-icon-data: url('data:image/svg+xml,'); 14 | } 15 | 16 | /* this version has folder icons appear beside the chevrons */ 17 | .workspace-leaf-content[data-type=file-explorer] { 18 | .nav-folder-title { 19 | &:not(:has(> [data-icon])) { 20 | .nav-folder-title-content { 21 | &::before { 22 | content: ''; 23 | display:inline-block; 24 | width:13px; 25 | height:13px; 26 | background-color:var(--tx2); 27 | mask-image: var(--replete-folder-closed-icon-data); 28 | mask-size: contain; 29 | mask-repeat: no-repeat; 30 | mask-position: center; 31 | margin-right:4px; 32 | transform:translate(-1px,2px); 33 | } 34 | } 35 | &:has(> .collapse-icon:not(.is-collapsed)) { 36 | .nav-folder-title-content::before { 37 | mask-image: var(--replete-folder-open-icon-data); 38 | } 39 | } 40 | } 41 | } 42 | } 43 | -------------------------------------------------------------------------------- /[ui] File Explorer Header Autohide.css: -------------------------------------------------------------------------------- 1 | /* 2 | File Explorer Header auto-hide 3 | Hides the file explorer header until hovered over (I never use this and it looks better without it) 4 | https://github.com/replete/obsidian-minimal-theme-css-snippets 5 | 6 | */ 7 | 8 | .workspace-leaf-content[data-type=file-explorer] { 9 | 10 | > .nav-header { 11 | transition: all 0.2s ease-in-out; 12 | opacity:0; 13 | margin-bottom:-4px; 14 | 15 | &:not(:hover, :focus-within) { 16 | height: 3px !important; 17 | overflow: hidden; 18 | } 19 | 20 | &:hover, 21 | &:focus-within { 22 | opacity:1; 23 | height: 36px !important; /* suits compact file explorer */ 24 | } 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /[ui] Floating Tab Header mini.css: -------------------------------------------------------------------------------- 1 | /* 2 | Floating Tab Header Mini 3 | With inline title enabled, it seems a waste to take up vertical space of the 'view header' 4 | especially if you don't use the back/forward buttons or the breadcrumb, so this minifies 5 | that interface into a float right toolbar. 6 | https://github.com/replete/obsidian-minimal-theme-css-snippets 7 | */ 8 | 9 | 10 | /* Floating tab header styles */ 11 | .view-header { 12 | background:transparent !important; 13 | border:none; 14 | position:fixed; 15 | top:8px; 16 | right:10px; 17 | right: calc(var(--scrollbar-size) + 8px); 18 | padding: 5px 5px; 19 | justify-content:end; 20 | border-radius: 8px; 21 | /* border:1px solid hsla(var(--base-h), var(--base-s), var(--base-l), 1); */ 22 | border:1px solid transparent; 23 | height:auto; 24 | z-index:500; /* Fixes in excalidraw */ 25 | } 26 | 27 | .view-header:hover, 28 | .view-header:focus-within { 29 | border:1px solid var(--divider-color); 30 | box-shadow: -2px 2px 6px -2px var(--divider-color); 31 | background-color: var(--background-primary) !important; 32 | } 33 | 34 | /* Show/hide nav + breadcrumb interaction */ 35 | .view-header-nav-buttons, 36 | .view-header-title-container, 37 | .view-header .cmdr-adder, 38 | .view-header .clickable-icon:not(:last-child) { 39 | opacity:0; 40 | display:none; 41 | } 42 | .view-header:hover :is(.view-header-nav-buttons, .view-header-title-container), 43 | .view-header:focus-within :is(.view-header-nav-buttons, .view-header-title-container), 44 | .view-header:is(:hover) .clickable-icon:not(.view-header-icon){ 45 | opacity:1; 46 | display:flex 47 | } 48 | 49 | /* Tweak commander '+' icon */ 50 | .view-header:hover .cmdr-adder, 51 | .view-header:focus-within .cmdr-adder { 52 | opacity:0.4; 53 | display:flex; 54 | } 55 | 56 | /* Excalidraw fix */ 57 | [data-type="excalidraw"] .view-header .clickable-icon:not(:last-of-type){ 58 | display:none; 59 | opacity:0; 60 | } 61 | [data-type="excalidraw"] .view-header:hover .clickable-icon:not(.view-header-icon) { 62 | display:flex; 63 | opacity:1; 64 | } -------------------------------------------------------------------------------- /[ui] Floating Tab Header.css: -------------------------------------------------------------------------------- 1 | /* 2 | Floating Tab Header 3 | With inline title enabled, it seems a waste to take up vertical space of the 'view header' 4 | especially if you don't use the back/forward buttons or the breadcrumb, so this minifies 5 | that interface into a float right toolbar. 6 | https://github.com/replete/obsidian-minimal-theme-css-snippets 7 | */ 8 | 9 | 10 | /* Floating tab header styles */ 11 | .view-header { 12 | background:transparent !important; 13 | border:none; 14 | position:fixed; 15 | top:8px; 16 | right:10px; 17 | right: calc(var(--scrollbar-size) + 8px); 18 | padding: 5px 5px; 19 | justify-content:end; 20 | border-radius: 8px; 21 | /* border:1px solid hsla(var(--base-h), var(--base-s), var(--base-l), 1); */ 22 | border:1px solid transparent; 23 | height:auto; 24 | z-index:500; /* Fixes in excalidraw */ 25 | } 26 | 27 | .view-header:hover, 28 | .view-header:focus-within { 29 | border:1px solid var(--divider-color); 30 | box-shadow: -2px 2px 6px -2px var(--divider-color); 31 | background-color: var(--background-primary) !important; 32 | } 33 | 34 | /* Show/hide nav + breadcrumb interaction */ 35 | .view-header-nav-buttons, 36 | .view-header-title-container, 37 | .view-header .cmdr-adder { 38 | opacity:0; 39 | display:none; 40 | } 41 | .view-header:hover :is(.view-header-nav-buttons, .view-header-title-container), 42 | .view-header:focus-within :is(.view-header-nav-buttons, .view-header-title-container){ 43 | opacity:1; 44 | display:flex 45 | } 46 | 47 | /* Tweak commander '+' icon */ 48 | .view-header:hover .cmdr-adder, 49 | .view-header:focus-within .cmdr-adder { 50 | opacity:0.4; 51 | display:flex; 52 | } 53 | 54 | /* Excalidraw fix */ 55 | [data-type="excalidraw"] .view-header .clickable-icon:not(:last-of-type){ 56 | display:none; 57 | opacity:0; 58 | } 59 | [data-type="excalidraw"] .view-header:hover .clickable-icon:not(.view-header-icon) { 60 | display:flex; 61 | opacity:1; 62 | } -------------------------------------------------------------------------------- /[ui] Native Scrollbar styles.css: -------------------------------------------------------------------------------- 1 | /* 2 | Native scrollbars 3 | I styled the native scrollbars before I reaized there was an option to render them in Obsidian... 4 | Only tested on MacOS 5 | https://github.com/replete/obsidian-minimal-theme-css-snippets 6 | */ 7 | :root { 8 | --scrollbar-size: 6px; 9 | } 10 | ::-webkit-scrollbar { 11 | width: var(--scrollbar-size); /* for vertical scrollbars */ 12 | height: var(--scrollbar-size); /* for horizontal scrollbars */ 13 | } 14 | ::-webkit-scrollbar-track, 15 | ::-webkit-scrollbar-corner { 16 | background:transparent; 17 | } 18 | ::-webkit-scrollbar-track:vertical { 19 | background:linear-gradient(to right, transparent 50%, hsla(var(--base-h), var(--base-s), calc(var(--base-l) - 10%), 0.2)); 20 | } 21 | ::-webkit-scrollbar-track:horizontal { 22 | background:linear-gradient(to bottom, transparent 50%, hsla(var(--base-h), var(--base-s), calc(var(--base-l) - 10%), 0.2)); 23 | } 24 | ::-webkit-scrollbar-thumb { 25 | background: var(--nav-indentation-guide-color); 26 | } 27 | /* ::-webkit-scrollbar-thumb:vertical { 28 | border-radius: var(--scrollbar-size) 0 0 var(--scrollbar-size); 29 | } 30 | ::-webkit-scrollbar-thumb:horizontal { 31 | border-radius: var(--scrollbar-size) var(--scrollbar-size) 0 0; 32 | } */ 33 | ::-webkit-scrollbar-thumb:hover { 34 | background: var(--text-muted); 35 | } -------------------------------------------------------------------------------- /[ui] Resize Handles tweaks.css: -------------------------------------------------------------------------------- 1 | /* 2 | Resize handles tweaks 3 | The resize handles when you resize sidebars use the accent colour which makes no sense to me 4 | https://github.com/replete/obsidian-minimal-theme-css-snippets 5 | */ 6 | .workspace-leaf-resize-handle { 7 | transition: all .2s ease-in; 8 | } 9 | .workspace-leaf-resize-handle:hover { 10 | border-color:var(--text-muted); 11 | background-color:var(--text-muted); 12 | } -------------------------------------------------------------------------------- /[ui] Restrict last right sidebar panel.css: -------------------------------------------------------------------------------- 1 | /* 2 | Restrict last right sidebar panel 3 | Limit the height of the last right sidebar item (.e.g the calendar) to save constant resizing on window resize 4 | https://github.com/replete/obsidian-minimal-theme-css-snippets 5 | 6 | How to use: 7 | - activate snippet 8 | - resize Obsidian window to smallest vertical size that you will use 9 | - resize panel by dragging divider to make calendar visible (setting flex-grow values) 10 | - calendar should now always be visible on resize 11 | */ 12 | 13 | /* Assumes calendar plugin is the last panel in the right sidebar */ 14 | .mod-right-split .workspace-tabs:last-of-type { 15 | max-height:300px; 16 | } -------------------------------------------------------------------------------- /[ui] Statusbar tweaks.css: -------------------------------------------------------------------------------- 1 | /* 2 | Status bar 3 | Improves visual prominence of status bar, I don't want to hover in order to see what's on the status bar 4 | https://github.com/replete/obsidian-minimal-theme-css-snippets 5 | */ 6 | 7 | .status-bar { 8 | 9 | /* More visibility on dark theme */ 10 | .theme-dark & { 11 | color:var(--nav-item-color) !important; 12 | } 13 | 14 | /* Compact icons */ 15 | .clickable-icon { 16 | padding-left:3px; 17 | padding-right:3px; 18 | } 19 | } 20 | 21 | @container style(--status-bar-position: fixed) { 22 | /* transparent minimal status bar */ 23 | /* .status-bar{ 24 | background:transparent !important; 25 | transition: .2s all ease-in; 26 | 27 | &:hover { 28 | background: var(--background-primary) !important; 29 | box-shadow: 0 0 3px 3px rgba(0,0,0,.1); 30 | } 31 | } */ 32 | } 33 | -------------------------------------------------------------------------------- /[ui] Tab Header on bottom.css: -------------------------------------------------------------------------------- 1 | /* 2 | Tab Headder on bottom 3 | https://github.com/replete/obsidian-minimal-theme-css-snippets 4 | */ 5 | 6 | .view-header { 7 | position: fixed; 8 | bottom:0; 9 | width: 100%; 10 | background:var(--background-primary) !important; 11 | border-top: 1px solid var(--divider-color) !important; 12 | } 13 | 14 | /* vertical status bar when right sidedock is closed */ 15 | :has(.mod-right-split.is-sidedock-collapsed) .status-bar { 16 | transform: translate(3px, calc(var(--header-height) * -1)); 17 | width: var(--header-height); 18 | flex-direction: column !important; 19 | background-color: transparent; 20 | } 21 | 22 | :has(.mod-right-split.is-sidedock-collapsed) .status-bar-item { 23 | margin-right: 10px !important 24 | } 25 | 26 | :has(.mod-right-split.is-sidedock-collapsed) .status-bar .day-planner-progress-bar { 27 | display:none !important 28 | } 29 | 30 | :has(.mod-right-split.is-sidedock-collapsed) .status-bar .day-planner-status-bar-text { 31 | margin-right:20px !important; 32 | display: none; 33 | } -------------------------------------------------------------------------------- /[ui] Tab Header show path and title.css: -------------------------------------------------------------------------------- 1 | /* 2 | Tab Headder show path and title 3 | https://github.com/replete/obsidian-minimal-theme-css-snippets 4 | */ 5 | 6 | .view-header { 7 | 8 | .view-header-title-container { 9 | opacity:1; 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /[ui] Top fade.css: -------------------------------------------------------------------------------- 1 | /* 2 | Editor top fade 3 | This is a visual tweak for use with Floating Tab Header or Tab Header on bottom snippets 4 | https://github.com/replete/obsidian-minimal-theme-css-snippets 5 | */ 6 | 7 | .cm-content::before { 8 | content:''; 9 | height:18px; 10 | background:linear-gradient(to bottom, var(--background-primary), transparent); 11 | left:0; 12 | position:fixed; 13 | top:0px; 14 | width:calc(100% - var(--scrollbar-size)); /* depends on var from Native Custom Scrollbars */ 15 | pointer-events:none; 16 | z-index:100; 17 | border-top:1px solid var(--background-primary); 18 | } 19 | 20 | .theme-dark .cm-content::before { 21 | opacity:0.5; 22 | height:10px; 23 | } 24 | 25 | /* Hide if there's a banner */ 26 | .cm-content:has(.mk-header img)::after { 27 | display:none 28 | } -------------------------------------------------------------------------------- /[ui] Translucent Tab Header.css: -------------------------------------------------------------------------------- 1 | /* 2 | Translucent Tab Header tweaks 3 | Make view header translucent, showing document underneath 4 | https://github.com/replete/obsidian-minimal-theme-css-snippets 5 | */ 6 | 7 | /* Only set floating translucent view-header for leafs with editors */ 8 | .workspace-leaf-content:has(.cm-contentContainer) .view-header { 9 | background:hsla(var(--base-h),var(--base-s),var(--base-l),.7) !important; 10 | backdrop-filter:blur(5px); 11 | position:fixed; 12 | width:calc(100% - 16px); /* default scrollbar width*/ 13 | width:calc(100% - var(--scrollbar-size)); 14 | top:0; 15 | height:calc(var(--header-height) - 2px); 16 | } 17 | 18 | /* Offset editor content */ 19 | .cm-editor > .cm-scroller > .cm-sizer::before { 20 | content:''; 21 | display:block; 22 | height:var(--header-height); 23 | } 24 | 25 | /* Don't offset for notes showing a Make.MD Contexts banner image */ 26 | .cm-editor > .cm-scroller > .cm-sizer:has(.mk-note-header img)::before { 27 | display:none; 28 | } 29 | -------------------------------------------------------------------------------- /[ui] Ultra Compact Sidebar.css: -------------------------------------------------------------------------------- 1 | /* 2 | Ultra Compact Sidebar 3 | 4 | Resizes to previous set width on hover, and shrinks to 135px when not hovered. 5 | Drag handles still work, but invisibly. 6 | Top nav is a bit janky, but works if you hover over in the right way. 7 | 8 | https://github.com/replete/obsidian-minimal-theme-css-snippets 9 | */ 10 | 11 | .mod-sidedock.mod-left-split { 12 | transition: .1s width ease-in-out; 13 | 14 | /* fade sidebar nav icons nicer */ 15 | .sidebar-toggle-button.mod-left { 16 | position:absolute; 17 | right:5px; 18 | background:linear-gradient(90deg, transparent, var(--bg2) 40%); 19 | } 20 | 21 | &:not(:is(:hover, :focus-within)) { 22 | /* sidebsr shrinks if not hovered */ 23 | /* you can still resize the hovered sidebar width by dragging the handles, but its invisible */ 24 | width:135px !important; 25 | transition: .1s width ease-in-out; 26 | } 27 | } 28 | -------------------------------------------------------------------------------- /[ui] Ultra Compact Tab Header.css: -------------------------------------------------------------------------------- 1 | /* 2 | Compact Tab Header 3 | Make main tab header items more compact 4 | https://github.com/replete/obsidian-minimal-theme-css-snippets 5 | */ 6 | 7 | .view-header { 8 | --header-height: 26px !important; 9 | padding-left:0; 10 | gap:0px; 11 | 12 | .view-header-title-container { 13 | justify-content:start; 14 | 15 | .view-header-title { 16 | color:var(--tx2) !important; 17 | 18 | &:hover, 19 | &:focus { 20 | color:var(--tx1) !important 21 | } 22 | } 23 | } 24 | 25 | .view-actions { 26 | 27 | &:hover { 28 | .clickable-icon { 29 | color: var(--tx1) !important; 30 | } 31 | } 32 | 33 | /* Condensed Icon spacing */ 34 | .clickable-icon{ 35 | border-radius:0; 36 | color:var(--tx2) !important; 37 | transition: .2s color ease-in; 38 | padding-left:2px; 39 | padding-right:2px; 40 | } 41 | } 42 | 43 | } 44 | -------------------------------------------------------------------------------- /[ui] Ultra Compact.css: -------------------------------------------------------------------------------- 1 | /* 2 | Ultra Compact 3 | 4 | More compact navigation tabs, toolbars, smaller icons. 5 | Requires Compact Tabs snippet. 6 | 7 | https://github.com/replete/obsidian-minimal-theme-css-snippets 8 | */ 9 | 10 | :root { 11 | --replete-ultra-compact-header-height: 29px; 12 | --replete-custom-separators-vertical-padding: 3px; 13 | } 14 | 15 | /* Left sidebar header 16 | */ 17 | .mod-top-left-space { 18 | 19 | .workspace-tab-header-container-inner { 20 | padding-bottom:2px; 21 | } 22 | 23 | /* Hide border underneath sidebar top buttons */ 24 | .workspace-tab-header-container { 25 | border-bottom:0 !important; 26 | 27 | &::after { 28 | content:''; 29 | position:absolute; 30 | display:block; 31 | bottom:0; 32 | width:100%; 33 | height:1px; 34 | background:linear-gradient(to right, transparent, var(--tab-outline-color) 20%); 35 | } 36 | 37 | /* &::after { 38 | content:''; 39 | position:absolute; 40 | display:block; 41 | top:0; 42 | width:100%; 43 | height:calc(100% - 1px); 44 | border-bottom-left-radius: 8px; 45 | border-left: 1px solid var(--tab-outline-color); 46 | border-bottom: 1px solid var(--tab-outline-color); 47 | } */ 48 | 49 | /* .workspace-tab-header-container-inner { 50 | padding-left:5px; 51 | } */ 52 | 53 | .sidebar-toggle-button { 54 | margin-top: -6px; 55 | margin-right:-3px; 56 | 57 | .clickable-icon { 58 | border-radius:0 !important; 59 | } 60 | } 61 | } 62 | 63 | .workspace-tab-header { 64 | &.is-active { 65 | background:none; 66 | } 67 | 68 | .workspace-tab-header-inner { 69 | padding-left:1px !important; 70 | padding-right:1px !important; 71 | } 72 | } 73 | 74 | /* File Explorer */ 75 | [data-type=file-explorer] { 76 | /* header */ 77 | .nav-buttons-container { 78 | justify-content: flex-end !important; 79 | margin-top:-3px; 80 | margin-right:-2px; 81 | margin-bottom:-5px; 82 | 83 | .nav-action-button { 84 | padding:2px; 85 | 86 | svg { 87 | width:15px; 88 | height:15px; 89 | } 90 | } 91 | } 92 | /* explorer */ 93 | .nav-files-container { 94 | margin-top:6px; 95 | .tree-item[class*=nav-] .tree-item-self { 96 | padding-top:2px; 97 | padding-bottom:2px; 98 | border-radius: 3px; 99 | } 100 | } 101 | } 102 | } 103 | body:has(.mod-left-split.is-sidedock-collapsed) .mod-top-left-space .sidebar-toggle-button { 104 | margin-right:4px !important; 105 | } 106 | 107 | /* Navigation header */ 108 | .workspace-tab-header-container { 109 | padding-left:0; 110 | max-height: var(--replete-ultra-compact-header-height) !important; 111 | } 112 | .workspace-tab-header { 113 | padding-bottom:0 !important; 114 | padding-right:0 !important; 115 | padding-left:0 !important; 116 | 117 | &.is-active { 118 | /* background:transparent !important; */ 119 | border-radius:0; 120 | } 121 | } 122 | .workspace-tab-header-inner { 123 | border-radius:0; 124 | } 125 | .workspace-tab-header-inner-icon { 126 | padding-left:2px; 127 | } 128 | div.workspace-tab-header-container-inner.workspace-tab-header-container-inner { /* specificity hack */ 129 | margin-top:0 !important; 130 | margin-bottom:0 !important; 131 | } 132 | .workspace-tab-header-tab-list { 133 | /* Navigation tabs chevron menu */ 134 | margin-right:0; 135 | } 136 | 137 | /* Right sidebar header 138 | */ 139 | .mod-top-right-space { 140 | 141 | /* Panel icons */ 142 | .workspace-tab-header-container-inner { 143 | padding-top:0; 144 | padding-bottom:0; 145 | gap:0; 146 | } 147 | 148 | /* Right sidebar toggle button */ 149 | .sidebar-toggle-button.mod-right { 150 | padding-top: 0 !important; 151 | padding-right:2px !important; 152 | margin-top:-2px !important; 153 | background:transparent !important; 154 | } 155 | } 156 | 157 | /* View header 158 | */ 159 | .view-header { 160 | box-shadow: 0 0px 4px 2px var(--bg2); 161 | 162 | > [class^=view-] { 163 | transform:translateY(1px); 164 | } 165 | 166 | .view-header-nav-buttons { 167 | padding-left:2px; 168 | 169 | .clickable-icon { 170 | padding-left:3px; 171 | padding-right:3px; 172 | } 173 | } 174 | .view-action { 175 | margin-right:2px; 176 | } 177 | } 178 | 179 | /* Minimal Statusbar 180 | */ 181 | @container style(--status-bar-position: fixed) { 182 | .status-bar { 183 | padding:0; 184 | } 185 | } 186 | -------------------------------------------------------------------------------- /[user] Daily Note - Sticky Headings.css: -------------------------------------------------------------------------------- 1 | /* 2 | Daily note styles for Sticky Headings plugin. Disables plugin on non-daily note pages. 3 | Enable 'PrevToH1' option in plugin settings 4 | https://github.com/replete/obsidian-minimal-theme-css-snippets 5 | */ 6 | 7 | .obsidian-sticky-heading { 8 | 9 | display:none; /* Enable only for some templates */ 10 | .dailynote & { 11 | display:flex; 12 | } 13 | 14 | background:linear-gradient(0deg, transparent, var(--bg2) 20%); 15 | 16 | &:has(.obsidian-sticky-heading_inner:not(:empty)) { 17 | padding:8px 0 16px 0; 18 | } 19 | 20 | .obsidian-sticky-heading_inner { 21 | background:transparent; 22 | 23 | .HyperMD-header { 24 | margin-top:0 !important; 25 | margin-bottom:0 !important; 26 | 27 | /* second item */ 28 | + .HyperMD-header { 29 | padding:0 !important; 30 | 31 | h1, h2, h3, h4, h5, h6 { 32 | font-size:14px; 33 | } 34 | } 35 | 36 | /* Hide 3rd onwards items */ 37 | + .HyperMD-header ~ .HyperMD-header { 38 | display:none; 39 | } 40 | 41 | .cm-header[class*=cm-header-] { 42 | margin-top:0 !important; 43 | margin-bottom:0 !important; 44 | } 45 | } 46 | } 47 | 48 | .obsidian-sticky-heading_text { 49 | margin-top:0; 50 | 51 | h1, h2, h3, h4, h5, h6 { 52 | font-size:18px; 53 | } 54 | } 55 | 56 | 57 | /* Hide the H* level text */ 58 | .obsidian-sticky-heading_level { 59 | /* color: transparent; */ 60 | display:none; 61 | 62 | /* &::before { 63 | content:'›'; 64 | color: var(--tx2); 65 | display:block; 66 | position:absolute; 67 | right:0; 68 | top:50%; 69 | transform: translateY(-50%); 70 | font-size:1rem 71 | } */ 72 | } 73 | } -------------------------------------------------------------------------------- /[user] Daily Note styles.css: -------------------------------------------------------------------------------- 1 | /* 2 | Note styles: Daily Note template-specific styles 3 | Requires `cssclass dailynote` in note YAML frontmatter 4 | https://github.com/replete/obsidian-minimal-theme-css-snippets 5 | */ 6 | 7 | 8 | .dailynote { 9 | 10 | &.cm-content.is-live-preview > div:nth-of-type(4) { 11 | margin-bottom:15px !important; 12 | } 13 | 14 | &.is-live-preview { 15 | 16 | /* Blockquote styles (I only use blockquotes in my daily note for actual quotes) */ 17 | .HyperMD-quote { 18 | font-family: Book Antiqua,Palatino,Palatino Linotype,Palatino LT STD,Georgia,serif; 19 | letter-spacing:0.01em; 20 | 21 | .cm-quote.cm-hmd-internal-link { 22 | color:var(--tx2); 23 | font-style:italic; 24 | opacity:0.7; 25 | 26 | > * { 27 | color:var(--tx2); 28 | text-decoration: none !important 29 | } 30 | 31 | &::before { 32 | content:'—' 33 | } 34 | } 35 | } 36 | 37 | /* h2 styles */ 38 | .cm-header-2 { 39 | font-size:20px !important; 40 | letter-spacing: 0.05em; 41 | color:var(--tx2) !important; 42 | text-transform:uppercase; 43 | } 44 | 45 | /* h3 styles */ 46 | .cm-header-3 { 47 | font-size:18px !important; 48 | letter-spacing: 0.05em; 49 | color:var(--tx2) !important; 50 | text-transform:uppercase; 51 | } 52 | 53 | /* h4 styles */ 54 | .cm-header-4 { 55 | font-size:16px !important; 56 | color:var(--tx3) !important; 57 | text-transform:uppercase; 58 | letter-spacing:0.1em; 59 | font-weight:600; 60 | } 61 | &:not(.is-live-preview) .cm-header-4, 62 | .cm-focused .cm-active .cm-header-4 { 63 | text-transform:none !important 64 | } 65 | .HyperMD-header-4 { 66 | padding-top:0 !important; 67 | padding:.4em 0 !important; 68 | 69 | .cm-task-progress-bar:has(.progress-bar-inline-4)::after { 70 | color:var(--tx3) 71 | } 72 | } 73 | 74 | /* h5 styles */ 75 | .cm-header-5 { 76 | font-size:13px !important; 77 | color:var(--tx3) !important; 78 | text-transform:uppercase; 79 | /* font-weight:400; */ 80 | /* letter-spacing:0.1em; */ 81 | } 82 | &:not(.is-live-preview) .cm-header-5, 83 | .cm-focused .cm-active .cm-header-5 { 84 | text-transform:none !important; 85 | letter-spacing:0; 86 | } 87 | .HyperMD-header-5 { 88 | padding-top:0 !important; 89 | 90 | .cm-task-progress-bar { 91 | transform:scale(0.7); 92 | transform-origin:0; 93 | 94 | &:has(.progress-bar-inline-4)::after { 95 | color:var(--tx3) 96 | } 97 | } 98 | } 99 | 100 | /* h6 styles */ 101 | .cm-header-6 { 102 | font-size:16px !important; 103 | font-family: Book Antiqua,Palatino,Palatino Linotype,Palatino LT STD,Georgia,serif; 104 | font-weight: 300; 105 | font-style:italic; 106 | color:var(--tx2) !important; 107 | } 108 | .HyperMD-header-6 { 109 | /* font-variant:normal; 110 | font-weight:bold; */ 111 | .cm-task-progress-bar { 112 | display:none; /* hide on h6 */ 113 | transform:scale(0.7); 114 | transform-origin:0; 115 | 116 | &:has(.progress-bar-inline-4)::after { 117 | color:var(--tx3) 118 | } 119 | } 120 | } 121 | 122 | /* fold placeholder */ 123 | .HyperMD-header .cm-foldPlaceholder { 124 | display:none; 125 | } 126 | 127 | /* Callouts */ 128 | .callout { 129 | padding:.5em .75em; 130 | 131 | .callout-content { 132 | ul { 133 | padding-left:0; 134 | } 135 | 136 | /* Callouts task list fix */ 137 | li[data-task] { 138 | padding-inline-start:var(--list-indent); 139 | 140 | .task-list-item-checkbox { 141 | margin-left: -22px; 142 | transform: translate(-4px, 0) 143 | } 144 | } 145 | } 146 | } 147 | 148 | /* Task progressbar style */ 149 | .cm-task-progress-bar { 150 | box-shadow:inset 1.5px 2px 3px -2px rgba(0,0,0,.5), 151 | 1px 1px 2px -2px rgba(255,255,255,.5); 152 | border-radius:10px; 153 | } 154 | 155 | /* Fix task progressbar for elements */ 156 | .HyperMD-header-1 .cm-task-progress-bar { 157 | transform:translate(0, -3px) !important 158 | } 159 | .HyperMD-header-2 .cm-task-progress-bar { 160 | transform:translate(0, -2px) !important 161 | } 162 | .HyperMD-header-4 .cm-task-progress-bar { 163 | transform: translate(0, -2px) scale(0.8); 164 | transform-origin: 0 165 | } 166 | 167 | .HyperMD-list-line .cm-task-progress-bar { 168 | transform: translate(0, -7px) scale(0.8); 169 | transform-origin: 0 170 | } 171 | 172 | /* Callout */ 173 | 174 | .cm-callout { 175 | 176 | .callout-content { 177 | font-family: Book Antiqua,Palatino,Palatino Linotype,Palatino LT STD,Georgia,serif !important; 178 | } 179 | } 180 | 181 | 182 | /* Embedded markdown files - containers */ 183 | .inline-embed { 184 | border:none; 185 | background: hsla(var(--base-h), var(--base-s), calc(var(--base-l) - 10%), 0.5); 186 | padding-top: var(--size-4-6); 187 | padding-bottom: var(--size-4-6); 188 | padding-right: calc(var(--size-4-6) * 1.5); 189 | padding-left: calc(var(--size-4-6) * 1); 190 | --font-text: Book Antiqua,Palatino,Palatino Linotype,Palatino LT STD,Georgia,serif; 191 | --line-height: 1.6; 192 | letter-spacing:0.01em; 193 | 194 | .embed-title { 195 | display:none; 196 | } 197 | .markdown-embed-link { 198 | width:1.5rem; 199 | height:1.5rem; 200 | position:absolute; 201 | right:5px; 202 | top:5px; 203 | } 204 | 205 | /* Specific sections: */ 206 | &:has(:is( 207 | [data-heading=Errors], 208 | [data-heading=Reflect]) 209 | ) { 210 | .mod-header + [data-heading] {display:none} 211 | .has-list-bullet {margin-top:5px} 212 | .el-ul:has(.contains-task-list) {display:none} 213 | } 214 | 215 | :is(h1) { 216 | text-align: center; 217 | } 218 | 219 | &[src*='The Daily Laws'] { 220 | :is(h2) { 221 | text-align: center; 222 | font-family:var(--font-default); 223 | text-transform:uppercase; 224 | letter-spacing: 0.05rem; 225 | font-size: 16px; 226 | opacity:0.7; 227 | } 228 | :is(h3) { 229 | margin:2rem 0 1rem; 230 | } 231 | } 232 | 233 | } 234 | .file-embed.mod-empty, 235 | .file-embed.mod-empty-attachment { 236 | border-radius:0; 237 | background:transparent; 238 | text-align:left; 239 | font-style: italic; 240 | color: var(--tx3); 241 | padding-left:0; 242 | 243 | &:hover { 244 | color:var(--link-color); 245 | } 246 | } 247 | 248 | /* Embedded markdown files - content */ 249 | .markdown-embed-content { 250 | 251 | .markdown-preview-sizer[style] { 252 | 253 | /* fix min-height being too large, to fit content better */ 254 | min-height:auto !important; 255 | } 256 | 257 | /* p */ 258 | :is(p) { 259 | /* margin-bottom:0; */ 260 | margin-block-end: 1rem; 261 | } 262 | 263 | [data-heading] { 264 | margin-top:0; 265 | 266 | &:is(h6) { 267 | margin-bottom: 0; 268 | color:var(--tx2) !important; 269 | font-style:italic; 270 | font-weight:400; 271 | font-size:15px; 272 | } 273 | } 274 | } 275 | 276 | /* Hide code blocks until hover */ 277 | .cm-preview-code-block .edit-block-button { 278 | display:none !important; 279 | } 280 | .cm-preview-code-block:hover .edit-block-button { 281 | display:block !important; 282 | } 283 | 284 | /* Style first footnote after page heading */ 285 | .HyperMD-header-1 + .HyperMD-footnote { 286 | text-indent:-7px; 287 | opacity:0.7; 288 | 289 | .cm-underline { 290 | color:var(--tx2); 291 | text-decoration: none; 292 | } 293 | } 294 | 295 | /* Table borders */ 296 | .table-wrapper { 297 | > table thead tr th { 298 | border:0; 299 | font-weight:normal; /* remove header styling */ 300 | } 301 | > table td { 302 | border-left:0 !important; 303 | border-right:0 !important; 304 | } 305 | > table tbody tr:last-child { 306 | border-bottom: 1px solid var(--table-border-color); 307 | } 308 | } 309 | 310 | /* Dataview styles */ 311 | .dataview { 312 | &.list-view-ul { 313 | margin-top:0; 314 | /* margin-bottom:0; */ 315 | } 316 | } 317 | } 318 | } 319 | 320 | /* Daily Note Outline tweaks */ 321 | /* Container */ 322 | .workspace-leaf-content[data-type="daily-note-outline"] .view-content { 323 | 324 | /* Disable inline preview */ 325 | .nav-file-title-preview { 326 | display:none; 327 | } 328 | 329 | /* h4 heading */ 330 | .tree-item-self[aria-label*='####'] { 331 | font-size:12px !important; 332 | color:var(--tx3) !important; 333 | text-transform:uppercase; 334 | letter-spacing:0.1em; 335 | font-weight:600; 336 | } 337 | 338 | /* h5 heading */ 339 | .tree-item-self[aria-label*='#####'] { 340 | font-size:12px !important; 341 | color:var(--tx3) !important; 342 | text-transform:uppercase; 343 | letter-spacing:0.1em; 344 | font-weight:600; 345 | } 346 | 347 | /* h4 heading */ 348 | .tree-item-self[aria-label*='######'] { 349 | font-size:13px !important; 350 | font-family: Book Antiqua,Palatino,Palatino Linotype,Palatino LT STD,Georgia,serif; 351 | font-weight: 400; 352 | font-style:italic; 353 | color:var(--tx3) !important; 354 | letter-spacing:0; 355 | text-transform:none; 356 | } 357 | } 358 | -------------------------------------------------------------------------------- /[user] Lighter Banner images.css: -------------------------------------------------------------------------------- 1 | /* 2 | user: Banner colour tweaks 3 | https://github.com/replete/obsidian-minimal-theme-css-snippets 4 | */ 5 | 6 | /* Improve visibility on light themes */ 7 | .theme-light .mk-note-header img { 8 | opacity:0.5 !important; 9 | } -------------------------------------------------------------------------------- /[user] Scratchpad styles.css: -------------------------------------------------------------------------------- 1 | /* 2 | Note styles: Scratchpad 3 | Requires `cssclass scratchpad` in note YAML frontmatter 4 | https://github.com/replete/obsidian-minimal-theme-css-snippets 5 | */ 6 | 7 | 8 | /* h2 styles */ 9 | .scratchpad .cm-header-1 { 10 | font-size:13px !important; 11 | letter-spacing: 0.05em; 12 | color:var(--tx2) !important; 13 | text-transform:uppercase; 14 | line-height:1em !important; 15 | } 16 | -------------------------------------------------------------------------------- /[user] Themed colours.css: -------------------------------------------------------------------------------- 1 | /* 2 | Theme colours 3 | https://github.com/replete/obsidian-minimal-theme-css-snippets 4 | */ 5 | 6 | .theme-dark.minimal-default-dark { 7 | /* --accent-h:181 !important; */ 8 | /* --accent-s:37% !important; */ 9 | /* --accent-l:71% !important; */ 10 | } 11 | 12 | .theme-dark.minimal-atom-dark { 13 | --accent-h:193 !important; 14 | /* --accent-s:46 !important; */ 15 | /* --accent-l:50 !important; */ 16 | } 17 | 18 | .theme-dark.minimal-ayu-dark { 19 | --accent-h:203 !important; 20 | --accent-s:49% !important; 21 | --accent-l:70% !important; 22 | } 23 | 24 | .theme-dark.minimal-catppuccin-dark { 25 | --accent-h:207 !important; 26 | --accent-s:65% !important; 27 | --accent-l:70% !important; 28 | } 29 | 30 | .theme-dark.minimal-dracula-dark { 31 | --accent-h:215 !important; 32 | --accent-s:60% !important; 33 | -accent-l:71% !important; 34 | } 35 | 36 | .theme-dark.minimal-everforest-dark { 37 | --accent-h:145 !important; 38 | --accent-s:27% !important; 39 | --accent-l:61% !important; 40 | 41 | --text-selection:hsla(var(--accent-h),var(--accent-s),calc(var(--accent-l) - 5%),0.2); 42 | } 43 | 44 | .theme-dark.minimal-gruvbox-dark { 45 | --accent-h:121 !important; 46 | --accent-s:37% !important; 47 | --accent-l:71% !important; 48 | } 49 | 50 | .theme-dark.minimal-nord-dark { 51 | --accent-h:205 !important; 52 | --accent-s:77% !important; 53 | --accent-l:76% !important; 54 | } 55 | 56 | .theme-dark.minimal-rose-pine-dark { 57 | --accent-h:2400 !important; 58 | --accent-s:37% !important; 59 | --accent-l:65% !important; 60 | } 61 | 62 | .theme-dark.minimal-solarized-dark { 63 | --accent-h:185 !important; 64 | --accent-s:37% !important; 65 | --accent-l:51% !important; 66 | } 67 | 68 | .theme-light.minimal-atom-light { 69 | --accent-h:195 !important; 70 | --accent-s:47% !important; 71 | --accent-l:65% !important; 72 | } 73 | 74 | .theme-light.minimal-ayu-light { 75 | /* --accent-h:210 !important; 76 | --accent-s:47% !important; 77 | --accent-l:75% !important; */ 78 | } 79 | 80 | .theme-light.minimal-catppuccin-light { 81 | --accent-h:225 !important; 82 | --accent-s:47% !important; 83 | --accent-l:70% !important; 84 | } 85 | 86 | .theme-light.minimal-everforest-light { 87 | --accent-h:175 !important; 88 | --accent-s:27% !important; 89 | --accent-l:54% !important; 90 | } 91 | 92 | .theme-light.minimal-gruvbox-light { 93 | --accent-h:165 !important; 94 | --accent-s:20% !important; 95 | --accent-l:54% !important; 96 | } 97 | 98 | .theme-light.minimal-macos-light { 99 | --accent-h:205 !important; 100 | --accent-s:40% !important; 101 | --accent-l:64% !important; 102 | } 103 | 104 | .theme-light.minimal-nord-light { 105 | --accent-h:225 !important; 106 | --accent-s:37% !important; 107 | --accent-l:66% !important; 108 | } 109 | 110 | .theme-light.minimal-notion-light { 111 | --accent-h:190 !important; 112 | --accent-s:37% !important; 113 | --accent-l:64% !important; 114 | } 115 | 116 | .theme-light.minimal-rose-pine-light { 117 | --accent-h:20 !important; 118 | --accent-s:30% !important; 119 | --accent-l:70% !important; 120 | } 121 | 122 | .theme-light.minimal-solarized-light { 123 | --accent-h:20 !important; 124 | --accent-s:35% !important; 125 | --accent-l:68% !important; 126 | } 127 | 128 | .theme-light.minimal-things-light { 129 | --accent-h:225 !important; 130 | --accent-s:40% !important; 131 | --accent-l:70% !important; 132 | } -------------------------------------------------------------------------------- /dummy.css: -------------------------------------------------------------------------------- 1 | /* This is a dummy CSS file used to defeat some weird obsidian layout bug I am getting */ -------------------------------------------------------------------------------- /screenshots/accents.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/accents.gif -------------------------------------------------------------------------------- /screenshots/calendar.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/calendar.png -------------------------------------------------------------------------------- /screenshots/cardboard.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/cardboard.png -------------------------------------------------------------------------------- /screenshots/checklist.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/checklist.png -------------------------------------------------------------------------------- /screenshots/collapsible-header.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/collapsible-header.gif -------------------------------------------------------------------------------- /screenshots/compact-file-explorer-new.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/compact-file-explorer-new.png -------------------------------------------------------------------------------- /screenshots/compact-file-explorer.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/compact-file-explorer.png -------------------------------------------------------------------------------- /screenshots/compact-properties.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/compact-properties.gif -------------------------------------------------------------------------------- /screenshots/compact-sidebar-footer.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/compact-sidebar-footer.png -------------------------------------------------------------------------------- /screenshots/compact-sidebar-header.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/compact-sidebar-header.png -------------------------------------------------------------------------------- /screenshots/compact-tab-header-plus.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/compact-tab-header-plus.png -------------------------------------------------------------------------------- /screenshots/compact-tab-header.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/compact-tab-header.png -------------------------------------------------------------------------------- /screenshots/compact-tabs-classic.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/compact-tabs-classic.png -------------------------------------------------------------------------------- /screenshots/compact-tabs.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/compact-tabs.png -------------------------------------------------------------------------------- /screenshots/custom-frames-duotone.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/custom-frames-duotone.png -------------------------------------------------------------------------------- /screenshots/custom-separators-gradient.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/custom-separators-gradient.png -------------------------------------------------------------------------------- /screenshots/custom-separators.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/custom-separators.png -------------------------------------------------------------------------------- /screenshots/custom-tags.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/custom-tags.png -------------------------------------------------------------------------------- /screenshots/daily-note-outline.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/daily-note-outline.png -------------------------------------------------------------------------------- /screenshots/dailynote-sticky.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/dailynote-sticky.png -------------------------------------------------------------------------------- /screenshots/dayplanner-ivanlednev.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/dayplanner-ivanlednev.png -------------------------------------------------------------------------------- /screenshots/dayplanner.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/dayplanner.png -------------------------------------------------------------------------------- /screenshots/dbfolder.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/dbfolder.png -------------------------------------------------------------------------------- /screenshots/excalidraw-compact.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/excalidraw-compact.png -------------------------------------------------------------------------------- /screenshots/excel.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/excel.png -------------------------------------------------------------------------------- /screenshots/file-explorer-folder-icons.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/file-explorer-folder-icons.png -------------------------------------------------------------------------------- /screenshots/file-explorer-header-autohide.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/file-explorer-header-autohide.gif -------------------------------------------------------------------------------- /screenshots/floating-tab-header-mini.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/floating-tab-header-mini.gif -------------------------------------------------------------------------------- /screenshots/floating-tab-header.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/floating-tab-header.gif -------------------------------------------------------------------------------- /screenshots/makemd-duotone-fade-2025.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/makemd-duotone-fade-2025.png -------------------------------------------------------------------------------- /screenshots/makemdcontexts.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/makemdcontexts.png -------------------------------------------------------------------------------- /screenshots/makemdcontextsautohide.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/makemdcontextsautohide.gif -------------------------------------------------------------------------------- /screenshots/makemdcontextsbannerduotone.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/makemdcontextsbannerduotone.png -------------------------------------------------------------------------------- /screenshots/makemdcontextsbannergradient.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/makemdcontextsbannergradient.png -------------------------------------------------------------------------------- /screenshots/makemdinlinecontexts.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/makemdinlinecontexts.gif -------------------------------------------------------------------------------- /screenshots/monoemojis.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/monoemojis.png -------------------------------------------------------------------------------- /screenshots/mysnippets.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/mysnippets.png -------------------------------------------------------------------------------- /screenshots/mysnippets_tweaks.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/mysnippets_tweaks.png -------------------------------------------------------------------------------- /screenshots/omnisearch.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/omnisearch.png -------------------------------------------------------------------------------- /screenshots/outline.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/outline.png -------------------------------------------------------------------------------- /screenshots/quietoutline.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/quietoutline.png -------------------------------------------------------------------------------- /screenshots/restrict-last-right-sidebar-panel.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/restrict-last-right-sidebar-panel.png -------------------------------------------------------------------------------- /screenshots/screenshot.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/screenshot.png -------------------------------------------------------------------------------- /screenshots/sheets-plus.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/sheets-plus.png -------------------------------------------------------------------------------- /screenshots/smart2ndbrain.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/smart2ndbrain.png -------------------------------------------------------------------------------- /screenshots/tab-header-bottom.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/tab-header-bottom.png -------------------------------------------------------------------------------- /screenshots/tab-header-translucent.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/tab-header-translucent.png -------------------------------------------------------------------------------- /screenshots/taskprogressbars.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/taskprogressbars.png -------------------------------------------------------------------------------- /screenshots/tasks-compact.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/tasks-compact.gif -------------------------------------------------------------------------------- /screenshots/tasks-dates-on-hover.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/tasks-dates-on-hover.gif -------------------------------------------------------------------------------- /screenshots/tasks-icons-lucide2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/tasks-icons-lucide2.png -------------------------------------------------------------------------------- /screenshots/top-fade.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/top-fade.png -------------------------------------------------------------------------------- /screenshots/typography-fixes.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/typography-fixes.png -------------------------------------------------------------------------------- /screenshots/ultra-compact.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/ultra-compact.png -------------------------------------------------------------------------------- /screenshots/ultra.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/replete/obsidian-minimal-theme-css-snippets/6becd6e5a38cc3f3e05206f889fb95ff034a4de0/screenshots/ultra.png --------------------------------------------------------------------------------