frzysk/inception
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

dev: reorganize

Browse source
This commit is contained in:
mcolonna 2025-03-27 14:59:22 +01:00
parent 5d72cc8d48
commit e406e26b4d
6 changed files with 21 additions and 53 deletions
Download patch file Download diff file Expand all files Collapse all files

6
srcs/compose.yaml → srcs/docker-compose.yml
View file

@ -3,11 +3,9 @@ name: my-awesome-compose
services:
nginx:
# TODO no latest??
image: nginx:latest
build: ./requirements/nginx/
ports:
- 80:80
volumes:
- ${DATA:?error}/nginx/www/:/usr/share/nginx/html:ro
- 8080:80
### services ###
# image:

1
srcs/.dockerignore → srcs/requirements/nginx/.dockerignore
View file

@ -1 +1,2 @@
/Dockerfile
/.dockerignore

7
srcs/requirements/nginx/Dockerfile Normal file
View file

@ -0,0 +1,7 @@
# TODO no latest
FROM nginx:latest
EXPOSE 80
RUN rm -r /usr/share/nginx/html
COPY www /usr/share/nginx/html

BIN
srcs/requirements/nginx/www/VarelaRound.ttf Normal file
View file

Binary file not shown.

143
srcs/requirements/nginx/www/index.html Normal file
View file

@ -0,0 +1,143 @@
<!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; }
17% { color: #f00; }
17% { color: #ff0; }
33% { color: #ff0; }
33% { color: #0f0; }
50% { color: #0f0; }
50% { color: #0ff; }
67% { color: #0ff; }
67% { color: #00f; }
83% { color: #00f; }
83% { color: #f0f; }
100% { 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>