#557

Thanks for your answer. I solved it by replacing the use of CSS snippets with Florian Woelker’s ‘Icon Folder’ plugin. Go try it, recommended.

1 Like
#558

I couldnt make it run :frowning: I loved t but

#559

I don’t use it anymore and it’s probably been broken with changes in Obsidian. I’ll give it a look if I find time for that.

1 Like
#560

Hello all! I have been fiddling around with a way to change the symbol for bullet points based on indent in live preview, and I finally figured something out. Thought I’d share it with the community:

.mod-cm6 span.cm-list-1 span.list-bullet::after {
    content: "•"; 
}

.mod-cm6 span.cm-list-2 span.list-bullet::after {
    content: "◦";
}

.mod-cm6 span.cm-list-3 span.list-bullet::after {
    content: "▪"; 
}

Here is an example of it in use (along with indent lines from this plugin).

image

4 Likes
#561

I had the same problem. I am ok with CSS and spent WAY too much time trying to figure it out. Turns out it is not the CSS. It is the Theme that you are using. If you switch you theme to Atom, you will see that the tag-pills look like the image. Bummer because I don’t want to switch my favorite theme just to get this to work.

BTW, Thank you @uzerper for your modified tag-pill code. It works great!

1 Like
#562

if I wanted to reduce the padding around a bunch of elements, what would be the best way? I’m trying to tighten up everything as much as I can for.

I’ve hodge podge some clips from the minimal theme but it even misses some padding I’ve isolated in a very ugly css snippet. I’m flying blind tbh. I know enough to get in trouble.

seems like there would be a global setting maybe? thanks in advance

#563

@kleerkoat the minimum padding size is 0 (zero). Padding cannot go negative like a margin can.

If you already know this I apologize.

#564

thank you, no worries at all. I’m pretty comfortable with obsidian and tweaking little css values.

I guess my biggest issue is opening the dev console and pic around the gui til I hopefully get the element. I was hoping for maybe a universal value.

thank you

#565

Anyone know how to select the dataview table heading line in css?

#566

This?

.table-view-table > thead > tr > th {
    font-weight: 700;
    font-size: 1.6em;
    font-style: italic;
    border-top: none;
    border-left: none;
    border-right: none;
    border-bottom: solid;
    max-width: 100%;
}

Angel

#567

unfortunately not :confused:

I tried:

tr {
border: red 1px solid;
}

and got this:

Screenshot 2022-02-17 at 15.47.42
Screenshot 2022-02-17 at 15.47.421558×256 21.8 KB

same result with table-view-table {}

#570

image
image878×227 10.2 KB 


/***************************************/
h2:after{
	content: '2';
	margin: .7em;
	Color: #EDEDED;
	/* font-family: 'Dancing Script', cursive;*/
	font-size: 10px;
	position: relative ;
	top: -16px;
	left: 10px;
}


h3:after{
	content: '3';
	margin: .7em;
	Color: #EDEDED;
	font-size: 10px;
	position: relative;
	top: -15px;
	left: 10px;
}


h4:after{
	content: '4';
	margin: .7em;
	Color: #EDEDED;
	font-size: 10px;
	position: relative ;
	top: -14px;
	left: 10px;
}


h5:after{
	content: '5';
	margin: .7em;
	Color: #EDEDED;
	font-size: 10px;
	position: relative ;
	top: -12px;
	left: 10px;
}


h6:after{
	content: '6';
	margin: .7em;
	Color: #EDEDED;
	font-size: 10px;
	position: relative ;
	top: -11px;
	left: 10px;
}

/***************************************/
/*         Source mode           */


.HyperMD-header.HyperMD-header-2.cm-line{
}

.HyperMD-header.HyperMD-header-2.cm-line:after{
	content: ' 2';
	margin: .7em;
	Color: #EDEDED;
	/* font-family: 'Dancing Script', cursive;*/
	font-size: 10px;
	position: relative ;
	top: -16px;
	left: 10px;
}

.HyperMD-header.HyperMD-header-3.cm-line{
}
.HyperMD-header.HyperMD-header-3.cm-line:after{
	content: '3';
	margin: .7em;
	Color: #EDEDED;
	font-size: 10px;
	position: relative;
	top: -15px;
	left: 10px;
}

.HyperMD-header.HyperMD-header-4.cm-line{
}
.HyperMD-header.HyperMD-header-4.cm-line:after{
	content: '4';
	margin: .7em;
	Color: #EDEDED;
	font-size: 10px;
	position: relative ;
	top: -14px;
	left: 10px;
}

.HyperMD-header.HyperMD-header-5.cm-line{
}

.HyperMD-header.HyperMD-header-5.cm-line:after{
	content: '5';
	margin: .7em;
	Color: #EDEDED;
	font-size: 10px;
	position: relative ;
	top: -12px;
	left: 10px;
}

.HyperMD-header.HyperMD-header-6.cm-line{
}
.HyperMD-header.HyperMD-header-6.cm-line:after{
	content: '6';
	margin: .7em;
	Color: #EDEDED;
	font-size: 10px;
	position: relative ;
	top: -11px;
	left: 10px;
}

/***************************************/
#571

Can you zoom in on the image after hovering for a second?

#572

Hello there! I’m a newbie with Obsidian and I also love justified text 'cos I find it’s more readable, where should I put the “text-align” snippet? I guess in my theme css but don’t know how could somebody help me at dummies level? Thx!

1 Like
#573

@nestorito it depends on which element of the theme you want to justify the text of, e.g. a blockquote, aside note, etc.

So, then you define the class (e.g. .aside) and set text-align: justify;

#574

Did you ever figure out a solution to this? Maybe another plugin? I’m trying to embed goals into other notes, but it’s not a good solution for me if there’s a big empty box surrounding every embedded text.

1 Like
#575

hello Klaas, been out for a while so sorry for not answering. Actually I’d like to have justified text in every text which is body text but I’m a CSS-dummy: how can I set/modify my theme to have justified text as default text-align property for body? Thx!

#576

You have not mentioned if you want it for the Edit/Live Preview mode, or for Reading mode, or for both.

Here is the code for both Edit (= CM5) and Reading mode:

.cm-s-obsidian, .markdown-preview-view {
  text-align: justify;
  hyphens: auto;
}

If, instead of Edit/CM5 you want Live Preview/CM6, you can replace .cm-s-obsidian by .markdown-source-view.mod-cm6.is-live-preview.

Having said that (last paragraph), it might not be sufficient (I have not checked), in which case you might also have to add the .cm-s-obsidian.

1 Like
#577

Thanks a lot @Klaas I’ll have a look!

#578

Text alignment with links, images, formatting using markdown, etc.