bugfixes

vue/src/assets/main.css

@@ -70,7 +70,7 @@ a,
 .feed-title {
   cursor: pointer;
   font-family: Glook, 'Courier New';
-  font-size: clamp(1.25rem, 4.5vw, 1.6rem);
+  font-size: clamp(1.4rem, 5vw, 2rem);
   font-weight: bold;
   color: var(--color-accent-2);
   border-bottom: 1px solid #ccc;
@@ -112,5 +112,6 @@ h3 {
 @media (min-width: 768px) {
   #app {
     padding: 0.75rem;
+    padding-top: var(--app-nav-height, 4.5rem);
   }
 }

vue/src/components/RssFeeds.vue

@@ -325,7 +325,7 @@ onMounted(async () => {
   margin: 0;
   padding: 0 1rem;
   font-family: 'Courier New';
-  font-size: clamp(1.75rem, 6vw, 2.75rem);
+  font-size: clamp(1.4rem, 5vw, 2rem);
   font-weight: bold;
   line-height: 1.15;
   color: var(--color-accent-2);

vue/src/composables/useFeeds.js

@@ -290,9 +290,15 @@ function toggleViewMode() {
   }
 }
 
-function toggleLayout() {
+async function toggleLayout() {
+  if (observer) {
+    observer.disconnect()
+    observer = null
+  }
   layout.value = layout.value === 'list' ? 'cards' : 'list'
   localStorage.setItem('layout', layout.value)
+  await nextTick()
+  setupIntersectionObserver()
 }
 
 function nextArticle() {