add static site
This commit is contained in:
@@ -63,6 +63,16 @@ services:
|
||||
- wordpress
|
||||
restart: always
|
||||
|
||||
static_site:
|
||||
build: ./requirements/static_site
|
||||
image: static_site:inception
|
||||
container_name: static_site
|
||||
networks:
|
||||
- inception
|
||||
ports:
|
||||
- "8080:80"
|
||||
restart: always
|
||||
|
||||
networks:
|
||||
inception:
|
||||
driver: bridge
|
||||
|
||||
@@ -0,0 +1,15 @@
|
||||
FROM debian:bookworm-slim
|
||||
|
||||
RUN apt-get update && apt-get install -y --no-install-recommends \
|
||||
nginx \
|
||||
&& rm -rf /var/lib/apt/lists/*
|
||||
|
||||
COPY conf/nginx.conf /etc/nginx/sites-available/default
|
||||
COPY html/ /var/www/static/
|
||||
|
||||
RUN rm -f /etc/nginx/sites-enabled/default \
|
||||
&& ln -s /etc/nginx/sites-available/default /etc/nginx/sites-enabled/default
|
||||
|
||||
EXPOSE 80
|
||||
|
||||
CMD ["nginx", "-g", "daemon off;"]
|
||||
@@ -0,0 +1,11 @@
|
||||
server {
|
||||
listen 80;
|
||||
server_name static.oriabenk.42.fr;
|
||||
|
||||
root /var/www/static;
|
||||
index index.html;
|
||||
|
||||
location / {
|
||||
try_files $uri $uri/ =404;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,59 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>oriabenk — 42 Student</title>
|
||||
<link rel="stylesheet" href="style.css">
|
||||
</head>
|
||||
<body>
|
||||
<div class="page">
|
||||
|
||||
<header class="hero">
|
||||
<div class="avatar">O</div>
|
||||
<h1>oriabenk</h1>
|
||||
<p class="tagline">Student at 42 School — Systems & Infrastructure</p>
|
||||
</header>
|
||||
|
||||
<section class="card">
|
||||
<h2>About</h2>
|
||||
<p>
|
||||
I'm a 42 School student working through the common core, focused on
|
||||
systems programming, networking, and infrastructure. This page is served
|
||||
as a standalone static site — part of the <strong>Inception</strong>
|
||||
project's bonus scope, running in its own Docker container.
|
||||
</p>
|
||||
</section>
|
||||
|
||||
<section class="card">
|
||||
<h2>Skills</h2>
|
||||
<ul class="skills">
|
||||
<li>C</li>
|
||||
<li>Docker & Docker Compose</li>
|
||||
<li>Linux system administration</li>
|
||||
<li>Networking</li>
|
||||
<li>Shell scripting</li>
|
||||
<li>Git</li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<section class="card">
|
||||
<h2>Inception — Project Highlights</h2>
|
||||
<ul class="projects">
|
||||
<li><span class="dot"></span> NGINX with TLSv1.2/1.3, single entrypoint</li>
|
||||
<li><span class="dot"></span> WordPress + php-fpm, no bundled web server</li>
|
||||
<li><span class="dot"></span> MariaDB, isolated in its own container</li>
|
||||
<li><span class="dot"></span> Docker secrets for all credentials</li>
|
||||
<li><span class="dot"></span> Bonus: FTP server on the WordPress volume</li>
|
||||
<li><span class="dot"></span> Bonus: this static site, in plain HTML/CSS/JS</li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<footer>
|
||||
<p id="year"></p>
|
||||
</footer>
|
||||
|
||||
</div>
|
||||
<script src="script.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,2 @@
|
||||
document.getElementById("year").textContent =
|
||||
"© " + new Date().getFullYear() + " oriabenk — served from a static container";
|
||||
@@ -0,0 +1,118 @@
|
||||
:root {
|
||||
--bg: #0f1115;
|
||||
--card: #171a21;
|
||||
--border: #262b36;
|
||||
--text: #e6e8ec;
|
||||
--muted: #9aa3b2;
|
||||
--accent: #5eb1ff;
|
||||
}
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
background: var(--bg);
|
||||
color: var(--text);
|
||||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.page {
|
||||
max-width: 640px;
|
||||
margin: 0 auto;
|
||||
padding: 48px 24px 80px;
|
||||
}
|
||||
|
||||
.hero {
|
||||
text-align: center;
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
|
||||
.avatar {
|
||||
width: 72px;
|
||||
height: 72px;
|
||||
margin: 0 auto 16px;
|
||||
border-radius: 50%;
|
||||
background: linear-gradient(135deg, var(--accent), #8a6bff);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 28px;
|
||||
font-weight: 700;
|
||||
color: #0f1115;
|
||||
}
|
||||
|
||||
.hero h1 {
|
||||
margin: 0;
|
||||
font-size: 28px;
|
||||
}
|
||||
|
||||
.tagline {
|
||||
color: var(--muted);
|
||||
margin-top: 4px;
|
||||
}
|
||||
|
||||
.card {
|
||||
background: var(--card);
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 12px;
|
||||
padding: 24px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.card h2 {
|
||||
margin-top: 0;
|
||||
font-size: 16px;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.06em;
|
||||
color: var(--accent);
|
||||
}
|
||||
|
||||
.skills {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.skills li {
|
||||
background: var(--bg);
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 999px;
|
||||
padding: 6px 14px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.projects {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
display: grid;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.projects li {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.dot {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-radius: 50%;
|
||||
background: var(--accent);
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
footer {
|
||||
text-align: center;
|
||||
color: var(--muted);
|
||||
font-size: 13px;
|
||||
margin-top: 32px;
|
||||
}
|
||||
Reference in New Issue
Block a user