whoami7 - Manager
:
/
home
/
dataiclx
/
vielorbe.com
/
wp-content
/
themes
/
glowing
/
assets
/
sass
/
Upload File:
files >> //home/dataiclx/vielorbe.com/wp-content/themes/glowing/assets/sass/_header.scss
.site-header { min-height: var(--g5-header-height); background-color: var(--g5-header-bg-color); color: var(--g5-header-text-color); .site-navigation { @include d-flex(); @include flex-fill; @include justify-content-center(); .site-menu { @include align-self-center; } + .search-form-wrapper { margin-left: 1.5rem; } } .toggle-icon:hover { color: var(--g5-header-text-hover-color); } .search-form-wrapper { @include align-self-center; margin-bottom: 0; margin-left: auto; > span { cursor: pointer; margin-bottom: 0; line-height: 1; @include d-flex(); font-size: 20px; &:hover { color: var(--g5-header-text-hover-color); } } .search-form { position: absolute; display: none; right: 0; top: 100%; z-index: 1099; background-color: #fff; @include box-shadow(0 1px 5px 0 rgba(0, 0, 0, 0.1)); input { width: 210px; border: none; font-size: 0.875rem; background-color: transparent; padding: 0 20px; } button { display: none; } } } .menu-toggle-button { display: none; position: absolute; top: calc((var(--g5-header-mobile-height) - 30px) * 0.5); left: 0; } } .site-header-content { width: 100%; position: relative; @include d-flex(); @include flex-wrap(); } .menu-horizontal { margin: 0; padding: 0; list-style: none; @include d-flex(); @include flex-wrap; > .menu-item { @include d-flex(); + .menu-item { margin-left: var(--g5-menu-spacing); } > .sub-menu { top: 100%; left: 0; } > a { display: block; font-family: var(--g5-menu-font); font-weight: var(--g5-menu-font-weight); font-size: var(--g5-menu-font-size); line-height: var(--g5-menu-line-height); padding: calc((var(--g5-header-height) - var(--g5-menu-line-height)) * 0.5) 0; color: inherit; text-decoration: none; @include transition(width 0.3s, padding 0.5s); letter-spacing: var(--g5-menu-letter-spacing); text-transform: var(--g5-menu-text-transform); font-style: var(--g5-menu-font-style); &:before { content: ''; position: absolute; height: 1px; bottom: 35px; left: 0; right: 0; background-color: var(--g5-header-text-hover-color); @include transition(transform 0.4s ease); @include transform(scale3d(0, 1, 1)); @include transform-origin(100%, 50%); @include transition-timing-function(cubic-bezier(0.8, 0, 0.2, 1)); } &:focus { outline: none; } } &.current-menu-ancestor:not(.menu-item-type-taxonomy), &.current-menu-parent:not(.menu-item-type-taxonomy), &.current-menu-item, &.menu-current, &:hover, &:focus { > a { &:before { @include transform(scale3d(1, 1, 1)); @include transform-origin(0%, 50%); } } } } .menu-item { position: relative; &.x-active > .sub-menu, &:hover > .sub-menu { display: block; } } .menu-item-has-children > a .caret { margin-left: 3px; line-height: 1; letter-spacing: 0; font-size: 12px; font-weight: 400; &:before { content: '\f107'; font-family: var(--g5-font-icon); } } .sub-menu { display: none; position: absolute; left: 100%; top: 0; min-width: 230px; list-style: none; padding: 15px 0; margin: 0; background-color: var(--g5-submenu-bg-color); color: var(--g5-submenu-text-color); z-index: 1099; @include box-shadow(0 1px 5px 0 rgba(0, 0, 0, 0.1)); .menu-item { > a { display: block; padding: 7px 15px 7px 30px; font-family: var(--g5-submenu-font); font-size: var(--g5-submenu-font-size); line-height: var(--g5-submenu-line-height); font-style: var(--g5-submenu-font-style); font-weight: var(--g5-submenu-font-weight); text-transform: var(--g5-submenu-text-transform); position: relative; color: inherit; @include transition(all .3s); } &:hover { > a { background-color: var(--g5-submenu-bg-hover-color); color: var(--g5-submenu-text-hover-color); } } &.menu-current, &.current-menu-parent, &.current-menu-ancestor, &.current-menu-item { > a { background-color: var(--g5-submenu-bg-hover-color); color: var(--g5-submenu-text-hover-color); } } } .menu-item-has-children > a .caret { float: right; &:before { content: '\f105'; } } } } .site-branding { padding: 8px 2rem 8px 0; @include d-flex; @include align-items-center; height: var(--g5-header-height); .site-description { display: none; margin: 0; } &.has-logo { .site-title, .site-branding-text { display: none; } } .custom-logo-link img { display: block; max-height: calc(var(--g5-header-height) - 16px); width: auto; } } .site-branding-text .site-title { font-size: 34px; text-transform: uppercase; margin-bottom: 0; color: var(--g5-color-heading); font-weight: 600; a { color: inherit; } } @media (min-width: 1200px) { .custom-sub-menu-stretched_content > .sub-menu > .x-is-mega-menu { max-width: 95%; margin: 0 auto; } } @media (min-width: 1850px) { .custom-sub-menu-stretched_content > .sub-menu > .x-is-mega-menu { max-width: 1850px; } } @include media-md() { .site-header { min-height: var(--g5-header-mobile-height); .menu-toggle-button { @include d-flex(); } } .site-branding { margin: auto; padding: 8px 0; height: var(--g5-header-mobile-height); } .site-header .site-navigation { display: none; width: 100%; border-top: solid 1px var(--g5-color-border); @include flex(0 0 100%); } .site-header .search-form-wrapper { position: absolute; top: 0; right: 0; font-size: 20px; padding: calc((var(--g5-header-mobile-height) - 20px) * 0.5) 0; } .site-menu { margin: 0.5rem 0; } .site-menu .menu-horizontal { display: block; .menu-item { display: block; + .menu-item { margin-left: 0; } > a { //display: inline-block; padding: 0.625rem 0; font-size: var(--g5-font-size-menu-mobile); &:before { display: none; } } &:hover { .sub-menu { display: none; } } } .menu-item-has-children > a .caret { position: absolute; top: 0; right: 0; padding: 0.625rem 0.75rem; &:before { content: '\f105'; } &.in:before { content: '\f107'; } } .sub-menu { position: static; border: none; padding: 0 0 0 1.5rem; box-shadow: none; .menu-item { border-bottom: none; } .menu-item > a { text-transform: none; //display: inline-block; padding: 0.5rem 0; font-size: var(--g5-font-size-menu-mobile); } } } }
Copyright ©2021 || Defacer Indonesia