import { onMounted } from 'vue'
import _kebabCase from 'lodash/kebabCase'
import { themes } from '@/libs/theme'

export default () => {
    const style = {
        backgroundColor: themes.red.bg,
        color: themes.red.fg,
        padding: '8px',
        borderRadius: '5px',
        fontWeight: 'bold',
    }

    const styleToString = (style) => {
        return Object.entries(style)
            .map(([key, value]) => `${_kebabCase(key)}: ${value}`)
            .join('; ')
    }

    onMounted(() => {
        console.log('%c🪄 nicwands 🪄', styleToString(style))
        console.log(
            '%cDesign by: Jeff Kardos https://jeffkardos.com',
            styleToString(style),
        )
    })
}
