diff --git a/maxima_2025.html b/maxima_2025.html index 6045184..c03620b 100644 --- a/maxima_2025.html +++ b/maxima_2025.html @@ -47,8 +47,8 @@ /* background: rgba(20,20,20,0.5); */ /* backdrop-filter: blur(30px); */ /* transition: transform .5s ease, backdrop-filter 2s ease; */ - transition: all .5s ease; - background: linear-gradient(to bottom, rgba(0,0,0,1), rgba(0,0,0,0)); +/* transition: all 2s ease; */ +/* background: linear-gradient(to bottom, rgba(0,0,0,1), rgba(0,0,0,0)); */ /* background: linear-gradient(to bottom, rgba(0,0,0,1), rgba(0,0,0,0)); */ /* background: linear-gradient(to bottom, rgba(0,0,0,1), rgba(0,0,0,0) 25%, rgba(0,0,0,.75) 75%); */ /* background: rgba(0,0,0,.5); */ @@ -58,15 +58,27 @@ justify-content: center; align-items: center; cursor: default; +/* transition: opacity .5s ease; */ } #header-spacer { height: var(--headheight); /* background: linear-gradient(to bottom, rgba(0,0,0,1), rgba(0,0,0,0)); */ transition: height .5s ease; } - /*#title-intro-container { - transition: opacity .25s ease; - }*/ + #gradient { + position:fixed; + width:100%; + background: linear-gradient(to bottom, rgba(0,0,0,1), rgba(0,0,0,0)); + height:100vh; + transition: opacity .5s ease; + opacity: calc(1 - (var(--scrollratioboundedslower) / 2)); + } + #title-intro-container { + opacity: calc(1 - var(--scrollratioboundedslow)); +/* transition: filter .5s ease; */ +/* backdrop-filter: blur(5px); */ +/* border-radius: 10pt; */ + } #controls { text-align: right; position:fixed; @@ -159,13 +171,17 @@ /* #controls.scrolled { */ /* backdrop-filter: blur(30px); */ /* } */ - .past-header #title-intro-container { + + /*.past-header #title-intro-container { opacity:0; - } - .bottom #header { -/* background: unset; */ + }*/ + /*.past-header #header { + opacity:0; + }*/ + .bottom #gradient { opacity: 0; } + /*.scrolled #header { min-height:0; align-items: start; @@ -220,7 +236,7 @@ } .aside.caution { - background: rgba(255,192,0,0.1); + background: rgba(255,160,0,0.1); font-size: 1em; } .aside.caution::before { @@ -259,6 +275,25 @@ font-size: .8em; } + .aside.important { +/* background: rgba(255,255,0,0.1); */ + background: linear-gradient(to bottom right, rgba(255,255,0,0.2), rgba(255,255,0,0.02) 50%); + font-size: 1em; + font-weight: bold; + } + .aside.important::before { + content: 'Important'; +/* margin-left:8pt; */ +/* margin-right:8pt; */ +/* color: rgba(255,255,255,.35); */ + color: rgba(255,255,128,.75); + letter-spacing: .35em; + text-transform: uppercase; + font-size: .75em; + margin-bottom:.25em; + display:block; + } + h1,h2,h3,h4,h5,h6 { margin-top:0; /* margin-bottom:0; */ @@ -530,6 +565,7 @@
+
-
- -
-
+ +
+ +