<template>
    <button
        class="px-4 py-2 ring-2 ring-blue ring-inset font-roboto text-base bg-transparent text-blue hover:bg-blue hover:text-white transition duration-200
                disabled:bg-smokewhite disabled:ring-lightgrey disabled:hover:bg-smokewhite disabled:cursor-not-allowed disabled:text-lightgrey disabled:hover:text-lightgrey"
        @click="pressed"
        :disabled="disabled">
        {{ text }}
    </button>
</template>

<script>
export default {
    name: "HoverButtonBlue",
    props: {
        text: {
            type: String,
            default: ''
        },
        pressed: {
            type: Function,
            default: () => {}
        },
        disabled: {
            type: Boolean,
            default: false
        }
    }
}
</script>