- Complete GGZ Ecademy Nuxt.js user portal - Learning products browser and management - Member management interface - User authentication and roles - Multi-language support (NL/EN) - Vuex store for state management - Component-based architecture
This commit is contained in:
42
components/Hero/Hero.vue
Normal file
42
components/Hero/Hero.vue
Normal file
@@ -0,0 +1,42 @@
|
||||
<template>
|
||||
<v-container fluid>
|
||||
<v-card tile flat>
|
||||
<v-img
|
||||
class="white--text"
|
||||
gradient="to bottom, rgba(0,0,0,.1), rgba(0,0,0,.5)"
|
||||
height="480px"
|
||||
:lazy-src="require('@/assets/img/newsletter.jpg')"
|
||||
>
|
||||
<div class="d-flex justify-space-between flex-column fill-height">
|
||||
<span class="display-1 ma-4 pa-4">In the mood for black and yellow..</span>
|
||||
<div class="d-flex justify-space-between ma-4 pa-4">
|
||||
<v-btn
|
||||
v-for="(btn, i) in buttons"
|
||||
:key="i"
|
||||
tile
|
||||
depressed
|
||||
light
|
||||
class="px-6"
|
||||
color="#ffcc00"
|
||||
x-large
|
||||
>{{btn.label}}</v-btn>
|
||||
</div>
|
||||
</div>
|
||||
</v-img>
|
||||
</v-card>
|
||||
</v-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data: () => ({
|
||||
buttons: [
|
||||
{ label: 'Sierkussens', link: '' },
|
||||
{ label: 'Vloerkleden', link: '' },
|
||||
{ label: 'Salontafels', link: '' },
|
||||
{ label: 'Banken', link: '' },
|
||||
{ label: 'Leeslampen', link: '' }
|
||||
]
|
||||
})
|
||||
}
|
||||
</script>
|
||||
Reference in New Issue
Block a user