add: nginx example website & dev: Makefile
This commit is contained in:
parent
8f789d51a0
commit
3ba95ed8a6
4 changed files with 227 additions and 0 deletions
81
Makefile
Normal file
81
Makefile
Normal file
|
@ -0,0 +1,81 @@
|
||||||
|
DOCKER=docker
|
||||||
|
SRC_DATA=data/
|
||||||
|
SRC_COMPOSE=srcs/
|
||||||
|
OUT_DATA=$(HOME)/inception_data # TODO to change
|
||||||
|
|
||||||
|
.ONESHELL :
|
||||||
|
.SHELLFLAGS = -eu -c
|
||||||
|
.PHONY : all run re data_install data_remove data_reinstall help
|
||||||
|
|
||||||
|
### pretty logs ####
|
||||||
|
|
||||||
|
_ECHO = echoo(){ \
|
||||||
|
if [ -t 1 ]; then \
|
||||||
|
echo "\e[30;47;1m$$*\e[0m"; \
|
||||||
|
else \
|
||||||
|
echo "$$*"; \
|
||||||
|
fi; \
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
### rules ###
|
||||||
|
|
||||||
|
|
||||||
|
## Run the compose, installing the necessary data if necessary.
|
||||||
|
all : data_install run
|
||||||
|
|
||||||
|
|
||||||
|
## Run the compose.
|
||||||
|
run :
|
||||||
|
@$(_ECHO)
|
||||||
|
|
||||||
|
echoo "Running '$(SRC_COMPOSE)'..."
|
||||||
|
echo "$ cd -- $(SRC_COMPOSE)"
|
||||||
|
cd -- $(SRC_COMPOSE)
|
||||||
|
echo "$ DATA=$(OUT_DATA) docker compose up --build"
|
||||||
|
DATA=$(OUT_DATA) docker compose up --build
|
||||||
|
|
||||||
|
|
||||||
|
## Reinstall the data then run it again.
|
||||||
|
re : data_reinstall run
|
||||||
|
|
||||||
|
|
||||||
|
## Install the necessary data if the directory doesn't exist yet.
|
||||||
|
data_install :
|
||||||
|
@$(_ECHO)
|
||||||
|
|
||||||
|
echoo "Copy '$(SRC_DATA)' to '$(OUT_DATA)'..."
|
||||||
|
if [ -d $(OUT_DATA) ]; then
|
||||||
|
echo "'$(OUT_DATA)' already exists."
|
||||||
|
else
|
||||||
|
echo "$ cp -r -- $(SRC_DATA) $(OUT_DATA)"
|
||||||
|
cp -r -- $(SRC_DATA) $(OUT_DATA)
|
||||||
|
echo "$ chmod -R 0777 -- $(OUT_DATA)"
|
||||||
|
chmod -R 0777 -- $(OUT_DATA)
|
||||||
|
fi
|
||||||
|
|
||||||
|
|
||||||
|
## Remove the necessary data..
|
||||||
|
data_remove :
|
||||||
|
@$(_ECHO)
|
||||||
|
|
||||||
|
echoo "Remove '$(OUT_DATA)'..."
|
||||||
|
echo "$ rm -rf -- $(OUT_DATA)"
|
||||||
|
rm -rf -- $(OUT_DATA)
|
||||||
|
|
||||||
|
|
||||||
|
## Remove then reinstall the necessary data.
|
||||||
|
data_reinstall : data_remove data_install
|
||||||
|
|
||||||
|
|
||||||
|
## Show help
|
||||||
|
help :
|
||||||
|
@$(_ECHO)
|
||||||
|
|
||||||
|
echo "all Run the compose, installing the necessary data if necessary."
|
||||||
|
echo "run Run the compose."
|
||||||
|
echo "re Reinstall the data then run it again."
|
||||||
|
echo "data_install Install the necessary data."
|
||||||
|
echo "data_remove Remove the compose data."
|
||||||
|
echo "data_reinstall Remove then reinstall the necessary data."
|
||||||
|
echo "help this lol"
|
BIN
data/nginx/www/VarelaRound.ttf
Normal file
BIN
data/nginx/www/VarelaRound.ttf
Normal file
Binary file not shown.
144
data/nginx/www/index.html
Normal file
144
data/nginx/www/index.html
Normal file
|
@ -0,0 +1,144 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<title>yippee</title>
|
||||||
|
<style>
|
||||||
|
|
||||||
|
* {
|
||||||
|
animation-play-state: paused;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face
|
||||||
|
{
|
||||||
|
font-family: "Varela Round";
|
||||||
|
src: url("/VarelaRound.ttf");
|
||||||
|
}
|
||||||
|
|
||||||
|
html {
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
body {
|
||||||
|
height: 100%;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
background: #000000;
|
||||||
|
}
|
||||||
|
|
||||||
|
.yippee {
|
||||||
|
font-size: 3em;
|
||||||
|
font-family: "Varela Round";
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes rotationoeoeoe {
|
||||||
|
0% { transform: rotate(0); }
|
||||||
|
100% { transform: rotate(360deg); }
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes pulseyayaya {
|
||||||
|
0% { transform: scale(1); }
|
||||||
|
50% { transform: scale(1.4); }
|
||||||
|
100% { transform: scale(1); }
|
||||||
|
}
|
||||||
|
/*
|
||||||
|
@keyframes rainbow {
|
||||||
|
0% { color: #f00; }
|
||||||
|
33% { color: #0f0; }
|
||||||
|
67% { color: #00f; }
|
||||||
|
100% { color: #f00; }
|
||||||
|
}*/
|
||||||
|
|
||||||
|
@keyframes rainbow {
|
||||||
|
0% { color: #f00; }
|
||||||
|
17% { color: #ff0; }
|
||||||
|
33% { color: #0f0; }
|
||||||
|
50% { color: #0ff; }
|
||||||
|
67% { color: #00f; }
|
||||||
|
83% { color: #f0f; }
|
||||||
|
100% { color: #f00; }
|
||||||
|
}
|
||||||
|
|
||||||
|
.yippee {
|
||||||
|
animation-name: rotationoeoeoe;
|
||||||
|
animation-duration: 1s;
|
||||||
|
animation-timing-function: linear;
|
||||||
|
animation-iteration-count: infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
.yippee > .yippeeinner {
|
||||||
|
animation-name: pulseyayaya;
|
||||||
|
animation-duration: .8s;
|
||||||
|
animation-timing-function: ease-in-out;
|
||||||
|
animation-iteration-count: infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
#one, #two, #three {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
position: absolute;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
animation-name: rainbow;
|
||||||
|
animation-duration: 1s;
|
||||||
|
animation-iteration-count: infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
#one {
|
||||||
|
z-index: 3;
|
||||||
|
color: #f00;
|
||||||
|
animation-delay: .0s;
|
||||||
|
}
|
||||||
|
|
||||||
|
#one > .yippee {
|
||||||
|
animation-delay: .0s;
|
||||||
|
}
|
||||||
|
|
||||||
|
#one > .yippee > .yippeeinner {
|
||||||
|
animation-delay: .0s;
|
||||||
|
}
|
||||||
|
|
||||||
|
#two {
|
||||||
|
z-index: 2;
|
||||||
|
color: #0f0;
|
||||||
|
opacity: .50;
|
||||||
|
animation-delay: .1s;
|
||||||
|
}
|
||||||
|
|
||||||
|
#two > .yippee {
|
||||||
|
animation-delay: .05s;
|
||||||
|
}
|
||||||
|
|
||||||
|
#two > .yippee > .yippeeinner {
|
||||||
|
animation-delay: .05s;
|
||||||
|
}
|
||||||
|
|
||||||
|
#three {
|
||||||
|
z-index: 1;
|
||||||
|
color: #00f;
|
||||||
|
opacity: .33;
|
||||||
|
animation-delay: .2s;
|
||||||
|
}
|
||||||
|
|
||||||
|
#three > .yippee {
|
||||||
|
animation-delay: .1s;
|
||||||
|
}
|
||||||
|
|
||||||
|
#three > .yippee > .yippeeinner {
|
||||||
|
animation-delay: .1s;
|
||||||
|
}
|
||||||
|
|
||||||
|
* {
|
||||||
|
animation-play-state: running;
|
||||||
|
}
|
||||||
|
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="one"><div class="yippee"><div class="yippeeinner">yippee</div></div></div>
|
||||||
|
<div id="two"><div class="yippee"><div class="yippeeinner">yippee</div></div></div>
|
||||||
|
<div id="three"><div class="yippee"><div class="yippeeinner">yippee</div></div></div>
|
||||||
|
</body>
|
||||||
|
</html>
|
|
@ -6,6 +6,8 @@ services:
|
||||||
image: nginx:latest
|
image: nginx:latest
|
||||||
ports:
|
ports:
|
||||||
- 8080:80
|
- 8080:80
|
||||||
|
volumes:
|
||||||
|
- ${DATA:?error}/nginx/www/:/usr/share/nginx/html:ro
|
||||||
|
|
||||||
### services ###
|
### services ###
|
||||||
# image:
|
# image:
|
||||||
|
|
Loading…
Add table
Reference in a new issue