banner size in mobile + fix security bug
This commit is contained in:
hamid zarghami
Generated
+48
-48
@@ -27,7 +27,7 @@
|
|||||||
"leaflet": "^1.9.4",
|
"leaflet": "^1.9.4",
|
||||||
"lucide-react": "^0.539.0",
|
"lucide-react": "^0.539.0",
|
||||||
"moment-jalaali": "^0.10.4",
|
"moment-jalaali": "^0.10.4",
|
||||||
"next": "^15.5.3",
|
"next": "^15.5.7",
|
||||||
"rc-rate": "^2.13.1",
|
"rc-rate": "^2.13.1",
|
||||||
"react": "19.1.0",
|
"react": "19.1.0",
|
||||||
"react-dom": "19.1.0",
|
"react-dom": "19.1.0",
|
||||||
@@ -52,7 +52,7 @@
|
|||||||
"@types/react": "^19",
|
"@types/react": "^19",
|
||||||
"@types/react-dom": "^19",
|
"@types/react-dom": "^19",
|
||||||
"eslint": "^9",
|
"eslint": "^9",
|
||||||
"eslint-config-next": "15.4.5",
|
"eslint-config-next": "^15.5.7",
|
||||||
"tailwindcss": "^4",
|
"tailwindcss": "^4",
|
||||||
"tw-animate-css": "^1.3.6",
|
"tw-animate-css": "^1.3.6",
|
||||||
"typescript": "^5"
|
"typescript": "^5"
|
||||||
@@ -868,15 +868,15 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/@next/env": {
|
"node_modules/@next/env": {
|
||||||
"version": "15.5.3",
|
"version": "15.5.7",
|
||||||
"resolved": "https://registry.npmjs.org/@next/env/-/env-15.5.3.tgz",
|
"resolved": "https://registry.npmjs.org/@next/env/-/env-15.5.7.tgz",
|
||||||
"integrity": "sha512-RSEDTRqyihYXygx/OJXwvVupfr9m04+0vH8vyy0HfZ7keRto6VX9BbEk0J2PUk0VGy6YhklJUSrgForov5F9pw==",
|
"integrity": "sha512-4h6Y2NyEkIEN7Z8YxkA27pq6zTkS09bUSYC0xjd0NpwFxjnIKeZEeH591o5WECSmjpUhLn3H2QLJcDye3Uzcvg==",
|
||||||
"license": "MIT"
|
"license": "MIT"
|
||||||
},
|
},
|
||||||
"node_modules/@next/eslint-plugin-next": {
|
"node_modules/@next/eslint-plugin-next": {
|
||||||
"version": "15.4.5",
|
"version": "15.5.7",
|
||||||
"resolved": "https://registry.npmjs.org/@next/eslint-plugin-next/-/eslint-plugin-next-15.4.5.tgz",
|
"resolved": "https://registry.npmjs.org/@next/eslint-plugin-next/-/eslint-plugin-next-15.5.7.tgz",
|
||||||
"integrity": "sha512-YhbrlbEt0m4jJnXHMY/cCUDBAWgd5SaTa5mJjzOt82QwflAFfW/h3+COp2TfVSzhmscIZ5sg2WXt3MLziqCSCw==",
|
"integrity": "sha512-DtRU2N7BkGr8r+pExfuWHwMEPX5SD57FeA6pxdgCHODo+b/UgIgjE+rgWKtJAbEbGhVZ2jtHn4g3wNhWFoNBQQ==",
|
||||||
"dev": true,
|
"dev": true,
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
@@ -884,9 +884,9 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/@next/swc-darwin-arm64": {
|
"node_modules/@next/swc-darwin-arm64": {
|
||||||
"version": "15.5.3",
|
"version": "15.5.7",
|
||||||
"resolved": "https://registry.npmjs.org/@next/swc-darwin-arm64/-/swc-darwin-arm64-15.5.3.tgz",
|
"resolved": "https://registry.npmjs.org/@next/swc-darwin-arm64/-/swc-darwin-arm64-15.5.7.tgz",
|
||||||
"integrity": "sha512-nzbHQo69+au9wJkGKTU9lP7PXv0d1J5ljFpvb+LnEomLtSbJkbZyEs6sbF3plQmiOB2l9OBtN2tNSvCH1nQ9Jg==",
|
"integrity": "sha512-IZwtxCEpI91HVU/rAUOOobWSZv4P2DeTtNaCdHqLcTJU4wdNXgAySvKa/qJCgR5m6KI8UsKDXtO2B31jcaw1Yw==",
|
||||||
"cpu": [
|
"cpu": [
|
||||||
"arm64"
|
"arm64"
|
||||||
],
|
],
|
||||||
@@ -900,9 +900,9 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/@next/swc-darwin-x64": {
|
"node_modules/@next/swc-darwin-x64": {
|
||||||
"version": "15.5.3",
|
"version": "15.5.7",
|
||||||
"resolved": "https://registry.npmjs.org/@next/swc-darwin-x64/-/swc-darwin-x64-15.5.3.tgz",
|
"resolved": "https://registry.npmjs.org/@next/swc-darwin-x64/-/swc-darwin-x64-15.5.7.tgz",
|
||||||
"integrity": "sha512-w83w4SkOOhekJOcA5HBvHyGzgV1W/XvOfpkrxIse4uPWhYTTRwtGEM4v/jiXwNSJvfRvah0H8/uTLBKRXlef8g==",
|
"integrity": "sha512-UP6CaDBcqaCBuiq/gfCEJw7sPEoX1aIjZHnBWN9v9qYHQdMKvCKcAVs4OX1vIjeE+tC5EIuwDTVIoXpUes29lg==",
|
||||||
"cpu": [
|
"cpu": [
|
||||||
"x64"
|
"x64"
|
||||||
],
|
],
|
||||||
@@ -916,9 +916,9 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/@next/swc-linux-arm64-gnu": {
|
"node_modules/@next/swc-linux-arm64-gnu": {
|
||||||
"version": "15.5.3",
|
"version": "15.5.7",
|
||||||
"resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-15.5.3.tgz",
|
"resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-15.5.7.tgz",
|
||||||
"integrity": "sha512-+m7pfIs0/yvgVu26ieaKrifV8C8yiLe7jVp9SpcIzg7XmyyNE7toC1fy5IOQozmr6kWl/JONC51osih2RyoXRw==",
|
"integrity": "sha512-NCslw3GrNIw7OgmRBxHtdWFQYhexoUCq+0oS2ccjyYLtcn1SzGzeM54jpTFonIMUjNbHmpKpziXnpxhSWLcmBA==",
|
||||||
"cpu": [
|
"cpu": [
|
||||||
"arm64"
|
"arm64"
|
||||||
],
|
],
|
||||||
@@ -932,9 +932,9 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/@next/swc-linux-arm64-musl": {
|
"node_modules/@next/swc-linux-arm64-musl": {
|
||||||
"version": "15.5.3",
|
"version": "15.5.7",
|
||||||
"resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-15.5.3.tgz",
|
"resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-15.5.7.tgz",
|
||||||
"integrity": "sha512-u3PEIzuguSenoZviZJahNLgCexGFhso5mxWCrrIMdvpZn6lkME5vc/ADZG8UUk5K1uWRy4hqSFECrON6UKQBbQ==",
|
"integrity": "sha512-nfymt+SE5cvtTrG9u1wdoxBr9bVB7mtKTcj0ltRn6gkP/2Nu1zM5ei8rwP9qKQP0Y//umK+TtkKgNtfboBxRrw==",
|
||||||
"cpu": [
|
"cpu": [
|
||||||
"arm64"
|
"arm64"
|
||||||
],
|
],
|
||||||
@@ -948,9 +948,9 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/@next/swc-linux-x64-gnu": {
|
"node_modules/@next/swc-linux-x64-gnu": {
|
||||||
"version": "15.5.3",
|
"version": "15.5.7",
|
||||||
"resolved": "https://registry.npmjs.org/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-15.5.3.tgz",
|
"resolved": "https://registry.npmjs.org/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-15.5.7.tgz",
|
||||||
"integrity": "sha512-lDtOOScYDZxI2BENN9m0pfVPJDSuUkAD1YXSvlJF0DKwZt0WlA7T7o3wrcEr4Q+iHYGzEaVuZcsIbCps4K27sA==",
|
"integrity": "sha512-hvXcZvCaaEbCZcVzcY7E1uXN9xWZfFvkNHwbe/n4OkRhFWrs1J1QV+4U1BN06tXLdaS4DazEGXwgqnu/VMcmqw==",
|
||||||
"cpu": [
|
"cpu": [
|
||||||
"x64"
|
"x64"
|
||||||
],
|
],
|
||||||
@@ -964,9 +964,9 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/@next/swc-linux-x64-musl": {
|
"node_modules/@next/swc-linux-x64-musl": {
|
||||||
"version": "15.5.3",
|
"version": "15.5.7",
|
||||||
"resolved": "https://registry.npmjs.org/@next/swc-linux-x64-musl/-/swc-linux-x64-musl-15.5.3.tgz",
|
"resolved": "https://registry.npmjs.org/@next/swc-linux-x64-musl/-/swc-linux-x64-musl-15.5.7.tgz",
|
||||||
"integrity": "sha512-9vWVUnsx9PrY2NwdVRJ4dUURAQ8Su0sLRPqcCCxtX5zIQUBES12eRVHq6b70bbfaVaxIDGJN2afHui0eDm+cLg==",
|
"integrity": "sha512-4IUO539b8FmF0odY6/SqANJdgwn1xs1GkPO5doZugwZ3ETF6JUdckk7RGmsfSf7ws8Qb2YB5It33mvNL/0acqA==",
|
||||||
"cpu": [
|
"cpu": [
|
||||||
"x64"
|
"x64"
|
||||||
],
|
],
|
||||||
@@ -980,9 +980,9 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/@next/swc-win32-arm64-msvc": {
|
"node_modules/@next/swc-win32-arm64-msvc": {
|
||||||
"version": "15.5.3",
|
"version": "15.5.7",
|
||||||
"resolved": "https://registry.npmjs.org/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-15.5.3.tgz",
|
"resolved": "https://registry.npmjs.org/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-15.5.7.tgz",
|
||||||
"integrity": "sha512-1CU20FZzY9LFQigRi6jM45oJMU3KziA5/sSG+dXeVaTm661snQP6xu3ykGxxwU5sLG3sh14teO/IOEPVsQMRfA==",
|
"integrity": "sha512-CpJVTkYI3ZajQkC5vajM7/ApKJUOlm6uP4BknM3XKvJ7VXAvCqSjSLmM0LKdYzn6nBJVSjdclx8nYJSa3xlTgQ==",
|
||||||
"cpu": [
|
"cpu": [
|
||||||
"arm64"
|
"arm64"
|
||||||
],
|
],
|
||||||
@@ -996,9 +996,9 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/@next/swc-win32-x64-msvc": {
|
"node_modules/@next/swc-win32-x64-msvc": {
|
||||||
"version": "15.5.3",
|
"version": "15.5.7",
|
||||||
"resolved": "https://registry.npmjs.org/@next/swc-win32-x64-msvc/-/swc-win32-x64-msvc-15.5.3.tgz",
|
"resolved": "https://registry.npmjs.org/@next/swc-win32-x64-msvc/-/swc-win32-x64-msvc-15.5.7.tgz",
|
||||||
"integrity": "sha512-JMoLAq3n3y5tKXPQwCK5c+6tmwkuFDa2XAxz8Wm4+IVthdBZdZGh+lmiLUHg9f9IDwIQpUjp+ysd6OkYTyZRZw==",
|
"integrity": "sha512-gMzgBX164I6DN+9/PGA+9dQiwmTkE4TloBNx8Kv9UiGARsr9Nba7IpcBRA1iTV9vwlYnrE3Uy6I7Aj6qLjQuqw==",
|
||||||
"cpu": [
|
"cpu": [
|
||||||
"x64"
|
"x64"
|
||||||
],
|
],
|
||||||
@@ -4167,13 +4167,13 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/eslint-config-next": {
|
"node_modules/eslint-config-next": {
|
||||||
"version": "15.4.5",
|
"version": "15.5.7",
|
||||||
"resolved": "https://registry.npmjs.org/eslint-config-next/-/eslint-config-next-15.4.5.tgz",
|
"resolved": "https://registry.npmjs.org/eslint-config-next/-/eslint-config-next-15.5.7.tgz",
|
||||||
"integrity": "sha512-IMijiXaZ43qFB+Gcpnb374ipTKD8JIyVNR+6VsifFQ/LHyx+A9wgcgSIhCX5PYSjwOoSYD5LtNHKlM5uc23eww==",
|
"integrity": "sha512-nU/TRGHHeG81NeLW5DeQT5t6BDUqbpsNQTvef1ld/tqHT+/zTx60/TIhKnmPISTTe++DVo+DLxDmk4rnwHaZVw==",
|
||||||
"dev": true,
|
"dev": true,
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@next/eslint-plugin-next": "15.4.5",
|
"@next/eslint-plugin-next": "15.5.7",
|
||||||
"@rushstack/eslint-patch": "^1.10.3",
|
"@rushstack/eslint-patch": "^1.10.3",
|
||||||
"@typescript-eslint/eslint-plugin": "^5.4.2 || ^6.0.0 || ^7.0.0 || ^8.0.0",
|
"@typescript-eslint/eslint-plugin": "^5.4.2 || ^6.0.0 || ^7.0.0 || ^8.0.0",
|
||||||
"@typescript-eslint/parser": "^5.4.2 || ^6.0.0 || ^7.0.0 || ^8.0.0",
|
"@typescript-eslint/parser": "^5.4.2 || ^6.0.0 || ^7.0.0 || ^8.0.0",
|
||||||
@@ -6137,12 +6137,12 @@
|
|||||||
"license": "MIT"
|
"license": "MIT"
|
||||||
},
|
},
|
||||||
"node_modules/next": {
|
"node_modules/next": {
|
||||||
"version": "15.5.3",
|
"version": "15.5.7",
|
||||||
"resolved": "https://registry.npmjs.org/next/-/next-15.5.3.tgz",
|
"resolved": "https://registry.npmjs.org/next/-/next-15.5.7.tgz",
|
||||||
"integrity": "sha512-r/liNAx16SQj4D+XH/oI1dlpv9tdKJ6cONYPwwcCC46f2NjpaRWY+EKCzULfgQYV6YKXjHBchff2IZBSlZmJNw==",
|
"integrity": "sha512-+t2/0jIJ48kUpGKkdlhgkv+zPTEOoXyr60qXe68eB/pl3CMJaLeIGjzp5D6Oqt25hCBiBTt8wEeeAzfJvUKnPQ==",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@next/env": "15.5.3",
|
"@next/env": "15.5.7",
|
||||||
"@swc/helpers": "0.5.15",
|
"@swc/helpers": "0.5.15",
|
||||||
"caniuse-lite": "^1.0.30001579",
|
"caniuse-lite": "^1.0.30001579",
|
||||||
"postcss": "8.4.31",
|
"postcss": "8.4.31",
|
||||||
@@ -6155,14 +6155,14 @@
|
|||||||
"node": "^18.18.0 || ^19.8.0 || >= 20.0.0"
|
"node": "^18.18.0 || ^19.8.0 || >= 20.0.0"
|
||||||
},
|
},
|
||||||
"optionalDependencies": {
|
"optionalDependencies": {
|
||||||
"@next/swc-darwin-arm64": "15.5.3",
|
"@next/swc-darwin-arm64": "15.5.7",
|
||||||
"@next/swc-darwin-x64": "15.5.3",
|
"@next/swc-darwin-x64": "15.5.7",
|
||||||
"@next/swc-linux-arm64-gnu": "15.5.3",
|
"@next/swc-linux-arm64-gnu": "15.5.7",
|
||||||
"@next/swc-linux-arm64-musl": "15.5.3",
|
"@next/swc-linux-arm64-musl": "15.5.7",
|
||||||
"@next/swc-linux-x64-gnu": "15.5.3",
|
"@next/swc-linux-x64-gnu": "15.5.7",
|
||||||
"@next/swc-linux-x64-musl": "15.5.3",
|
"@next/swc-linux-x64-musl": "15.5.7",
|
||||||
"@next/swc-win32-arm64-msvc": "15.5.3",
|
"@next/swc-win32-arm64-msvc": "15.5.7",
|
||||||
"@next/swc-win32-x64-msvc": "15.5.3",
|
"@next/swc-win32-x64-msvc": "15.5.7",
|
||||||
"sharp": "^0.34.3"
|
"sharp": "^0.34.3"
|
||||||
},
|
},
|
||||||
"peerDependencies": {
|
"peerDependencies": {
|
||||||
|
|||||||
+2
-2
@@ -28,7 +28,7 @@
|
|||||||
"leaflet": "^1.9.4",
|
"leaflet": "^1.9.4",
|
||||||
"lucide-react": "^0.539.0",
|
"lucide-react": "^0.539.0",
|
||||||
"moment-jalaali": "^0.10.4",
|
"moment-jalaali": "^0.10.4",
|
||||||
"next": "^15.5.3",
|
"next": "^15.5.7",
|
||||||
"rc-rate": "^2.13.1",
|
"rc-rate": "^2.13.1",
|
||||||
"react": "19.1.0",
|
"react": "19.1.0",
|
||||||
"react-dom": "19.1.0",
|
"react-dom": "19.1.0",
|
||||||
@@ -53,7 +53,7 @@
|
|||||||
"@types/react": "^19",
|
"@types/react": "^19",
|
||||||
"@types/react-dom": "^19",
|
"@types/react-dom": "^19",
|
||||||
"eslint": "^9",
|
"eslint": "^9",
|
||||||
"eslint-config-next": "15.4.5",
|
"eslint-config-next": "^15.5.7",
|
||||||
"tailwindcss": "^4",
|
"tailwindcss": "^4",
|
||||||
"tw-animate-css": "^1.3.6",
|
"tw-animate-css": "^1.3.6",
|
||||||
"typescript": "^5"
|
"typescript": "^5"
|
||||||
|
|||||||
@@ -29,20 +29,20 @@ const Banners3: FC = () => {
|
|||||||
{/* دو بنر کوچک - سمت راست (60% عرض در RTL) */}
|
{/* دو بنر کوچک - سمت راست (60% عرض در RTL) */}
|
||||||
<div className='flex flex-col gap-4 lg:w-[60%] w-full'>
|
<div className='flex flex-col gap-4 lg:w-[60%] w-full'>
|
||||||
<div
|
<div
|
||||||
className='bg-gray-400 rounded-lg flex items-center justify-center w-full flex-1'
|
className='bg-gray-400 rounded-lg flex items-center justify-center w-full lg:flex-1 h-auto min-h-[200px]'
|
||||||
>
|
>
|
||||||
<span className='text-white text-lg font-bold'>بنر 1</span>
|
<span className='text-white text-lg font-bold'>بنر 1</span>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
className='bg-blue-400 rounded-lg flex items-center justify-center w-full flex-1'
|
className='bg-blue-400 rounded-lg flex items-center justify-center w-full lg:flex-1 h-auto min-h-[200px]'
|
||||||
>
|
>
|
||||||
<span className='text-white text-lg font-bold'>بنر 2</span>
|
<span className='text-white text-lg font-bold'>بنر 2</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
{/* بنر بزرگ - سمت چپ (40% عرض در RTL) */}
|
{/* بنر بزرگ - سمت چپ (40% عرض در RTL) */}
|
||||||
<div className='lg:w-[40%] w-full' style={{ aspectRatio: '1/1' }}>
|
<div className='lg:w-[40%] w-full lg:[aspect-ratio:1/1] h-auto'>
|
||||||
<div
|
<div
|
||||||
className='bg-purple-600 rounded-lg flex items-center justify-center w-full h-full'
|
className='bg-purple-600 rounded-lg flex items-center justify-center w-full lg:h-full h-auto min-h-[200px]'
|
||||||
>
|
>
|
||||||
<span className='text-white text-lg font-bold'>بنر 3 - بزرگ</span>
|
<span className='text-white text-lg font-bold'>بنر 3 - بزرگ</span>
|
||||||
</div>
|
</div>
|
||||||
@@ -61,33 +61,33 @@ const Banners3: FC = () => {
|
|||||||
<div className='flex lg:flex-row flex-col gap-4'>
|
<div className='flex lg:flex-row flex-col gap-4'>
|
||||||
{/* دو بنر کوچک - سمت راست (60% عرض در RTL) */}
|
{/* دو بنر کوچک - سمت راست (60% عرض در RTL) */}
|
||||||
<div className='flex flex-col gap-4 lg:w-[60%] w-full'>
|
<div className='flex flex-col gap-4 lg:w-[60%] w-full'>
|
||||||
<Link href={firstBanner.linkUrl || '#'} className='block flex-1'>
|
<Link href={firstBanner.linkUrl || '#'} className='block lg:flex-1 h-auto'>
|
||||||
<Image
|
<Image
|
||||||
src={firstBanner.imageUrl}
|
src={firstBanner.imageUrl}
|
||||||
height={400}
|
height={400}
|
||||||
width={1000}
|
width={1000}
|
||||||
className='w-full h-full rounded-lg object-cover'
|
className='w-full lg:h-full h-auto rounded-lg object-cover'
|
||||||
alt={firstBanner.altText}
|
alt={firstBanner.altText}
|
||||||
/>
|
/>
|
||||||
</Link>
|
</Link>
|
||||||
<Link href={secondBanner.linkUrl || '#'} className='block flex-1'>
|
<Link href={secondBanner.linkUrl || '#'} className='block lg:flex-1 h-auto'>
|
||||||
<Image
|
<Image
|
||||||
src={secondBanner.imageUrl}
|
src={secondBanner.imageUrl}
|
||||||
height={400}
|
height={400}
|
||||||
width={1000}
|
width={1000}
|
||||||
className='w-full h-full rounded-lg object-cover'
|
className='w-full lg:h-full h-auto rounded-lg object-cover'
|
||||||
alt={secondBanner.altText}
|
alt={secondBanner.altText}
|
||||||
/>
|
/>
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
{/* بنر بزرگ - سمت چپ (40% عرض در RTL) */}
|
{/* بنر بزرگ - سمت چپ (40% عرض در RTL) */}
|
||||||
<div className='lg:w-[40%] w-full' style={{ aspectRatio: '1/1' }}>
|
<div className='lg:w-[40%] w-full lg:[aspect-ratio:1/1] h-auto'>
|
||||||
<Link href={thirdBanner.linkUrl || '#'} className='block h-full'>
|
<Link href={thirdBanner.linkUrl || '#'} className='block lg:h-full h-auto'>
|
||||||
<Image
|
<Image
|
||||||
src={thirdBanner.imageUrl}
|
src={thirdBanner.imageUrl}
|
||||||
height={1000}
|
height={1000}
|
||||||
width={1000}
|
width={1000}
|
||||||
className='w-full h-full rounded-lg object-cover'
|
className='w-full lg:h-full h-auto rounded-lg object-cover'
|
||||||
alt={thirdBanner.altText}
|
alt={thirdBanner.altText}
|
||||||
/>
|
/>
|
||||||
</Link>
|
</Link>
|
||||||
|
|||||||
@@ -24,27 +24,27 @@ const Banners4: FC = () => {
|
|||||||
}, [data?.results?.banners])
|
}, [data?.results?.banners])
|
||||||
|
|
||||||
const renderPlaceholder = () => (
|
const renderPlaceholder = () => (
|
||||||
<div className='flex lg:flex-row flex-col gap-4 lg:h-[340px]'>
|
<div className='flex lg:flex-row flex-col gap-4 lg:h-[340px] h-auto'>
|
||||||
{/* بنر 1 (Order 4) - بزرگ سمت راست - 34% عرض */}
|
{/* بنر 1 (Order 4) - بزرگ سمت راست - 34% عرض */}
|
||||||
<div className='lg:w-[34%] w-full lg:h-full h-[200px]'>
|
<div className='lg:w-[34%] w-full lg:h-full h-auto'>
|
||||||
<div className='bg-pink-300 rounded-lg flex items-center justify-center w-full h-full'>
|
<div className='bg-pink-300 rounded-lg flex items-center justify-center w-full lg:h-full h-auto min-h-[200px]'>
|
||||||
<span className='text-white text-lg font-bold'>بنر 1 (Order 4) - بزرگ راست</span>
|
<span className='text-white text-lg font-bold'>بنر 1 (Order 4) - بزرگ راست</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* دو بنر کوچک عمودی - 12% عرض */}
|
{/* دو بنر کوچک عمودی - 12% عرض */}
|
||||||
<div className='flex flex-col gap-4 lg:w-[12%] w-full lg:h-full'>
|
<div className='flex flex-col gap-4 lg:w-[12%] w-full lg:h-full h-auto'>
|
||||||
<div className='bg-gray-400 rounded-lg flex items-center justify-center w-full flex-1 min-h-[100px]'>
|
<div className='bg-gray-400 rounded-lg flex items-center justify-center w-full lg:flex-1 h-auto min-h-[100px]'>
|
||||||
<span className='text-white text-sm font-bold'>بنر 2 (Order 5)</span>
|
<span className='text-white text-sm font-bold'>بنر 2 (Order 5)</span>
|
||||||
</div>
|
</div>
|
||||||
<div className='bg-green-400 rounded-lg flex items-center justify-center w-full flex-1 min-h-[100px]'>
|
<div className='bg-green-400 rounded-lg flex items-center justify-center w-full lg:flex-1 h-auto min-h-[100px]'>
|
||||||
<span className='text-white text-sm font-bold'>بنر 3 (Order 6)</span>
|
<span className='text-white text-sm font-bold'>بنر 3 (Order 6)</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* بنر 4 (Order 7) - عریض سمت چپ - 54% عرض */}
|
{/* بنر 4 (Order 7) - عریض سمت چپ - 54% عرض */}
|
||||||
<div className='lg:w-[54%] w-full lg:h-full h-[200px]'>
|
<div className='lg:w-[54%] w-full lg:h-full h-auto'>
|
||||||
<div className='bg-teal-300 rounded-lg flex items-center justify-center w-full h-full'>
|
<div className='bg-teal-300 rounded-lg flex items-center justify-center w-full lg:h-full h-auto min-h-[200px]'>
|
||||||
<span className='text-white text-lg font-bold'>بنر 4 (Order 7) - عریض چپ</span>
|
<span className='text-white text-lg font-bold'>بنر 4 (Order 7) - عریض چپ</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -67,50 +67,50 @@ const Banners4: FC = () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className='flex lg:flex-row flex-col gap-4 lg:h-[340px]'>
|
<div className='flex lg:flex-row flex-col gap-4 lg:h-[340px] h-auto'>
|
||||||
{/* بنر 1 (Order 4) - بزرگ سمت راست - 34% عرض */}
|
{/* بنر 1 (Order 4) - بزرگ سمت راست - 34% عرض */}
|
||||||
<div className='lg:w-[34%] w-full lg:h-full'>
|
<div className='lg:w-[34%] w-full lg:h-full h-auto'>
|
||||||
<Link href={firstBanner.linkUrl || '#'} className='block h-full'>
|
<Link href={firstBanner.linkUrl || '#'} className='block lg:h-full h-auto'>
|
||||||
<Image
|
<Image
|
||||||
src={firstBanner.imageUrl}
|
src={firstBanner.imageUrl}
|
||||||
height={340}
|
height={340}
|
||||||
width={340}
|
width={340}
|
||||||
className='w-full h-full rounded-lg object-cover'
|
className='w-full lg:h-full h-auto rounded-lg object-cover'
|
||||||
alt={firstBanner.altText}
|
alt={firstBanner.altText}
|
||||||
/>
|
/>
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* دو بنر کوچک عمودی - 12% عرض */}
|
{/* دو بنر کوچک عمودی - 12% عرض */}
|
||||||
<div className='flex flex-col gap-4 lg:w-[12%] w-full lg:h-full'>
|
<div className='flex flex-col gap-4 lg:w-[12%] w-full lg:h-full h-auto'>
|
||||||
<Link href={secondBanner.linkUrl || '#'} className='block flex-1 min-h-0'>
|
<Link href={secondBanner.linkUrl || '#'} className='block lg:flex-1 h-auto min-h-0'>
|
||||||
<Image
|
<Image
|
||||||
src={secondBanner.imageUrl}
|
src={secondBanner.imageUrl}
|
||||||
height={160}
|
height={160}
|
||||||
width={160}
|
width={160}
|
||||||
className='w-full h-full rounded-lg object-cover'
|
className='w-full lg:h-full h-auto rounded-lg object-cover'
|
||||||
alt={secondBanner.altText}
|
alt={secondBanner.altText}
|
||||||
/>
|
/>
|
||||||
</Link>
|
</Link>
|
||||||
<Link href={thirdBanner.linkUrl || '#'} className='block flex-1 min-h-0'>
|
<Link href={thirdBanner.linkUrl || '#'} className='block lg:flex-1 h-auto min-h-0'>
|
||||||
<Image
|
<Image
|
||||||
src={thirdBanner.imageUrl}
|
src={thirdBanner.imageUrl}
|
||||||
height={160}
|
height={160}
|
||||||
width={160}
|
width={160}
|
||||||
className='w-full h-full rounded-lg object-cover'
|
className='w-full lg:h-full h-auto rounded-lg object-cover'
|
||||||
alt={thirdBanner.altText}
|
alt={thirdBanner.altText}
|
||||||
/>
|
/>
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* بنر 4 (Order 7) - عریض سمت چپ - 54% عرض */}
|
{/* بنر 4 (Order 7) - عریض سمت چپ - 54% عرض */}
|
||||||
<div className='lg:w-[54%] w-full lg:h-full'>
|
<div className='lg:w-[54%] w-full lg:h-full h-auto'>
|
||||||
<Link href={fourthBanner.linkUrl || '#'} className='block h-full'>
|
<Link href={fourthBanner.linkUrl || '#'} className='block lg:h-full h-auto'>
|
||||||
<Image
|
<Image
|
||||||
src={fourthBanner.imageUrl}
|
src={fourthBanner.imageUrl}
|
||||||
height={340}
|
height={340}
|
||||||
width={800}
|
width={800}
|
||||||
className='w-full h-full rounded-lg object-cover'
|
className='w-full lg:h-full h-auto rounded-lg object-cover'
|
||||||
alt={fourthBanner.altText}
|
alt={fourthBanner.altText}
|
||||||
/>
|
/>
|
||||||
</Link>
|
</Link>
|
||||||
|
|||||||
Reference in New Issue
Block a user