fuelprices/frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

first commit

Browse Source
This commit is contained in:
Anekdotin
2024-04-11 11:57:46 -04:00
commit fd8b8bfb04
33 changed files with 6099 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
src/app.d.ts vendored Executable file
View File

@@ -0,0 +1,12 @@
// See https://kit.svelte.dev/docs/types#app
// for information about these interfaces
declare global {
namespace App {
// interface Error {}
// interface Locals {}
// interface PageData {}
// interface Platform {}
}
}
export {};

12
src/app.html Executable file
View File

@@ -0,0 +1,12 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" href="%sveltekit.assets%/favicon.png" />
<meta name="viewport" content="width=device-width , initial-scale=1.0" />
%sveltekit.head%
</head>
<body data-sveltekit-preload-data="hover">
<div style="display: contents">%sveltekit.body%</div>
</body>
</html>

4
src/app.postcss Executable file
View File

@@ -0,0 +1,4 @@
/* Write your global styles here, in PostCSS syntax */
@tailwind base;
@tailwind components;
@tailwind utilities;

1
src/lib/index.ts Executable file
View File

@@ -0,0 +1 @@
// place files you want to import through the `$lib` alias in this folder.

13
src/lib/types/types.ts Normal file
View File

@@ -0,0 +1,13 @@
export type oilprice = {
ok: boolean
price: string;
}
export type company = {
ok: boolean
name: string;
telephone: string;
}

157
src/routes/+layout.svelte Executable file
View File

@@ -0,0 +1,157 @@
<script lang="ts">
import "../app.postcss";
import { onMount } from "svelte";
import { PUBLIC_BASE_URL } from "$env/static/public";
import type { company, oilprice } from '$lib/types/types'
export let company_data: company;
export let oil_price_data: oilprice;
let price_of_oil: string = '';
let company_name: string = '';
let tel_number: string = '';
onMount(async () => {
await fetch(PUBLIC_BASE_URL + "/info/price/oil", {
method: "get",
credentials: "include",
headers: {
"Content-Type": "application/json",
},
})
.then((response) => response.json())
.then((result) => (oil_price_data = result));
if (oil_price_data["ok"] == true) {
price_of_oil = oil_price_data["price"];
}
});
onMount(async () => {
await fetch(PUBLIC_BASE_URL + "/info/company", {
method: "get",
credentials: "include",
headers: {
"Content-Type": "application/json",
},
})
.then((response) => response.json())
.then((result) => (company_data = result));
if (company_data["ok"] == true) {
company_name = company_data["name"];
tel_number = company_data["telephone"];
}
});
</script>
<div class="grid grid-cols-12 bg-white overflow-hidden">
<div class="col-span-12 md:col-span-3 text-3xl p-10 text-base-100 font-bold invisible md:visible h-0 md:h-auto">
<div class="text-center pt-5">Call Today</div>
<div class="text-center">{tel_number}</div>
</div>
<div class="col-span-12 md:col-span-6 md:p-10 text-center font-bold ">
<div class="flex justify-center">
<a
class="normal-case text-8xl text-white bg-primary"
href="/"
>
Good
</a>
<a
class="normal-case text-8xl text-primary"
href="/"
>
Oil
</a>
</div>
<a
class="normal-case text-3xl text-primary text-primary"
href="/">Oil thats good for your system</a
>
</div>
<div
class=" col-span-12 md:col-span-3 md:p-10 text-3xl text-base-100 font-bold"
>
<div class="text-center pt-5">Todays Price</div>
<div class="text-center">{price_of_oil}</div>
</div>
</div>
<div class="navbar bg-primary">
<div class="navbar-start">
<div class="dropdown">
<div tabindex="0" role="button" class="btn btn-ghost lg:hidden">
<svg
xmlns="http://www.w3.org/2000/svg"
class="h-5 w-5"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
><path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M4 6h16M4 12h8m-8 6h16"
/></svg
>
</div>
<!-- svelte-ignore a11y-no-noninteractive-tabindex -->
<ul
tabindex="0"
class="menu menu-sm dropdown-content mt-3 z-[1] p-2 shadow bg-white rounded-box w-52 font-bold text-blue-800 "
>
<li><a class="text-2xl py-2 hover:bg-base-100" href="/delivery">Oil Delivery</a></li>
<li><a class="text-2xl py-2 hover:bg-base-100" href="/servicearea">Delivery Area</a></li>
<li><a class="text-2xl py-2 hover:bg-base-100" href="/about">About Us</a></li>
<li><a class="text-2xl py-2 hover:bg-base-100" href="/contact">Contact</a></li>
</ul>
</div>
<a class="btn btn-ghost text-xl">GoodOil</a>
</div>
<div class="navbar-center hidden lg:flex text-white">
<ul class="menu menu-horizontal px-1 text-xl">
<li><a href="/delivery">Oil Delivery</a></li>
<li><a href="/servicearea">Delivery Area</a></li>
<li><a href="/about">About Us</a></li>
<li><a href="/contact">Contact</a></li>
</ul>
</div>
<div class="navbar-end"></div>
</div>
<div class="body bg-white text-black">
<slot />
</div>
<div class="grid grid-cols-12 bg-secondary py-10 w-full">
<div
class="col-span-12 md:col-span-4 text-center text-white text-bold text-6xl"
>
<div class="flex justify-center pt-5">
<div class=" text-white px-1">Good</div>
<div class=" text-white px-1">Oil</div>
</div>
</div>
<div
class="col-span-12 md:col-span-4 text-center text-bold text-xl text-white"
>
<div class="">{tel_number}</div>
<div class="">Worcester Ma</div>
<div class="">Mon - Fri 8:00 am - 5:00 pm</div>
<div class="">Sat Closed | Sun Closed</div>
</div>
<div class="col-span-4 text-center"></div>
<div class="col-span-12 h-auto bg-primary text-white w-full">
<div class=" mx-auto max-w-7xl p-5">
<div class="text-xl font-bold text-center">
© 2023 by Rocket Services LLC - Auburn, MA | All Rights Reserved
</div>
</div>
</div>
</div>

