From 4b29e6fdb021a98046ff38ee3f8ccdcf9c15fb41 Mon Sep 17 00:00:00 2001 From: Ovidiu U Date: Tue, 7 Apr 2026 08:29:12 +0100 Subject: [PATCH] feat: add saved stations mockup with iconify-icon package --- ...1-enhanced-fuelalert-earthy-dashboard.html | 257 ++++++ .claude/mockup/02-price-alerts-setup.html | 274 ++++++ .../mockup/03-saved-stations-fuelalert.html | 225 +++++ .../04-fuelalert-price-trends-stats.html | 279 +++++++ package-lock.json | 19 + package.json | 1 + resources/js/app.js | 1 + resources/views/welcome.blade.php | 788 +++++++++++++----- 8 files changed, 1658 insertions(+), 186 deletions(-) create mode 100644 .claude/mockup/01-enhanced-fuelalert-earthy-dashboard.html create mode 100644 .claude/mockup/02-price-alerts-setup.html create mode 100644 .claude/mockup/03-saved-stations-fuelalert.html create mode 100644 .claude/mockup/04-fuelalert-price-trends-stats.html diff --git a/.claude/mockup/01-enhanced-fuelalert-earthy-dashboard.html b/.claude/mockup/01-enhanced-fuelalert-earthy-dashboard.html new file mode 100644 index 0000000..69d1078 --- /dev/null +++ b/.claude/mockup/01-enhanced-fuelalert-earthy-dashboard.html @@ -0,0 +1,257 @@ + + + + + + FuelAlert Earthy Dashboard + + + + + + + + +
+ +
+
+
+ +
+

FuelAlert

+
+ +
+ +
+ +
+
+ + +
+ +
+ + + +
+
+ + +
+
+
+
+

Recommendation

+

Fill up now

+
+
+
+ + + + + 80% +
+ Confidence +
+
+

+ Local prices are at a 30-day low. Regional wholesale trends indicate a 3p per litre increase starting Monday. Securing fuel today is highly advised. +

+
+
+ + +
+ +
+
+ + +
+
142.9p
+ +
+
+
145.7p
+ +
+
+
148.9p
+ +
+ + +
+
+ + Current +
+
+ + Recent +
+
+ + Stale +
+
+
+ + +
+
+

Stations Nearby

+ 26 Results +
+ +
+ +
+

Tesco Superstore

+
142.9p
+
+ +
+

Sainsbury's Fuel

+
143.1p
+
+ +
+

BP Connect

+
145.7p
+
+ +
+

Shell V-Power

+
148.9p
+
+ +
+

Esso Express

+
151.2p
+
+
+
+ + +
+
+
+
+

14-Day Forecast

+
+ + Pro +
+
+ + +
+ + + + + +
+ +
+
+
+
+
+
+ + + +
+ + \ No newline at end of file diff --git a/.claude/mockup/02-price-alerts-setup.html b/.claude/mockup/02-price-alerts-setup.html new file mode 100644 index 0000000..e36faf1 --- /dev/null +++ b/.claude/mockup/02-price-alerts-setup.html @@ -0,0 +1,274 @@ + + + + + + FuelAlert - Price Alerts Setup + + + + + + + + + + +
+ + +
+
+
+
+ +
+

FuelAlert

+
+ +
+
+ + +
+ +
+

Price Alerts

+

Get notified the moment fuel prices drop.

+
+ + +
+
+ +
+ +
+ + +
+
+ + +
+ +
+ + +
+
+ + +
+ +
+
+ Below + + p +
+
+
+ + +
+ +
+
+
+ + Push Notification +
+ +
+
+
+ + Email Alert +
+ +
+
+
+ + SMS (Pro Only) +
+ +
+
+
+ + + +
+
+ + +
+
+

Active Alerts

+ 2 Active +
+ +
+ +
+
+
+
+ Petrol +

London, SW1A

+
+

Threshold: Below 140.0p

+
+ +
+
+ + +
+
+ + +
+
+
+
+ Diesel +

Manchester, M1

+
+

Threshold: Below 145.0p

+
+ +
+
+ + +
+
+
+
+
+ + + +
+ +
+ +
+ + \ No newline at end of file diff --git a/.claude/mockup/03-saved-stations-fuelalert.html b/.claude/mockup/03-saved-stations-fuelalert.html new file mode 100644 index 0000000..edc9900 --- /dev/null +++ b/.claude/mockup/03-saved-stations-fuelalert.html @@ -0,0 +1,225 @@ + + + + + + Saved Stations - FuelAlert + + + + + + + + + + +
+ + +
+
+
+
+ +
+

FuelAlert

+
+ +
+
+ + +
+ +
+
+

Saved
Forecourts

+

Tracking 4 locations

