more cssclasses for widening specific aspects of the notes ...

[fredjoe7]

I use the multi column markdown plugin. https://github.com/ckRobinson/multi-column-markdown i usually use nw100 cssclass to max page width when i use the multi column feature . but i feel it will be better if there is a new css class to max width only the multi column and not the content outside it.

---

i sometimes use this https://efemkay.github.io/obsidian-modular-css-layout/multi-column/

to specifically max width of callouts or tables..

but one issue i got was when i use the max-callouts to specifically maximize width of callouts in a note where i have the >[!g-black] callout of magicusertheme, the click on image to zoom feature doesnot work properly... like

when i use the default nw100 and >[!g-black] callout, .. when i click the image it opens on the center in fullscreen... but when i use the mcl wide page cssclass from above github to specifically max callouts, then when i click on the image it doesnot zoom properly in the center...

so i propose similiar to nw100 . a seperate cssclass for callouts and one for table .. that will be compatible with other features in the magicuser theme.

[drbap]

Thanks for the suggestion.

I think this issue will take more time to solve because I don't use this plugin. I will have to check how the plugin works (related to CSS) and then adjust some theme features to be more compatible with it. Stay tuned.

[drbap]

but i feel it will be better if there is a new css class to max width only the multi column and not the content outside it.

1. Could you explain this better? What format should content outside of the multicolumn remain in?

so i propose similiar to nw100 . a seperate cssclass for callouts and one for table .. that will be compatible with other features in the magicuser theme.

2. Have you tried resizing callouts: https://github.com/drbap/magicuser-theme-for-obsidian#resize-callouts ?
3. About the 100% table, the default table width is 100% width.

[fredjoe7]

veins contributing to the formation of IVC.md

the content outside the multicolumn should follow readable line length while the multicolumn should follow nw100..

i want content of all format outside to be following readable line length..

[fredjoe7]

but i feel it will be better if there is a new css class to max width only the multi column and not the content outside it.

1. Could you explain this better? What format should content outside of the multicolumn remain in?

so i propose similiar to nw100 . a seperate cssclass for callouts and one for table .. that will be compatible with other features in the magicuser theme.

2. Have you tried resizing callouts: https://github.com/drbap/magicuser-theme-for-obsidian#resize-callouts ?

3. About the 100% table, the default table width is 100% width.

this is what i meant by wide tables... having all content normal and only widen the table..

Thanks for the calloutresize reference.. i never noticed it still now..

[drbap]

Thanks for explaining with screenshots, much easier to understand. Now I get it. Table occupying 100% of the viewing area, regardless of the width of the readable line (readable line length). Okay, I'll see what I can do. I'll try that later tonight. I will also try to find a solution for this multiple column (100% width within each column). Stay tuned.

[fredjoe7]

The issue I am having with callouts is that I used the wide-callouts cssclass from modular column github page to use with it magicuser image callout and now when I click the img to zoom. its not visible properly....

[drbap]

The issue I am having with callouts is that I used the wide-callouts cssclass from modular column github page to use with it magicuser image callout and now when I click the img to zoom. its not visible properly....

Well, I'll have to see this snippet, it changed the positioning of the image when clicked (g-callouts)... it still shows it bigger, but completely out of position.

[drbap]

What is the link for the snippet file (.css)? could you post the link here so I can get the exact one you are using? Thanks.

Later at night, I will work on this.

[fredjoe7]

https://github.com/efemkay/obsidian-modular-css-layout/blob/main/MCL%20Wide%20Views.css

[drbap]

Stay tuned. I installed the plugin and later at night I will start trying to solve these issues. Thanks for the link

[drbap]

I dedicated my free time yesterday to fix the laser beam issue. I hope it is working well now independently of the display/layout mode.

I will try to fix this today (later at night)

All the best

[fredjoe7]

Yes. Thank you. It is compatible with all modes.

I noticed a drop in smoothness immediately after updating, compared to before.

[drbap]

Please download the files again and reload the plugin. I updated the css file, it was using a different one (older one) thats why it was not so smooth... hopefully it is fixed now.

[drbap]

I added a small animation to show the laser as well (from left to right, opacity effect too when you activate it).

[drbap]

I tested the multicolumn plugin and found it useful and well-made, even with some experimental features. I believe there is room for improvement in terms of user experience and ease of use. I understand that the developer is offering his work for free and I appreciate his effort.

Honestly, I don't understand how I could help (related to the theme) in integrating with the multicolumn plugin. Perhaps the developer could offer as a plugin feature the option to resize the multi-column area when using readable line length (resize only the multi-column areas) to fit the entire width.

Regarding galleries, since g-callouts work well without the snippet, I don't really plan on changing what's working well and tested so many times. I looked at the code of the css snippet and it seemed tuned for other community themes, so it would be easier to adjust the snippet (not the theme). There are thousands of CSS snippets.... I've already adjusted some theme properties to be compatible with snippets in the past... dashboard++ for example.

About tables, you showed a screenshot with a table at 100% width and the other text following the readable line length limit. It looks like you already have a working solution for table width. Is this approach working well for your needs?

All the best

[drbap]

Well, here it is a snippet to make tables and callouts 100% width on reading mode (other paragraphs will follow the readable line length).

.markdown-reading-view .markdown-preview-sizer {
  width: 100% !important;
  max-width: 100% !important;
}

.markdown-reading-view .markdown-preview-sizer>div>*:not(table, .callout) {
  margin-left: auto;
  margin-right: auto;
  max-width: var(--file-line-width);
}

.markdown-reading-view .markdown-preview-sizer>div>table {
  width: 100%;
  margin-top: 1em;
  margin-bottom: 1em;
}

Let me know if it is working well. If it is working ok I can add some classes to the theme, so you and others can add the classes only on the desired notes. Maybe split in 2 or more classes.

All the best

[drbap]

The above snippet works with g-callouts too (when clicked -> zoom is working well).

[drbap]

Please check the snippet again, I had to adjust the margin of the non table and callouts elements. Now I think it is working well, but I will test more later.

EDIT: I adjusted the table margins as well.

[drbap]

Classes easy to remember:

• tw100 (tables width 100%)
• tcw100 (tables and callouts width 100%).
• Maybe one to make only the callouts 100% (cw100)

What do you think?

EDIT: So it is consistent with the nw100 class.

[fredjoe7]

I have a big exam this week.. I'll check the css next week and let you know. Thank you. You can close the issue if needed.

[drbap]

Ok no rush. I will keep it open, so you can test after the exam.

[drbap]

Well, I am closing this issue. If you want to talk more about it and/or keep testing the snippet, please open another issue. Thanks

[fredjoe7]

just tried the css snippets.. works well.

thank you