Sidebar2: CSS customization #816
Answered
by
gvreddy04
mightygriffon6
asked this question in
Q&A
-
Is it posible to custom sidebar2 css like sidebar? if it is , please could you give me an example |
Beta Was this translation helpful? Give feedback.
Answered by
gvreddy04
Jul 18, 2024
Replies: 1 comment
-
@mightygriffon6 Thank you for using BlazorBootstrap. Here is the example: Sample Code<style>
:root {
--bb-sidebar2-width: 270px;
--bb-sidebar2-collapsed-width: 50px;
--bb-sidebar2-background-color: rgba(234, 234, 234, 1);
--bb-sidebar2-top-row-background-color: rgba(0,0,0,0.08);
--bb-sidebar2-top-row-border-color: rgb(194,192,192);
--bb-sidebar2-title-text-color: rgb(0,0,0);
--bb-sidebar2-brand-icon-color: #6f42c1;
--bb-sidebar2-brand-image-width: 24px;
--bb-sidebar2-brand-image-height: 24px;
--bb-sidebar2-title-badge-text-color: rgb(255,255,255);
--bb-sidebar2-title-badge-background-color: rgba(25,135,84,var(--bs-bg-opacity,1));
--bb-sidebar2-navbar-toggler-icon-color: rgb(0,0,0);
--bb-sidebar2-navbar-toggler-background-color: rgba(0,0,0,0.08);
--bb-sidebar2-content-border-color: rgb(194,192,192);
--bb-sidebar2-nav-item-text-color: rgba(0,0,0,0.9);
--bb-sidebar2-nav-item-text-active-color-rgb: 0,0,0;
--bb-sidebar2-nav-item-text-hover-color: rgba(var(--bb-sidebar-nav-item-text-active-color-rgb),0.9);
--bb-sidebar2-nav-item-text-active-color: rgba(var(--bb-sidebar-nav-item-text-active-color-rgb),0.9);
--bb-sidebar2-nav-item-background-hover-color: rgba(var(--bb-sidebar-nav-item-text-active-color-rgb),0.08);
--bb-sidebar2-nav-item-group-background-color: rgba(var(--bb-sidebar-nav-item-text-active-color-rgb),0.08);
}
</style> Screenshot |
Beta Was this translation helpful? Give feedback.
0 replies
Answer selected by
mightygriffon6
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
@mightygriffon6 Thank you for using BlazorBootstrap. Here is the example:
Sample Code