133 lines
2.6 KiB
SCSS
133 lines
2.6 KiB
SCSS
@charset "UTF-8";
|
|
|
|
/**
|
|
* @copyright 2022 beikeshop.com - All Rights Reserved.
|
|
* @link https://beikeshop.com
|
|
* @Author pu shuo <pushuo@guangda.work>
|
|
* @Date 2022-08-04 15:52:42
|
|
* @LastEditTime 2022-09-16 19:05:15
|
|
*/
|
|
|
|
.header-wrap {
|
|
background-color: #fff;
|
|
height: 54px;
|
|
// border-bottom: 1px solid #f1f1f1;
|
|
position: relative;
|
|
display: flex;
|
|
align-items: center;
|
|
z-index: 9;
|
|
box-shadow: 0 2px 14px 0 rgba(0, 0, 0, .05);
|
|
|
|
.header-left {
|
|
width: 190px;
|
|
display: flex;
|
|
align-items: center; // flex-start | center
|
|
justify-content: center; // flex-end | center | space-between
|
|
// flex-wrap: wrap;
|
|
|
|
.logo {
|
|
max-width: 76%;
|
|
max-height: 30px;
|
|
}
|
|
}
|
|
|
|
.header-right {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
flex: 1;
|
|
|
|
> .navbar {
|
|
margin-bottom: 0;
|
|
padding: 0;
|
|
list-style: none;
|
|
> li {
|
|
html[lang="zh_cn"] &, html[lang="zh_hk"] &, html[lang="en"] & {
|
|
padding: 0 1rem;
|
|
}
|
|
|
|
@media screen and (max-width: 991px) {
|
|
padding: 0 .3rem;
|
|
}
|
|
|
|
.dropdown {
|
|
&:hover {
|
|
.nav-link {
|
|
background-color: #eee;
|
|
}
|
|
|
|
.dropdown-menu {
|
|
display: block;
|
|
&.dropdown-menu-end {
|
|
right: 0;
|
|
left: auto;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
a.nav-link {
|
|
color: #333;
|
|
padding: 0 6px;
|
|
height: 54px;
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
&.show {
|
|
background-color: #eee;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.navbar {
|
|
&.navbar-left {
|
|
li {
|
|
a.nav-link {
|
|
position: relative;
|
|
|
|
&:after {
|
|
content: '';
|
|
position: absolute;
|
|
left: 0;
|
|
display: none;
|
|
bottom: 0;
|
|
width: 100%;
|
|
height: 3px;
|
|
background-color: $primary;
|
|
}
|
|
}
|
|
|
|
&.active, &:hover {
|
|
font-weight: bold;
|
|
|
|
a {
|
|
&:after {
|
|
display: block;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
&.navbar-right {
|
|
> li {
|
|
html[lang="zh_cn"] &, html[lang="zh_hk"] &, html[lang="en"] & {
|
|
padding: 0 .5rem;
|
|
}
|
|
|
|
a.nav-link {
|
|
padding: 0 10px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.avatar {
|
|
height: 36px;
|
|
margin-bottom: -15px;
|
|
margin-top: -15px;
|
|
width: 36px;
|
|
}
|
|
} |