How do i add a transition on Quasar?

Question

I press the button but it doesn't come with transitions. Where am i doing wrong? It doesn't come with transition when the button is pressed. I can send the codes you want as well. Simple mistake but i couldn't

 <q-btn
    class="filterbtn q-mx-sm q-mt-sm"
    flat
    color="grey"
    outline
    @click="filterOpen"
    icon="tune"
    label="filtreler"
  />

  <q-item class="filterchooses q-mx-sm q-mt-sm" v-model="expanded" v-show="expanded">
    <q-list>
      <q-item-section>Yükleme Tarihi</q-item-section>
      <q-separator color="grey-9" class="q-mt-sm q-mb-lg" />
      <q-item-label class="q-mt-sm" caption>
        <li
          class="filterchoose q-my-md cursor-pointer"
          v-for="item in filterList"
          :key="item.chooseDate"
        >{{ item.chooseDate }}</li>
      </q-item-label>
    </q-list>

    <q-list class="q-ml-xl">
      <q-item-section>Video Süresi</q-item-section>
      <q-separator color="grey-9" class="q-mt-sm q-mb-lg" />
      <q-item-label class="q-mt-sm" caption>
        <li
          class="filterchoose q-my-md cursor-pointer"
          v-for="item in filterList"
          :key="item.chooseDuration"
        >{{ item.chooseDuration }}</li>
      </q-item-label>
    </q-list>
  </q-item>



<style>
  .filterchooses{
  transition: 0.3s;
  }
</style>