Comments (6)
That worked. Thank you very much.
from obsidian-theme-mado-miniflow.
Do you mind sharing your snippets over here? I can try to test the snippets and see what I can help out with.
from obsidian-theme-mado-miniflow.
Sure.
I made some modifications to the color scheme and added some comments for me.
Most of the variables are defined in another .css file.
I also made everything bold, as I find it easier to read with Lexend Deca font.
Please be aware, I have no clue about css, I just copy trial and error 😅
body{
/* --accent-h: 210; */
/* --accent-s: 93%; */
/* --accent-l: 62%; */
--accent-h: 254;
--accent-s: 80%;
--accent-l: 68%;
--titlebar-background:var(--background-secondary);
--titlebar-background-focused:var(--background-secondary);
--background-modifier-hover:var(--color-base-hover);
--bold-weight:var(--font-bold);
--italic-color:var(--text-muted);
--code-normal:var(--text-muted);
--blockquote-color:var(--color-muted);
--background-primary:var(--color-base-00);
--background-secondary:var(--color-base-20);
--checklist-done-color:var(--color-base-50);
--icon-m:20px;
--icon-l:20px;
--divider-width: 4px;
/* --callout-padding:17px 17px; */
/* --callout-content-padding:0 12px 0 27px; */
/* --embed-padding:13px 23px; */
/* --list-indent:37px; */
--header-height:43px;
--tab-stacked-header-width:53px;
/* custom */
--border:0px solid var(--tab-outline-color);
--button-radius:4px;
--panel-radius:8px;
--window-radius:23px;
--button-padding-icon:7px;
--button-padding-long:7px 15px;
--background-fourth:var(--color-base-00-0);
--background-fifth:var(--color-base-20-0);
--panel-shadow:0 1px 3px var(--color-base-shadow);
--panel-shadow-hover:0 3px 5px var(--color-base-shadow-hover);
--window-shadow:0 0 9px var(--color-base-shadow-hover);
--window-shadow-left:-4px 0 5px var(--color-base-shadow-hover);
--window-shadow-right:4px 0 5px var(--color-base-shadow-hover);
--sidebar-size-left:270px;
--sidebar-size-right:270px;
--color-strikethrough:var(--text-faint);
--italic-color:var(--color-italic);
--inline-code-color:var(--color-red);
--indentation-guide-color: var(--sne-gold-trans3);
--button-padding-long: 5px 1px !important;
}
body.is-translucent{
--background-primary:var(--color-base-00-trans);
--background-secondary:var(--color-base-20-trans);
--background-fourth:var(--color-base-00-0-trans);
}
body.toggle-tab-height{
--header-height:35px;
}
.theme-dark,
.is-mobile.theme-dark,
.is-tablet.theme-dark{
--color-base-00: #242618; /* Hintergrund Hauptfenster */
--color-base-10: var(--sne-code); /* Code snippet Hintergrund */
--color-base-05: var(--sne-rahmen); /* zb. Hintergrundfarbe gehoverter Tabs */
--color-base-20: #1e2014; /* restlicher Hintergrund außenrum */
--color-base-00-trans:hsla(215, 17%, 19%, 0.5); /*for transparency background*/
--color-base-20-trans:hsla(214, 24%, 15%, 0.5);
--color-base-00-0:hsla(212, 17%, 22%, 0.9); /* very white */
--color-base-20-0:hsla(207, 10%, 10%, 0.1); /* hovered version for above */
--color-base-00-0-trans:hsla(212, 17%, 22%, 0.5);
--color-base-shadow:hsla(207, 10%, 10%, 0.1); /* shadow */
--color-base-shadow-hover:hsla(212, 17%, 0%, 0.3); /* shadow hover*/
--color-base-hover:var(--color-base-05); /* hover*/
--color-base-30: var(--sne-rahmen); /* horizontale Linie --- */
--color-base-35: #000000;
--color-base-40: var(--sne-rahmen); /* Rahmen um Modals, also zb. Settings Fenster */
--color-base-50: #126d0e; /* Bullet Points und nicht ausgewählte Tabs Text */
--color-base-70: #126d0e90; /* text-muted, so ziemlich alles, was sonst nicht ausgewählt ist */
--color-base-100: var(--sne-text); /* text-normal color */
--color-accent: hsl(calc(var(--accent-h) - 0), calc(var(--accent-s) + 13%), calc(var(--accent-l) + 3%));
--color-accent-1: #;
--color-accent-2: hsl(calc(var(--accent-h) - 0), calc(var(--accent-s) + 7%), calc(var(--accent-l) + 2%));
--color-red:hsla(365, 90%, 65%, 1); /* Code Snippet Text Farbe */
--color-muted: #126d0e99;
--color-italic:hsla(215, 33%, 60%, 1);
--color-highlight: #000000; /* for highlight text color */
--text-highlight-bg: #000000; /* for highlight text underline color */
--text-on-accent: var(--sne-gold-trans);
}
.theme-dark:is(.THT-background,.THT-underline-light){
--color-highlight: #000000;
}
/* Gap inbetween panes */
.workspace-split.mod-vertical.mod-root,
.workspace-split.mod-vertical.mod-root .workspace-split:not(.mod-horizontal){
gap:14px;
}
/* Abstand Note zu rechter Rand */
body:not(.is-mobile) .workspace:not(.is-right-sidedock-open) .workspace-split.mod-vertical.mod-root {
padding-right: 14px;
height: auto;
}
/* Abstand Note Inhalt zum Header */
.ͼ1 .cm-scroller {
margin-top: -2em;
}
.clickable-icon {
color: var(--icon-color) !Important;
}
/*
----------------------------------
ALLES BOLD
--------------------------------------------------
*/
body *, .app-container * {
font-weight: bold;
}
/* ---- Dataview inline Queries in Überschriften nicht bold ---- */
.HyperMD-header > span,
.HyperMD-header > .dataview-inline > span {
font-weight: normal;
}
/* ---- Dataview inline Queries in Überschriften im Preview Popup nicht bold ---- */
:is(h1, h2, h3, h4, h5, h6) > .dataview-inline-query,
:is(h1, h2, h3, h4, h5, h6) > .dataview-inline-query > span {
font-weight: normal !Important;
}
/* --------- Supercharged Links in Headings nicht fett ------- */
.HyperMD-header > .cm-header > .data-link-text > span {
font-weight: normal !important;
}
/* -------------- Dataview Tables ----------------- */
.markdown-source-view.mod-cm6 .dataview.table-view-table .table-view-tbody td {
font-weight: bold;
}
/* ---------------- YAML nicht fett ---------------- */
.markdown-source-view .cm-hmd-frontmatter, code.language-yaml {
font-weight: normal !Important;
}
from obsidian-theme-mado-miniflow.
I think the problem lies on the specific character .ͼ1
that caused the whole css to stop working on a new window. Removing that helps apply the other styles to the new window successfully.
The forum post you have linked also has that character in it, by the way.
As for why it does that:
https://discuss.codemirror.net/t/why-does-cm6-use-the-character-in-class-names/2821
These are generated anonymous classes. You shouldn’t be typing them, because targeting them with CSS rules isn’t going to work—they aren’t stable across page loads.
So, for the solution, I'm not sure what you want to style with it, but try and change the following code:
/* Abstand Note Inhalt zum Header */
.ͼ1 .cm-scroller {
margin-top: -2em;
}
to
/* Abstand Note Inhalt zum Header */
.cm-scroller {
margin-top: -2em;
}
from obsidian-theme-mado-miniflow.
Hmm, ok, that worked for the most part.
There were still some styles not applied, because they were in other CSS files, which also contained .ͼ1
character.
While it did not seem to make any difference in the example above, the following example does not seem to work for me without the .ͼ1
character.
This is for Live Preview
.ͼ1 .cm-content {
width: 95% !Important;
max-width: 750px;
margin-left: auto;
margin-right: auto;
}
from obsidian-theme-mado-miniflow.
Try to put !important
on all of those 4 (and other elements that didn't work), that should work in most case.
.cm-content {
width: 95%!important;
max-width: 750px!important;
margin-left: auto!important;
margin-right: auto!important;
}
from obsidian-theme-mado-miniflow.
Related Issues (20)
- What the heck is Obsidian? HOT 2
- Zoom on hover or click HOT 6
- Right sidebar renders poorly with wide plugins HOT 3
- Theme Color from Style Settings not applied HOT 2
- about highlight-active-line HOT 2
- task lists are not aligned with headings HOT 2
- task lists are not aligned with headings
- Option to customize background colour HOT 3
- Where are this themes settings? HOT 2
- Canvas text is blurry when the Canvas is focused HOT 3
- [BUG] Color schemes don't seem to work HOT 2
- Question with left bar HOT 4
- Custom checboxes styles request HOT 4
- weird bug highlighting background HOT 4
- Opening Canvas Embedded PDFs in New Tab Fails HOT 2
- File Names Cut Off in Files Navigation Pane HOT 6
- H6 color is listed twice in style settings plugin. HOT 2
- FR: get mado-heading and other CSS features to work in LP mode HOT 1
- May I ask if it is possible to add features: Hidden Ribbon HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from obsidian-theme-mado-miniflow.