/* Universaali mobiililayout (alle 940px): ei snapia, ei fixed/absolute, kaikki virtaan */
@media (max-width: 940px){
#jk-archive{
display:block !important;
height:auto !important;
min-height:100vh !important;
overflow:visible !important;
padding:16px 18px 32px !important;
}
#jk-archive .jk-left,
#jk-archive .jk-left-inner{
position:static !important;
transform:none !important;
padding:0 !important;
margin:0 !important;
}
#jk-archive .jk-index,
#jk-archive .jk-now{ display:none !important; }
#jk-archive .jk-right{
width:100% !important;
max-width:100% !important;
height:auto !important;
overflow:visible !important;
scroll-snap-type:none !important;
scroll-behavior:auto !important;
padding:0 !important;
}
#jk-archive .jk-right .jk-item,
#jk-archive .jk-right media-item,
#jk-archive .jk-right figure{
display:block !important;
min-height:auto !important;
padding:0 0 28px 0 !important;
margin:0 0 32px 0 !important;
scroll-snap-align:none !important;
scroll-snap-stop:normal !important;
}
#jk-archive img,
#jk-archive video{
width:100% !important;
max-width:100% !important;
height:auto !important;
max-height:none !important;
border-radius:12px !important;
margin:0 auto !important;
object-fit:contain !important;
}
/* Kuvateksti ja “View more” virrassa kuvan jälkeen */
#jk-archive media-item figcaption,
#jk-archive figure figcaption,
#jk-archive .caption,
#jk-archive .media-caption{
position:static !important;
margin:12px 0 10px 0 !important;
padding:0 !important;
text-align:center !important;
}
/* Kontaktirivi virtaan, ei fixed */
#jk-archive .jk-email,
#jk-archive .jk-loc{
position:static !important;
display:flex !important;
flex-wrap:wrap !important;
gap:12px !important;
justify-content:center !important;
text-align:center !important;
margin:14px 0 0 0 !important;
transform:none !important;
opacity:1 !important;
pointer-events:auto !important;
letter-spacing:0.08em !important;
text-transform:uppercase !important;
}
}
/* Desktop: täytä tila ylhäältä, ei keskitettyä tyhjää */
@media (min-width: 941px){
#jk-archive.jk-onepage .jk-right .jk-item:nth-of-type(var(--onepage-item)),
#jk-archive.jk-onepage .jk-right media-item:nth-of-type(var(--onepage-item)),
#jk-archive.jk-onepage .jk-right figure:nth-of-type(var(--onepage-item)){
display:flex !important;
flex-direction:column;
align-items:center;
justify-content:flex-start;
min-height:100vh;
padding-top: calc(var(--top, 70px) + 16px);
padding-bottom: 48px;
gap: 11px;
}
/* Skaalaa mediaa niin että se täyttää näkymää paremmin */
#jk-archive.jk-onepage img,
#jk-archive.jk-onepage video{
max-height: calc(100vh - var(--top, 70px) - 160px);
width: auto;
max-width: 86vw;
object-fit: contain;
}
}
Tässä uusin lisätty tiedosto kokonaisuudessaan, valmiina copy‑pasteen:
`/Users/jeesi/Downloads/Work Files /BRANDING - Personals/Work folders.jpg/Codex/jk-archive-enhancements.snippet.html`
```html
/* Mobile: add a tiny white buffer after the last project */
@media (max-width: 940px){
#jk-archive .jk-right::after{
content:"";
display:block;
height: var(--mobile-tail, 56px);
background: transparent;
}
}
#jk-archive .jk-right { overflow-y: auto !important; }
[id="U2015001963"] .page-layout {
max-width: 99%;
}
[id="U2015001963"] .page-layout {
}
@media (max-width: 940px){
#jk-archive > #ShowUpKLText,
#jk-archive > #ShowUpKLTextX,
#jk-archive > .jk-contact-rebuild,
#jk-archive .jk-contact-mobile-v3{
display: none !important;
}
}
@media (max-width: 940px){
html, body{ overflow:auto !important; height:100% !important; }
#jk-archive{ height:100dvh !important; overflow:hidden !important; }
#jk-archive .jk-right{
height:100dvh !important;
overflow-y:auto !important;
-webkit-overflow-scrolling:touch !important;
scroll-snap-type:y mandatory !important;
scroll-behavior:smooth !important;
}
}