Match teaser placement/order on index with responsive desktop/mobile layout

This commit is contained in:
hbrain 2026-06-01 07:33:49 +02:00
parent 4397c0b7a5
commit a87d8d8920

View file

@ -256,6 +256,14 @@ $headerTitles = [
'Multi-Vision Log', 'Multi-Vision Log',
'Multi-Vista Log', 'Multi-Vista Log',
'Mutable View Log', 'Mutable View Log',
'Mistakes, Victories & Lessons',
'Mostly Verified Legends',
'Mostly Vague Logistics',
'Marginally Viable Leadership',
'Mileage Versus Luck',
'Mechanical Violence Log',
'Moderately Violent Leisure',
'Mistakes Validated Later',
]; ];
$siteHeaderTitle = $headerTitles[array_rand($headerTitles)]; $siteHeaderTitle = $headerTitles[array_rand($headerTitles)];
?> ?>
@ -292,10 +300,13 @@ $siteHeaderTitle = $headerTitles[array_rand($headerTitles)];
.meta a:hover{text-decoration:underline} .meta a:hover{text-decoration:underline}
@media (max-width:900px){ @media (max-width:900px){
.video-row-head-mobile{display:block;grid-column:1 / -1;margin:0 0 .05rem} .video-row-head-mobile{display:block;grid-column:1 / -1;margin:0 0 .05rem}
.video-row-head-mobile .meta{display:none}
.video-row-head-mobile .description-teaser{margin:.25rem 0 .3rem}
#videos .video-wrapper{grid-column:1 / -1} #videos .video-wrapper{grid-column:1 / -1}
#videos .video-info{grid-column:1 / -1} #videos .video-info{grid-column:1 / -1}
.video-info .video-row-title.video-row-title-desktop, .video-info .video-row-title.video-row-title-desktop,
.video-info .meta.meta-desktop{display:none} .video-info .meta.meta-desktop,
.video-info .description-teaser.description-teaser-desktop{display:none}
#videos .video-info .description{margin-top:.8rem} #videos .video-info .description{margin-top:.8rem}
} }
</style> </style>
@ -334,6 +345,7 @@ $siteHeaderTitle = $headerTitles[array_rand($headerTitles)];
<time class="created-at" datetime="<?=h(date('c', filemtime($v)))?>"><?=h(date('d.m.Y H:i', filemtime($v)))?></time> <time class="created-at" datetime="<?=h(date('c', filemtime($v)))?>"><?=h(date('d.m.Y H:i', filemtime($v)))?></time>
<div class="video-row-head video-row-head-mobile"> <div class="video-row-head video-row-head-mobile">
<h2 class="video-row-title"><?=h($m['title'])?></h2> <h2 class="video-row-title"><?=h($m['title'])?></h2>
<?php if(!empty($m['teaser'])): ?><p class="description-teaser description-teaser-mobile"><?=h((string)$m['teaser'])?></p><?php endif; ?>
<p class="meta"> <p class="meta">
<span><a href="<?=h($dateFilterUrl)?>"><?=h($m['date'])?></a></span> <span><a href="<?=h($dateFilterUrl)?>"><?=h($m['date'])?></a></span>
<?php if(!empty($m['location'])): ?><span><a href="<?=h($locFilterUrl)?>"><?=h($m['location'])?></a></span><?php endif; ?> <?php if(!empty($m['location'])): ?><span><a href="<?=h($locFilterUrl)?>"><?=h($m['location'])?></a></span><?php endif; ?>
@ -355,7 +367,7 @@ $siteHeaderTitle = $headerTitles[array_rand($headerTitles)];
<span><a href="<?=h($dateFilterUrl)?>"><?=h($m['date'])?></a></span> <span><a href="<?=h($dateFilterUrl)?>"><?=h($m['date'])?></a></span>
<?php if(!empty($m['location'])): ?><span><a href="<?=h($locFilterUrl)?>"><?=h($m['location'])?></a></span><?php endif; ?> <?php if(!empty($m['location'])): ?><span><a href="<?=h($locFilterUrl)?>"><?=h($m['location'])?></a></span><?php endif; ?>
</p> </p>
<?php if(!empty($m['teaser'])): ?><p class="description-teaser"><?=h((string)$m['teaser'])?></p><?php endif; ?> <?php if(!empty($m['teaser'])): ?><p class="description-teaser description-teaser-desktop"><?=h((string)$m['teaser'])?></p><?php endif; ?>
<?php if(!empty($m['description'])): ?><p class="description"><?=nl2br(h($m['description']), false)?></p><?php endif; ?> <?php if(!empty($m['description'])): ?><p class="description"><?=nl2br(h($m['description']), false)?></p><?php endif; ?>
<?php if(!empty($m['quote_da'])): ?><p class="description-quote">“<?=h(trim((string)$m['quote_da'], "\"“”"))?>”</p><?php endif; ?> <?php if(!empty($m['quote_da'])): ?><p class="description-quote">“<?=h(trim((string)$m['quote_da'], "\"“”"))?>”</p><?php endif; ?>
</div> </div>