Temporary site built
This commit is contained in:
Tara Wilson
parent
fde357fe71
commit
60c664be47
2
.gitignore
vendored
2
.gitignore
vendored
|
|
@ -12,3 +12,5 @@
|
|||
# Built Visual Studio Code Extensions
|
||||
*.vsix
|
||||
|
||||
#macOS garbage
|
||||
**/.DS_Store
|
||||
|
|
|
|||
3
Dockerfile
Normal file
3
Dockerfile
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
FROM nginx:latest-alpine
|
||||
COPY /source /usr/share/nginx/html
|
||||
COPY nginx.conf /etc/nginx/nginx.conf
|
||||
10
build-production.sh
Executable file
10
build-production.sh
Executable file
|
|
@ -0,0 +1,10 @@
|
|||
#PREPARE
|
||||
echo "Setting Version"
|
||||
VERSION_NUMBER=$(date +%Y)"."$(date +%m)"."$(date +%d)
|
||||
echo $VERSION_NUMBER
|
||||
|
||||
#PACKAGE
|
||||
echo "Dockerizing"
|
||||
docker build -t troop20-web:$VERSION_NUMBER -f Dockerfile .
|
||||
docker tag troop20-web:$VERSION_NUMBER terralilly85/troop20-web:$VERSION_NUMBER
|
||||
docker buildx build --platform linux/amd64,linux/arm64 --push -t terralilly85/troop20-web:$VERSION_NUMBER .
|
||||
13
nginx.conf
Normal file
13
nginx.conf
Normal file
|
|
@ -0,0 +1,13 @@
|
|||
events{}
|
||||
http {
|
||||
include /etc/nginx/mime.types;
|
||||
server {
|
||||
listen 80;
|
||||
server_name localhost;
|
||||
root /usr/share/nginx/html;
|
||||
index index.html;
|
||||
location / {
|
||||
try_files $uri $uri/ /index.html;
|
||||
}
|
||||
}
|
||||
}
|
||||
BIN
source/images/bsa-logo.png
Normal file
BIN
source/images/bsa-logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 9.0 KiB |
BIN
source/images/down.gif
Normal file
BIN
source/images/down.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 40 KiB |
BIN
source/images/favicon.ico
Normal file
BIN
source/images/favicon.ico
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 207 KiB |
BIN
source/images/fe-logo.png
Normal file
BIN
source/images/fe-logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 209 KiB |
57
source/index.html
Normal file
57
source/index.html
Normal file
|
|
@ -0,0 +1,57 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Troop 20 - Columbiana, Ohio</title>
|
||||
<link rel="icon" type="image/x-icon" href="./images/favicon.ico">
|
||||
<link rel="stylesheet" href="./styles.css">
|
||||
|
||||
<body>
|
||||
<script src="./scripts.js"></script>
|
||||
|
||||
<div class="parallax parallax-one">
|
||||
<div class="caption">
|
||||
<a href="https://www.scouting.org" target="_blank" rel="noopener noreferrer">
|
||||
<img class="image" src="./images/bsa-logo.png" alt="Scouting BSA logo"/>
|
||||
</a>
|
||||
<a href="https://www.fortyandeight.org" target="_blank" rel="noopener noreferrer">
|
||||
<img class="image" src="./images/fe-logo.png" alt="40 and 8s logo"/>
|
||||
</a>
|
||||
<br/> <br/>
|
||||
<div class="glass">
|
||||
<span class="border">Troop 20 Columbiana, Ohio</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="spacer-block spacer-two">
|
||||
Founded in 2020, and Chartered by 40 & 8s Voiture 273, Troop 20 proudly serves Columbiana, Leetonia, and East Palestine in Ohio by developing young people into tomorrow's leaders.
|
||||
</div>
|
||||
|
||||
<div class="parallax parallax-three">
|
||||
<div class="caption-lower">
|
||||
<div class="glass">
|
||||
<span class="border">Meetings are held on Thursdays At 7:30 PM</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="spacer-block spacer-one">
|
||||
The Troop has monthly outings which include Camping and Backpacking. The Troop also attends a week long Summer Camp Program.
|
||||
</div>
|
||||
|
||||
<div id="last-parallax" class="parallax parallax-two">
|
||||
<div class="caption-lower">
|
||||
<div class="glass">
|
||||
<span class="border">Join us for a new adventure!</span>
|
||||
<br/>
|
||||
<span class="border">44640 St RT 14, Columbiana, Ohio 44408</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<img id="scroll-image" class="scroll-image" src="./images/down.gif" alt="Scroll Down" />
|
||||
</body>
|
||||
</head>
|
||||
18
source/scripts.js
Normal file
18
source/scripts.js
Normal file
|
|
@ -0,0 +1,18 @@
|
|||
// This script shows and hides the scroll indicator in the lower
|
||||
// right hand corner of the page.
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
const image = document.getElementById('scroll-image');
|
||||
const lastParallax = document.getElementById('last-parallax');
|
||||
|
||||
const observer = new IntersectionObserver((entries) => {
|
||||
entries.forEach(entry => {
|
||||
if (entry.isIntersecting) {
|
||||
image.style.display = 'none';
|
||||
} else {
|
||||
image.style.display = 'block'
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
observer.observe(lastParallax);
|
||||
});
|
||||
104
source/styles.css
Normal file
104
source/styles.css
Normal file
|
|
@ -0,0 +1,104 @@
|
|||
.parallax {
|
||||
/* Create the parallax scrolling effect */
|
||||
background-attachment: fixed;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.parallax-one {
|
||||
background-image: url('https://images.unsplash.com/photo-1505490096310-204ef067fe6b?q=80&w=3270&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D');
|
||||
}
|
||||
|
||||
.parallax-two {
|
||||
background-image: url('https://images.unsplash.com/photo-1566679056462-2075774c8c07?q=80&w=3130&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D');
|
||||
}
|
||||
|
||||
.parallax-three {
|
||||
background-image: url('https://images.unsplash.com/photo-1469433791803-c2719135f970?q=80&w=3270&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D');
|
||||
}
|
||||
|
||||
.glass {
|
||||
backdrop-filter: blur(6px) saturate(200%);
|
||||
-webkit-backdrop-filter: blur(6px) saturate(200%);
|
||||
background-color: rgba(17, 25, 40, 0.6);
|
||||
border: 0px solid rgba(255, 255, 255, 0.125);
|
||||
}
|
||||
|
||||
.spacer-block {
|
||||
position: relative;
|
||||
font-size: 25px;
|
||||
text-align: center;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.spacer-one {
|
||||
background-color: #B39475;
|
||||
}
|
||||
|
||||
.spacer-two {
|
||||
background-color: #9AB3D5;
|
||||
}
|
||||
|
||||
.image {
|
||||
height: 250px;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.scroll-image {
|
||||
position: fixed;
|
||||
right: 0px;
|
||||
bottom: 0px;
|
||||
margin-bottom: 5px;
|
||||
margin-right: 5px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.glass {
|
||||
backdrop-filter: blur(6px) saturate(200%);
|
||||
-webkit-backdrop-filter: blur(6px) saturate(200%);
|
||||
background-color: rgba(0, 0, 0, 0.65);
|
||||
border: 1px solid rgba(255, 255, 255, 0.125);
|
||||
}
|
||||
|
||||
.caption {
|
||||
position: relative;
|
||||
left: 0;
|
||||
top: 25%;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
text-wrap: inherit;
|
||||
}
|
||||
|
||||
.caption-lower {
|
||||
position: relative;
|
||||
left: 0;
|
||||
top: 45%;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
text-wrap: inherit;
|
||||
}
|
||||
|
||||
.caption span.border {
|
||||
font-size: 25px;
|
||||
text-wrap: inherit;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.caption-lower span.border {
|
||||
font-size: 25px;
|
||||
text-wrap: inherit;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
body, html {
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
@media only screen and (max-device-width: 1366px) {
|
||||
.parallax {
|
||||
background-attachment: scroll;
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user