Information to solve problem

[Mcezarf]

see the text below copied from ++Dashboard. Is this code run by .css? The result does not show as it is in the article. What needs to be done? the commands are shown with the figure!!!! Apparently the banner and div etc commands are not being recognized.

---

cssclass: dashboard

banner: "![[02 - Anexos/home.jpg]]"
banner_y: 0.55
banner_x: 0.5

HOME

---

[TfTHacker]

The HOME should be below the ---

Look at the file in raw mode, might be clearer the text flow:

https://raw.githubusercontent.com/TfTHacker/DashboardPlusPlus/master/Dashboard%2B%2B.md

[Mcezarf]

I did this but It does not working. See the screen attached

.

[TfTHacker]

This looks like the CSS for dashboard is not installed or enabled. Can you confirm this?

[Mcezarf]

See the screen file attached



d

[sirlaughalot90]

Hello, thank you for the great work! I can't get it to work quite right:

I use Minimal Theme with Image Grids. Disabling Contextual Typography didn't solve it. Do you have any ideas on what setting to fiddle with? I am almost certain, it is just some setting in Minimal Theme. I copied some of your examples in order to check if I have done the formatting wrong but it makes no difference.

[sirlaughalot90]

This solves it... kind of:

The fourth column is still being displayed below.

[sirlaughalot90]

Plus, when I open the sidbars it goes back to only 2 columns being displayed. I would guess that your approach only works on big displays with enough vertical space, not on a MB Air. I'll test it later today when I have access to a larger display.

[TfTHacker]

I can't say I have very large display. But of course each device can be different. Basically as you see in your picture the sections wrap to new rows based on size.

You will see in the dashboard.css file:

.dashboard div > ul > li {
    min-width: 250px;
    width: 15%;
}

You can experiment with making min-width smaller by changing 250 to lets say 200 and so on.

I also personally added this to reduce padding more:

.dashboard .markdown-preview-section {
    padding-left:  10px !important;
    padding-right: 10px !important;
}

Let me know if one of these strategies worked.

[sirlaughalot90]

Thank you. I did some testing, and it basically comes down to display size and readable line length. RLL makes the biggest difference. With RLL enabled I always only get 2 columns, no matter how big the screen. With RLL disabled, I get three columns on my MacBook and all four when plugged into my 4k display. My main problem is that I really do like RLL. 😅 Probably, I'll stick to RLL and use your (very nice) CSS with only two columns. 😇

[TfTHacker]

That is progress then. But I have a css file in the repo for overriding readline setting. The article mentions this.