#15

glad you like the tweaks to the transclusions.
I also find it more useful and more pleasing to the eye this way.

Now I’m puzzled when you say:

You mean you ALWAYS see the file title ? in my case I can NOT see the file title when I transclude a section, it’s only displayed when I fully transclude a document. see example below (with the default obsidian theme).

Obsidian_j5rqsABjFx
Obsidian_j5rqsABjFx1294×950 94.1 KB

if you have 2 minutes to spare could you test the 2 files 202002-VSP.zip (592 Bytes) and post a screenshot for me please ?

#16

Oh no not always in the sense in every instance of transclusion, I mean for some notes I include the whole page, but my file title is big and annoying when I’m not trying to see all of that.

image
image1480×466 72 KB

It becomes particularly problematic for atomic notes that I may have.
image
image1524×617 64.5 KB

I could just make some compromises with the title, but in the case I end up changing them, I don’t want my note to rely on that as an identifier in transclusions.

#17

aah, now I understand better, thanks for the screenshots !

I has the same issue as you, hence the css tweaks included in my theme to make the title to look more like a reference link rather than a heading.
It’s also possible to hide the title completely :

.markdown-embed-title { 
    display : none
    }

but it might break the alignement of the elements depending on your custom theme.

Since obsidian will reflect the modification internally, it shouldn’t be a problem though ? I did a bunch of renaming from xx_yyyyMMddhhssMsec to actual titles and never had issues with lost links so far.

#18

