Best way to increase topbar height

Forum rules
Please note that response time for technical support is within 3-5 business days.
Post Reply
stkoser
Posts: 2
Joined: 17 Nov 2020, 18:24

17 Nov 2020, 18:35

Hello, what is the beast way to increase the height of the topbar?
I tried to override height in
- .layout-wrapper .topbar .topbar-left
- .layout-wrapper .topbar
and top in .layout-menu

This seemed to work, but found again problems with different views (devices).
What ist the best way to do so?
When I search for 75px (which is the default height) I find many styles in css and I'm not sure if all belong to the topbar height.

--
bye Stephan...

mert.sincan
Posts: 5281
Joined: 29 Jun 2013, 12:38

18 Nov 2020, 08:36

Hi,

Please add the following scss to _layout_styles.scss and then provide new css files using SASS command;

Code: Select all

$topbarHeight: 90px;

.layout-wrapper {
    .topbar {
        height: $topbarHeight;

        .topbar-left {
            padding-top: calc(20px + #{$topbarHeight} - 75px);
            height: $topbarHeight;
        }

        .topbar-right {
            padding-top: calc(15px + #{$topbarHeight} - 75px);
        }
    }

    .layout-rightpanel,
    .layout-menu {
        top: $topbarHeight;
    }

    .layout-main {
        padding-top: calc(95px + #{$topbarHeight} - 75px);
    }

    .layout-config {
        top: calc(75px + #{$topbarHeight} - 75px);
    }

    @media (max-width: 1024px) {
        .topbar .topbar-right #topbar-menu-button {
            top: calc(20px + #{$topbarHeight} - 75px);
        }
    }
}
You can change it according to your needs.

Best Regards,

stkoser
Posts: 2
Joined: 17 Nov 2020, 18:24

11 Dec 2020, 09:26

Worked - thank you!

mert.sincan
Posts: 5281
Joined: 29 Jun 2013, 12:38

11 Dec 2020, 09:59

Glad to hear, thanks a lot for the update!

Best Regards,

Post Reply

Return to “Ultima - PrimeFaces”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 3 guests