+
+ +
+ + +
+ +
+
+
+

Tesco Superstore

+

+ + Warwick Road, London • 0.8 mi +

+
+
+
142.9p
+

Current

+
+
+
+ + +
+
+ + +
+
+
+

BP Connect

+

+ + Knightsbridge, London • 1.2 mi +

+
+
+
145.7p
+

Recent

+
+
+
+ + +
+
+ + +
+
+
+

Shell V-Power

+

+ + Vauxhall Bridge Rd • 2.4 mi +

+
+
+
148.9p
+

Stale

+
+
+
+ + +
+
+ + +
+
+
+

Esso Express

+

+ + Kensington High St • 3.1 mi +

+
+
+
151.2p
+

Outdated

+
+
+
+ + +
+
+
+ + +
+ +

+ Forecourts are automatically ranked by price freshness. We recommend filling up at stations marked green for the most accurate rates. +

+
+
+ + + +
+ +
+ +
+ + \ No newline at end of file diff --git a/.claude/mockup/04-fuelalert-price-trends-stats.html b/.claude/mockup/04-fuelalert-price-trends-stats.html new file mode 100644 index 0000000..0cd1ed1 --- /dev/null +++ b/.claude/mockup/04-fuelalert-price-trends-stats.html @@ -0,0 +1,279 @@ + + + + + + FuelAlert Price Trends & Stats + + + + + + + + + +
+ + +
+
+
+
+ +
+

FuelAlert

+
+ +
+
+ + +
+ +
+

Market Trends

+ +
+ + +
+
+ + +
+
+
+ 30D Average +
146.4p
+
+ + +1.2p from last month +
+
+
+ Current Lowest +
139.9p
+
Tesco, London SE1
+
+
+
+ + +
+
+
+

UK 30-Day Price Movement

+
+
+ + Peak +
+
+ + Low +
+
+
+ +
+ + + + + + + + + + + + + + + +
+ +
+
+ 30 Days Ago + 148.2p +
+
+ Lowest (May 12) + 140.1p +
+
+ Current + 145.9p +
+
+
+
+ + +
+
+
+

Regional Averages

+ vs National +
+
+
+ Greater London +
+ 149.2p + +2.8p +
+
+
+ Midlands +
+ 145.4p + -1.0p +
+
+
+ Northern Ireland +
+ 142.1p + -4.3p +
+
+
+ North West +
+ 144.8p + -1.6p +
+
+
+
+
+ + +
+
+
+ +

Weekly Market Insights

+
+ +
+
+
+ +
+
+

Price Warning

+

+ Wholesale crude oil prices spiked 4% yesterday. Retail forecourts usually lag by 3-5 days. Expect localized jumps by the weekend. +

+
+
+ +
+
+ +
+
+

Strategy Tip

+

+ Supermarkets in the North West are currently engaged in a price war. If you're heading that way, fill up at Tesco or Asda in Crewe for the best rates. +

+
+
+
+ +
+
+
+ Predicted Trend + Moderate Increase +
+ +
+
+
+
+
+ + + +
+ +
+ +
+ + \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index bb3eb6b..a5a4987 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,6 +8,7 @@ "@tailwindcss/vite": "^4.1.11", "autoprefixer": "^10.4.20", "concurrently": "^9.0.1", + "iconify-icon": "^3.0.2", "laravel-vite-plugin": "^3.0.0", "leaflet": "^1.9.4", "tailwindcss": "^4.0.7", @@ -50,6 +51,12 @@ "tslib": "^2.4.0" } }, + "node_modules/@iconify/types": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/@iconify/types/-/types-2.0.0.tgz", + "integrity": "sha512-+wluvCrRhXrhyOmRDJ3q8mux9JkKy5SJ/v8ol2tu4FVjyYvtEzkc/3pK15ET6RKg4b4w4BmTk1+gsCUhf21Ykg==", + "license": "MIT" + }, "node_modules/@jridgewell/gen-mapping": { "version": "0.3.13", "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.13.tgz", @@ -1001,6 +1008,18 @@ "node": ">=8" } }, + "node_modules/iconify-icon": { + "version": "3.0.2", + "resolved": "https://registry.npmjs.org/iconify-icon/-/iconify-icon-3.0.2.tgz", + "integrity": "sha512-DYPAumiUeUeT/GHT8x2wrAVKn1FqZJqFH0Y5pBefapWRreV1BBvqBVMb0020YQ2njmbR59r/IathL2d2OrDrxA==", + "license": "MIT", + "dependencies": { + "@iconify/types": "^2.0.0" + }, + "funding": { + "url": "https://github.com/sponsors/cyberalien" + } + }, "node_modules/is-fullwidth-code-point": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz", diff --git a/package.json b/package.json index c98fbe7..6b8e07b 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,7 @@ "@tailwindcss/vite": "^4.1.11", "autoprefixer": "^10.4.20", "concurrently": "^9.0.1", + "iconify-icon": "^3.0.2", "laravel-vite-plugin": "^3.0.0", "leaflet": "^1.9.4", "tailwindcss": "^4.0.7", diff --git a/resources/js/app.js b/resources/js/app.js index 9a1f7c3..74266b0 100644 --- a/resources/js/app.js +++ b/resources/js/app.js @@ -1,3 +1,4 @@ +import 'iconify-icon'; import { stationMap } from './maps/station-map.js'; document.addEventListener('alpine:init', () => { diff --git a/resources/views/welcome.blade.php b/resources/views/welcome.blade.php index 25a0178..804e018 100644 --- a/resources/views/welcome.blade.php +++ b/resources/views/welcome.blade.php @@ -1,204 +1,620 @@ - - - + + + + FuelAlert | Stop Overpaying for Fuel + + + + + + + @vite(['resources/css/app.css', 'resources/js/app.js']) + + + - - - - -
- @if (Route::has('login')) - - @endif + {{-- Mobile Header --}} +
+
+
+ +
+ FuelAlert +
+
-
-
-
-

