Vuetify - V-для скинуть форматирование столбцов

Question

Вот URL-адрес publi c, где вы можете увидеть мою проблему форматирования

У меня есть макет Vuetify, который разделен на два раздела, один с 9 столбцами с v- для создания строк, а затем один с 3 столбцами без v-for и только с одной строкой. последний элемент в v-for, а я хочу его после первого элемента!

Вот мой код целиком:

<template>
<v-content class="no_top_padding">
  <v-container>

    <v-row>
      <v-col cols="9">
        <h1 class="headline">Welcome to your Bella Virtual Showroom: Here’s Everything You Need To Know!</h1>
      </v-col>

      <v-col cols="3">
        <h1 class="headline">More Info</h1>
      </v-col>
    </v-row>

    <v-row>
      <v-col cols="9" v-for="(help, index) in helpTopics" :key="help.image">
        <v-card outlined>
          <v-row>
            <v-col cols="4" align="start" justify="center" class="my-n3">
              <v-img :src="help.image" class="my_img"></v-img>
            </v-col>

            <v-col cols="8">
              <v-row class="">
                <v-col cols="12">
                  <h1 class="body-2 font-weight-bold">{{ help.step}}</h1>
                </v-col>
              </v-row>

              <v-row class="mt-n5">
                <v-col cols="12">
                  <h1 class="headline">{{ help.title}}</h1>
                </v-col>
              </v-row>

              <v-row class="mt-n5">
                <v-col cols="12">
                  <ul>
                    <li class="dark_pink_text"><span class="grey_text body-2">{{ help.bulletOne }}</span></li>
                    <li class="dark_pink_text"><span class="grey_text body-2">{{ help.bulletTwo }}</span></li>
                    <li v-if="help.bulletThree" class="dark_pink_text"><span class="grey_text body-2">{{ help.bulletThree }}</span></li>
                  </ul>
                </v-col>
              </v-row>

            </v-col>

          </v-row>
        </v-card>
      </v-col>

      <v-col cols="3">
        <v-card outlined>
          <v-row align="center">
            <v-cols cols="12" align="center">
              <h1 class="font-weight-bold">Still Have Questions?</h1>
            </v-cols>
          </v-row>
        </v-card>
      </v-col>
      
    </v-row>

  </v-container>

</v-content>
</template>

<script>
export default {
  data() {
    return {
      helpTopics: [{
        image: 'help1.png',
        step: 'STEP 1',
        title: 'Virtual Showroom Setup',
        bulletOne: 'After meeting with a stylist you’ll be set up with an exclusive Bella virtual showroom to share your top selections with your Bella bridesmaids.',
        bulletTwo: 'Collaborate with your bridal party as much (or as little) as you’d like!',
        bulletThree: false,
      },
      {
        image: 'help2.png',
        step: 'STEP 2',
        title: 'Keep The Conversation Going',
        bulletOne: 'Achieve your dream look by having your bridal party view, comment and vote on your top picks.',
        bulletTwo: 'It doesn’t matter where you are, everyone can even add their own photos and Pinterest inspiration boards.',
        bulletThree: false,
      },
      {
        image: 'help3.png',
        step: 'STEP 3',
        title: 'Time To Order',
        bulletOne: 'Let’s do this! You’ve finalized your decision, now it’s time for your leading ladies to order.',
        bulletTwo: ' Each one of your Bella bridesmaids will log into their virtual showroom account to place their orders, choosing the style and size best for them.',
        bulletThree: 'Once everyone has ordered, we’ll share a final contract with you. You give us the thumbs up and then we’ll place the order with the designer(s).',
      },
      {
        image: 'help4.png',
        step: 'STEP 4',
        title: 'Shipping & Alterations',
        bulletOne: 'The customized dashboard will help you easily keep track of important dates, deadlines and order status.',
        bulletTwo: 'Once the dresses arrive each bridesmaid will need to try it on with the shoes they plan to wear and get any necessary alterations. You’ll want to make sure everyone feels their best on the big day!',
        bulletThree: false,
      },      
      ],
    }
  },
}
</script>

<style>
@import '../../../../styles/global_styles.css';
</style>