|
|
@ -819,7 +819,7 @@ body { |
|
|
}.s-product-card__link { |
|
|
}.s-product-card__link { |
|
|
display: flex; |
|
|
display: flex; |
|
|
flex-direction: column; |
|
|
flex-direction: column; |
|
|
gap: 1.5rem; |
|
|
|
|
|
|
|
|
gap: 2rem; |
|
|
height: 100%; |
|
|
height: 100%; |
|
|
padding: 2.5rem; |
|
|
padding: 2.5rem; |
|
|
border-radius: 1.25rem; |
|
|
border-radius: 1.25rem; |
|
|
@ -839,8 +839,8 @@ body { |
|
|
}.s-product-card__media img { |
|
|
}.s-product-card__media img { |
|
|
display: block; |
|
|
display: block; |
|
|
width: auto; |
|
|
width: auto; |
|
|
max-width: 100%; |
|
|
|
|
|
max-height: 100%; |
|
|
|
|
|
|
|
|
max-width: 80%; |
|
|
|
|
|
max-height: 80%; |
|
|
object-fit: contain; |
|
|
object-fit: contain; |
|
|
transition: transform var(--duration-normal) var(--easing); |
|
|
transition: transform var(--duration-normal) var(--easing); |
|
|
}.s-product-card__link:hover .s-product-card__media img { |
|
|
}.s-product-card__link:hover .s-product-card__media img { |
|
|
@ -1058,9 +1058,9 @@ body { |
|
|
height: var(--header-t-h); |
|
|
height: var(--header-t-h); |
|
|
max-height: var(--header-t-h); |
|
|
max-height: var(--header-t-h); |
|
|
padding: 0 3.125rem; |
|
|
padding: 0 3.125rem; |
|
|
overflow: hidden; |
|
|
|
|
|
|
|
|
overflow: visible; |
|
|
position: relative; |
|
|
position: relative; |
|
|
z-index: 2; |
|
|
|
|
|
|
|
|
z-index: 5; |
|
|
transition: max-height var(--duration-normal) var(--easing), height var(--duration-normal) var(--easing), padding var(--duration-normal) var(--easing), opacity var(--duration-fast) var(--easing); |
|
|
transition: max-height var(--duration-normal) var(--easing), height var(--duration-normal) var(--easing), padding var(--duration-normal) var(--easing), opacity var(--duration-fast) var(--easing); |
|
|
}.site-header__main { |
|
|
}.site-header__main { |
|
|
display: grid; |
|
|
display: grid; |
|
|
@ -1182,6 +1182,76 @@ body { |
|
|
height: 1rem; |
|
|
height: 1rem; |
|
|
flex-shrink: 0; |
|
|
flex-shrink: 0; |
|
|
color: inherit; |
|
|
color: inherit; |
|
|
|
|
|
text-decoration: none; |
|
|
|
|
|
} |
|
|
|
|
|
.site-header__social--wechat { |
|
|
|
|
|
position: relative; |
|
|
|
|
|
cursor: pointer; |
|
|
|
|
|
outline: none; |
|
|
|
|
|
} |
|
|
|
|
|
.site-header__wechat-pop { |
|
|
|
|
|
position: absolute; |
|
|
|
|
|
top: calc(100% + 0.75rem); |
|
|
|
|
|
left: 50%; |
|
|
|
|
|
z-index: 999; |
|
|
|
|
|
display: flex; |
|
|
|
|
|
flex-direction: column; |
|
|
|
|
|
align-items: center; |
|
|
|
|
|
gap: 0.5rem; |
|
|
|
|
|
width: 8.5rem; |
|
|
|
|
|
padding: 0.75rem; |
|
|
|
|
|
border-radius: 0.5rem; |
|
|
|
|
|
background: #fff; |
|
|
|
|
|
box-shadow: 0 0.5rem 1.5rem rgba(46, 53, 58, 0.16); |
|
|
|
|
|
color: var(--color-text); |
|
|
|
|
|
opacity: 0; |
|
|
|
|
|
visibility: hidden; |
|
|
|
|
|
pointer-events: none; |
|
|
|
|
|
transform: translateX(-50%) translateY(0.25rem); |
|
|
|
|
|
transition: opacity var(--duration-fast) var(--easing), visibility var(--duration-fast) var(--easing), transform var(--duration-fast) var(--easing); |
|
|
|
|
|
} |
|
|
|
|
|
.site-header__wechat-pop::before { |
|
|
|
|
|
content: ""; |
|
|
|
|
|
position: absolute; |
|
|
|
|
|
top: -0.375rem; |
|
|
|
|
|
left: 50%; |
|
|
|
|
|
width: 0.75rem; |
|
|
|
|
|
height: 0.75rem; |
|
|
|
|
|
background: #fff; |
|
|
|
|
|
transform: translateX(-50%) rotate(45deg); |
|
|
|
|
|
box-shadow: -2px -2px 4px rgba(46, 53, 58, 0.04); |
|
|
|
|
|
} |
|
|
|
|
|
.site-header__wechat-pop::after { |
|
|
|
|
|
content: ""; |
|
|
|
|
|
position: absolute; |
|
|
|
|
|
top: -0.75rem; |
|
|
|
|
|
left: 0; |
|
|
|
|
|
right: 0; |
|
|
|
|
|
height: 0.75rem; |
|
|
|
|
|
} |
|
|
|
|
|
.site-header__wechat-pop img { |
|
|
|
|
|
position: relative; |
|
|
|
|
|
z-index: 1; |
|
|
|
|
|
display: block; |
|
|
|
|
|
width: 7rem; |
|
|
|
|
|
height: 7rem; |
|
|
|
|
|
object-fit: contain; |
|
|
|
|
|
} |
|
|
|
|
|
.site-header__wechat-pop > span { |
|
|
|
|
|
position: relative; |
|
|
|
|
|
z-index: 1; |
|
|
|
|
|
font-family: "MiSans VF", "PingFang SC", sans-serif; |
|
|
|
|
|
font-size: var(--font-12, 0.75rem); |
|
|
|
|
|
line-height: 1.2; |
|
|
|
|
|
color: var(--color-text-muted, #666); |
|
|
|
|
|
white-space: nowrap; |
|
|
|
|
|
} |
|
|
|
|
|
.site-header__social--wechat:hover .site-header__wechat-pop, |
|
|
|
|
|
.site-header__social--wechat:focus-within .site-header__wechat-pop { |
|
|
|
|
|
opacity: 1; |
|
|
|
|
|
visibility: visible; |
|
|
|
|
|
pointer-events: auto; |
|
|
|
|
|
transform: translateX(-50%) translateY(0); |
|
|
}.site-header__lang { |
|
|
}.site-header__lang { |
|
|
display: flex; |
|
|
display: flex; |
|
|
align-items: center; |
|
|
align-items: center; |
|
|
@ -1276,6 +1346,7 @@ body { |
|
|
padding-top: 0; |
|
|
padding-top: 0; |
|
|
padding-bottom: 0; |
|
|
padding-bottom: 0; |
|
|
opacity: 0; |
|
|
opacity: 0; |
|
|
|
|
|
overflow: hidden; |
|
|
pointer-events: none; |
|
|
pointer-events: none; |
|
|
}.site-header.is-scrolled .site-header__main { |
|
|
}.site-header.is-scrolled .site-header__main { |
|
|
border-top-color: transparent; |
|
|
border-top-color: transparent; |
|
|
|
