Kadence Nav CSS Backup
CSS
.wp-block-navigation ul {
display: flex;
gap: 15px;
}
.wp-block-navigation a:hover,
.wp-block-navigation a:focus-visible {
text-decoration: underline;
}
// Off Canvas Logo
.offcanvas-logo {
position: relative;
top: -60px;
max-width: 70%;
}
.drawer-header,
.drawer-content {
padding-left: 16px !important;
padding-right: 16px !important;
}
.popup-drawer .drawer-header {
padding: 0 16px !important;
}
.offcanvas-kontakt {
margin-top: 25px;
}
* a:focus-visible {
outline: 2px dashed orange !important;
}
// kadence Reset
.single-content address,.single-content figure,.single-content hr,.single-content p,.single-content table,.single-content pre,.single-content form,.single-content .wp-block-buttons,.single-content .wp-block-button,.single-content .wc-block-grid,.single-content .wp-block-kadence-advancedbtn,.single-content .wp-block-media-text,.single-content .wp-block-cover,.single-content .entry-content-asset,.single-content .wp-block-kadence-form,.single-content .wp-block-group,.single-content .wp-block-yoast-faq-block,.single-content .wp-block-yoast-how-to-block,.single-content .schema-faq-section,.single-content .wp-block-kadence-tableofcontents,.single-content .enlighter-default,.single-content .wp-block-kadence-iconlist,.single-content [class*=__inner-content] {
margin-top: 0;
margin-bottom: 15px !important;
}
.single-content h1, .single-content h2, .single-content h3, .single-content h4, .single-content h5, .single-content h6 {
margin: 1em 0 0.5em;
}
.ntm {
margin-top: 0 !important;
}
.set-rel {
position: relative !important;
}
// WS Forms angepasst an Farben
button.wsf-button.wsf-button-primary {
color: var(--global-palette9) !important;
background-color: var(--global-palette-highlight) !important;
border-color: var(--global-palette-highlight) !important;
max-width: 220px !important;
}
button.wsf-button.wsf-button-primary:hover,
button.wsf-button.wsf-button-primary:focus-visible {
color: var(--global-palette9) !important;
background-color: var(--global-palette-highlight-alt) !important;
border-color: var(--global-palette-highlight-alt) !important;
box-shadow: none !important;
}
.header-navigation .menu {
gap: 28px !important;
}
/* Base styles for menu items */
.primary-menu-container ul li a {
position: relative;
display: inline-block;
padding-bottom: 5px; /* Space for the border animation */
transition: all 0.3s ease; /* Smooth transition for text and border */
padding: 0 0 4px 0 !important;
color: #333 !important;
}
/* On hover: add border and move text up */
.primary-menu-container ul li a::after {
content: '';
position: absolute;
left: 0;
right: 0;
bottom: 0;
height: 3px; /* Height of the bottom border */
background-color: #B30013; /* Border color */
transform: scaleY(0); /* Start with no visible border */
transition: transform 0.3s ease; /* Smoothly scale the border */
transform-origin: bottom;
}
.primary-menu-container ul li a:hover::after {
transform: scaleY(1); /* Full height on hover */
}
.primary-menu-container ul li a:hover {
transform: translateY(-4px); /* Move the text up slightly */
box-shadow: none; /* Prevent shadow on hover */
color: #B30013 !important;
}
/* For active/current menu item */
.primary-menu-container ul li.current-menu-item a {
transform: translateY(-4px); /* Keep text up for active item */
box-shadow: 0px -3px 0px #B30013 inset; /* Static bottom border for active item */
transition: all 0.3s ease;
color: #B30013 !important;
}
/* Consistent animation for submenu items */
ul.sub-menu li:hover>a {
transform: translateY(0); /* No text movement for submenu items */
box-shadow: none;
transition: all 0.3s ease;
}