First of all amazing work, my top favorite theme for Obsidian!
I started to make a few tweaks to your theme and would like to share with you and other users tha might like it.
How it looks like with my css tweaks:
(in order to work must set the backgorund container opacity to 0)
This css include a few tweakes to banner plugin and DBfolder too.
I'm not a pro in css and for sure there are many improvments to be made.
Feel free to use and maybe, if worth it, we could see this in a future update!
thank you so much for your theme!
css tweaks:
(I'm using a cssclass to change note width, this in conjunction with meta bin plugin, which allow to have a toggle to change in between wide or narrow.)
`
/ change note width - meant to be used with meta bin plugin/
.wide {
--file-line-width: 100%;
}
.narrow {
--file-line-width: 900px;
}
Hi!
First of all amazing work, my top favorite theme for Obsidian!
I started to make a few tweaks to your theme and would like to share with you and other users tha might like it.
How it looks like with my css tweaks:
(in order to work must set the backgorund container opacity to 0)
This css include a few tweakes to banner plugin and DBfolder too.
I'm not a pro in css and for sure there are many improvments to be made.
Feel free to use and maybe, if worth it, we could see this in a future update!
thank you so much for your theme!
css tweaks:
(I'm using a cssclass to change note width, this in conjunction with meta bin plugin, which allow to have a toggle to change in between wide or narrow.)
` / change note width - meant to be used with meta bin plugin/ .wide { --file-line-width: 100%; } .narrow { --file-line-width: 900px; }
/ window button background transparent: close, maximize, minimize button/ .titlebar-button-container.mod-right { background-color: transparent !important; }
/ adapted banners plugin to the width of the note / .obsidian-banner { left: 0; right: 0; width: var(--file-line-width)!important; margin-left: auto !important; margin-right: auto !important; border-radius: 5px 5px 0px 0px !important; }
/ expand collapse folder menu trick someone did this not me, but it works! / .workspace-split.mod-left-split { --right-anchor-position: 0; --width-delay: 15ms; display: flex !important; contain: layout; flex: none; transform: translateX(calc(var(--right-anchor-position) * 1px)); }
.workspace-split.mod-left-split:not(.is-sidedock-collapsed) { --right-anchor-position: 0; transition: width 200ms var(--width-delay), --right-anchor-position 224ms !important; / background-color:var(--background-secondary)!important; / }
.workspace-split.mod-left-split.is-sidedock-collapsed { --right-anchor-position: -299.5; transition: width 140ms, --right-anchor-position 275ms var(--width-delay) !important; }
@property --right-anchor-position { syntax: "";
inherits: true;
initial-value: 0;
}
/ file explorer background/ .workspace-leaf-content[data-type="file-explorer"] { background-color: var(--background-secondary); border-radius: 4px; }
/ color when folder menu is collapsed / .workspace-ribbon.mod-left.is-collapsed { background-color: transparent !important; }
/ background color when folder menu is expanded / .workspace-ribbon { background-color: var(--background-secondary) !important; }
/ background bookmarks backgeound/ .workspace-leaf-content[data-type=bookmarks] { background-color: var(--background-secondary) !important; }
/ search background/ .workspace-leaf-content[data-type=search]{ background-color: var(--background-secondary) !important; }
/ DBFOLDER: adjustments/ .database-plugintable { background-color: var(--background-modifier-border)!important; padding: 10px; border-radius: 4px; } / change margins like defaults documents / .database-plugincontainer { padding: 0px var(--file-margins) ; } / search bar and buttons transparent/ .css-1xfvyax{ background-color: transparent !important; } / headers transparent / .database-pluginth { background-color: transparent !important; } / transparent rows / .database-plugintd{ background-color: transparent !important; } / transparent bottom / .database-plugin__tr{ background-color: transparent !important; }
/ READABLE NOTES TWEAK / .markdown-preview-view { padding: 0px; } /for source view/ .view-content > .markdown-source-view.mod-cm6 > .cm-editor > .cm-scroller { padding: 0px; } .markdown-preview-view.is-readable-line-width .markdown-preview-sizer { background-color: var(--background-secondary) !important; padding: var(--file-margins); opacity: 0.95; border-radius: 5px 5px 0px 0px !important; } /for source view/ .markdown-source-view.mod-cm6.is-readable-line-width .cm-sizer { background-color: var(--background-secondary) !important; padding: var(--file-margins); opacity: 0.95; border-radius: 5px 5px 0px 0px !important; }
/ text not active tab/ .workspace-tab-header-inner-title{ color: var(--color-accent) !important; }
.clickable-icon { color: var(--color-accent) !important; } .workspace-tab-header-inner-icon{ color: var(--color-accent) !important; }
/ right tab container/ .workspace-leaf-content[data-type='outline'] { background-color: var(--background-secondary) !important; }
.workspace-leaf-content[data-type='tag'] { background-color: var(--background-secondary) !important; }
.workspace-leaf-content[data-type='backlink'] { background-color: var(--background-secondary) !important; }
.workspace-leaf-content[data-type='outgoing-link'] { background-color: var(--background-secondary) !important; }
`