<style scoped src="./Technology.css"/>

<template>
  <div class="Technology flex-col" :class="[size]">
    <a v-if="link" :href="link" target="_blank" rel="noopener noreferrer">
      <img :src="img" :alt="name" :class="[size]"/>
    </a>
    <img v-else :src="img" :alt="name"/>
    <span class="tip">{{name}}</span>
  </div>
</template>

<script setup lang="ts">
type Props = {
  img: string
  name: string
  link?: string
  size?: 'm' | 'l'
}

withDefaults(defineProps<Props>(), {
  size: 'm'
})
</script>
