restore public_html

This commit is contained in:
Josh Ashton
2023-05-09 22:14:56 -06:00
parent 65c68b90dc
commit 1e7af0b94b
98 changed files with 4952 additions and 27 deletions
Binary file not shown.
+57
View File
@@ -0,0 +1,57 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1" charset="utf-8" lang="en">
<link rel="stylesheet" type="text/css" href="css/style.css">
<title>About</title>
</head>
<body>
<nav>
<ul>
<a href="index.html"><li>Ashton Pizzeria</li></a>
<a href="contact.html"><li>Contact Us</li></a>
<a href="about.html"><li>About</li></a>
<a href="order.html"><li id="spotlight">Order Now!</li></a>
</ul>
</nav>
<div class="cover-img">
<img src="img/outdoor-dining.jpg">
<h1>About</h1>
</div>
<main>
<p class="info">Ashton Pizzeria opened it's doors May 25, 2001.
Family-owned, Ashton Pizzeria was the stomach-child of Josh Ashton.
Working hard with his parents, Richard and Tracy, the trio spent years prior to the grand opening cultivating
and perfecting recipes for the pizzeria.
<br><br>
The Ashton's have a long history with pizza, with regularly made homemade pizzas each week.
Pizza wasn't just a food for the Ashton's: it was a lifestyle.
The Ashton's truly believe that everyone is happier when they have some pizza.
<br><br>
The next step was to make pizza as accessible as possible to anyone.
Not some frozen or processed pizza one finds at <span id="strike">Little Caesar's</span> other pizzeria's,
but true artisanal pizza made fresh for each customer.
<br><br>
We're still making pizza after 20 years, and our family will continue to make pizza for the next 20 years!
</p>
<br>
</main>
</body>
</html>
+61
View File
@@ -0,0 +1,61 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1" charset="utf-8" lang="en">
<link rel="stylesheet" type="text/css" href="css/style.css">
<title>Contact</title>
</head>
<body>
<nav>
<ul>
<a href="index.html"><li>Ashton Pizzeria</li></a>
<a href="contact.html"><li>Contact Us</li></a>
<a href="about.html"><li>About</li></a>
<a href="order.html"><li id="spotlight">Order Now!</li></a>
</ul>
</nav>
<div class="cover-img">
<img src="img/hand-made2.jpg">
<h1>Contact</h1>
</div>
<main>
<p class="info">Please reach out with any feedback you have for us!
Just as we care about serving the best quality pizza, we also care about our service.
Let us know of any negative experiences, and especially all of your positive experiences!
We want to know when we're doing something right, and when we are not. Thank you!
</p>
<br>
<form id="contactForm" action="https://www.stonecoldprofessor.com/pizza-contact.php" method="post">
<div class="newRow">
<input type="text" name="first-name" placeholder="First Name">
<input type="text" name="last-name" placeholder="Last Name">
<input type="email" name="email" placeholder="jsmith@example.com">
</div>
<div class="newRow">
<textarea class="comment" name="message" placeholder="Reach out with any questions!"></textarea>
</div>
<div class="newRow">
<input type="reset" name="reset" id="reset">
<input type="submit" name="submit" id="submit">
</div>
</form>
</main>
</body>
</html>
+309
View File
@@ -0,0 +1,309 @@
/*GENERAL*/
:root {
--main-dark-color: #162521;
--main-offwhite-color: #F7F7FF;
--main-midtone-color: #9BC995;
--main-accent-color: #EEF36A;
--secondary-accent-color: #98B9AB;
}
* {
margin: auto;
position: relative;
font-family: Lato;
font-size: 1em;
color: var(--main-offwhite-color);
}
html {
background-color: var(--main-dark-color);
margin-bottom: 5em;
}
main {
max-width: 1200px;
}
h1 {
font-size: 10em;
padding-top: 1em;
padding-bottom: 1em;
text-align: center;
}
h2 {
font-size: 5em;
text-align: center;
}
h3 {
font-size: 2em;
text-align: center;
}
h4 {
font-size: 1.4em;
padding: .5em;
text-align: center;
color: var(--main-offwhite-color);
background-color: var(--main-midtone-color);
}
p.info {
font-size: .9em;
padding: 2em;
margin-top: 2em;
margin-bottom: 2em;
text-align: center;
width: 60%;
color: var(--main-offwhite-color);
background-color: var(--main-midtone-color);
}
.cover-img {
max-width: 100%;
display: flex;
overflow: hidden;
margin-bottom: 1em;
}
.cover-img > img {
max-width: 100%;
position: absolute;
}
.cover-img > h1 {
position: relative;
}
#strike {
text-decoration: line-through;
}
/*NAVIGATION BAR*/
nav,
nav ul,
nav ul a,
nav ul a li {
background-color: var(--main-midtone-color);
color: var(--main-offwhite-color);
text-align: center;
}
nav ul a {
display: inline-block;
text-decoration: none;
}
nav ul a li {
display: block;
padding: 1em;
font-size: larger;
list-style: none;
width: 6.8em;
border-radius: 10px;
transition: background-color 250ms, color 500ms;
}
nav ul a li:hover {
background-color: var(--main-accent-color);
color: var(--main-dark-color);
}
/*ORDER & CONTACT FORM*/
form {
width: 80%;
}
input {
padding: 1em;
margin: .5em;
font-size: 1.2em;
min-width: 6.1em;
border-radius: 10px;
border: none;
color: var(--main-dark-color);
background-color: var(--main-offwhite-color);
transition: 500ms;
}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
-webkit-appearance: none;
margin: 0;
}
input[type=reset] {
background-color: var(--main-dark-color);
color: var(--main-offwhite-color);
}
input[type=reset]:hover {
background-color: var(--secondary-accent-color);
}
input[type=submit] {
background-color: var(--main-offwhite-color)
}
input[type=submit]:hover {
background-color: var(--main-accent-color);
}
input[type=number] {
-moz-appearance: textfield;
}
input[type="radio"], input[type="checkbox"] {
opacity: 0;
position: fixed;
width: 0;
}
label, label {
display: inline-block;
border: 2px solid var(--main-offwhite-color);
border-radius: 5px;
text-align: center;
padding: .5em;
margin: 0 2em 1em 2em;
transition: 500ms;
}
input[type="radio"]:checked + label, input[type="checkbox"]:checked + label {
background-color: var(--main-accent-color);
color: var(--main-dark-color);
}
input[type="radio"]:hover + label, input[type="checkbox"]:hover + label {
background-color: var(--main-accent-color);
color: var(--main-dark-color);
}
input[name="add1"], input[name="add2"] {
width: 100%;
}
input::placeholder, textarea.comment::placeholder {
color: var(--main-midtone-color);
font-style: italic;
font-size: .8em;
}
input:focus, textarea.comment:focus {
background-color: var(--main-midtone-color);
color: var(--main-offwhite-color);
}
select {
border: 2px solid var(--main-offwhite-color);
border-radius: 5px;
text-align: center;
color: var(--main-offwhite-color);
background-color: var(--main-midtone-color);
}
div.newRow {
display: flex;
justify-content: center;
}
div.newRow > :not(input.address){
width: 50%;
}
textarea.comment {
border: 1px solid var(--main-offwhite-color);
border-radius: 5px;
background-color: var(--main-offwhite-color);
color: var(--main-dark-color);
padding: 1em;
height: 4em;
transition: 500ms;
}
Binary file not shown.