I’ve pushed a small update to the css on 2020-06-30 :

  • fixed : location of the markdown-embed-link is now consistent when using ![[file]] and ![[file#section]]
  • tweaked margins of transclusions, more compact
  • transcluded file title should be sharper

(new version on the left side, previous on the right)

Obsidian_tDEMCmJiRj
Obsidian_tDEMCmJiRj1204×697 88.9 KB

in the previous version, when using ![[file#section]], the red link icon ended up being too high and there were small inconsistencies in element spacing. This should be fixed with the latest version : now the red icon is aligned with the text block.
the spacing between blocks has been reduced to enforce consistency.
The transcluded file title (the small blue link) should look sharper.

It should work well if you are using inline transclusions a lot.

You can grab it on Github.

Don’t forget to backup your custom tweaks before replacing the obsidian.css !!

3 Likes
#19

Thanks for that. 1 observation:

if I am not mistaken you had included the Andy Mode in the previous version, not in this one.

#20

@_ph Thanks for this theme and your work on it

[Off-topic]

To address this:

…do you by chance have any thoughts on this post/question about how to make css more modular?

#21

Hi!

I came over here from another thread, trying to find out how to modify my CSS to show the blue border on the embedded documents/sections.

I have a mixture of quite a few things in my CSS from different themes/snippets. I did copy all the tweaks under ==Transclusion Tweaks=== from GitHub, and played around with them (mostly to fix positions of things) but couldn’t find what selector adds the blue border on the left. Any hints?

Thanks!

Edit: I ended up finding the collisions, but just in case someone comes here after me the selector in question is (very obviously, duh me) .markdown-embed, specifically border-left , e.g. for me it ended up as border-left: 3px solid rgb(150,200,255);

#22

@randulfr : sorry for the late reply. see my post in the other topic

@argentum : glad you found what you were looking for. I’ve made minor revisions in the latest version of my theme to get a better preview layout (on the margins and paddings), maybe you’ll want to apply some of the tweaks too.

1 Like
#23

UPDATE 2020/07/10
important : press CTRL+R to refresh after switching from dark to light to avoid issues.

and :

  • snappier animation/transitions
  • inline transclusions : reduced the size of the link icons, small tweaks on margins/padding
  • small tweaks to Dark color scheme
  • reduced the size of icons on header title
  • navtab : smaller icons, colored icons, left justification
  • tags sidebar have smaller fonts
  • alignment and thickness of UI elements is more consistent

Obsdn-drk-rmx_DARK
Obsdn-drk-rmx_DARK1920×974 278 KB

3 Likes
#24

Nice, it’s an improvement on the previous version.

Couple of points:

  1. why red dots for the graph view instead of the blue dots that were more in tune with the base colour of the theme?
  2. in the screenshot there is the word Tansclusion instead of T r ansclusion.

Why do you not have it added to the community themes?

#25

beautiful, thank you @_ph :+1:

#26

@Klaas :

  1. I just like the contrast between the red and blue :slight_smile: but you can change the color around line 405:
.graph-view.color-fill {
	color: var(--accent-strong);

replace var(--accent-strong); with var(--text-accent); for the blue tone (or with var(--text-muted); for the neutral gray)

  1. thanks, I’ve corrected it and hanged the pictures
  2. actually @Silver added it to the community themes a couple of days ago… I should have waited for this update to get a nicer screenshot though, but I wasn’t really planning to do the light version.

@dottorzivago > thanks !

#27

Thank you.

#28

I made an account just to say how much I like this. I’m a TW nerd from way back, and transclusion is one thing I was missing here. I like the fill on the pills, too. I killed most of your styling in favor of the stock dark-theme, but that’s just a personal preference.
FWIW, I’m only leaving TW because I tend to tweak it more than use it. I need something I can use OOTB without worrying over plugins and styling. The TW markdown flavor will take time to unlearn.
Great work. I look forward the the future of Obsidian (hint - mobile app :slight_smile: )

#29

I left TW too, not because of the endless tweaking on my side, though it was obvious from the forum comments that many users were essentially just doing that. No, I left because of the HTML/JavaScript/CSS expertise needed to implement even simple things.

What I find with Obs is that there is now choice of quite a few custom themes, and each new one I want to try. That’s the only temptation I feel. Each time I run back to this theme (Obsdn-Dark-Rmx) because I like it and I have been able to tweak it to my liking. And when @_ph makes an update I copy the tweaks to the new version.

#30

Alongside a transclusion in Preview there is a vertical line to show the start and end of it. Is there a way to

  1. change the colour of that line;
  2. eliminate that line?

I looked in the css sheet but cannot identify it.

#31

@Klaas - I saw this somewhere else, but I also confirmed myself: currently that line (a border, in this case) is controlled through the ‘var(–text-selection)’ variable. Changing the variable is one option, but may alter unwanted things as well.
You can control it explicitly by adding the line ‘.markdown-preview-view .markdown-embed {border-left: 1px solid red;}’ - Change the color at will, or change the size to 0px to remove.

#32

Many thanks for that. I changed it to white so it isn’t visible in the light version of this theme.

#33

When you update the screenshot (with the same name) the entry in community theme should show up.

Is it compatible with both light and dark mode now? If so let me know, I can update that too :slight_smile:.

#34

haha, it’s funny you mention TW as I’m currently experiencing exactly that: I’m spendiing more time tweaking it than actually using it. But I like the feature set and TW is currently my daily driver (alongside Dynalist). I have high hopes for Obsidian and AthensResearch though.

Erisred got it right. I think you can just put the border-left to 0px instead of using white, that way you can still switch between light & dark mode.

I’m not sure how I can update the screenshot ? I didn’t link the thread image from the Gihub, but just used a drag-n-drop upload to the discourse.
Should I hotlink from https://raw.github.com/cannibalox/Obsdn-dark-rmx/blob/master/Obsdn-drk-rmx_DARK.png and update the link in the first post of this thread, or is there a better way to do it ?
PLease let me know the correct process to upload the image so that it appears in the thread and also in the community themes in case I make further updates.

yes ! it’s now compatible with light and dark mode… the preview for light is here :
https://raw.githubusercontent.com/cannibalox/Obsdn-dark-rmx/master/Obsdn-drk-rmx_LIGHT.png but I thought hotlinking to raw.github wasn’t a good idea ?

on a side note, what’s the proper etiquette to reply to multiple people ? should I use @username > reply in the some post, or quote replies ? or multiple seqeuntial posts ?