<template>
    <svg
        xmlns="http://www.w3.org/2000/svg"
        viewBox="0 0 512 512"
        :class="[stroke, fill]">
        <path
            d="M448 256c0-106-86-192-192-192S64 150 64 256s86 192 192 192 192-86 192-192z"
            fill="none"
            stroke-miterlimit="10"
            :stroke-width="strokeWidth" />
        <path
            d="M250.26 166.05L256 288l5.73-121.95a5.74 5.74 0 00-5.79-6h0a5.74 5.74 0 00-5.68 6z"
            fill="none"
            stroke-linecap="round"
            stroke-linejoin="round"
            :stroke-width="strokeWidth" />
        <path d="M256 367.91a20 20 0 1120-20 20 20 0 01-20 20z" />
    </svg>
</template>

<script>
export default {
    name: 'WarningIcon',
    props: {
        strokeWidth: {
            type: Number,
            default: 30
        },
        stroke: {
            type: String,
            default: 'stroke-red'
        },
        fill: {
            type: String,
            default: 'fill-red'
        }
    }
}

</script>
