ghassan/scp-syria
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

latest

Browse Source
This commit is contained in:
root committed 2026-05-11 17:58:21 +00:00
1 parent b03c1d4619
commit b07423aef3
42 files changed
+1431 -394
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

resources/views/index.blade.php
+62 -26
View File
@@ -15,33 +15,69 @@
/* Bootstrap resets max-width:100% on all <img> which breaks Leaflet tiles */
.leaflet-container img { max-width: none !important; box-shadow: none !important; }
.leaflet-container { direction: ltr; }
/* ── Desktop: map + list fill remaining viewport height ─────────────── */
@media (min-width: 992px) {
html, body { height: 100%; overflow: hidden; }
body { display: flex; flex-direction: column; }
.app-topbar { flex-shrink: 0; }
.mob-hero-compact { flex-shrink: 0; }
#mainContent {
flex: 1;
min-height: 0;
display: flex;
flex-direction: column;
padding-bottom: 0.75rem !important;
}
#mainContent > .row {
flex: 1;
min-height: 0;
}
#mainContent .col-lg-8,
#mainContent .col-lg-4 {
display: flex;
flex-direction: column;
}
/* Map card */
#mainContent .col-lg-8 > .card {
flex: 1;
min-height: 0;
display: flex;
flex-direction: column;
}
#mainContent .col-lg-8 .card-body {
flex: 1;
min-height: 0;
overflow: hidden;
}
#map { height: 100% !important; }
/* List card */
#mainContent .col-lg-4 > .card {
flex: 1;
min-height: 0;
position: static !important;
display: flex;
flex-direction: column;
}
#parkingList {
flex: 1;
min-height: 0;
max-height: none !important;
overflow-y: auto;
}
}
</style>
</head>
<body style="background:#f1f5f9;font-family:'Cairo',sans-serif;">
{{-- ══ HEADER ══════════════════════════════════════════════════════════════ --}}
<header class="public-header">
<div class="container">
<div class="d-flex align-items-center justify-content-between">
<div class="d-flex align-items-center gap-3">
<div style="width:40px;height:40px;background:#6366f1;border-radius:.625rem;display:flex;align-items:center;justify-content:center;flex-shrink:0;">
<i class="bi bi-p-square-fill text-white" style="font-size:1.25rem;"></i>
</div>
<div>
<div class="fw-800" style="color:#f8fafc;font-size:1.05rem;line-height:1.2;">دمشق باركينغ</div>
<div style="color:#94a3b8;font-size:.72rem;">مواقف السيارات في دمشق</div>
</div>
</div>
<div class="d-flex align-items-center gap-2">
@include('partials.user-dropdown')
</div>
</div>
</div>
</header>
@include('partials.topbar')
{{-- ══ HERO SEARCH ═════════════════════════════════════════════════════════ --}}
<div class="mob-hero-compact" style="background:linear-gradient(135deg,#0f172a 0%,#1e3a5f 100%);padding:2.5rem 0 3rem;">
<div class="container text-center">
<div class="container-fluid text-center">
<h1 class="fw-800 mb-2 d-none d-md-block" style="color:#f8fafc;font-size:clamp(1.4rem,4vw,2rem);">
ابحث عن موقف سيارات في دمشق
</h1>
@@ -72,7 +108,7 @@
</div>
{{-- ══ MAIN CONTENT ════════════════════════════════════════════════════════ --}}
<div class="container py-4 mob-nav-pad">
<div id="mainContent" class="container-fluid py-4 mob-nav-pad">
<div class="row g-3">
{{-- Parking List (RTL: renders on right side, but we put it second so it's on LEFT visually) --}}
@@ -81,7 +117,7 @@
{{-- MAP --}}
<div class="col-lg-8 order-lg-1 mob-section-map">
<div class="card h-100" style="min-height:520px;">
<div class="card h-100">
<div class="card-header d-flex align-items-center justify-content-between">
<span class="fw-700 text-sm" style="color:#0f172a;">
<i class="bi bi-map me-1" style="color:#6366f1;"></i>
@@ -90,7 +126,7 @@
<span class="badge badge-soft-primary text-xs" id="map-count">--</span>
</div>
<div class="card-body p-0" style="border-radius:0 0 .75rem .75rem;overflow:hidden;">
<div id="map" style="height:500px;"></div>
<div id="map"></div>
</div>
</div>
</div>
@@ -105,7 +141,7 @@
</span>
<span class="badge badge-soft-success text-xs" id="list-count">{{ $lots->count() }} موقف</span>
</div>
<div style="max-height:500px;overflow-y:auto;scrollbar-width:thin;" id="parkingList">
<div style="overflow-y:auto;scrollbar-width:thin;" id="parkingList">
@forelse($lots as $lot)
@php
$avail = $lot['avail'];
@@ -130,7 +166,7 @@
<p class="text-xs mb-2" style="color:#94a3b8;">{{ $lot['address'] }}</p>
<div class="d-flex gap-3 text-xs" style="color:#64748b;">
<span><i class="bi bi-car-front me-1"></i>{{ $total }}</span>
<span><i class="bi bi-currency-exchange me-1"></i>{{ number_format($lot['price']) }} ر.س</span>
<span><i class="bi bi-currency-exchange me-1"></i>{{ number_format($lot['price']) }} ليرة سورية</span>
<span><i class="bi bi-clock me-1"></i>{{ $lot['hours'] }}</span>
</div>
</div>
@@ -370,7 +406,7 @@
if (l.avail < l.total * .2) return { cls: 'avail-limited', text: `${l.avail} محدود`, pct: Math.round((l.total - l.avail) / l.total * 100) };
return { cls: 'avail-open', text: `${l.avail} متاح`, pct: Math.round((l.total - l.avail) / l.total * 100) };
}
const fmtPrice = p => new Intl.NumberFormat('ar-SY').format(p) + ' ر.س';
const fmtPrice = p => new Intl.NumberFormat('ar-SY').format(p) + ' ليرة سورية';
// ── Map (lazy-init on mobile) ─────────────────────────────────────────
let map = null, mapReady = false;
@@ -379,7 +415,7 @@
if (mapReady) { map?.invalidateSize(); return; }
mapReady = true;
map = L.map('map').setView([33.5138, 36.2765], 12);
map = L.map('map', { attributionControl: false }).setView([33.5138, 36.2765], 12);
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: '© OpenStreetMap'
}).addTo(map);