Removed breadcrumbs on mobile

pages/my/calendars/[id].vue

@@ -60,8 +60,8 @@ watch([calendar], () => {
       <Title>{{ calendar.data.name }}</Title>
     </Head>
 
-    <div class="h-full grid grid-rows-[auto_1fr] pt-8 gap-y-1 md:gap-y-2">
-      <div class="px-5 md:px-8">
+    <div class="h-full md:grid md:grid-rows-[auto_1fr] pt-8 gap-y-1 md:gap-y-2">
+      <div class="px-5 md:px-8 max-md:hidden">
         <Breadcrumb
           v-if="calendar.data.world"
           :items="[

pages/my/worlds/[id].vue

@@ -180,11 +180,13 @@ function hideEditModal() {
 
       <header class="mb-8">
         <Spacing size="lg">
-          <Breadcrumb
-            :items="[
-              { label: world.data.name }
-            ]"
-          />
+          <div class="max-md:hidden">
+            <Breadcrumb
+              :items="[
+                { label: world.data.name }
+              ]"
+            />
+          </div>
 
           <div class="lg:w-1/2">
             <div class="flex items-center gap-2 mb-2">