code code code

vuejs

Models

<!-- BaseInput.vue component -->

<template>
    <div>
        <input type="text" :value="title" @input="updateValue" />
    </div>
</template>

<script>
export default {
    name: 'BaseInput',
    props: ['title'],
    model: {
        prop: 'title',
        event: 'changeTitle'
    },
    methods: {
        updateValue(event) {
            this.$emit('changeTitle', event.target.value)
        }
    },
}
</script>

button css

padding: 7px 10px;
border-radius: 3px;
font-size: 15px;
font-weight: 500;
border: var(--border-button-flat);
background-color: var(--background-secondary);
align-items: center;
background-image: linear-gradient(#FCFCFC, #F6F7F9);
border-radius: 10px;