fix rules page columns + hover; sub-timeline click zones

This commit is contained in:
2026-08-08 20:54:27 +02:00
parent ca5b34db96
commit 7071858390
2 changed files with 15 additions and 8 deletions
+1 -1
View File
@@ -674,7 +674,7 @@
.tl-project-evt-dot.light { background: var(--paper); border-color: var(--brass); } .tl-project-evt-dot.light { background: var(--paper); border-color: var(--brass); }
.tl-project-evt-dot.dark { background: var(--rust); border-color: var(--void); } .tl-project-evt-dot.dark { background: var(--rust); border-color: var(--void); }
.tl-bar-add-overlay { .tl-bar-add-overlay {
position: absolute; top: 16px; bottom: 0; position: absolute; top: 0; height: 16px; /* rail area only */
z-index: 2; cursor: crosshair; background: transparent; z-index: 2; cursor: crosshair; background: transparent;
} }
+14 -7
View File
@@ -137,12 +137,16 @@
.project { .project {
display: grid; display: grid;
grid-template-columns: minmax(0, 1.35fr) minmax(240px, 0.6fr); grid-template-columns: minmax(200px, 0.68fr) minmax(0, 1fr);
gap: clamp(2rem, 5vw, 5rem); gap: clamp(2rem, 5vw, 5rem);
align-items: start; align-items: start;
margin: 0 0 7rem; margin: 0 0 7rem;
} }
.project:nth-of-type(even) .project-image { order: 2; } /* Explicit column placement so text always gets the wider side */
.project .project-image { grid-column: 1; grid-row: 1; }
.project .project-copy { grid-column: 2; grid-row: 1; }
.project:nth-of-type(even) .project-image { grid-column: 2; order: initial; }
.project:nth-of-type(even) .project-copy { grid-column: 1; }
.project-image { .project-image {
position: sticky; position: sticky;
top: 5.3rem; top: 5.3rem;
@@ -258,12 +262,15 @@
transition-delay: 0.06s; transition-delay: 0.06s;
} }
/* Project images: contained zoom on hover */ /* Project images: whole frame lifts (no clipping of the inner border) */
.project-image { overflow: hidden; } .project-image {
.project-image img { transition: transform 0.6s cubic-bezier(0.22,1,.36,1),
transition: transform 0.6s cubic-bezier(0.22,1,.36,1); box-shadow 0.6s cubic-bezier(0.22,1,.36,1);
}
.project-image:hover {
transform: scale(1.015) translateY(-4px);
box-shadow: 0 40px 80px rgba(0,0,0,.62);
} }
.project-image:hover img { transform: scale(1.04); }
/* Divider: fade in with slight width expansion */ /* Divider: fade in with slight width expansion */
img.divider[data-reveal] { img.divider[data-reveal] {