kekscloud/keksAccountGUI
Archived
1
0
Fork 0
Code Issues 2 Pull requests Releases Wiki Activity

Change Startpage

Browse source
This commit is contained in:
Kekskurse 2019-08-11 22:55:26 +02:00
parent f74bfec6c2
commit dd19c6d57a
2 changed files with 55 additions and 33 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/plugins/vuetify.js
View file

@ -5,6 +5,6 @@ Vue.use(Vuetify);
export default new Vuetify({ export default new Vuetify({
icons: { icons: {
iconfont: 'mdi', iconfont: 'mdiSvg',
}, },
}); });

84
src/views/Startpage.vue
View file

@ -4,43 +4,55 @@
<h1>{{ nameBig }}<span class="small">{{ nameSmall }}</span></h1> <h1>{{ nameBig }}<span class="small">{{ nameSmall }}</span></h1>
<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-container>
</v-layout> <template>
<v-layout row wrap> <v-carousel class="bg">
<v-flex md4 xs12 text-xs-center v-for="(item, index) in apps"> <v-carousel-item
<v-card> v-for="(item, index) in apps"
<v-layout> :key="color"
<v-flex xs5> >
<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;