From 91b0a3b32bdf17f92ff080839469e0685d04719d Mon Sep 17 00:00:00 2001 From: Lanta Date: Mon, 18 May 2026 13:29:43 +0200 Subject: [PATCH] update --- assets/css/custom/modern.css | 133 +++++++++++++++++++++++++++++++++++ index.html | 63 ++++++++++++++++- 2 files changed, 195 insertions(+), 1 deletion(-) diff --git a/assets/css/custom/modern.css b/assets/css/custom/modern.css index f23038e..8e1bfdf 100644 --- a/assets/css/custom/modern.css +++ b/assets/css/custom/modern.css @@ -1019,6 +1019,139 @@ p { margin: 0 0 1em; color: var(--c-text-dim); } box-shadow: 0 10px 24px rgba(0, 242, 255, .35); } +/* ---------- Self-hosted Git banner ---------- */ +.mx-git-banner { + position: relative; + display: grid; + grid-template-columns: 1.1fr 1fr; + gap: 48px; + align-items: center; + padding: 56px; + border-radius: var(--r-xl); + background: + linear-gradient(135deg, rgba(0,242,255,.06), rgba(150,0,244,.10)), + rgba(255,255,255,.03); + border: 1px solid var(--c-border-2); + box-shadow: var(--shadow-card), var(--shadow-glow); + overflow: hidden; + isolation: isolate; +} +.mx-git-banner-glow { + position: absolute; + inset: -2px; + border-radius: inherit; + background: var(--grad-brand); + opacity: .25; + filter: blur(60px); + z-index: -1; + pointer-events: none; + animation: gitGlow 8s ease-in-out infinite alternate; +} +@keyframes gitGlow { + 0% { opacity: .15; transform: translate(-4%, -2%) scale(1); } + 100% { opacity: .35; transform: translate(4%, 2%) scale(1.05); } +} +.mx-git-banner-content h2 { + font-family: var(--f-display); + font-size: clamp(1.6rem, 2.6vw, 2.2rem); + line-height: 1.15; + margin: 12px 0 16px; +} +.mx-git-banner-content h2 code { + font-family: var(--f-mono); + font-size: .8em; + padding: 4px 10px; + border-radius: var(--r-sm); + background: rgba(0,0,0,.35); + border: 1px solid var(--c-border); + color: var(--c-accent); + white-space: nowrap; +} +.mx-git-banner-content p { + color: var(--c-text-dim); + line-height: 1.7; + margin: 0 0 22px; +} +.mx-git-features { + display: flex; + flex-wrap: wrap; + gap: 10px; +} +.mx-git-features span { + display: inline-flex; + align-items: center; + gap: 8px; + padding: 8px 14px; + border-radius: var(--r-pill); + background: rgba(255,255,255,.04); + border: 1px solid var(--c-border); + color: var(--c-text-dim); + font-size: 13px; +} +.mx-git-features span i { color: var(--c-accent); } + +/* Terminal mock */ +.mx-git-terminal { + border-radius: var(--r-md); + background: #0a0c18; + border: 1px solid var(--c-border-2); + box-shadow: var(--shadow-card); + overflow: hidden; + font-family: var(--f-mono); + transform: perspective(900px) rotateY(-4deg) rotateX(2deg); + transition: transform .6s var(--ease-out); +} +.mx-git-banner:hover .mx-git-terminal { + transform: perspective(900px) rotateY(-2deg) rotateX(1deg) translateY(-4px); +} +.mx-git-terminal-bar { + display: flex; + align-items: center; + gap: 6px; + padding: 10px 14px; + background: rgba(255,255,255,.04); + border-bottom: 1px solid var(--c-border); +} +.mx-git-terminal-bar > span { + width: 11px; height: 11px; + border-radius: 50%; + background: #ff5f56; +} +.mx-git-terminal-bar > span:nth-child(2) { background: #ffbd2e; } +.mx-git-terminal-bar > span:nth-child(3) { background: #27c93f; } +.mx-git-terminal-title { + margin-left: auto; + width: auto !important; + height: auto !important; + border-radius: 0 !important; + background: none !important; + color: var(--c-text-mute); + font-size: 12px; +} +.mx-git-terminal-body { + margin: 0; + padding: 18px 20px; + font-size: 13px; + line-height: 1.7; + color: var(--c-text); + white-space: pre-wrap; + word-break: break-word; +} +.mx-git-terminal-body .t-prompt { color: var(--c-accent); margin-right: 6px; } +.mx-git-terminal-body .t-str { color: #d42bff; } +.mx-git-terminal-body .t-ok { color: #27c93f; margin-right: 6px; } + +@media (max-width: 900px) { + .mx-git-banner { + grid-template-columns: 1fr; + padding: 36px 28px; + gap: 32px; + } + .mx-git-terminal { + transform: none; + } +} + /* ---------- Footer ---------- */ .mx-footer { padding: 40px 0; diff --git a/index.html b/index.html index 2257e7a..8247066 100644 --- a/index.html +++ b/index.html @@ -48,6 +48,7 @@
  • Tech
  • Aanpak
  • Skills
    • +
  • Git
  • Contact
    • @@ -117,6 +118,7 @@ Docker Bicep ARM Templates + Self-hosted Forgejo @@ -288,6 +290,55 @@
    SQL
    Bicep
    REST API
    +
    Forgejo (self-hosted)
    + + + + + +
    +
    +
    + +
    + Self-hosted +

    Onze eigen Git-server — git.opzeker.it

    +

    + We eten ons eigen hondenvoer: al onze code, Infrastructure as Code en + automation-scripts staan op een zelf-gehoste Forgejo-instance. + Volledig in eigen beheer, met onze eigen CI/CD, backups en monitoring — + een voorbeeld van wat we ook voor jou kunnen draaien. +

    +
    + Eigen beheer & data + Hardened & gemonitord + CI/CD ready + Hybrid cloud +
    + +
    +
    @@ -424,6 +475,9 @@ + + + @@ -450,6 +504,13 @@

    in/thijsstobbelaar

    +
  • + +
    +

    Git

    +

    git.opzeker.it

    +
    +
  • @@ -466,7 +527,7 @@