Change Startpage
This commit is contained in:
parent
f74bfec6c2
commit
dd19c6d57a
2 changed files with 55 additions and 33 deletions
|
@ -5,6 +5,6 @@ Vue.use(Vuetify);
|
||||||
|
|
||||||
export default new Vuetify({
|
export default new Vuetify({
|
||||||
icons: {
|
icons: {
|
||||||
iconfont: 'mdi',
|
iconfont: 'mdiSvg',
|
||||||
},
|
},
|
||||||
});
|
});
|
|
@ -5,42 +5,54 @@
|
||||||
<h2>{{ slogen }}</h2>
|
<h2>{{ slogen }}</h2>
|
||||||
</div>
|
</div>
|
||||||
<v-container grid-list-md pa-10>
|
<v-container grid-list-md pa-10>
|
||||||
<v-layout row wrap>
|
<v-layout wrap>
|
||||||
<v-flex md12>
|
<v-flex v-for="i in 3" :key="`4${i}`" style="text-align: justify; padding-left: 10px; padding-right: 10px;" xs4>
|
||||||
<h1>Services</h1>
|
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>
|
||||||
<p>Mit deinem KeksAccount Username kannst du dich u.a. bei folgenden Servicen einloggen und diese nutzten. </p>
|
|
||||||
</v-flex>
|
</v-flex>
|
||||||
|
|
||||||
</v-layout>
|
</v-layout>
|
||||||
<v-layout row wrap>
|
</v-container>
|
||||||
<v-flex md4 xs12 text-xs-center v-for="(item, index) in apps">
|
<template>
|
||||||
<v-card>
|
<v-carousel class="bg">
|
||||||
<v-layout>
|
<v-carousel-item
|
||||||
<v-flex xs5>
|
v-for="(item, index) in apps"
|
||||||
|
:key="color"
|
||||||
|
>
|
||||||
|
<v-sheet
|
||||||
|
color="transparent"
|
||||||
|
height="100%"
|
||||||
|
tile
|
||||||
|
>
|
||||||
|
<v-layout
|
||||||
|
align-center
|
||||||
|
fill-height
|
||||||
|
justify-center
|
||||||
|
>
|
||||||
|
<v-container grid-list-md pa-10 style="margin-right: 20%;margin-left: 20%;">
|
||||||
|
<v-layout wrap>
|
||||||
|
<v-flex xs4>
|
||||||
<v-img
|
<v-img
|
||||||
:src="getImageUrl(item.id)"
|
:src="getImageUrl(item.id)"
|
||||||
height="125px"
|
height="125px"
|
||||||
contain
|
contain
|
||||||
></v-img>
|
></v-img>
|
||||||
</v-flex>
|
</v-flex>
|
||||||
<v-flex xs7>
|
<v-flex xs8>
|
||||||
<v-card-title primary-title>
|
<h1>{{ item.name }}</h1>
|
||||||
<div>
|
<p>{{ item.description }}</p>
|
||||||
<div class="headline">{{ item.name }}</div>
|
|
||||||
<div>{{ item.description }}</div>
|
|
||||||
</div>
|
|
||||||
</v-card-title>
|
|
||||||
</v-flex>
|
</v-flex>
|
||||||
</v-layout>
|
</v-layout>
|
||||||
<v-divider light></v-divider>
|
</v-container>
|
||||||
<v-card-actions class="pa-3">
|
|
||||||
|
|
||||||
<v-spacer></v-spacer>
|
</v-layout>
|
||||||
<v-btn icon>
|
</v-sheet>
|
||||||
<v-icon @click="navigateToApp(item)">input</v-icon>
|
</v-carousel-item>
|
||||||
</v-btn>
|
</v-carousel>
|
||||||
</v-card-actions>
|
</template>
|
||||||
</v-card>
|
<v-container grid-list-md pa-10>
|
||||||
|
<v-layout wrap>
|
||||||
|
<v-flex style="text-align: justify; padding-left: 10px; padding-right: 10px;" xs12>
|
||||||
|
<h3>Open Source</h3>
|
||||||
|
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>
|
||||||
</v-flex>
|
</v-flex>
|
||||||
</v-layout>
|
</v-layout>
|
||||||
</v-container>
|
</v-container>
|
||||||
|
@ -63,7 +75,14 @@
|
||||||
{ icon: 'info', title: 'Invited' },
|
{ icon: 'info', title: 'Invited' },
|
||||||
{ icon: 'warning', title: 'Register' }
|
{ icon: 'warning', title: 'Register' }
|
||||||
],
|
],
|
||||||
apps: []
|
apps: [],
|
||||||
|
colors: [
|
||||||
|
'primary',
|
||||||
|
'secondary',
|
||||||
|
'yellow darken-2',
|
||||||
|
'red',
|
||||||
|
'orange',
|
||||||
|
],
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
@ -86,6 +105,9 @@
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
|
.bg {
|
||||||
|
background-image: url('~@/assets/texture-1485529_1920.jpg');
|
||||||
|
}
|
||||||
.headerStartpage {
|
.headerStartpage {
|
||||||
background-image: url('~@/assets/texture-1485529_1920.jpg');
|
background-image: url('~@/assets/texture-1485529_1920.jpg');
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
|
@ -94,7 +116,7 @@
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
.headerStartpage h1{
|
.headerStartpage h1{
|
||||||
padding-top: 200px;
|
padding-top: 300px;
|
||||||
font-size: 56px !important;
|
font-size: 56px !important;
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
line-height: 32px !important;
|
line-height: 32px !important;
|
||||||
|
|
Reference in a new issue