<template>
  <div class="d-inline-flex">
    <v-img v-if="variant==='full'" :src="`/logo/dexorder_full_${s.theme}mode.svg`" width="6em" inline/>
    <v-img v-if="variant==='icon'" :src="`/logo/ico_${s.theme==='dark'?'black':'white'}_clip.png`" :width="width" inline/>
  </div>
</template>

<script setup>

import {useStore} from "@/store/store.js";
import {computed} from "vue";

const s = useStore()
const props = defineProps({
  variant: {type: String, default: 'full', /* 'icon', */ },
  size: {type: String, default: 'medium'},
})

const width = computed(()=>{
  return {
    'x-small': '0.75em',
    'small': '1.0em',
    'medium': '1.25em',
    'large': '1.75em',
    'x-large': '2.5em',
  }[props.size] || props.size;
})

</script>

<style scoped lang="scss">
</style>