Merge pull request #381 from vuejs-jp/fix/style-panelist

Fix/ Update responsive styles for tablet and mobile devices
vuejs-jp · Oct 16, 2024 · 2f86df6 · 2f86df6
2 parents 609f7dc + 48107bc
commit 2f86df6
Showing 1 changed file with 12 additions and 1 deletion.
diff --git a/apps/web/app/components/event/PanelerList.vue b/apps/web/app/components/event/PanelerList.vue
@@ -43,13 +43,24 @@ const currentLocale = useLocaleCurrent().locale
     gap: calc(var(--unit) * 1);
     padding: calc(var(--unit) * 2);
   }
+
+  @media (--tablet) {
+    ::v-deep(.speaker-name) {
+      font-size: 0.875rem;
+      letter-spacing: 0.4px;
+    }
+
+    ::v-deep(.speaker-affiliation) {
+      font-size: 0.6875rem;
+    }
+  }
 }
 
 .eventcard-persons div {
   width: calc(calc(100% - 16px) / 2);
   height: 120px;
 
-  @media (--mobile) {
+  @media (--tablet) {
     width: 100%;
   }
 }