some site updates
All checks were successful
ClarkeIS Build / Build-Docker-Image (push) Successful in 42s
All checks were successful
ClarkeIS Build / Build-Docker-Image (push) Successful in 42s
This commit is contained in:
Lazy Hippopotamus
24
Dockerfile
24
Dockerfile
@@ -1,12 +1,24 @@
|
|||||||
|
FROM swaous.asuscomm.com/sitix:latest AS build
|
||||||
|
# build the site
|
||||||
|
|
||||||
|
|
||||||
|
RUN mkdir site
|
||||||
|
|
||||||
|
COPY site site
|
||||||
|
|
||||||
|
RUN ls site
|
||||||
|
|
||||||
|
ARG SITIX_ENVIRONMENT="production"
|
||||||
|
|
||||||
|
RUN /sitix site -y -c ${SITIX_ENVIRONMENT}
|
||||||
|
|
||||||
|
|
||||||
FROM busybox:1.35
|
FROM busybox:1.35
|
||||||
|
|
||||||
# Create a non-root user to own the files and run our server
|
|
||||||
RUN mkdir /static
|
|
||||||
WORKDIR /static
|
|
||||||
|
|
||||||
# Copy the static website
|
# Copy the static website
|
||||||
# Use the .dockerignore file to control what ends up inside the image!
|
COPY --from=build /output /output
|
||||||
COPY . .
|
|
||||||
|
WORKDIR output
|
||||||
|
|
||||||
# Run BusyBox httpd
|
# Run BusyBox httpd
|
||||||
CMD ["busybox", "httpd", "-f", "-v", "-p", "80"]
|
CMD ["busybox", "httpd", "-f", "-v", "-p", "80"]
|
||||||
|
|||||||
Binary file not shown.
|
Before Width: | Height: | Size: 6.4 KiB |
@@ -1,57 +0,0 @@
|
|||||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
|
||||||
<!-- Created with Inkscape (http://www.inkscape.org/) -->
|
|
||||||
|
|
||||||
<svg
|
|
||||||
width="64mm"
|
|
||||||
height="64mm"
|
|
||||||
viewBox="0 0 64.000002 64"
|
|
||||||
version="1.1"
|
|
||||||
id="svg1"
|
|
||||||
inkscape:version="1.4 (e7c3feb100, 2024-10-09)"
|
|
||||||
sodipodi:docname="icon.svg"
|
|
||||||
inkscape:export-filename="icon.png"
|
|
||||||
inkscape:export-xdpi="96"
|
|
||||||
inkscape:export-ydpi="96"
|
|
||||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
|
||||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
xmlns:svg="http://www.w3.org/2000/svg">
|
|
||||||
<sodipodi:namedview
|
|
||||||
id="namedview1"
|
|
||||||
pagecolor="#ffffff"
|
|
||||||
bordercolor="#000000"
|
|
||||||
borderopacity="0.25"
|
|
||||||
inkscape:showpageshadow="2"
|
|
||||||
inkscape:pageopacity="0.0"
|
|
||||||
inkscape:pagecheckerboard="0"
|
|
||||||
inkscape:deskcolor="#d1d1d1"
|
|
||||||
inkscape:document-units="mm"
|
|
||||||
inkscape:zoom="0.71268238"
|
|
||||||
inkscape:cx="291.85512"
|
|
||||||
inkscape:cy="94.011024"
|
|
||||||
inkscape:window-width="1920"
|
|
||||||
inkscape:window-height="1011"
|
|
||||||
inkscape:window-x="0"
|
|
||||||
inkscape:window-y="0"
|
|
||||||
inkscape:window-maximized="1"
|
|
||||||
inkscape:current-layer="layer1"
|
|
||||||
inkscape:export-bgcolor="#ffffffff" />
|
|
||||||
<defs
|
|
||||||
id="defs1" />
|
|
||||||
<g
|
|
||||||
inkscape:label="Layer 1"
|
|
||||||
inkscape:groupmode="layer"
|
|
||||||
id="layer1"
|
|
||||||
transform="translate(-32.216804,-67.856489)">
|
|
||||||
<path
|
|
||||||
id="path1"
|
|
||||||
style="fill:#00ffff;stroke:#000000;stroke-width:0.164;stroke-linecap:round"
|
|
||||||
d="M 64.216803,71.650989 A 14.47875,14.47875 0 0 0 49.7381,86.130208 14.47875,14.47875 0 0 0 52.866591,95.067131 L 64.216803,127.48737 75.567014,95.067131 A 14.47875,14.47875 0 0 0 78.695505,86.130208 14.47875,14.47875 0 0 0 64.216803,71.650989 Z" />
|
|
||||||
<circle
|
|
||||||
style="fill:#ff0000;stroke:#000000;stroke-width:0.164;stroke-linecap:round"
|
|
||||||
id="path2"
|
|
||||||
cx="64.216805"
|
|
||||||
cy="85.879189"
|
|
||||||
r="5.1190114" />
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 1.9 KiB |
@@ -1,35 +0,0 @@
|
|||||||
<!DOCTYPE html>
|
|
||||||
<html>
|
|
||||||
<head>
|
|
||||||
<title>camera-info</title>
|
|
||||||
<link rel="stylesheet" href="main.css" />
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
||||||
<link rel="manifest" href="manifest.json" />
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<video id="magic_video" class="offscreen">video stream unavailable</video>
|
|
||||||
<div id="home" style="display: none;">
|
|
||||||
<button onclick="setdetails()" style="display: none;" id="endcamera">Next</button>
|
|
||||||
<canvas id="precanvas" class="offscreen"></canvas>
|
|
||||||
<div id="camview">
|
|
||||||
<div id="video-container">
|
|
||||||
<video id="preview">video stream unavailable</video>
|
|
||||||
</div>
|
|
||||||
<button onclick="takepicture()">Take Picture!</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div id="details" style="display: none;">
|
|
||||||
<span>Longitude: <input type="number" id="long"/></span>
|
|
||||||
<span>Latitude: <input type="number" id="lat"/></span>
|
|
||||||
<button onclick="populateLocation()" id="here">Current Location</button>
|
|
||||||
<span>Title: <input type="text" id="title" placeholder="123 A Place"/></span>
|
|
||||||
<span>Notes: <input type="text" id="notes" placeholder="Location Notes" /></span>
|
|
||||||
<button onclick="render()">Finish</button>
|
|
||||||
</div>
|
|
||||||
<div id="finalresult" style="display: none;">
|
|
||||||
<canvas id="final" width="720" height="480"></canvas>
|
|
||||||
<button onclick="download()">Download!</button>
|
|
||||||
</div>
|
|
||||||
<script src="main.js"></script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
@@ -1,83 +0,0 @@
|
|||||||
body {
|
|
||||||
margin: 0px;
|
|
||||||
padding: 0px;
|
|
||||||
}
|
|
||||||
|
|
||||||
body > div {
|
|
||||||
position: absolute;
|
|
||||||
top: 0px;
|
|
||||||
left: 0px;
|
|
||||||
width: 100vw;
|
|
||||||
height: 100vh;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
body > div > * {
|
|
||||||
margin: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#camview {
|
|
||||||
max-width: 100vw;
|
|
||||||
box-shadow: 0px 0px 50px 0px black;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
padding: 30px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
#camview.took {
|
|
||||||
position: fixed;
|
|
||||||
right: 0px;
|
|
||||||
bottom: 0px;
|
|
||||||
width: 150px;
|
|
||||||
z-index: 100;
|
|
||||||
display: inline-flex;
|
|
||||||
background-color: white;
|
|
||||||
padding: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#camview.took > button {
|
|
||||||
font-size: 1em;
|
|
||||||
}
|
|
||||||
|
|
||||||
#video-container {
|
|
||||||
max-width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
#camview > button {
|
|
||||||
font-size: 2em;
|
|
||||||
}
|
|
||||||
|
|
||||||
#precanvas {
|
|
||||||
height: 100%;
|
|
||||||
max-height: 4in;
|
|
||||||
flex-shrink: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
#preview {
|
|
||||||
width: 100%;
|
|
||||||
display: inline-block;
|
|
||||||
}
|
|
||||||
|
|
||||||
.offscreen {
|
|
||||||
position: absolute;
|
|
||||||
top: -10000px;
|
|
||||||
left: -10000px;
|
|
||||||
}
|
|
||||||
|
|
||||||
video.unbounded {
|
|
||||||
position: absolute;
|
|
||||||
height: 100vw !important;
|
|
||||||
width: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
#final {
|
|
||||||
max-width: 100vw;
|
|
||||||
border: 1px solid black;
|
|
||||||
}
|
|
||||||
@@ -1,143 +0,0 @@
|
|||||||
function frame(e) {
|
|
||||||
for (let el of document.querySelectorAll("body > div")) {
|
|
||||||
if (el.style.display != "none") {
|
|
||||||
el.style.display = "none";
|
|
||||||
window.app[el.id].exit();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
document.getElementById(e).style.display = "";
|
|
||||||
window.app[e].enter();
|
|
||||||
}
|
|
||||||
|
|
||||||
let canvas = document.getElementById("precanvas");
|
|
||||||
let ctx = canvas.getContext("2d");
|
|
||||||
let video = document.getElementById("magic_video");
|
|
||||||
|
|
||||||
function takepicture() {
|
|
||||||
let box = video.getBoundingClientRect();
|
|
||||||
video.classList.add("unbounded");
|
|
||||||
document.getElementById("endcamera").style.display = "";
|
|
||||||
ctx.canvas.classList.remove("offscreen");
|
|
||||||
document.getElementById("camview").classList.add("took")
|
|
||||||
// si c'est portrait, nous doivons le tourner à landscape (parce que le canvas ont besoin d'un photo landscape pour marcher bien)
|
|
||||||
if (box.height > box.width) {
|
|
||||||
canvas.width = box.height;
|
|
||||||
canvas.height = box.width;
|
|
||||||
ctx.translate(box.width/2, box.height/2);
|
|
||||||
ctx.rotate(Math.PI / 2);
|
|
||||||
ctx.drawImage(video, -box.width/2, -box.height/2, box.width, box.height);
|
|
||||||
ctx.rotate(-Math.PI / 2);
|
|
||||||
ctx.translate(-box.width/2, -box.height/2);
|
|
||||||
}
|
|
||||||
else {
|
|
||||||
canvas.width = box.width;
|
|
||||||
canvas.height = box.height;
|
|
||||||
ctx.drawImage(video, 0, 0, box.width, box.height);
|
|
||||||
}
|
|
||||||
video.classList.remove("unbounded");
|
|
||||||
}
|
|
||||||
|
|
||||||
function setdetails() {
|
|
||||||
frame("details");
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
if ("geolocation" in navigator) {
|
|
||||||
document.getElementById("here").style.display = "";
|
|
||||||
}
|
|
||||||
|
|
||||||
function populateLocation() {
|
|
||||||
navigator.geolocation.getCurrentPosition(pos => {
|
|
||||||
document.getElementById("long").value = pos.coords.longitude;
|
|
||||||
document.getElementById("lat").value = pos.coords.latitude;
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function render() {
|
|
||||||
frame("finalresult");
|
|
||||||
}
|
|
||||||
|
|
||||||
window.app = {
|
|
||||||
"home": {
|
|
||||||
enter() {
|
|
||||||
let preview = document.getElementById("preview");
|
|
||||||
navigator.mediaDevices.getUserMedia({ video: {
|
|
||||||
facingMode: { ideal: "environment" }
|
|
||||||
}, audio : false }).then((stream) => {
|
|
||||||
video.srcObject = stream;
|
|
||||||
video.play();
|
|
||||||
preview.srcObject = stream;
|
|
||||||
preview.play();
|
|
||||||
window.app.stream = stream;
|
|
||||||
});
|
|
||||||
},
|
|
||||||
exit() {
|
|
||||||
window.app.stream.getTracks().forEach(track => {
|
|
||||||
track.stop();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"details": {
|
|
||||||
enter() {
|
|
||||||
},
|
|
||||||
exit() {
|
|
||||||
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"finalresult": {
|
|
||||||
enter() {
|
|
||||||
let canvas = document.getElementById("final");
|
|
||||||
let ctx = canvas.getContext("2d");
|
|
||||||
ctx.font = "bold 48px sans-serif";
|
|
||||||
ctx.filLStyle = "black";
|
|
||||||
ctx.fillText(document.getElementById("title").value, 0, 48);
|
|
||||||
ctx.font = "bold 24px sans-serif";
|
|
||||||
ctx.fillText(new Date().toLocaleString(), 0, 76);
|
|
||||||
let lat = document.getElementById("lat").value;
|
|
||||||
let long = document.getElementById("long").value;
|
|
||||||
reverse_geocode(lat, long).then(res => {
|
|
||||||
ctx.fillText(res, 0, 104);
|
|
||||||
});
|
|
||||||
ctx.fillText("https://maps.google.com/maps?q=" + lat + "," + long, 0, 128);
|
|
||||||
ctx.fillText("Notes: " + document.getElementById("notes").value, 0, 154);
|
|
||||||
let image = document.getElementById("precanvas");
|
|
||||||
ctx.drawImage(image, 0, 160, 720 * 1/2, image.height / image.width * 720 * 1/2);
|
|
||||||
maps_static(lat, long, img => {
|
|
||||||
ctx.drawImage(img, 365, 160);
|
|
||||||
});
|
|
||||||
},
|
|
||||||
exit() {
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
frame("home");
|
|
||||||
|
|
||||||
|
|
||||||
async function reverse_geocode(lat, long) {
|
|
||||||
let res = await fetch("https://maps.googleapis.com/maps/api/geocode/json?zoom=6&latlng=" + lat + "," + long + "&key=AIzaSyD_zbdxwN7_aOMNH69eAL9bSS814Ix-UM8");
|
|
||||||
let json = await res.json();
|
|
||||||
return json.results[0].formatted_address;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
function maps_static(lat, long, cbk) {
|
|
||||||
let img = document.createElement("img");
|
|
||||||
document.body.appendChild(img);
|
|
||||||
img.classList.add("offscreen");
|
|
||||||
img.src = "https://maps.googleapis.com/maps/api/staticmap?size=355x300&key=AIzaSyD_zbdxwN7_aOMNH69eAL9bSS814Ix-UM8&markers=label:S%7C" + lat + "," + long;
|
|
||||||
img.crossOrigin = "anonymous";
|
|
||||||
img.onload = () => {
|
|
||||||
cbk(img);
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
function download() {
|
|
||||||
let canvas = document.getElementById("final");
|
|
||||||
let anchor = document.createElement("a");
|
|
||||||
anchor.href = canvas.toDataURL();
|
|
||||||
anchor.download = "file.png";
|
|
||||||
anchor.click();
|
|
||||||
}
|
|
||||||
@@ -1,17 +0,0 @@
|
|||||||
{
|
|
||||||
"name": "camera-info",
|
|
||||||
"start_url": ".",
|
|
||||||
"icons": [
|
|
||||||
{
|
|
||||||
"src": "icon.png",
|
|
||||||
"type": "image/png",
|
|
||||||
"sizes": "512x512"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"src": "icon.png",
|
|
||||||
"type": "image/png",
|
|
||||||
"sizes": "192x192"
|
|
||||||
}
|
|
||||||
],
|
|
||||||
"display": "standalone"
|
|
||||||
}
|
|
||||||
@@ -1,2 +0,0 @@
|
|||||||
<h1>Under Construction</h1>
|
|
||||||
Welcome to the Clarke Information Systems homepage! This website is currently under construction. Check back later!
|
|
||||||
3
output/.sitix
Executable file
3
output/.sitix
Executable file
@@ -0,0 +1,3 @@
|
|||||||
|
Project rendered by Sitix (by Tyler Clarke). Sitix is free and open source software protected by GPLv3. For more information on Sitix, see the website: https://swaous.asuscomm.com/sitix.
|
||||||
|
|
||||||
|
This file is automatically added to mark a project directory; the directory this is in will be FULLY DELETED by the next Sitix build and files in it should not be manually edited.
|
||||||
18
output/header-hider.js
Executable file
18
output/header-hider.js
Executable file
@@ -0,0 +1,18 @@
|
|||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
let old_scroll_top = document.documentElement.scrollTop;
|
||||||
|
|
||||||
|
function onscroll() {
|
||||||
|
if (document.documentElement.scrollTop > old_scroll_top + 100) {
|
||||||
|
document.getElementById("header").classList.add("hide");
|
||||||
|
old_scroll_top = document.documentElement.scrollTop;
|
||||||
|
}
|
||||||
|
if (document.documentElement.scrollTop < old_scroll_top) {
|
||||||
|
old_scroll_top = document.documentElement.scrollTop;
|
||||||
|
document.getElementById("header").classList.remove("hide");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
window.addEventListener("wheel", onscroll);
|
||||||
|
window.addEventListener("scroll", onscroll);
|
||||||
28
output/index.html
Executable file
28
output/index.html
Executable file
@@ -0,0 +1,28 @@
|
|||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title>Home | Clarke Information Systems</title>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<link rel="stylesheet" href="http://localhost:8080/main.css" />
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="header">
|
||||||
|
header stuff!
|
||||||
|
</div>
|
||||||
|
<div id="main">
|
||||||
|
hi!
|
||||||
|
lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div id="footer">
|
||||||
|
footer stuff!
|
||||||
|
</div>
|
||||||
|
<script src="http://localhost:8080/header-hider.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
23
output/main.css
Executable file
23
output/main.css
Executable file
@@ -0,0 +1,23 @@
|
|||||||
|
body {
|
||||||
|
margin: 0px;
|
||||||
|
padding: 0px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
#header {
|
||||||
|
position: sticky;
|
||||||
|
top: 0px;
|
||||||
|
padding: 10px;
|
||||||
|
background-color: white;
|
||||||
|
box-shadow: 0px 0px 5px 5px black;
|
||||||
|
transition: transform 0.5s;
|
||||||
|
}
|
||||||
|
|
||||||
|
#footer {
|
||||||
|
margin-top: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
#header.hide {
|
||||||
|
transform: translateY(-100%);
|
||||||
|
}
|
||||||
0
output/main.js
Executable file
0
output/main.js
Executable file
8
site/config.stx
Normal file
8
site/config.stx
Normal file
@@ -0,0 +1,8 @@
|
|||||||
|
[?]
|
||||||
|
|
||||||
|
[=config-]
|
||||||
|
[=baseurl "http://localhost:8080"]
|
||||||
|
[i production]
|
||||||
|
[=baseurl "https://clarkeis.com"]
|
||||||
|
[/]
|
||||||
|
[/]
|
||||||
22
site/default.html
Normal file
22
site/default.html
Normal file
@@ -0,0 +1,22 @@
|
|||||||
|
[?]
|
||||||
|
[#config.stx]
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title>[^title] | Clarke Information Systems</title>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<link rel="stylesheet" href="[^config.baseurl]/main.css" />
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="header">
|
||||||
|
header stuff!
|
||||||
|
</div>
|
||||||
|
<div id="main">
|
||||||
|
[^content]
|
||||||
|
</div>
|
||||||
|
<div id="footer">
|
||||||
|
footer stuff!
|
||||||
|
</div>
|
||||||
|
<script src="[^config.baseurl]/header-hider.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
18
site/header-hider.js
Normal file
18
site/header-hider.js
Normal file
@@ -0,0 +1,18 @@
|
|||||||
|
[!]
|
||||||
|
|
||||||
|
|
||||||
|
let old_scroll_top = document.documentElement.scrollTop;
|
||||||
|
|
||||||
|
function onscroll() {
|
||||||
|
if (document.documentElement.scrollTop > old_scroll_top + 100) {
|
||||||
|
document.getElementById("header").classList.add("hide");
|
||||||
|
old_scroll_top = document.documentElement.scrollTop;
|
||||||
|
}
|
||||||
|
if (document.documentElement.scrollTop < old_scroll_top) {
|
||||||
|
old_scroll_top = document.documentElement.scrollTop;
|
||||||
|
document.getElementById("header").classList.remove("hide");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
window.addEventListener("wheel", onscroll);
|
||||||
|
window.addEventListener("scroll", onscroll);
|
||||||
7
site/index.html
Normal file
7
site/index.html
Normal file
@@ -0,0 +1,7 @@
|
|||||||
|
[!]
|
||||||
|
[=title "Home"]
|
||||||
|
[=content-]
|
||||||
|
hi!
|
||||||
|
lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>lor<br>
|
||||||
|
[/]
|
||||||
|
[#default.html]
|
||||||
23
site/main.css
Normal file
23
site/main.css
Normal file
@@ -0,0 +1,23 @@
|
|||||||
|
body {
|
||||||
|
margin: 0px;
|
||||||
|
padding: 0px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
#header {
|
||||||
|
position: sticky;
|
||||||
|
top: 0px;
|
||||||
|
padding: 10px;
|
||||||
|
background-color: white;
|
||||||
|
box-shadow: 0px 0px 5px 5px black;
|
||||||
|
transition: transform 0.5s;
|
||||||
|
}
|
||||||
|
|
||||||
|
#footer {
|
||||||
|
margin-top: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
#header.hide {
|
||||||
|
transform: translateY(-100%);
|
||||||
|
}
|
||||||
1
site/main.js
Normal file
1
site/main.js
Normal file
@@ -0,0 +1 @@
|
|||||||
|
[!]
|
||||||
Reference in New Issue
Block a user