Thanks. This also works but still shows a space above where the toolbar was until I refresh my dashboard.
Do not confirm.
Any change you can share your code, for me it not seems to work. Thx
Probably because the code is wrong from the beginning.
card-mod-root-yaml: |
.: | ----------- this !!!!
app-header {
display: none;
}
At least these types of errors you may do:
- wrong value is selected for a property (like ācolor: 12pxā);
- correct value for a property is not set - ā!importantā is needed;
- wrong attribute is selected (like ācolr: redā);
- wrong element is selected;
- wrong path is specified - so none element is selected;
- smth else.
And use Code Inspector to check a possible reason.
Like i said it works fine in all the 3 ways i tested. If i switch the boolean on the header/toolbar dissapear but the margin donāt changes so it leaves a empry space at the top of the pageā¦
Remove everything from you theme file and leave this only:
card-mod-root-yaml: |
.: |
app-header {
display: none;
}
Does it work?
Next step - check with input_boolean.
1 Like
Sorry for the question, Iām a bit newbieā¦Where should I put this code?
I have created a new theme āleft_sidebar.yamlā in themes folder:
Left_sidebar:
card-mod-view-yaml: |
hui-sidebar-view $: |
.container {
flex-direction: row-reverse;
}
I can see the new theme āleft_sidebarā when I edit my dashboard view, I select it but nothing happens (of course I have Card-mod installed)
Thank you in advance!
Try this:
Left_sidebar:
card-mod-theme: Left_sidebar
card-mod-view-yaml: |
...
Now yes! Thank you so much
Is there any way with adjusting of themes to style the scrollbars from chrome as well. Tried already several positions in view and root, but until now without success.
e.g.
::-webkit-scrollbar-thumb {
-webkit-border-radius: 10px;
border-radius: 10px;
background: rgba(255,0,0,0.8);
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
}
here and in other places in HA.
Since the remodelling of more-info in 2022.9, some of the card-mod-tricks to hide elements doesnāt work.
I can see that the structure has changed since ballobās new more-info merge, but I think the structure is quite confusing so I would appreciate some help.
What I want to hide (2022.9): Hide-History ā ImgBB
Example that worked pre-2022.8 (thanks to MariustHvdB): Hide-History-pre-2022-9 ā ImgBB / hatebin
Result: Hide-History-with-switch ā ImgBB
Suggestions?
This way with 2022.9
card-mod-more-info-yaml: |
ha-more-info-info:
$:
ha-more-info-history:
$: |
.header > a, a:visited {
color: var(--secondary-text-color) !important;
font-size: 12px;
}
ha-more-info-logbook:
$: |
.header > a, a:visited {
color: var(--secondary-text-color) !important;
font-size: 12px;
}
Saw your question after I posted my update for my usecase above. You should find youre problem there as well. It is only another new parent element above. Check my change-example.
1 Like
With the changes to more-info dialogs in 2022.9 release, the more-info popups now are located at the top of the page. Is there a code to add to the theme.yaml using card-mod to center these popups, like they were before? Kinda like the card-mod codes for themes that remove the header for example (which still work thankfully).
Get it back centered.
card-mod-more-info-yaml: |
.: |
ha-dialog {
--vertial-align-dialog: center !important;
}
4 Likes
Thanks, works great!
Is there a way to modify things in the Developer Tools, Settings, HACS page, etc? Iāve tried many variations on card-mod-developer-tools, card-mod-settings, card-mod-config-dashboard, etc., but havenāt had any luck targeting these pages. Any modifications Iāve put into card-mod-root donāt seem to carry over into these pages, which isnāt surprising. Any clarification would be appreciated.
Never saw it managed. Would lie to have it as well, but it isnāt in the form, Thomas in ingesting his code. Currently.
1 Like
