crowetic/commerce
1
0
Fork 1
mirror of https://github.com/vercel/commerce.git synced 2025-07-04 12:11:22 +00:00
Code Issues Packages Projects Releases Wiki Activity

🎨 styles: complete header hight light

Browse Source 
:%s
This commit is contained in:
lytrankieio123 2021-08-25 11:25:39 +07:00
parent 53616185f2
commit 4d3ba63eaf
2 changed files with 15 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
src/components/common/Header/components/HeaderHighLight/HeaderHighLight.module.scss
View File

@ -1,8 +1,19 @@
@import "../../../../../styles/utilities"; @import "../../../../../styles/utilities";
.headerHighLight { .headerHighLight {
@apply flex justify-between items-center spacing-horizontal bg-primary; @apply flex justify-between items-center spacing-horizontal bg-primary caption;
padding-top: 0.8rem; padding-top: 0.8rem;
padding-bottom: 0.8rem; padding-bottom: 0.8rem;
color: var(--white);
.menu {
@apply flex items-center list-none;
li {
&:not(:last-child) {
margin-right: 3.2rem;
}
a {
@appy no-underline;
}
}
}
} }

4
src/components/common/Header/components/HeaderHighLight/HeaderHighLight.tsx
View File

@ -29,7 +29,7 @@ const HeaderHighLight = memo(({ }: Props) => {
<div> <div>
Free Shipping on order $49+ / Express $99+ Free Shipping on order $49+ / Express $99+
</div> </div>
<div className="menu"> <ul className={s.menu}>
{ {
MENU.map(item => <li key={item.name}> MENU.map(item => <li key={item.name}>
<Link href={item.link}> <Link href={item.link}>
@ -40,7 +40,7 @@ const HeaderHighLight = memo(({ }: Props) => {
</li>) </li>)
} }
</div> </ul>
</section> </section>
) )
}) })