Homarr•14mo ago

Custom CSS to hide header but keep the right side

I want to hide the left part of the header, hopefully center the right side as well. Did a mock up of what I'd like it to look like. I know I can use dashboard-header-logo-root and dashboard-header-logo-textto hide those, but using dashboard-header hides the whole thing and there's no opposite to dashboard-header-group-right. Maybe what I'm looking for is not possible. If that's the case, no worries 🙂

Solution:

```css .mantine-Header-root { width: fit-content; margin: auto; }...

Jump to solution

7 Replies

Solution

Serenaphic•14mo ago

.mantine-Header-root {
  width: fit-content;
  margin: auto;
}

.mantine-Header-root {
  width: fit-content;
  margin: auto;
}

DroppisaltOP•14mo ago

Perfect. Thank you very much!

Serenaphic•14mo ago

Just for the beauty of it, you might want to add those 2 lines as well. @Droppisalt

  border-bottom-left-radius: 1rem;
  border-bottom-right-radius: 1rem;

  border-bottom-left-radius: 1rem;
  border-bottom-right-radius: 1rem;

DroppisaltOP•14mo ago

Thanks! I was using border-radius: 15px; but your thing is much better 🙂

Serenaphic•14mo ago

1rem is the value we use for all our roundings, it's equal to 16px so you weren't off by that much. Border radius is great but that also adds the top which may not be that great looking

KUSH43•3mo ago

hello, how did u do that can you give your css please i'm newbie on css

Serenaphic•3mo ago

it's already there, it's even shown in CSS code blocks

Gaming

Programming

Custom CSS to hide header but keep the right side