From 3adf97ce7806700c4b332c6e862d4e0e7a309886 Mon Sep 17 00:00:00 2001 From: zola Date: Sat, 20 Jun 2026 09:03:36 +0200 Subject: [PATCH] Initial commit: site vitrine Zola Labs --- .gitea/workflows/deploy.yml | 31 ++++++++++ Dockerfile | 2 + index.html | 116 ++++++++++++++++++++++++++++++++++++ script.js | 16 +++++ style.css | 86 ++++++++++++++++++++++++++ 5 files changed, 251 insertions(+) create mode 100644 .gitea/workflows/deploy.yml create mode 100644 Dockerfile create mode 100644 index.html create mode 100644 script.js create mode 100644 style.css diff --git a/.gitea/workflows/deploy.yml b/.gitea/workflows/deploy.yml new file mode 100644 index 0000000..4423a27 --- /dev/null +++ b/.gitea/workflows/deploy.yml @@ -0,0 +1,31 @@ +name: Build & Deploy + +on: + push: + branches: [main] + +jobs: + deploy: + runs-on: ubuntu-latest + steps: + - name: Checkout + uses: actions/checkout@v4 + + - name: Build Docker image + run: docker build -t site-vitrine:latest . + + - name: Deploy container + run: | + docker stop site-vitrine 2>/dev/null || true + docker rm site-vitrine 2>/dev/null || true + docker network connect proxy site-vitrine 2>/dev/null || true + docker run -d \ + --name site-vitrine \ + --network proxy \ + --restart unless-stopped \ + --label "traefik.enable=true" \ + --label "traefik.http.routers.site-vitrine.rule=Host(\`zola-labs.com\`) || Host(\`www.zola-labs.com\`)" \ + --label "traefik.http.routers.site-vitrine.entrypoints=websecure" \ + --label "traefik.http.routers.site-vitrine.tls.certresolver=letsencrypt" \ + --label "traefik.http.services.site-vitrine.loadbalancer.server.port=80" \ + site-vitrine:latest diff --git a/Dockerfile b/Dockerfile new file mode 100644 index 0000000..646310d --- /dev/null +++ b/Dockerfile @@ -0,0 +1,2 @@ +FROM nginx:alpine +COPY index.html style.css script.js /usr/share/nginx/html/ diff --git a/index.html b/index.html new file mode 100644 index 0000000..0fd975e --- /dev/null +++ b/index.html @@ -0,0 +1,116 @@ + + + + + + Zola Labs — Studio de développement logiciel + + + + + +
+
+ + + +
+
+ +
+
+

Des solutions logicielles
pensées pour durer

+

Nous concevons et développons des applications web, des APIs et des infrastructures cloud robustes, adaptées aux besoins réels de votre activité.

+
+ Discutons de votre projet + Nos services +
+
+
+ +
+
+

Ce que nous faisons

+

Des compétences techniques solides, mises au service de projets concrets.

+
+
+
◆
+

Développement web

+

Applications web performantes et interfaces utilisateur soignées. Du site vitrine à la plateforme SaaS complexe, nous construisons des produits fiables et maintenables.

+
+
+
◈
+

APIs & Backend

+

Architectures backend solides, APIs REST et GraphQL, intégrations tierces. Nous concevons des systèmes qui tiennent la charge et évoluent avec votre activité.

+
+
+
◊
+

Infrastructure & DevOps

+

Déploiement automatisé, conteneurisation, CI/CD, monitoring. Nous mettons en place des infrastructures reproductibles et sécurisées sur lesquelles vous pouvez compter.

+
+
+
◎
+

Conseil technique

+

Audit de code, choix d'architecture, accompagnement d'équipe. Nous vous aidons à prendre les bonnes décisions techniques pour vos projets existants ou à venir.

+
+
+
+
+ +
+
+
+

À propos

+

Zola Labs est un studio de développement logiciel fondé avec une conviction simple : la technologie doit servir le projet, pas l'inverse.

+

Nous travaillons avec des startups, des PME et des équipes techniques qui ont besoin de renfort sur des projets exigeants. Notre approche est directe — nous privilégions la clarté, la qualité du code et des solutions qui fonctionnent dans la durée.

+

Pas de jargon inutile, pas de frameworks à la mode pour le plaisir. Juste du travail bien fait, livré dans les temps.

+
+
+
+ Pragmatisme + Les bons outils pour le bon problème, pas l'inverse. +
+
+ Transparence + Communication claire, pas de surprises en fin de projet. +
+
+ Qualité + Du code maintenable, testé, documenté quand il faut. +
+
+
+
+ +
+
+

Un projet en tête ?

+

Décrivez-nous votre besoin, nous reviendrons vers vous rapidement pour en discuter.

+
+
+ + +
+ + +
+

Ou écrivez-nous directement à contact@zola-labs.com

