refactor: Reformat Svelte pages, move style block, and update image asset version.
This commit is contained in:
@@ -2,16 +2,14 @@
|
||||
import "../../app.postcss";
|
||||
import { onMount } from "svelte";
|
||||
import { PUBLIC_BASE_URL } from "$env/static/public";
|
||||
import type { company, oilprice } from '$lib/types/types'
|
||||
import '/static/fonts.css';
|
||||
import type { company, oilprice } from "$lib/types/types";
|
||||
import "/static/fonts.css";
|
||||
export let company_data: company;
|
||||
export let oil_price_data: oilprice;
|
||||
|
||||
|
||||
let price_of_oil: string = '';
|
||||
let company_name: string = '';
|
||||
let company_phone_number: string = '';
|
||||
|
||||
let price_of_oil: string = "";
|
||||
let company_name: string = "";
|
||||
let company_phone_number: string = "";
|
||||
|
||||
onMount(async () => {
|
||||
try {
|
||||
@@ -59,25 +57,30 @@
|
||||
}
|
||||
});
|
||||
</script>
|
||||
<style>
|
||||
.custom-font {
|
||||
font-family: 'EnterS', sans-serif;
|
||||
}
|
||||
</style>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
|
||||
<title>Auburn Oil: Quality Heating Oil Delivery in Southern Worcester County</title>
|
||||
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css"
|
||||
/>
|
||||
<title
|
||||
>Auburn Oil: Quality Heating Oil Delivery in Southern Worcester County</title
|
||||
>
|
||||
|
||||
<div class="bg-blue-oil text-white">
|
||||
<div class="bg-gray-oil px-10">
|
||||
<div class="max-w-7xl justify-center py-5 mx-auto font-bold text-white">
|
||||
<div class="max-w-7xl justify-center py-5 mx-auto font-bold text-white">
|
||||
<h1 class="text-center text-xl">Delivering Oil to Worcester County</h1>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mx-auto p-0 ">
|
||||
<div class="mx-auto p-0">
|
||||
<a href="/delivery">
|
||||
<img class="mx-auto p-0 m-0 overflow-hidden" src="/images/truck.png" alt="Auburn Massachusetts" />
|
||||
</a>
|
||||
<img
|
||||
class="mx-auto p-0 m-0 overflow-hidden"
|
||||
src="/images/truck.png"
|
||||
alt="Auburn Massachusetts"
|
||||
/>
|
||||
</a>
|
||||
</div>
|
||||
<!-- <div class="grid grid-cols-12 gap-5 px-5 text-center mt-10">
|
||||
<div class="col-span-12 font-bold text-4xl text-orange-oil mx-auto custom-font">
|
||||
@@ -90,13 +93,19 @@
|
||||
</div>
|
||||
</div> -->
|
||||
<div class="mx-auto p-10">
|
||||
<div class="flex justify-center gap-8 md:gap-20 flex-col md:flex-row custom-font">
|
||||
<div
|
||||
class="flex justify-center gap-8 md:gap-20 flex-col md:flex-row custom-font"
|
||||
>
|
||||
<div class="text-center w-full md:w-auto">
|
||||
<div class="pb-2 md:pb-5 text-3xl"><i class="fas fa-phone-alt mr-2"></i>Call Us</div>
|
||||
<div class="text-3xl ">508-426-8800</div>
|
||||
<div class="pb-2 md:pb-5 text-3xl">
|
||||
<i class="fas fa-phone-alt mr-2"></i>Call Us
|
||||
</div>
|
||||
<div class="text-3xl">508-426-8800</div>
|
||||
</div>
|
||||
<div class="text-center w-full md:w-auto">
|
||||
<div class="pb-2 md:pb-5 text-3xl"><i class="fas fa-sms mr-2"></i>Text</div>
|
||||
<div class="pb-2 md:pb-5 text-3xl">
|
||||
<i class="fas fa-sms mr-2"></i>Text
|
||||
</div>
|
||||
<div class="text-3xl">914-330-6100</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -108,20 +117,25 @@
|
||||
</div>
|
||||
</div> -->
|
||||
|
||||
<div class="bg-green-600 text-white p-4 mt-4 flex justify-center items-center gap-4 w-full md:w-1/2 md:mx-auto">
|
||||
<div
|
||||
class="bg-green-600 text-white p-4 mt-4 flex justify-center items-center gap-4 w-full md:w-1/2 md:mx-auto"
|
||||
>
|
||||
<img src="/images/paxton.jpg" alt="Paxton" class="w-16 h-16 rounded" />
|
||||
<span class="text-2xl font-bold">Now delivering to Paxton !</span>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-12 gap-5 px-5 text-center mt-10">
|
||||
<div class="col-span-12 font-bold text-4xl text-blue-400 mx-auto ">
|
||||
<div class="col-span-12 font-bold text-4xl text-blue-400 mx-auto">
|
||||
Why call Auburn Oil?
|
||||
</div>
|
||||
<div class="col-span-12 bg-orange-500 text-white p-6 text-center">
|
||||
<div class="text-4xl mb-5">Lightning Fast Delivery</div>
|
||||
<div class="text-xl">We're much faster than the competition, delivering home heating oil quickly and efficiently to keep your home warm.</div>
|
||||
<div class="text-xl">
|
||||
We're much faster than the competition, delivering home heating oil
|
||||
quickly and efficiently to keep your home warm.
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-span-12 lg:col-span-4 bg-gray-oil text-white p-10 ">
|
||||
<div class="col-span-12 lg:col-span-4 bg-gray-oil text-white p-10">
|
||||
<div class="text-4xl mb-3">Cheaper Prices</div>
|
||||
<div class="text-lg">
|
||||
No Middleman. No expensive bulk plants. Direct port to door for
|
||||
@@ -131,37 +145,34 @@
|
||||
<div class="col-span-12 lg:col-span-4 bg-gray-oil text-white p-10">
|
||||
<div class="text-4xl mb-3">Phone Support</div>
|
||||
<div class="text-lg">
|
||||
Real live person on the phone when you call. Text us if you prefer.
|
||||
We are here to help you.
|
||||
Real live person on the phone when you call. Text us if you prefer. We
|
||||
are here to help you.
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-span-12 lg:col-span-4 bg-gray-oil text-white p-10">
|
||||
<div class="text-4xl mb-3">Top Quality Oil</div>
|
||||
<div class="text-lg">
|
||||
We dont cut our oil with biodiesel. We use the best available
|
||||
fuel for your heating system.
|
||||
|
||||
We dont cut our oil with biodiesel. We use the best available fuel for
|
||||
your heating system.
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-span-12 lg:text-center text-center bg-gray-oil">
|
||||
<div class="text-3xl ">
|
||||
We Offer Automatic Delivery
|
||||
</div>
|
||||
<div class="text-xl p-5">We will automatically fill your home and keep your family comfortable without worries
|
||||
about oil levels.
|
||||
<div class="text-3xl">We Offer Automatic Delivery</div>
|
||||
<div class="text-xl p-5">
|
||||
We will automatically fill your home and keep your family comfortable
|
||||
without worries about oil levels.
|
||||
</div>
|
||||
<div class="text-xl">Always get priority delivery status.</div>
|
||||
</div>
|
||||
<div class="bg-red-500 col-span-12 lg:text-center text-center">
|
||||
<div class=" bg-red-500 text-3xl mb-3">Run out of oil?</div>
|
||||
<div class="bg-red-500 text-white p-4 my-4 text-center font-bold">
|
||||
We offer emergency after-hours, night, holiday, and weekend deliveries when you're running low or have run out of heating oil.
|
||||
We offer emergency after-hours, night, holiday, and weekend deliveries
|
||||
when you're running low or have run out of heating oil.
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-span-6 text-lg text-center">
|
||||
</div>
|
||||
<div class="col-span-6 text-lg text-center"></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="h-auto">
|
||||
@@ -181,7 +192,7 @@
|
||||
<div
|
||||
class="invisible md:visible h-0 md:h-auto flex gap-20 justify-center text-2xl"
|
||||
>
|
||||
<div >
|
||||
<div>
|
||||
<div class="text-2xl">Auburn</div>
|
||||
<div class="text-2xl">Millbury</div>
|
||||
<div class="text-2xl">Sutton</div>
|
||||
@@ -190,7 +201,7 @@
|
||||
<div class="text-2xl">Webster</div>
|
||||
<div class="text-2xl">Grafton</div>
|
||||
</div>
|
||||
<div >
|
||||
<div>
|
||||
<div class="text-2xl">Dudley</div>
|
||||
<div class="text-2xl">Charlton</div>
|
||||
<div class="text-2xl">Leicester</div>
|
||||
@@ -222,11 +233,21 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-span-12 py-5">
|
||||
<div class="flex justify-center items-center ">
|
||||
<img class="" src="/images/area.png" alt="Worcester County oil delivery" />
|
||||
<div class="flex justify-center items-center">
|
||||
<img
|
||||
class=""
|
||||
src="/images/area.png?v=2"
|
||||
alt="Worcester County oil delivery"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.custom-font {
|
||||
font-family: "EnterS", sans-serif;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,14 +1,13 @@
|
||||
<script lang='ts'>
|
||||
<script lang="ts">
|
||||
import "../../../app.postcss";
|
||||
import { onMount } from "svelte";
|
||||
import { PUBLIC_BASE_URL } from "$env/static/public";
|
||||
import type { company } from '$lib/types/types'
|
||||
import type { company } from "$lib/types/types";
|
||||
|
||||
export let company_data: company;
|
||||
|
||||
|
||||
let company_name: string = '';
|
||||
let tel_number: string = '';
|
||||
let company_name: string = "";
|
||||
let tel_number: string = "";
|
||||
|
||||
onMount(async () => {
|
||||
await fetch(PUBLIC_BASE_URL + "/info/company", {
|
||||
@@ -31,70 +30,76 @@
|
||||
<title>Delivery towns and Map</title>
|
||||
|
||||
<div class="bg-gray-oil px-10">
|
||||
<div class="max-w-7xl justify-center py-5 mx-auto font-bold text-white">
|
||||
<h1>Delivery Area</h1>
|
||||
</div>
|
||||
<div class="max-w-7xl justify-center py-5 mx-auto font-bold text-white">
|
||||
<h1>Delivery Area</h1>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="h-auto">
|
||||
<div class="mx-auto p-5">
|
||||
<div class="grid grid-cols-12 ">
|
||||
<div class="col-span-12 py-5 ">
|
||||
<div class="font-bold text-blue-oil mx-auto text-center md:text-left">
|
||||
<h3>Serving these communites</h3>
|
||||
</div>
|
||||
<div class="font-bold text-xl bg-gray-oil text-blue-oil h-10 mb-10">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-span-12 py-5 ">
|
||||
<div class="invisible md:visible h-0 md:h-auto flex gap-20 justify-center text-3xl">
|
||||
<div >
|
||||
<div class="text-2xl">Auburn</div>
|
||||
<div class="text-2xl">Millbury</div>
|
||||
<div class="text-2xl">Oxford</div>
|
||||
<div class="text-2xl">North Oxford</div>
|
||||
<div class="text-2xl">Webster</div>
|
||||
<div class="text-2xl">Grafton</div>
|
||||
<div class="text-2xl">Paxton</div>
|
||||
<div class="text-2xl">Worcester*</div>
|
||||
</div>
|
||||
<div >
|
||||
<div class="text-2xl">Dudley</div>
|
||||
<div class="text-2xl">Sutton</div>
|
||||
<div class="text-2xl">Charlton</div>
|
||||
<div class="text-2xl">Leicester</div>
|
||||
<div class="text-2xl">Cherry Valley</div>
|
||||
<div class="text-2xl">Rochdale</div>
|
||||
<div class="text-2xl">Spencer</div>
|
||||
|
||||
<div class="text-2xl">Paxton</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="visible sm:visible md:invisible h-auto sm:h-auto md:h-0">
|
||||
<div class="text-center">
|
||||
<div class="text-2xl">Auburn</div>
|
||||
<div class="text-2xl">Millbury</div>
|
||||
<div class="text-2xl">Oxford</div>
|
||||
<div class="text-2xl">North Oxford</div>
|
||||
<div class="text-2xl">Webster</div>
|
||||
<div class="text-2xl">Grafton</div>
|
||||
<div class="text-2xl">Dudley</div>
|
||||
<div class="text-2xl">Charlton</div>
|
||||
<div class="text-2xl">Leicester</div>
|
||||
<div class="text-2xl">Cherry Valley</div>
|
||||
<div class="text-2xl">Rochdale</div>
|
||||
<div class="text-2xl">Spencer</div>
|
||||
<div class="text-2xl">Sutton</div>
|
||||
<div class="text-2xl">Worcester</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-span-12 py-5 ">
|
||||
<div class="flex justify-center items-center md:h-auto">
|
||||
<img class="" src="/images/area.png" alt="Worcester County oil delivery">
|
||||
</div>
|
||||
</div>
|
||||
<div class="mx-auto p-5">
|
||||
<div class="grid grid-cols-12">
|
||||
<div class="col-span-12 py-5">
|
||||
<div class="font-bold text-blue-oil mx-auto text-center md:text-left">
|
||||
<h3>Serving these communites</h3>
|
||||
</div>
|
||||
<div
|
||||
class="font-bold text-xl bg-gray-oil text-blue-oil h-10 mb-10"
|
||||
></div>
|
||||
</div>
|
||||
<div class="col-span-12 py-5">
|
||||
<div
|
||||
class="invisible md:visible h-0 md:h-auto flex gap-20 justify-center text-3xl"
|
||||
>
|
||||
<div>
|
||||
<div class="text-2xl">Auburn</div>
|
||||
<div class="text-2xl">Millbury</div>
|
||||
<div class="text-2xl">Oxford</div>
|
||||
<div class="text-2xl">North Oxford</div>
|
||||
<div class="text-2xl">Webster</div>
|
||||
<div class="text-2xl">Grafton</div>
|
||||
<div class="text-2xl">Paxton</div>
|
||||
<div class="text-2xl">Worcester*</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="text-2xl">Dudley</div>
|
||||
<div class="text-2xl">Sutton</div>
|
||||
<div class="text-2xl">Charlton</div>
|
||||
<div class="text-2xl">Leicester</div>
|
||||
<div class="text-2xl">Cherry Valley</div>
|
||||
<div class="text-2xl">Rochdale</div>
|
||||
<div class="text-2xl">Spencer</div>
|
||||
|
||||
<div class="text-2xl">Paxton</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="visible sm:visible md:invisible h-auto sm:h-auto md:h-0">
|
||||
<div class="text-center">
|
||||
<div class="text-2xl">Auburn</div>
|
||||
<div class="text-2xl">Millbury</div>
|
||||
<div class="text-2xl">Oxford</div>
|
||||
<div class="text-2xl">North Oxford</div>
|
||||
<div class="text-2xl">Webster</div>
|
||||
<div class="text-2xl">Grafton</div>
|
||||
<div class="text-2xl">Dudley</div>
|
||||
<div class="text-2xl">Charlton</div>
|
||||
<div class="text-2xl">Leicester</div>
|
||||
<div class="text-2xl">Cherry Valley</div>
|
||||
<div class="text-2xl">Rochdale</div>
|
||||
<div class="text-2xl">Spencer</div>
|
||||
<div class="text-2xl">Sutton</div>
|
||||
<div class="text-2xl">Worcester</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-span-12 py-5">
|
||||
<div class="flex justify-center items-center md:h-auto">
|
||||
<img
|
||||
class=""
|
||||
src="/images/area.png?v=2"
|
||||
alt="Worcester County oil delivery"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
Reference in New Issue
Block a user