DavidJentes
/
websitedesign2024
1
0
Fork 0
Code

Partway done, syncing to main PC

main
dugo3number2 2024-01-24 20:29:13 -06:00
parent 796d77ac62
commit a3d0b74197
5 changed files with 89 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/about/index.html
View File

@ -8,7 +8,7 @@
<body> <body>
<header> <header>
<h1>Beacon Blend</h1> <h1>Beacon Blend</h1>
<nav> <nav class="top">
<ul> <ul>
<li><a href="..">Home</a></li> <li><a href="..">Home</a></li>
<li><a href="#" id="current">About</a></li> <li><a href="#" id="current">About</a></li>
@ -33,12 +33,14 @@
</main> </main>
<footer> <footer>
<span>Beacon Blend</span> <span>Beacon Blend</span>
<ul> <nav>
<li><a href="..">Home</a></li> <ul>
<li><a href="#">About</a></li> <li><a href="..">Home</a></li>
<li><a href="menu">Menu</a></li> <li><a href="#">About</a></li>
<li><a href="order">Order</a></li> <li><a href="menu">Menu</a></li>
</ul><br /> <li><a href="order">Order</a></li>
</ul>
</nav><br />
<span>&copy;2024 Lighthouse Christian School</span><br /> <span>&copy;2024 Lighthouse Christian School</span><br />
<span>Created for LCS and Student Conventions by David Jentes</span> <span>Created for LCS and Student Conventions by David Jentes</span>
</footer> </footer>

75
src/assets/css/main.css Normal file
View File

@ -0,0 +1,75 @@
@import url('https://fonts.googleapis.com/css2?family=Libre+Baskerville&family=Noto+Sans:wght@400;700&family=Roboto:wght@400;700&family=Vast+Shadow&display=swap');
header {
text-align: center;
margin: 20px;
padding: 10px;
background-color: #eed3b3;
border-radius: 30px;
position: fixed;
top: 0px;
width: calc(100% - 60px);
z-index: 10;
}
header h1 {
font-family: 'Vast Shadow', sans-serif;
text-transform: uppercase;
font-size: 3rem;
display: inline-block;
}
nav ul {
list-style: none;
display: inline-block;
padding: 0;
}
nav li {
display: inline-block;
padding: 0;
}
nav a {
text-decoration: none;
color: inherit;
padding: 15px;
background-color: #ffe4c4;
border-radius: 20px;
font-size: 1rem;
transition: font-size 500ms, margin-top 200ms, background-color 200ms;
}
nav a:hover {
background-color: #ddc2a2;
font-size: calc(1rem + 10px);
}
body {
background-color : #ffe4c4;
color: #222222;
font-family: 'Libre Baskerville', sans-serif;
margin: 0;
}
.cover {
text-shadow: -1px 1px 0 #000000, 1px 1px 0 #000000, 1px -1px 0 #000000, -1px -1px 0 #000000;
text-align: center;
width: 100%;
padding: 25% 0px;
background-image: url("/assets/img/coffee.png");
background-attachment: fixed;
background-repeat: no-repeat;
background-size: cover;
background-position: center;
z-index: 10;
}
.cover-tagline {
font-size: 2rem;
color: #dddddd;
}
main {
margin: 30px;
}

BIN
src/assets/img/coffee.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.1 MiB

7
src/index.html
View File

@ -4,6 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Beacon Blend</title> <title>Beacon Blend</title>
<link rel="stylesheet" href="assets/css/main.css" />
</head> </head>
<body> <body>
<header> <header>
@ -18,7 +19,7 @@
</nav> </nav>
</header> </header>
<div class="cover"> <div class="cover">
<span>The best coffee made by the best students</span> <span class="cover-tagline">The best coffee made by the best students</span>
</div> </div>
<main> <main>
<section> <section>
@ -26,10 +27,10 @@
<h2>Information here</h2> <h2>Information here</h2>
</section> </section>
<section> <section>
<!-- Highlighted coffees --> <!-- New at the coffee shop -->
<h2>Mocha</h2> <h2>Mocha</h2>
<h2>Almond milk</h2>
<h2>Sugar-free</h2> <h2>Sugar-free</h2>
<h2>Almond Milk</h2>
</section> </section>
<section> <section>
<!-- Images --> <!-- Images -->

2
src/menu/index.html
View File

@ -42,7 +42,7 @@
<h2>All drinks are available with whole or almond milk.</h2> <h2>All drinks are available with whole or almond milk.</h2>
</section> </section>
<section> <section>
<h2>Syrups (with sugar)<h2> <h2>Syrups (with sugar)</h2>
<ul> <ul>
<li>Salted Caramel</li> <li>Salted Caramel</li>
<li>French Vanilla</li> <li>French Vanilla</li>