drbap / magicuser-theme-for-obsidian

MagicUser theme for Obsidian.md (light and dark themes)
MIT License
29 stars 1 forks source link

the wide table css snippet seems to function without the cssclass applied #40

Closed fredjoe7 closed 3 months ago

fredjoe7 commented 3 months ago

demo546

image

drbap commented 3 months ago

Here is the snippet of that issue. Yes, you are right. I did not apply any class to it. It was a test. If you find it useful I can add a class to add this feature on the notes you want. It only works in reading mode so far.

.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;
}

Well, we can continue the topic here. I closed the other issue.

drbap commented 3 months ago

It looks good on this toggle you added (toggle css snippet), but it is another snippet to load. So I think this feature can be added as a theme feature. Have you tried with callouts? I didnt try with the multi-column plugin. Callouts will have the full width too.

drbap commented 3 months ago

Just a side comment, because I noticed this nice light theme setup and I have to congratulate you. It looks pretty good, in my opinion, with that blue accent color (even on the scrollbars). Also nice table colors. It looks like a textbook. Great job.

Well, I will continue working on this topic tomorrow or during the weekend. If you have suggestions, please let me know.

All the best

fredjoe7 commented 3 months ago

Yes, tried the callouts too.. everything works well

fredjoe7 commented 3 months ago

Just a side comment, because I noticed this nice light theme setup and I have to congratulate you. It looks pretty good, in my opinion, with that blue accent color (even on the scrollbars). Also nice table colors. It looks like a textbook. Great job.

Well, I will continue working on this topic tomorrow or during the weekend. If you have suggestions, please let me know.

All the best

I am not a fan of the light theme personally, just had to use it because of the ambient lightings... i prefer dark themes. Yeh i had to match the table colors with the platform i use for learning, so that it will be better retained in memory. All these were possible to customize easily because of the magicuser theme only. Thanks to you

drbap commented 3 months ago

I use light themes during the day and dark themes at night (sometimes during the day too).

Glad it is working well, I will try to expand this feature. Soon it will be implemented.

drbap commented 3 months ago

I'm working on a new theme update that will implement this feature to set the width of tables and callouts to 100% (reading mode so far). The class name for this feature is tw100 (similar to nw100 for note width 100%).

By the way, the next update will have new options to customize headings! This will add more options and variety for headings. I'm still testing things out, but there's some interesting stuff coming soon.

Well, please let me know what you think about the name tw100 for the class. Thanks!

fredjoe7 commented 3 months ago

The names are well thought of.. table width 100% (tw100) and similarly cw100 and tcw100.. . This is easy to remember

drbap commented 3 months ago

Implemented tw100 and tcw100 classes. They will be available on the next update. There is no need for cw100, it really looks strange, huge callouts and other elements using the readable line length limit.

fredjoe7 commented 3 months ago

But cw100 only can make the image callouts to be 100% width right..

drbap commented 3 months ago

But cw100 only can make the image callouts to be 100% width right..

Yes. You are right. The nw100 can make this effect too (but all elements will have width 100%). I forgot about the image callouts... using the image callouts the feature is useful. I tested with text callouts (thats why looked strange).

I will add it to the list again to implement. Thanks for reminding me. There are many features to remember. When I add a new feature, in most cases, I have to retest many other existing features.

Stay tuned, should be released later today or tomorrow.

All the best

drbap commented 3 months ago

Well, I made the theme roadmap public, so you all can see what it is in the works. Some features I still use pen and paper to write...

But hopefully it will make it easier to remember the features.

Link: https://github.com/users/drbap/projects/6

drbap commented 3 months ago

Ok, my friend. Implemented cw100 class too. Next update coming soon.

Using image callouts and image galleries... it can be useful indeed. Thanks.

drbap commented 3 months ago

So here is the list of these classes to help individual notes layout (using readable line length enabled):

drbap commented 3 months ago

Please check theme version 20.0.0. Let me know if it is working well for you.

If it is working well you can close this issue. Thanks

All the best

drbap commented 3 months ago

I still have to update the readme feature with some new features

magicuser_blockquote_indent_indicator

drbap commented 3 months ago

I will wait if it is working well. I moved it to done in the roadmap and it updated the issue status automatically... so I reopened this.

drbap commented 3 months ago

If you have other suggestions, please let me know.

Take care, my friend

fredjoe7 commented 3 months ago

So here is the list of these classes to help individual notes layout (using readable line length enabled):

* `nw100`: **Note** width 100%

* `tw100`: **Tables** width 100%

* `tcw100`: **Tables** and **callouts** width 100%

* `cw100`: **Callouts** width 100%

yes working well for me

thank you