From 562770b46221b262f26afcf90b7f723e8e93f3d1 Mon Sep 17 00:00:00 2001 From: Jeff Emmett Date: Thu, 19 Mar 2026 16:07:48 -0700 Subject: [PATCH] Add leafy backgrounds and Design Science Studio section - Add subtle SVG leaf patterns to Projects, Film & TV, OTB, and Contact sections with light/dark variants matching each section - New Design Science Studio section between Film & TV and Elle bio, describing Elle's fellowship with DSS / Buckminster Fuller Institute - Links to designscience.studio and bfi.org - Bucky Fuller quote in right column Co-Authored-By: Claude Opus 4.6 --- public/index.html | 122 ++++++++++++++++++++++++++++++++++++++++++++-- 1 file changed, 118 insertions(+), 4 deletions(-) diff --git a/public/index.html b/public/index.html index 7cf11f9..e32a4de 100644 --- a/public/index.html +++ b/public/index.html @@ -201,6 +201,33 @@ background: rgba(60, 36, 21, 0.1); } + /* LEAF BACKGROUNDS */ + .leafy-bg { + position: relative; + } + + .leafy-bg::before { + content: ''; + position: absolute; + inset: 0; + opacity: 0.04; + pointer-events: none; + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='200' viewBox='0 0 180 200'%3E%3Cpath d='M40 10 Q60 40 50 80 Q45 100 30 90 Q15 80 25 50 Q30 30 40 10Z' fill='%233C2415'/%3E%3Cpath d='M40 10 Q40 50 38 80' stroke='%233C2415' stroke-width='0.5' fill='none'/%3E%3Cpath d='M130 60 Q150 90 140 130 Q135 150 120 140 Q105 130 115 100 Q120 80 130 60Z' fill='%233C2415'/%3E%3Cpath d='M130 60 Q130 100 128 130' stroke='%233C2415' stroke-width='0.5' fill='none'/%3E%3Cpath d='M80 120 Q100 150 90 190 Q85 210 70 200 Q55 190 65 160 Q70 140 80 120Z' fill='%233C2415'/%3E%3Cpath d='M80 120 Q80 160 78 190' stroke='%233C2415' stroke-width='0.5' fill='none'/%3E%3C/svg%3E"); + background-size: 180px 200px; + } + + .leafy-bg-light::before { + opacity: 0.06; + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='220' viewBox='0 0 200 220'%3E%3Cpath d='M50 15 Q75 50 62 100 Q56 125 38 112 Q20 100 32 62 Q38 38 50 15Z' fill='%234A6741'/%3E%3Cpath d='M50 15 Q50 60 47 100' stroke='%234A6741' stroke-width='0.6' fill='none'/%3E%3Cpath d='M150 70 Q175 105 162 155 Q156 180 138 167 Q120 155 132 117 Q138 93 150 70Z' fill='%234A6741'/%3E%3Cpath d='M150 70 Q150 115 147 155' stroke='%234A6741' stroke-width='0.6' fill='none'/%3E%3Cpath d='M95 140 Q120 175 107 210 Q104 218 92 212 Q78 205 85 175 Q90 155 95 140Z' fill='%234A6741'/%3E%3C/svg%3E"); + background-size: 200px 220px; + } + + .leafy-bg-dark::before { + opacity: 0.08; + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='190' height='210' viewBox='0 0 190 210'%3E%3Cpath d='M45 10 Q70 45 57 95 Q51 120 33 107 Q15 95 27 57 Q33 33 45 10Z' fill='%23C68B3F'/%3E%3Cpath d='M45 10 Q45 55 42 95' stroke='%23C68B3F' stroke-width='0.5' fill='none'/%3E%3Cpath d='M140 65 Q165 100 152 150 Q146 175 128 162 Q110 150 122 112 Q128 88 140 65Z' fill='%23C68B3F'/%3E%3Cpath d='M140 65 Q140 110 137 150' stroke='%23C68B3F' stroke-width='0.5' fill='none'/%3E%3C/svg%3E"); + background-size: 190px 210px; + } + /* PROJECT CARDS */ .projects-section { background: var(--sand); } @@ -418,6 +445,63 @@ margin-bottom: 1rem; } + /* DSS / DESIGN SCIENCE */ + .dss-section { + background: var(--green-dark); + color: var(--sand); + } + + .dss-section .section-label { color: var(--gold-light); } + .dss-section .section-title { color: var(--sand); } + + .dss-grid { + display: grid; + grid-template-columns: 1fr 1fr; + gap: 4rem; + align-items: center; + } + + .dss-text { + font-size: 0.95rem; + color: rgba(245, 237, 224, 0.75); + line-height: 1.8; + margin-bottom: 1rem; + } + + .dss-links { + display: flex; + gap: 1rem; + flex-wrap: wrap; + margin-top: 1.5rem; + } + + .dss-links a { + display: inline-block; + color: var(--gold-light); + text-decoration: none; + font-size: 0.75rem; + letter-spacing: 0.12em; + text-transform: uppercase; + padding: 0.6rem 1.5rem; + border: 1px solid rgba(212, 165, 90, 0.4); + transition: all 0.3s; + } + + .dss-links a:hover { + background: rgba(212, 165, 90, 0.15); + border-color: var(--gold-light); + } + + .dss-quote { + font-family: 'Cormorant Garamond', serif; + font-size: clamp(1.2rem, 2.5vw, 1.5rem); + font-style: italic; + color: var(--gold-light); + line-height: 1.5; + border-left: 2px solid var(--gold); + padding-left: 1.5rem; + } + /* FILM & TV */ .filmtv-section { background: var(--sand-dark); @@ -771,6 +855,11 @@ grid-template-columns: 1fr; } + .dss-grid { + grid-template-columns: 1fr; + gap: 2rem; + } + .installation-item { flex: 0 0 100%; } @@ -806,6 +895,7 @@
  • Projects
  • Installations
  • Film & TV
    • +
  • Design Science
  • ELLE
  • Out the Box Creative Group
  • Contact
    • @@ -831,7 +921,7 @@ -
    +

    Projects

    @@ -932,7 +1022,7 @@
    -
    +

    Screen Work

    @@ -961,6 +1051,30 @@
    + +
    +
    +
    +

    Design Science

    +

    Design Science Studio

    +
    +
    +
    +

    Elle is a fellow of the Design Science Studio, a (r)evolutionary cultural and educational incubator created in partnership with the Buckminster Fuller Institute. The Studio supports creators worldwide to imagine and build regenerative futures that work for 100% of life.

    +

    Through the Studio’s curriculum of systemic thinking, world-building, and embodied praxis, Elle’s work on HOME and Cineasthesia connects directly to Fuller’s legacy of comprehensive anticipatory design science — applying whole-systems thinking to housing, healing, and storytelling across the Black diaspora.

    +
    + Design Science Studio + Buckminster Fuller Institute +
    +
    +
    + “You never change things by fighting the existing reality. To change something, build a new model that makes the existing model obsolete.”
    + — R. Buckminster Fuller +
    +
    +
    +
    +
    @@ -982,7 +1096,7 @@
    -
    +

    Artist Collective

    @@ -1020,7 +1134,7 @@
    -
    +

    Get in Touch