Update responsive page

هذا الالتزام موجود في:
2025-10-05 12:17:30 +03:00
الأصل 56eb562193
التزام d1d7c484c6
6 ملفات معدلة مع 15 إضافات و14 حذوفات

عرض الملف

@@ -26,6 +26,7 @@
@media (min-width: 1600px) {
.container {
max-width: 1824px;
max-width: 1600px;
}
}
}

عرض الملف

@@ -425,7 +425,7 @@ export default function DashboardGrid() {
{card.title}
</div>
{/* Tags */}
<div className="mt-3 flex flex-row gap-2 flex-wrap justify-center">
<div className="mt-2 flex flex-row gap-2 flex-wrap justify-center">
{card.tags.map((tag, i) => (
<TagComponent
key={i}
@@ -440,7 +440,7 @@ export default function DashboardGrid() {
</div>
)}
{card.paused && (
<div className="mt-3 text-center">
<div className="mt-1 text-center">
<div className="text-gray-400 text-sm">Campaign paused</div>
<button className="text-blue-600 text-sm hover:underline transition-all duration-300 hover:text-blue-800">Resume</button>
</div>

عرض الملف

@@ -37,10 +37,10 @@ function ProgressMetrics() {
{/* 60% Progress */}
<div className="w-[100%]">
<div className="flex items-center justify-between">
<div className="text-4xl font-bold text-gray-900 mb-1">60%</div>
<div className="text-3xl font-bold text-gray-900 mb-1">120/250 <span className="text-gray-500">links</span></div>
<div className="text-lg 2xl:text-4xl font-bold text-gray-900 mb-1">60%</div>
<div className="text-lg 2xl:text-3xl font-bold text-gray-900 mb-1">120/250 <span className="text-gray-500">links</span></div>
</div>
<div className="text-sm text-gray-500 mb-2">until content publishing + LLM seeding unlocked</div>
<div className="text-xs 2xl:text-sm text-gray-500 mb-2">until content publishing + LLM seeding unlocked</div>
{/* Progress bar */}
<div className="w-70 h-3 bg-gray-200 rounded-full overflow-hidden">
<div
@@ -52,15 +52,15 @@ function ProgressMetrics() {
</div>
<div className="flex items-center md:w-1/3 w-full md:border-r-2 border-0 border-solid border-gray-300 2xl:gap-32 gap-3">
<div className="flex items-center md:w-1/3 w-full md:border-r-2 border-0 border-solid border-gray-300 2xl:gap-12 lg:gap-6 gap-3">
{/* 75% Keyword Visibility */}
<div className="w-[30%]">
<div className="text-4xl font-bold text-gray-900 mb-1">75%</div>
<div className="text-xl 2xl:text-3xl font-bold text-gray-900 mb-1">75%</div>
<div className="text-sm text-gray-500">Keyword Visibility</div>
</div>
<div className="flex items-center gap-3 w-[100%]">
<div className="flex items-center gap-3">
<div className="flex items-center gap-3 flex-wrap">
<MetricCard
img={ChatGPT} tooltipText="ChatGPT" valueChange="+1" size="sm" />

عرض الملف

@@ -12,7 +12,7 @@ const MetricCard = ({ icon: Icon, img: Img, value, label, tooltipText, valueChan
onMouseEnter={() => setIsHovered(true)}
onMouseLeave={() => setIsHovered(false)}>
<div className={`${extraStyle}`}>
<img src={Img} alt="Img" className="w-10 h-10" />
<img src={Img} alt="Img" className="w-8 2xl:w-10 h-8 2xl:h-10" />
</div>
<div className="">
{tooltipText && (

عرض الملف

@@ -15,7 +15,7 @@ export default function UrlDropdown() {
const [selected, setSelected] = useState(urlOptions[0]);
const toggleDropdown = () => setIsOpen((prev) => !prev);
const handleSelect = (url) => {
const handleSelect = (url: string) => {
setSelected(url);
setIsOpen(false);
};
@@ -24,7 +24,7 @@ export default function UrlDropdown() {
<div className="relative text-sm max-w-[400px] min-w-[220px] mb:mb-0 mb-4">
{/* Input box */}
<div
className="flex justify-between items-center border border-gray-300 bg-white px-2 py-1 rounded-xl cursor-pointer focus:border-2 focus:border-blue-500"
className="flex justify-between items-center border border-gray-300 bg-white px-2 py-1 rounded cursor-pointer focus:border-2 focus:border-blue-500"
onClick={toggleDropdown}
>
<span className="truncate text-gray-800">{selected}</span>

عرض الملف

@@ -16,7 +16,7 @@ export default {
lg: '1024px',
xl: '1400px',
'2xl': '1800px',
// '3xl': '1800px',
'3xl': '2000px',
},
},
},