Navigation Bar Links Linked

temp
Pedram Keshavarzi 3 years ago
parent 95032e76cd
commit 63e1165281
  1. 22
      src/components/Navbar/index.js

@ -211,7 +211,7 @@ function Navbar({
</div> </div>
) : ( ) : (
<header className={`rounded-b-md w-full bg-transparent pb-4`}> <header className={`rounded-b-md w-full bg-transparent pb-4`}>
<div className="flex flex-row justify-between items-center border-b border-gray-200 border-solid h-16 px-6"> <div className="flex flex-row justify-between items-center border-b border-gray-200 border-solid h-16 px-20">
<div className="divide-x flex flex-row-reverse transform translate-x-2"> <div className="divide-x flex flex-row-reverse transform translate-x-2">
<span className="text-sm font-normal text-blue52 mr-6"> <span className="text-sm font-normal text-blue52 mr-6">
انتخاب کشور انتخاب کشور
@ -232,7 +232,7 @@ function Navbar({
desktopMiddleFix ? "" : "" desktopMiddleFix ? "" : ""
}`} }`}
> >
<div className="w-full flex flex-row items-center h-full relative bg-white justify-between py-4 px-5 z-20 border-b border-gray-200 border-solid "> <div className="w-full flex flex-row items-center px-20 h-full relative bg-white justify-between py-4 px-5 z-20 border-b border-gray-200 border-solid ">
<div className="ml-10"> <div className="ml-10">
<span className={`text-sm font-bold ml-4 text-gray-700 flex items-center`}> <span className={`text-sm font-bold ml-4 text-gray-700 flex items-center`}>
<Link <Link
@ -264,7 +264,7 @@ function Navbar({
</div> </div>
<div <div
className={`flex items-center relative w-full h-10 px-4 border-b border-solid border-gray-200 transform bg-white ${ className={`flex items-center relative w-full h-10 px-20 border-b border-solid border-gray-200 transform bg-white ${
desktopEndTransform ? "" : "" desktopEndTransform ? "" : ""
}`} }`}
style={{ style={{
@ -286,7 +286,7 @@ function Navbar({
className="flex items-center justify-around w-3/5 absolute left-1/2 top-1/2 transform -translate-x-1/2 -translate-y-1/2" className="flex items-center justify-around w-3/5 absolute left-1/2 top-1/2 transform -translate-x-1/2 -translate-y-1/2"
style={{ maxWidth: "calc(100vw / 2)" }} style={{ maxWidth: "calc(100vw / 2)" }}
> >
{menuItems.map((item, index) => ( {/* {menuItems.map((item, index) => (
<a <a
href="#" href="#"
className={`text-sm text-blue52 ${menuItemsColor}`} className={`text-sm text-blue52 ${menuItemsColor}`}
@ -294,7 +294,15 @@ function Navbar({
> >
{item} {item}
</a> </a>
))} ))} */}
{
pages.map((item, index) => (
<Link to={item.link} className={`text-sm text-blue52 ${menuItemsColor}`} key={'nav' + index}>
{item.name}
</Link>
))
}
</div> </div>
</div> </div>
</div> </div>
@ -312,6 +320,10 @@ export default connect(mapStateToProps, {})(Navbar);
Navbar.defaultProps = { Navbar.defaultProps = {
pages: [ pages: [
{
link: '/',
name: 'خانه'
},
{ {
link: "/products", link: "/products",
name: "محصولات", name: "محصولات",

Loading…
Cancel
Save