AlarmIcon.vue

<script setup lang="ts">
interface Props {
  color?: string;
  size?: string | number;
}
defineProps<Props>();
</script>

<template>
  <svg
    :width="`${size ?? 40}px`"
    :height="`${size ?? 40}px`"
    viewBox="0 0 24 24"
    fill="none"
    xmlns="http://www.w3.org/2000/svg"
  >
    <path
      d="M12.9999 11.8811V5.99997C12.9999 5.44768 12.5522 4.99997 11.9999 4.99997C11.4476 4.99997 10.9999 5.44768 10.9999 5.99997V12.4666C10.9999 12.8159 11.2182 13.1618 11.5173 13.3345L16.1371 16.0017C16.6154 16.2779 17.227 16.114 17.5031 15.6357C17.7792 15.1574 17.6154 14.5458 17.1371 14.2697L12.9999 11.8811Z"
      :fill="color ?? '#000000'"
    />
    <path
      fill-rule="evenodd"
      clip-rule="evenodd"
      d="M11.9999 0.00012207C11.4477 0.00012207 10.9999 0.447835 10.9999 1.00012V1.04484C9.74801 1.15765 8.55656 1.48023 7.46101 1.97715C7.18844 1.67245 6.75176 1.24982 6.16157 0.932023C5.62139 0.641155 4.92587 0.427815 4.12846 0.531815C3.3261 0.636461 2.53871 1.04702 1.79289 1.79283C1.04706 2.53865 0.636487 3.32603 0.531831 4.12839C0.427821 4.9258 0.641157 5.62133 0.932021 6.1615C1.24982 6.75171 1.67247 7.1884 1.97717 7.46097C1.34951 8.84475 0.999995 10.3815 0.999995 11.9999C0.999995 14.6729 1.95339 17.1232 3.53867 19.0293L2.29875 20.2692C1.90823 20.6597 1.90892 21.2936 2.29944 21.6841C2.68996 22.0746 3.32381 22.0753 3.71433 21.6848L4.95277 20.4464C6.86141 22.0405 9.31864 22.9999 11.9999 22.9999C14.6812 22.9999 17.1385 22.0405 19.0471 20.4464L20.2855 21.6848C20.6761 22.0753 21.3099 22.0746 21.7004 21.6841C22.0909 21.2936 22.0916 20.6597 21.7011 20.2692L20.4612 19.0293C22.0465 17.1232 22.9999 14.6729 22.9999 11.9999C22.9999 10.3815 22.6504 8.84475 22.0227 7.46097C22.3274 7.18839 22.75 6.75171 23.0678 6.1615C23.3587 5.62132 23.572 4.92579 23.468 4.12839C23.3634 3.32602 22.9528 2.53864 22.207 1.79283C21.4612 1.04702 20.6738 0.636458 19.8714 0.531811C19.074 0.427811 18.3785 0.641152 17.8383 0.932019C17.2481 1.24982 16.8114 1.67245 16.5389 1.97715C15.4433 1.48023 14.2519 1.15766 12.9999 1.04484V1.00012C12.9999 0.447835 12.5522 0.00012207 11.9999 0.00012207ZM18.337 3.00768C19.3663 3.73444 20.2654 4.63349 20.9922 5.66286C21.108 5.5287 21.2187 5.37704 21.3069 5.21331C21.4535 4.94099 21.5215 4.66777 21.4848 4.38706C21.4489 4.11131 21.297 3.71121 20.7928 3.20705C20.2886 2.70289 19.8885 2.55097 19.6128 2.515C19.332 2.47839 19.0588 2.54631 18.7865 2.69295C18.6228 2.78111 18.4711 2.89187 18.337 3.00768ZM3.0077 5.66287C3.73446 4.63349 4.63351 3.73444 5.66289 3.00768C5.52874 2.89187 5.37709 2.78111 5.21337 2.69295C4.94105 2.54631 4.66783 2.4784 4.38711 2.51501C4.11136 2.55097 3.71125 2.70289 3.20708 3.20705C2.70291 3.71121 2.55099 4.11131 2.51502 4.38707C2.47841 4.66777 2.54632 4.94099 2.69295 5.21331C2.78112 5.37704 2.89189 5.52871 3.0077 5.66287ZM11.9999 20.9931C7.03317 20.9931 3.00681 16.9667 3.00681 11.9999C3.00681 7.03317 7.03317 3.00681 11.9999 3.00681C16.9667 3.00681 20.9931 7.03317 20.9931 11.9999C20.9931 16.9667 16.9667 20.9931 11.9999 20.9931Z"
      :fill="color ?? '#000000'"
    />
  </svg>
</template>

<style scoped></style>