Merge branch 'next' into feat/v3-tabs

lerna.json

@@ -13,6 +13,6 @@
     }
   },
   "npmClient": "yarn",
-  "version": "3.0.0-alpha.12",
+  "version": "3.0.0-alpha.13",
   "useWorkspaces": true
 }

packages/api-generator/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vuetify/api-generator",
-  "version": "3.0.0-alpha.12",
+  "version": "3.0.0-alpha.13",
   "private": true,
   "description": "",
   "main": "src/index.js",
@@ -17,7 +17,7 @@
     "deepmerge": "^4.0.0",
     "rimraf": "^3.0.2",
     "vue": "^3.2.22",
-    "vuetify": "^3.0.0-alpha.12"
+    "vuetify": "^3.0.0-alpha.13"
   },
   "devDependencies": {
     "@babel/node": "^7.16.0"

packages/docs/package.json

@@ -3,7 +3,7 @@
   "description": "A Vue.js project",
   "private": true,
   "author": "John Leider <john@vuetifyjs.com>",
-  "version": "3.0.0-alpha.12",
+  "version": "3.0.0-alpha.13",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/vuetifyjs/vuetify.git",
@@ -30,7 +30,7 @@
     "vue": "^3.2.22",
     "vue-i18n": "^9.2.0-beta.23",
     "vue-prism-component": "^2.0.0",
-    "vuetify": "^3.0.0-alpha.12"
+    "vuetify": "^3.0.0-alpha.13"
   },
   "devDependencies": {
     "@intlify/vite-plugin-vue-i18n": "^3.2.1",

packages/docs/src/App.vue

@@ -95,4 +95,8 @@
     + p
       font-size: 1.25rem
       font-weight: 300
+
+  ul:not([class])
+    padding-left: 20px
+    margin-bottom: 16px
 </style>

packages/docs/src/components/Backmatter.vue

@@ -28,7 +28,7 @@
         :key="i"
         cols="12"
         sm="6"
-        lg="4"
+        md="4"
       >
         <app-sheet>
           <v-list-item
@@ -37,7 +37,11 @@
             :subtitle="item.subtitle"
           >
             <template #prepend>
-              <v-icon :icon="item.icon" :color="item.color" />
+              <v-icon
+                :icon="item.icon"
+                :color="item.color"
+                class="mr-5 ml-2"
+              />
             </template>
           </v-list-item>
         </app-sheet>

packages/docs/src/components/ads/Base.vue

@@ -1,7 +1,7 @@
 <template>
   <v-sheet
     :style="styles"
-    class="v-app-ad d-inline-flex flex-child-1 grow-shrink-0 my-2"
+    class="v-app-ad d-inline-flex flex-child-1 grow-shrink-0 mt-2 mb-4"
     rounded
     width="100%"
     v-bind="$attrs"

packages/docs/src/components/ads/Carbon.vue

@@ -16,8 +16,6 @@
       />
     </ads-base>
   </div>
-
-  <vuetify v-else />
 </template>
 
 <script lang="ts">
@@ -42,36 +40,41 @@
     > span
       display: flex
       position: relative
+      flex-wrap: wrap
 
     .carbon-wrap
       display: flex
+      flex-wrap: wrap
 
     .carbon-text,
     .carbon-poweredby
       max-width: 200px
-      padding: 0 0 0 16px
       text-decoration: none
 
     .carbon-img
       display: inline-flex
-      margin: 0.5rem
+      margin: 1rem auto
 
       img
         border-radius: 4px 0 0 4px
         max-height: 100px
 
     .carbon-text
       color: inherit
-      font-size: 0.75rem
-      padding: 0.475rem
+      font-size: 0.70rem
+      padding: 0 0.475rem
+      margin: 0 auto
+      text-align: center
 
     .carbon-poweredby
-      bottom: 0.5rem
+      color: inherit
       font-size: 0.625rem
       font-weight: 400
-      letter-spacing: 0.09375rem
-      position: absolute
-      right: 0.5rem
+      letter-spacing: 0.075rem
+      margin: 0 auto
+      opacity: .56
+      padding: 8px 0 16px 0
+      text-align: center
       text-transform: uppercase
 
   .v-app-ad.theme--light

packages/docs/src/components/ads/Entry.vue

@@ -1,12 +1,9 @@
 <template>
   <div class="mb-8">
     <vuetify
-      v-if="slug"
       :slug="slug"
       medium="entry"
     />
-
-    <carbon v-else />
   </div>
 </template>
 

packages/docs/src/components/ads/Inline.vue

@@ -1,12 +1,15 @@
 <template>
-  <base-ad>
-    <app-markdown
-      v-if="ad"
-      class="v-markdown--inline d-inline"
-      tag="span"
-      :content="description"
-    />
-  </base-ad>
+  <div class="d-none">
+    <!-- TODO: resolve style issues -->
+    <base-ad>
+      <app-markdown
+        v-if="ad"
+        class="v-markdown--inline d-inline"
+        tag="span"
+        :content="description"
+      />
+    </base-ad>
+  </div>
 </template>
 
 <script>

packages/docs/src/components/ads/Vuetify.vue

@@ -10,42 +10,16 @@
       class="rounded px-2"
       style="min-height: inherit; width: 100%"
       v-bind="attrs"
+      :prepend-avatar="src"
+      :title="ad.title"
     >
-      <template #prepend>
-        <v-list-item-avatar
-          v-if="src"
-          class="my-0"
-          size="56"
-          tile
-        >
-          <v-img
-            :alt="`Link to ${ad.title}`"
-            :src="src"
-            class="rounded-tl rounded-bl"
-            contain
-          />
-        </v-list-item-avatar>
-      </template>
-
-      <v-list-item-title
-        class="font-weight-medium text-subtitle-1 hidden-xs-only"
-        v-text="ad.title"
-      />
-
-      <div>
+      <template #subtitle>
         <app-markdown
           v-if="description"
           class="text-caption text--secondary"
           :content="description"
         />
-      </div>
-
-      <div
-        v-if="!compact"
-        class="powered-by align-self-end justify-self-end pl-4 my-2 hidden-sm-and-down"
-      >
-        {{ t('ads-via-vuetify') }}
-      </div>
+      </template>
     </v-list-item>
   </ads-base>
 </template>
@@ -65,6 +39,7 @@
 
     props: {
       color: String,
+
       ...createAdProps(),
     },