add html-validator + fix html ceo code
All checks were successful
Deploy Nuxt App / deploy (push) Successful in 1m31s

This commit is contained in:
2025-06-20 12:21:00 +04:00
parent cbabdf8ccb
commit 94d008ca7d
17 changed files with 318 additions and 123 deletions

View File

@ -1,6 +1,7 @@
<template>
<component
:is="tag"
:type="tag === 'button' ? 'button' : ''"
class="px-14 py-4 rounded-[20px] text-[30px] cursor-pointer shadow-[0px_16px_50px_-16px_rgba(229,30,125,1)]"
:class="[baseStyle, size]"
data-ui="ui-button"
@ -10,36 +11,36 @@
</template>
<script setup lang="ts">
import { toRefs, computed } from 'vue'
import { colorVariants } from './UiButton.params.js'
import { toRefs, computed } from "vue";
import { colorVariants } from "./UiButton.params.js";
const props = defineProps({
tag: {
type: String,
default: 'button',
default: "button",
},
variants: {
type: String as () => 'primary' | 'secondary',
default: 'primary',
type: String as () => "primary" | "secondary",
default: "primary",
validator: (value) => {
return ['primary', 'secondary'].includes(value as string)
return ["primary", "secondary"].includes(value as string);
},
},
size: {
type: String,
default: 'font-bold',
default: "font-bold",
},
})
});
const { tag, variants, size } = toRefs(props)
const { tag, variants, size } = toRefs(props);
const colorClasses: Record<'primary' | 'secondary', string[]> = {
const colorClasses: Record<"primary" | "secondary", string[]> = {
primary: colorVariants.primary,
secondary: colorVariants.secondary,
}
};
const baseStyle = computed(() => {
const variant = variants.value as 'primary' | 'secondary'
return colorClasses[variant]?.join(' ') || ''
})
const variant = variants.value as "primary" | "secondary";
return colorClasses[variant]?.join(" ") || "";
});
</script>