Let's get started

-

Laravel has an incredibly rich ecosystem.
We suggest starting with the following.

-
    -
  • - - - - - - - Read the - - Documentation - - - - - + + {{-- Mobile Scrollable Main --}} +
    + + {{-- Search & Filters --}} +
    +
    + + +
    +
    + + + +
    +
    + + {{-- Recommendation Card --}} +
    +
    +
    +
    +

    Recommendation

    +

    Fill up now

    +
    +
    +
    + + + + + 80% +
    + Confidence +
    +
    +

    + Local prices are at a 30-day low. Regional wholesale trends indicate a 3p/litre increase starting Monday. Securing fuel today is highly advised. +

    +
    +
    + + {{-- Map Section --}} +
    + {{-- Simulated map grid --}} +
    +
    + + {{-- Map Markers --}} +
    +
    142.9p
    + +
    +
    +
    145.7p
    + +
    +
    +
    148.9p
    + +
    + + {{-- Legend --}} +
    +
    + + Current +
    +
    + + Recent +
    +
    + + Stale +
    +
    +
    + + {{-- Nearby Stations --}} +
    +
    +

    Stations Nearby

    + 26 Results +
    +
    +
    +

    Tesco Superstore

    +
    142.9p
    +
    +
    +

    Sainsbury's Fuel

    +
    143.1p
    +
    +
    +

    BP Connect

    +
    145.7p
    +
    +
    +

    Shell V-Power

    +
    148.9p
    +
    +
    +

    Esso Express

    +
    151.2p
    +
    +
    +
    + + {{-- 14-Day Forecast (Pro) --}} +
    +
    +
    +
    +

    14-Day Forecast

    +
    + + Pro +
    +
    +
    + + + +
    + +
    +
    +
    +
    +
    + +
    + + {{-- Mobile Tab Bar --}} + + +
{{-- end mobile layout --}} + + {{-- Desktop Layout (hidden on mobile) --}} +
+ + {{-- Plus (highlighted) --}} +
+
Most Popular
+
+

Plus

+
+ £2.49 + /mo +
+
+
    +
  • Everything in Basic
    • +
  • SMS alerts (up to 1/day)
    • +
  • Supermarket anchor tracking
    • +
  • Multi-location tracking
    • +
+ Join Plus +
+ + {{-- Pro --}} +
+
+

Pro

+
+ £3.99 + /mo +
+
+
    +
  • Everything in Plus
    • +
  • AI price predictions
    • +
  • SMS alerts (up to 3/day)
    • +
  • Exportable price history
    • +
+ Go Pro +
+
+ + + + {{-- Social Proof --}} +
+
+
+
+

Loved by commuters.

+
+ + + + + +
+

Join thousands of UK drivers saving every single month.

+
+
+
+

"I used to just go to the nearest station. Now I check FuelAlert and there's always a station 2 miles away that's 5p cheaper. Over a month it adds up to a free tank per year."

+
+
JR
+
+

James R.

+

Daily Commuter

+
+
+
+
+

"The predictions are eerily accurate. I was going to fill up Friday, FuelAlert said wait until Monday. Sure enough, my local Tesco dropped 3p. Brilliant."

+
+
SM
+
+

Sarah M.

+

Delivery Driver

+
+
+
+
+
+
+
+ + {{-- CTA Banner --}} +
+
+

Ready to outsmart the pumps?

+

Sign up free today and never pay over the odds for fuel again.

+
+ Create Free Account + Search Prices Now +
+
+
+ + {{-- Footer --}} + + + {{-- end desktop layout --}} + +