diff --git a/index.php b/index.php
index 82c3fea..5d3bd67 100644
--- a/index.php
+++ b/index.php
@@ -448,6 +448,9 @@ $siteHeaderTitle = $headerTitles[array_rand($headerTitles)];
 #videos .video-info .description{margin-top:0}
 .meta a{color:inherit;text-decoration:none}
 .meta a:hover{text-decoration:underline}
+.meta-filter{display:inline-flex;align-items:center;gap:.25rem;padding:.12rem .5rem;border-radius:999px;background:rgba(255,255,255,.06);cursor:pointer;user-select:none;transition:background-color .15s ease,transform .15s ease}
+.meta-filter:hover,.meta-filter:focus-visible{background:rgba(255,255,255,.12);transform:translateY(-1px);outline:none}
+.meta-filter:focus-visible{box-shadow:0 0 0 2px rgba(202,162,109,.35)}
 .site-header.admin-header{padding-top:.9rem;padding-bottom:.7rem}
 @media (max-width:900px){
   .video-row-head-mobile{display:block;grid-column:1 / -1;margin:0 0 .05rem}
@@ -505,8 +508,8 @@ $siteHeaderTitle = $headerTitles[array_rand($headerTitles)];
       <div class="video-row-head video-row-head-mobile">
         <h2 class="video-row-title"><?php if($permalinkUrl !== ''): ?><a href="<?=h($permalinkUrl)?>"><?=h($m['title'])?></a><?php else: ?><?=h($m['title'])?><?php endif; ?></h2>
         <p class="meta">
-          <span><?=h($m['date'])?></span>
-          <?php if(!empty($m['location'])): ?><span><?=h($m['location'])?></span><?php endif; ?>
+          <?php if(!empty($m['date'])): ?><a class="meta-filter" href="<?=h($dateFilterUrl)?>" title="Filter by date"><?=h($m['date'])?></a><?php endif; ?>
+          <?php if(!empty($m['location'])): ?><a class="meta-filter" href="<?=h($locFilterUrl)?>" title="Filter by location"><?=h($m['location'])?></a><?php endif; ?>
         </p>
         <?php if(!empty($m['teaser'])): ?><p class="description-teaser description-teaser-mobile"><?=h((string)$m['teaser'])?></p><?php endif; ?>
       </div>
@@ -523,8 +526,8 @@ $siteHeaderTitle = $headerTitles[array_rand($headerTitles)];
       <div class="video-info">
         <h2 class="video-row-title video-row-title-desktop"><?php if($permalinkUrl !== ''): ?><a href="<?=h($permalinkUrl)?>"><?=h($m['title'])?></a><?php else: ?><?=h($m['title'])?><?php endif; ?></h2>
         <p class="meta meta-desktop">
-          <span><?=h($m['date'])?></span>
-          <?php if(!empty($m['location'])): ?><span><?=h($m['location'])?></span><?php endif; ?>
+          <?php if(!empty($m['date'])): ?><a class="meta-filter" href="<?=h($dateFilterUrl)?>" title="Filter by date"><?=h($m['date'])?></a><?php endif; ?>
+          <?php if(!empty($m['location'])): ?><a class="meta-filter" href="<?=h($locFilterUrl)?>" title="Filter by location"><?=h($m['location'])?></a><?php endif; ?>
         </p>
         <?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; ?>