165
src/routes/+page.svelte Executable file
View File

@@ -0,0 +1,165 @@
<script lang="ts">
import "../app.postcss";
import { onMount } from "svelte";
import { PUBLIC_BASE_URL } from "$env/static/public";
import type { company, oilprice } from '$lib/types/types'
export let company_data: company;
export let oil_price_data: oilprice;
let price_of_oil: string = '';
let company_name: string = '';
let tel_number: string = '';
onMount(async () => {
await fetch(PUBLIC_BASE_URL + "/info/price/oil", {
method: "get",
credentials: "include",
headers: {
"Content-Type": "application/json",
},
})
.then((response) => response.json())
.then((result) => (oil_price_data = result));
if (oil_price_data["ok"] == true) {
price_of_oil = oil_price_data["price"];
}
});
onMount(async () => {
await fetch(PUBLIC_BASE_URL + "/info/company", {
method: "get",
credentials: "include",
headers: {
"Content-Type": "application/json",
},
})
.then((response) => response.json())
.then((result) => (company_data = result));
if (company_data["ok"] == true) {
company_name = company_data["name"];
tel_number = company_data["telephone"];
}
});
</script>
<div class="bg-blue-900 text-white">
<div class="mx-auto p-0">
<img class="w-full p-0 m-0" src="/images/worc.jpg" alt="" />
</div>
<div class="mx-auto p-10">
<div class="mx-auto pb-5 text-5xl text-center">Order Now</div>
<div class="mx-auto text-5xl text-center">
{tel_number}
</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">
Why call good oil?
</div>
<div class="col-span-12 lg:col-span-2"></div>
<div class="col-span-12 lg:col-span-3 bg-base-100 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
cheapest prices.
</div>
</div>
<div class="col-span-12 lg:col-span-3 bg-base-100 p-10">
<div class="text-4xl mb-3">Phone Support</div>
<div class="text-lg">
We dont cut our product with products. Our Oil is pure #2 heating oil.
</div>
</div>
<div class="col-span-12 lg:col-span-3 bg-base-100 p-10">
<div class="text-4xl mb-3">Top Quality Oil</div>
<div class="text-lg">
We dont cut our product with products. Our Oil is pure #2 heating oil.
</div>
</div>
<div class="col-span-12 lg:col-span-2"></div>
</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-5xl text-blue-400 max-w-7xl mx-auto text-center md:text-left"
>
Serving these communites
</div>
<div
class="font-bold text-xl bg-blue-400 text-blue-800 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-2xl"
>
<div >
<div class="text-2xl">Auburn</div>
<div class="text-2xl">Millbury</div>
<div class="text-2xl">Sutton</div>
<div class="text-2xl">Oxford</div>
<div class="text-2xl">North Oxford</div>
<div class="text-2xl">Webster</div>
<div class="text-2xl">SouthBridge</div>
<div class="text-2xl">Douglas</div>
<div class="text-2xl">Holden</div>
<div class="text-2xl">Shrewsbury</div>
<div class="text-2xl">Grafton</div>
</div>
<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">West Brookfield</div>
<div class="text-2xl">Brookfield</div>
<div class="text-2xl">North Brookfield</div>
<div class="text-2xl">Worcester</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">Sutton</div>
<div class="text-2xl">Oxford</div>
<div class="text-2xl">North Oxford</div>
<div class="text-2xl">Webster</div>
<div class="text-2xl">SouthBridge</div>
<div class="text-2xl">Douglas</div>
<div class="text-2xl">Holden</div>
<div class="text-2xl">Shrewsbury</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">West Brookfield</div>
<div class="text-2xl">Brookfield</div>
<div class="text-2xl">North Brookfield</div>
<div class="text-2xl">Worcester</div>
</div>
</div>
</div>
<div class="col-span-12 py-5">
<div
class="flex justify-center items-center "
>
<img class="" src="/images/map.png" alt="" />
</div>
</div>
</div>
</div>
</div>
</div>