After

Width:  |  Height:  |  Size: 8.4 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.5 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.0 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.7 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.3 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.8 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.2 MiB

+39
View File
@@ -0,0 +1,39 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1" charset="utf-8" lang="en">
<link rel="stylesheet" type="text/css" href="css/style.css">
<title>Home</title>
</head>
<body>
<nav>
<ul>
<a href="index.html"><li>Ashton Pizzeria</li></a>
<a href="contact.html"><li>Contact Us</li></a>
<a href="about.html"><li>About</li></a>
<a href="order.html"><li id="spotlight">Order Now!</li></a>
</ul>
</nav>
<div class="cover-img">
<img src="img/pizza-oven.jpg">
<h1>Home</h1>
</div>
<main>
<h3>It's Pizza Time!</h3>
<p class="info">At Ashton Pizzeria, you'll taste world-class pizza prepared fresh for each customer.
Our recipes are tried and true, with over 20 years of raving reviews!
We're proud of our long-standing tradition of offering quality ingredients, quality chefs, for a quality pizza.<p>
<br>
</main>
</body>
</html>
+442
View File
@@ -0,0 +1,442 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1" charset="utf-8" lang="en">
<link rel="stylesheet" type="text/css" href="css/style.css">
<title>Order</title>
</head>
<body>
<nav>
<ul>
<a href="index.html">
<li>Ashton Pizzeria</li>
</a>
<a href="contact.html">
<li>Contact Us</li>
</a>
<a href="about.html">
<li>About</li>
</a>
<a href="order.html">
<li id="spotlight">Order Now!</li>
</a>
</ul>
</nav>
<div class="cover-img">
<img src="img/fresh-veggies.jpg">
<h1>Order</h1>
</div>
<main>
<h3>Every pizza, made from scratch</h3>
<p class="info">Here at Ashton Pizzeria, we take tremendous pride in our award-winning pizza.
Every pizza is hand-made with fresh, all-natural ingredients,
and is cooking in our brick oven within 25 minutes of receiving an order.
With our free delivery service, you'll have your dream pizza within 40 minutes of placing an order.
</p>
<form action="https://www.stonecoldprofessor.com/pizza-order.php" method="post">
<h3>About You</h3>
<br>
<div class="newRow">
<input class="info" type="text" name="first" placeholder="First Name" required>
<input class="info" type="text" name="last" placeholder="Last Name" required>
</div>
<div class="newRow">
<input class="address info" type="text" name="add1" placeholder="Address 1" required>
</div>
<div class="newRow">
<input class="address info" type="text" name="add2" placeholder="Address 2">
</div>
<div class="newRow">
<input class="info" type="text" name="city" placeholder="City" required>
<select class="info" name="state" required>
<option value="AL">AL</option>
<option value="AK">AK</option>
<option value="AR">AR</option>
<option value="AZ">AZ</option>
<option value="CA">CA</option>
<option value="CO">CO</option>
<option value="CT">CT</option>
<option value="DC">DC</option>
<option value="DE">DE</option>
<option value="FL">FL</option>
<option value="GA">GA</option>
<option value="HI">HI</option>
<option value="IA">IA</option>
<option value="ID">ID</option>
<option value="IL">IL</option>
<option value="IN">IN</option>
<option value="KS">KS</option>
<option value="KY">KY</option>
<option value="LA">LA</option>
<option value="MA">MA</option>
<option value="MD">MD</option>
<option value="ME">ME</option>
<option value="MI">MI</option>
<option value="MN">MN</option>
<option value="MO">MO</option>
<option value="MS">MS</option>
<option value="MT">MT</option>
<option value="NC">NC</option>
<option value="NE">NE</option>
<option value="NH">NH</option>
<option value="NJ">NJ</option>
<option value="NM">NM</option>
<option value="NV">NV</option>
<option value="NY">NY</option>
<option value="ND">ND</option>
<option value="OH">OH</option>
<option value="OK">OK</option>
<option value="OR">OR</option>
<option value="PA">PA</option>
<option value="RI">RI</option>
<option value="SC">SC</option>
<option value="SD">SD</option>
<option value="TN">TN</option>
<option value="TX">TX</option>
<option value="UT">UT</option>
<option value="VT">VT</option>
<option value="VA">VA</option>
<option value="WA">WA</option>
<option value="WI">WI</option>
<option value="WV">WV</option>
<option value="WY">WY</option>
</select>
<input class="info" type="number" name="zip" placeholder="Zip" required>
</div>
<div class="newRow">
<input class="info" type="number" name="phone" placeholder="Phone Number">
<input class="info" type="email" name="email" placeholder="Email Address" required>
</div>
<br>
<h2>About your pizza</h2>
<br>
<!-- Radio options to choose pizza size, 10 options available. -->
<br>
<h4>SIZE</h4>
<br>
<div class="newRow">
<input id="XXS" type="radio" name="size" value="Extra Extra-Small">
<label for="XXS">ExtraExtra-Small | 6"</label><br>
<input id="XS" type="radio" name="size" value="Extra-Small">
<label for="XS">Extra-Small | 10"</label><br>
</div>
<div class="newRow">
<input id="S" type="radio" name="size" value="Small">
<label for="S">Small | 12"</label><br>
<input id="M" type="radio" name="size" value="Medium">
<label for="M">Medium | 14"</label><br>
</div>
<div class="newRow">
<input id="L" type="radio" name="size" value="Large">
<label for="L">Large | 16"</label><br>
<input id="XL" type="radio" name="size" value="Extra-Large">
<label for="XL">Extra-Large | 20"</label><br>
</div>
<div class="newRow">
<input id="XXL" type="radio" name="size" value="Extra Extra-Large">
<label for="XXL">ExtraExtra-Large | 24"</label><br>
<input id="XXXL" type="radio" name="size" value="Triple X-Large">
<label for="XXXL">Triple-Large | 30"</label><br>
</div>
<div class="newRow">
<input id="XXXXL" type="radio" name="size" value="Quadro-Large">
<label for="XXXXL">Quadro-Large | 36"</label><br>
<input id="XXXXXL" type="radio" name="size" value="Quinti-Large">
<label for="XXXXXL">Quinti-Large | 50"</label><br>
</div>
<!-- Radio options for crust selection, 10 options available. Drop-down does not make sense for either the size or crust, so the dropdown was implemented for the customer's state selection. -->
<br>
<h4>CRUST</h4>
<br>
<div class="newRow">
<input id="pan" type="radio" name="crust" value="pan">
<label for="pan">Pan</label><br>
<input id="thin" type="radio" name="crust" value="thin">
<label for="thin">Thin</label><br>
</div>
<div class="newRow">
<input id="deep" type="radio" name="crust" value="deep">
<label for="deep">Deep Dish</label><br>
<input id="neo" type="radio" name="crust" value="neo">
<label for="neo">Neopolitan</label><br>
</div>
<div class="newRow">
<input id="flat" type="radio" name="crust" value="flatbread">
<label for="flat">Flat Bread</label><br>
<input id="cracker" type="radio" name="crust" value="cracker">
<label for="cracker">Cracker</label><br>
</div>
<div class="newRow">
<input id="baconWrap" type="radio" name="crust" value="baconWrap">
<label for="baconWrap">Bacon-wrapped</label><br>
<input id="garlicCrust" type="radio" name="crust" value="garlicCrust">
<label for="garlicCrust">Garlic</label><br>
</div>
<div class="newRow">
<input id="stuffed" type="radio" name="crust" value="stuffed">
<label for="stuffed">Stuffed</label><br>
<input id="gluten-free" type="radio" name="crust" value="gluten-free">
<label for="gluten-free">Gluten-Free</label><br>
</div>
<!-- Toppings covers four areas: meats, greens, sauces, and cheeses.
Meats, greens, and cheeses are checkbox options (ie. multiple can be selected at once) while the selection of sauce is a radio option (only one selection allowed).
34 toppings options available.-->
<br>
<h2>Toppings</h2>
<br>
<!-- MEATS -->
<br>
<h4>MEATS</h4>
<br>
<div class="newRow">
<input type="checkbox" name="toppings[]" id="baconBits" value="Bacon Bits">
<label for="baconBits">Bacon Bits</label>
<input type="checkbox" name="toppings[]" id="ham" value="Ham">
<label for="ham">Ham</label>
</div>
<div class="newRow">
<input type="checkbox" name="toppings[]" id="sausageHot" value="Hot Sausage">
<label for="sausageHot">Hot Sausage</label>
<input type="checkbox" name="toppings[]" id="baconStrips" value="Bacon Strips">
<label for="baconStrips">Bacon Strips</label>
</div>
<div class="newRow">
<input type="checkbox" name="toppings[]" id="chicken" value="Chicken">
<label for="chicken">Chicken</label>
<input type="checkbox" name="toppings[]" id="beef" value="Beef">
<label for="beef">Ground Beef</label>
</div>
<div class="newRow">
<input type="checkbox" name="toppings[]" id="pep" value="Pepperoni">
<label for="pep">Pepperoni</label>
<input type="checkbox" name="toppings[]" id="sausageMild" value="Mild Sausage">
<label for="sausageMild">Mild Sausage</label>
</div>
<div class="newRow">
<input type="checkbox" name="toppings[]" id="steak" value="Steak">
<label for="steak">Steak</label>
<input type="checkbox" name="toppings[]" id="anchovies" value="Anchovies">
<label for="anchovies">Anchovies</label>
</div>
<!-- VEGETABLES -->
<br>
<h4>GREENS</h4>
<br>
<div class="newRow">
<input type="checkbox" name="toppings[]" id="tomatoes" value="Tomatoes">
<label for="tomatoes">Tomatoes</label>
<input type="checkbox" name="toppings[]" id="sunTomatoes" value="Sun-Dried Tomatoes">
<label for="sunTomatoes">Sun-Dried Tomatoes</label>
</div>
<div class="newRow">
<input type="checkbox" name="toppings[]" id="olivesBlack" value="Black Olives">
<label for="olivesBlack">Black Olives</label>
<input type="checkbox" name="toppings[]" id="olivesGreen" value="Green Olives">
<label for="olivesGreen">Olives Green</label>
</div>
<div class="newRow">
<input type="checkbox" name="toppings[]" id="spinach" value="Spinach">
<label for="spinach">Spinach</label>
<input type="checkbox" name="toppings[]" id="broccoli" value="Broccoli">
<label for="broccoli">Broccoli</label>
</div>
<div class="newRow">
<input type="checkbox" name="toppings[]" id="pepperRed" value="Red Peppers">
<label for="pepperRed">Roasted Red Peppers</label>
<input type="checkbox" name="toppings[]" id="pepperGreen" value="Green Peppers">
<label for="pepperGreen">Green Peppers</label>
</div>
<div class="newRow">
<input type="checkbox" name="toppings[]" id="pepperBanana" value="Bananna Peppers">
<label for="pepperBanana">Banana Peppers</label>
<input type="checkbox" name="toppings[]" id="jalepenos" value="Jalepenos">
<label for="jalepenos">Jalepenos</label>
</div>
<div class="newRow">
<input type="checkbox" name="toppings[]" id="pineapple" value="Pineapple">
<label for="pineapple">Pineapple</label>
<input type="checkbox" name="toppings[]" id="mushrooms" value="Mushrooms">
<label for="mushrooms">Mushrooms</label>
</div>
<div class="newRow">
<input type="checkbox" name="toppings[]" id="onion" value="Onion">
<label for="onion">Onion</label>
<input type="checkbox" name="toppings[]" id="avacado" value="Avacado">
<label for="avacado">Avacado</label>
</div>
<!-- SAUCES -->
<br>
<h4>SAUCES</h4>
<br>
<div class="newRow">
<input type="radio" name="toppings[]" id="marinara" value="marinara">
<label for="marinara">Marinara</label>
<input type="radio" name="toppings[]" id="ranch" value="ranch">
<label for="ranch">Ranch</label>
</div>
<div class="newRow">
<input type="radio" name="toppings[]" id="alfredo" value="alfredo">
<label for="alfredo">Alfredo</label>
<input type="radio" name="toppings[]" id="sauceBBQ" value="sauceBBQ">
<label for="sauceBBQ">Barbeque</label>
</div>
<div class="newRow">
<input type="radio" name="toppings[]" id="pesto" value="pesto">
<label for="pesto">Pesto</label>
<input type="radio" name="toppings[]" id="whiteGarlic" value="whiteGarlic">
<label for="whiteGarlic">White Garlic</label>
</div>
<!-- CHEESES -->
<br>
<h4>CHEESE</h4>
<br>
<div class="newRow">
<input type="checkbox" name="toppings[]" id="ricotta" value="ricotta">
<label for="ricotta">Ricotta</label>
<input type="checkbox" name="toppings[]" id="feta" value="feta">
<label for="feta">Feta</label>
</div>
<div class="newRow">
<input type="checkbox" name="toppings[]" id="blue" value="blue">
<label for="blue">Blue Cheese</label>
<input type="checkbox" name="toppings[]" id="provolone" value="provolone">
<label for="provolone">Provolone</label>
</div>
<br>
<div class="newRow">
<textarea class="comment" name="comments" placeholder="Anything else? Let us know!"></textarea>
</div>
<br>
<div class="newRow">
<input type="reset" name="reset" id="reset">
<input type="submit" name="submit" id="submit">
</div>
</form>
</main>
</body>
</html>