How create footer into panel

I am using a website where I want to use the Framework7 combination with Vue. I created a side panel with a listing inside. Now I would like to create an icon within this panel but it is positioned at the end of it: an exit icon. Can someone give me a hand?

 <template>
  <f7-panel left cover theme-auto :visible-breakpoint="960">
    <f7-list media-list>
      <f7-list-item link="#">
        <img slot="media" src="https://image.flaticon.com/icons/svg/2943/2943218.svg" width="80" />
    <a href>Enlace 1</a>
  </f7-list-item>
  <f7-list-item
    link="#"
  >
    <img
      slot="media"
      src="https://banner2.cleanpng.com/20180410/zje/kisspng-borderlands-2-borderlands-3-tales-from-the-borderl-alphabet-collection-5acd7b9d83f218.3032657615234159655405.jpg"
      width="80"
    />
  </f7-list-item>
  <f7-list-item
    link="#"
  >
    <img
      slot="media"
      src="https://cdn.icon-icons.com/icons2/1070/PNG/512/darth-vader_icon-icons.com_76959.png"
      width="80"
    />

  </f7-list-item>
</f7-list>

Just apply custom CSS styles to that element, e.g. position: absolute; bottom: 0;, etc.