diff --git a/components/email-subscribe.vue b/components/email-subscribe.vue index 63ceca9..3e5bf18 100644 --- a/components/email-subscribe.vue +++ b/components/email-subscribe.vue @@ -10,14 +10,14 @@ >
{} } }, data: function () { @@ -82,6 +83,33 @@ export default { feedbackMessage: null, } }, + computed: { + inputId () { + return `email-subscribe-${this._uid}` + }, + inputClasslist () { + const defaultClassGroups = { + general: 'form-input block w-full rounded-md py-1', + shadow: 'neumorphic-shadow', + bg: 'bg-darker', + focus: 'pl-8', + blur: 'placeholder-white text-center border border-transparent px-3', + } + + const mergedClassGroups = { + ...defaultClassGroups, + ...this.inputClassGroups + } + + if (this.isFocused) { + delete mergedClassGroups.blur + } else { + delete mergedClassGroups.focus + } + + return Object.values(mergedClassGroups) + } + }, methods: { async trySubmit () { console.log('Trying submit') diff --git a/components/search.vue b/components/search.vue index 1cd5bd5..1705b11 100644 --- a/components/search.vue +++ b/components/search.vue @@ -42,6 +42,7 @@
  • {{ app.text }}
  • - - + -->
    @@ -90,6 +85,28 @@
    +
    + +
    + + + +
    + +
    @@ -105,6 +122,8 @@ import scrollIntoView from 'scroll-into-view-if-needed' import appList from '~/assets/app-list.json' +import EmailSubscribe from '~/components/email-subscribe.vue' + // import overlayStore from './mixins/store' // import modalRouter from '~/components/modals/mixins/router' // import Card from '~/components/cards/Default.vue' @@ -114,6 +133,9 @@ import appList from '~/assets/app-list.json' // import PlayCircle from '~/assets/svg/play-circle.svg?inline' export default { + components: { + EmailSubscribe + }, props: { appList: { type: Array,