You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
44 lines
1.4 KiB
44 lines
1.4 KiB
3 years ago
|
import React from "react";
|
||
|
|
||
|
const HeaderDesign1 = () => {
|
||
|
return (
|
||
|
<header className="p-4">
|
||
|
<div class="container flex justify-between items-center mx-auto py-2 px-8 md:px-14 lg:px-24 w-full bg-white rounded shadow-sm">
|
||
|
<div class="text-lg font-bold text-productPrice w-1/5 ">
|
||
|
Design System
|
||
|
</div>
|
||
|
<div class="hidden lg:flex items-center justify-around w-3/5">
|
||
|
<a href="#" className="text-productPrice">
|
||
|
محصولات
|
||
|
</a>
|
||
|
<a href="#" className="text-productPrice">
|
||
|
دسته بندی
|
||
|
</a>
|
||
|
<a href="#" className="text-productPrice">
|
||
|
تماس با ما
|
||
|
</a>
|
||
|
<a href="#" className="text-productPrice">
|
||
|
درباره ما
|
||
|
</a>
|
||
|
<a href="#" className="text-productPrice">
|
||
|
پیگیری
|
||
|
</a>
|
||
|
<a href="#" className="text-productPrice">
|
||
|
وبلاگ
|
||
|
</a>
|
||
|
</div>
|
||
|
<div className="w-1/5 flex justify-end">
|
||
|
<button className="ml-2 py-2 px-8 text-productPrice text-sm font-light rounded border border-darkCrimsonBorderColor">
|
||
|
ورود
|
||
|
</button>
|
||
|
<button className="py-2 px-8 text-white text-sm font-light rounded bg-darkCrimsonBgColor">
|
||
|
ثبت نام
|
||
|
</button>
|
||
|
</div>
|
||
|
</div>
|
||
|
</header>
|
||
|
);
|
||
|
};
|
||
|
|
||
|
export default HeaderDesign1;
|