71
src/routes/about/+page.svelte Executable file
View File

@@ -0,0 +1,71 @@
<div class="bg-secondary px-10">
<div
class="max-w-7xl justify-center py-5 mx-auto font-bold text-2xl text-white"
>
About Us
</div>
</div>
<div class="max-w-7xl mx-auto px-10">
<div class="grid grid-cols-12 max-w-7xl gap-5">
<div class="col-span-12 text-2xl text-bold"></div>
<div class="col-span-12 md:col-span-6 mb-20">
<div class="col-span-12 mb-5 font-bold text-xl text-primary">
Our Oil Wont Ruin your heating system!
</div>
<div class="col-span-12 text-lg">
After 20 years delivering for other companies in Worcester. Our family
decided it was time to start our own small business. We have the
experience to ensure your family stays warm!
</div>
<div class="col-span-12 mb-5 text-2xl font-bold mt-10 text-primary">
The best oil in your Tank
</div>
<div class="col-span-12 mb-10">
<ul>
<div class="flex gap-5">
<img class=" p-0 m-0 h-10 w-5" src="/images/flame.png" alt="" />
<li class=" font-bold text-error">2-5% biodiesel (B2–B5) is Bioheat® fuel (Our Oil)</li>
</div>
<div class="flex gap-5">
<img class=" p-0 m-0 h-10 w-5" src="/images/flame.png" alt="" />
<li class=" font-bold">
5-20% biodiesel (B5–B20) is Bioheat Plus® fuel
</li>
</div>
<div class="flex gap-5">
<img class=" p-0 m-0 h-10 w-5" src="/images/flame.png" alt="" />
<li class=" font-bold">
20% biodiesel and above (B20+) is Bioheat Super Plus®
</li>
</div>
</ul>
</div>
<div class="col-span-12 mb-5 font-bold text-xl text-primary">
Symptoms your oil company is selling you bad oil
</div>
<div class="col-span-12 mb-10">
<ul class="text-lg">
<li>- System needs filters frequently</li>
<li>- Furnace has bad flame and doesnt produce high heat</li>
<li>- System is clogged</li>
<li>- Tank goes bad all of a sudden!</li>
</ul>
</div>
<div class="col-span-12 mb-5 font-bold text-xl">
See the slime? Imagine that all inside your tank and equipment!
</div>
<div class="col-span-12 mb-5 font-bold text-xl text-center">
Thats a bio filled system :(
</div>
<div class="col-span-12">
<img class="w-full p-0 m-0" src="/images/slimefilter.png" alt="" />
</div>
</div>
<div class="col-span-12 md:col-span-6">
<img class="w-full p-0 m-0" src="/images/oildelivery.jpg" alt="" />
</div>
</div>
</div>

91
src/routes/contact/+page.svelte Executable file
View File

@@ -0,0 +1,91 @@
<script lang="ts">
import "../../app.postcss";
import { onMount } from "svelte";
import { PUBLIC_BASE_URL } from "$env/static/public";
import type { company, oilprice } from '$lib/types/types'
export let company_data: company;
export let oil_price_data: oilprice;
let price_of_oil: string = '';
let company_name: string = '';
let tel_number: string = '';
onMount(async () => {
await fetch(PUBLIC_BASE_URL + "/info/price/oil", {
method: "get",
credentials: "include",
headers: {
"Content-Type": "application/json",
},
})
.then((response) => response.json())
.then((result) => (oil_price_data = result));
if (oil_price_data["ok"] == true) {
price_of_oil = oil_price_data["price"];
}
});
onMount(async () => {
await fetch(PUBLIC_BASE_URL + "/info/company", {
method: "get",
credentials: "include",
headers: {
"Content-Type": "application/json",
},
})
.then((response) => response.json())
.then((result) => (company_data = result));
if (company_data["ok"] == true) {
company_name = company_data["name"];
tel_number = company_data["telephone"];
}
});
</script>
<div class="bg-secondary px-10">
<div
class="max-w-7xl justify-center py-5 mx-auto font-bold text-2xl text-white"
>
Contact
</div>
</div>
<div class="max-w-7xl mx-auto px-10">
<div class="grid grid-cols-2">
<div class="col-span-1 p-5">
<div class="text-2xl font-bold text-primary">Contact Good Oil</div>
<div class="mb-20 text-xl">Phone: {tel_number}</div>
<div class="mb-10">
<div class="font-bold text-2xl text-primary max-w-7xl mx-auto">
Business Hours Summer
</div>
<div class="font-bold text-xl bg-primary text-white h-2 mb-2"></div>
<div class="text-xl">8:00 a.m. – 5:00 p.m.</div>
<div class="text-xl">Tuesday: 8:30 a.m. – 5:00 p.m.</div>
<div class="text-xl">Wednesday: 8:30 a.m. – 5:00 p.m.</div>
<div class="text-xl">Thursday: 8:00 a.m. – 5:00 p.m.</div>
<div class="text-xl">Friday: 8:00 a.m. – 3:00 p.m.</div>
<div class="text-xl">Saturday: Closed</div>
<div class="text-xl">Sunday: Closed</div>
</div>
<div class="">
<div class="font-bold text-2xl text-primary max-w-7xl mx-auto">
Business Hours Winter
</div>
<div class="font-bold text-xl bg-primary text-white h-2 mb-2"></div>
<div class="text-xl">8:00 a.m. – 5:00 p.m.</div>
<div class="text-xl">Tuesday: 8:30 a.m. – 5:00 p.m.</div>
<div class="text-xl">Wednesday: 8:30 a.m. – 5:00 p.m.</div>
<div class="text-xl">Thursday: 8:00 a.m. – 5:00 p.m.</div>
<div class="text-xl">Friday: 8:00 a.m. – 5:00 p.m.</div>
<div class="text-xl">Saturday: 8:00 a.m. – 1:00 p.m.</div>
<div class="text-xl">Sunday: Closed</div>
</div>
</div>
<div class="col-span-1">
<img class=" w-auto" src="/images/contact.png" alt="" />
</div>
</div>
</div>

107
src/routes/delivery/+page.svelte Executable file
View File

@@ -0,0 +1,107 @@
<script lang='ts'>
import "../../app.postcss";
import { onMount } from "svelte";
import { PUBLIC_BASE_URL } from "$env/static/public";
import type { company, oilprice } from '$lib/types/types'
export let company_data: company;
export let oil_price_data: oilprice;
let company_name: string = '';
let tel_number: string = '';
onMount(async () => {
await fetch(PUBLIC_BASE_URL + "/info/company", {
method: "get",
credentials: "include",
headers: {
"Content-Type": "application/json",
},
})
.then((response) => response.json())
.then((result) => (company_data = result));
if (company_data["ok"] == true) {
company_name = company_data["name"];
tel_number = company_data["telephone"];
}
});
</script>
<div class="bg-secondary px-10">
<div
class="max-w-7xl justify-center py-5 mx-auto font-bold text-2xl text-white"
>
Heating Oil Delivery
</div>
</div>
<div class="max-w-7xl mx-auto px-10">
<div class="grid grid-cols-12 max-w-7xl">
<div class="col-span-12 lg:col-span-6">
<div class="grid grid-cols-12">
<div class="col-span-12 font-bold text-2xl my-10">
We know it can be tough to order oil. We make it simple!
</div>
<div class="col-span-12 font-bold text-xl text-primary">
Worcester County
</div>
<div class="col-span-12 text-lg">
<ul>100 Gallon Minimum to Worcester County</ul>
<ul>Prime - 25$</ul>
<ul>Same Day - 150$</ul>
</div>
<div class="col-span-12 font-bold mt-10 text-xl text-primary">
Payments Methods
</div>
<div class="col-span-12 text-lg">
<ul>Cash on Delivery (C.O.D)</ul>
<ul>Credit Card</ul>
<ul>Money Order</ul>
</div>
<div class="col-span-12 mx-auto py-10">
<img class=" h-20 w-auto" src="/images/creditcards.png" alt="">
</div>
<div class="col-span-12 mb-10">
<ul>
<div class="flex gap-5">
<img class=" p-0 m-0 h-10 w-5" src="/images/flame.png" alt="" />
<li class=" font-bold text-error">2-5% biodiesel (B2–B5) is Bioheat® fuel (Our Oil)</li>
</div>
<div class="flex gap-5">
<img class=" p-0 m-0 h-10 w-5" src="/images/flame.png" alt="" />
<li class=" font-bold">
5-20% biodiesel (B5–B20) is Bioheat Plus® fuel
</li>
</div>
<div class="flex gap-5">
<img class=" p-0 m-0 h-10 w-5" src="/images/flame.png" alt="" />
<li class=" font-bold">
20% biodiesel and above (B20+) is Bioheat Super Plus®
</li>
</div>
</ul>
</div>
</div>
</div>
<div class="col-span-12 md:col-span-6">
<div class="col-span-12">
<img alt="" class="w-full p-0 m-0" src="/images/worc.jpg" />
</div>
</div>
<div class="col-span-12 mb-10
text-bold bg-primary text-white mt-10 text-5xl text-bold
p-5 text-center">
Call Today {tel_number}
</div>
</div>
</div>

81
src/routes/servicearea/+page.svelte Executable file
View File

@@ -0,0 +1,81 @@
<div class=" bg-secondary px-10">
<div
class="max-w-7xl justify-center py-5 mx-auto font-bold text-2xl text-white"
>
Delivery Area
</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-5xl text-secondary max-w-7xl mx-auto text-center md:text-left">
Serving these communites
</div>
<div class="font-bold text-xl bg-secondary text-primary 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">Sutton</div>
<div class="text-2xl">Oxford</div>
<div class="text-2xl">North Oxford</div>
<div class="text-2xl">Webster</div>
<div class="text-2xl">SouthBridge</div>
<div class="text-2xl">Douglas</div>
<div class="text-2xl">Holden</div>
<div class="text-2xl">Shrewsbury</div>
<div class="text-2xl">Grafton</div>
</div>
<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">West Brookfield</div>
<div class="text-2xl">Brookfield</div>
<div class="text-2xl">North Brookfield</div>
<div class="text-2xl">Worcester</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">Sutton</div>
<div class="text-2xl">Oxford</div>
<div class="text-2xl">North Oxford</div>
<div class="text-2xl">Webster</div>
<div class="text-2xl">SouthBridge</div>
<div class="text-2xl">Douglas</div>
<div class="text-2xl">Holden</div>
<div class="text-2xl">Shrewsbury</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">West Brookfield</div>
<div class="text-2xl">Brookfield</div>
<div class="text-2xl">North Brookfield</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/map.png">
</div>
</div>
</div>
</div>
</div>