+
+
+ + + + + + diff --git a/script.js b/script.js new file mode 100644 index 0000000..295bdfe --- /dev/null +++ b/script.js @@ -0,0 +1,16 @@ +document.addEventListener("DOMContentLoaded", function () { + var toggle = document.querySelector(".menu-toggle"); + var nav = document.querySelector(".nav"); + + toggle.addEventListener("click", function () { + toggle.classList.toggle("open"); + nav.classList.toggle("open"); + }); + + document.querySelectorAll('.nav a').forEach(function (link) { + link.addEventListener("click", function () { + toggle.classList.remove("open"); + nav.classList.remove("open"); + }); + }); +}); diff --git a/style.css b/style.css new file mode 100644 index 0000000..9c3238e --- /dev/null +++ b/style.css @@ -0,0 +1,86 @@ +*,*::before,*::after{margin:0;padding:0;box-sizing:border-box} +:root{ + --bg:#fafafa;--surface:#fff;--text:#1a1a1a;--muted:#6b7280; + --accent:#111827;--accent-hover:#374151;--border:#e5e7eb; + --radius:8px;--max-w:1120px; +} +html{scroll-behavior:smooth} +body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;color:var(--text);background:var(--bg);line-height:1.6;-webkit-font-smoothing:antialiased} + +.container{max-width:var(--max-w);margin:0 auto;padding:0 24px} + +/* Header */ +.header{position:fixed;top:0;left:0;right:0;z-index:100;background:rgba(250,250,250,.92);backdrop-filter:blur(12px);border-bottom:1px solid var(--border)} +.header-inner{display:flex;align-items:center;justify-content:space-between;height:64px} +.logo{font-size:1.25rem;font-weight:700;text-decoration:none;color:var(--text);letter-spacing:-.02em} +.logo span{color:var(--muted)} +.nav{display:flex;align-items:center;gap:32px} +.nav a{text-decoration:none;color:var(--muted);font-size:.9rem;font-weight:500;transition:color .2s} +.nav a:hover{color:var(--text)} +.menu-toggle{display:none;background:none;border:none;cursor:pointer;flex-direction:column;gap:5px;padding:4px} +.menu-toggle span{display:block;width:22px;height:2px;background:var(--text);transition:transform .3s,opacity .3s} + +/* Buttons */ +.btn{display:inline-block;padding:12px 28px;background:var(--accent);color:#fff;text-decoration:none;border-radius:var(--radius);font-size:.9rem;font-weight:500;border:2px solid var(--accent);cursor:pointer;transition:background .2s,border-color .2s} +.btn:hover{background:var(--accent-hover);border-color:var(--accent-hover)} +.btn-outline{background:transparent;color:var(--text);border-color:var(--border)} +.btn-outline:hover{border-color:var(--accent);color:var(--accent)} +.btn-sm{padding:8px 20px;font-size:.85rem} + +/* Hero */ +.hero{padding:160px 0 100px;text-align:center} +.hero h1{font-size:clamp(2rem,5vw,3.5rem);font-weight:700;letter-spacing:-.03em;line-height:1.15;margin-bottom:24px} +.hero-sub{font-size:1.15rem;color:var(--muted);max-width:600px;margin:0 auto 40px;line-height:1.7} +.hero-actions{display:flex;gap:16px;justify-content:center;flex-wrap:wrap} + +/* Services */ +.services{padding:100px 0;background:var(--surface);border-top:1px solid var(--border);border-bottom:1px solid var(--border)} +.services h2,.about h2,.contact h2{font-size:2rem;font-weight:700;letter-spacing:-.02em;margin-bottom:12px} +.section-sub{color:var(--muted);font-size:1.05rem;margin-bottom:48px} +.services-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:24px} +.card{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);padding:32px 28px} +.card-icon{font-size:1.5rem;margin-bottom:16px;color:var(--accent)} +.card h3{font-size:1.1rem;font-weight:600;margin-bottom:10px} +.card p{color:var(--muted);font-size:.92rem;line-height:1.65} + +/* About */ +.about{padding:100px 0} +.about-inner{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start} +.about-text p{color:var(--muted);margin-bottom:16px;font-size:1.02rem} +.about-text p:first-of-type{color:var(--text);font-size:1.1rem} +.about-values{display:flex;flex-direction:column;gap:20px;padding-top:48px} +.value{padding:20px 24px;border-left:3px solid var(--accent);background:var(--surface);border-radius:0 var(--radius) var(--radius) 0} +.value strong{display:block;font-size:.95rem;margin-bottom:4px} +.value span{color:var(--muted);font-size:.9rem} + +/* Contact */ +.contact{padding:100px 0;background:var(--surface);border-top:1px solid var(--border)} +.contact-inner{max-width:640px;margin:0 auto;text-align:center} +.contact p{color:var(--muted);margin-bottom:32px;font-size:1.02rem} +.contact-form{display:flex;flex-direction:column;gap:16px;text-align:left} +.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px} +.contact-form input,.contact-form textarea{width:100%;padding:14px 16px;border:1px solid var(--border);border-radius:var(--radius);font-size:.95rem;font-family:inherit;background:var(--bg);transition:border-color .2s;outline:none} +.contact-form input:focus,.contact-form textarea:focus{border-color:var(--accent)} +.contact-form .btn{align-self:flex-start} +.contact-alt{font-size:.9rem;margin-top:24px} +.contact-alt a{color:var(--text);font-weight:500} + +/* Footer */ +.footer{padding:32px 0;border-top:1px solid var(--border)} +.footer-inner{display:flex;align-items:center;justify-content:space-between;font-size:.85rem;color:var(--muted)} + +/* Mobile */ +@media(max-width:768px){ + .nav{display:none;position:absolute;top:64px;left:0;right:0;background:var(--surface);flex-direction:column;padding:24px;gap:20px;border-bottom:1px solid var(--border);box-shadow:0 4px 12px rgba(0,0,0,.06)} + .nav.open{display:flex} + .menu-toggle{display:flex} + .menu-toggle.open span:nth-child(1){transform:rotate(45deg) translate(5px,5px)} + .menu-toggle.open span:nth-child(2){opacity:0} + .menu-toggle.open span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)} + .hero{padding:120px 0 80px} + .hero h1{font-size:2rem} + .about-inner{grid-template-columns:1fr;gap:40px} + .about-values{padding-top:0} + .form-row{grid-template-columns:1fr} + .footer-inner{flex-direction:column;gap:12px;text-align:center} +}