ramon
/
skillbox
1
0
Fork 0
Code Issues 1 Pull Requests 1 Packages Projects 1 Releases 1 Wiki Activity

Update styling on join class page

This commit is contained in:
Ramon Wenger 2020-02-13 15:51:50 +01:00
parent 97469ce419
commit d22a77e513
3 changed files with 21 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
client/src/pages/joinClass.vue
View File

@ -1,18 +1,23 @@
<template> <template>
<div> <div>
<h1>Schulklasse beitreten {{code}}</h1> <h1>Zugangscode eingeben</h1>
<div> <div>
<div v-if="error"> <div v-if="error">
{{error}} {{error}}
</div> </div>
<input <div class="skillboxform-input">
class="skillbox-input" <label for="join-code" class="skillboxform-input__label">Zugangscode</label>
data-cy="input-class-code" <input
:value="code" id="join-code"
@input="updateCode"> class="skillbox-input skillboxform-input__input"
data-cy="input-class-code"
:value="code"
@input="updateCode">
</div>
<div> <div>
<a class="button" data-cy="join-class" @click="joinClass(code)">Beitreten</a> <a class="button button--primary button--big" data-cy="join-class" @click="joinClass(code)">Klasse beitreten</a>
<a class="button button--big" data-cy="join-class-cancel" @click="cancel">Abbrechen</a>
</div> </div>
</div> </div>
@ -59,6 +64,9 @@
console.error(e.message) console.error(e.message)
this.error = 'Code ist nicht gültig'; this.error = 'Code ist nicht gültig';
}) })
},
cancel() {
this.$router.go(-1);
} }
} }
} }

10
client/src/pages/profile.vue
View File

@ -2,16 +2,16 @@
<div class="profile"> <div class="profile">
<nav class="top-navigation profile-submenu profile__submenu"> <nav class="top-navigation profile-submenu profile__submenu">
<router-link to="/me/activity" active-class="top-navigation__link--active" <router-link to="/me/activity" active-class="top-navigation__link--active"
class="top-navigation__link profile-submenu__item submenu-item">Aktivität class="top-navigation__link profile-submenu__item submenu-item">Aktivität
</router-link> </router-link>
<router-link to="/me/myclasses" active-class="top-navigation__link--active" <router-link to="/me/myclasses" active-class="top-navigation__link--active"
class="top-navigation__link profile-submenu__item submenu-item">Klassenliste class="top-navigation__link profile-submenu__item submenu-item">Klassenliste
</router-link> </router-link>
<router-link to="/me/profile" active-class="top-navigation__link--active" <router-link to="/me/profile" active-class="top-navigation__link--active"
class="top-navigation__link profile-submenu__item submenu-item">Profil class="top-navigation__link profile-submenu__item submenu-item">Profil
</router-link> </router-link>
<router-link to="/me/join-class" active-class="top-navigation__link--active" data-cy="join-class-link" <router-link :to="{name:'join-class'}" active-class="top-navigation__link--active" data-cy="join-class-link"
class="top-navigation__link profile-submenu__item submenu-item">Klasse beitreten class="top-navigation__link profile-submenu__item submenu-item">Klasse beitreten
</router-link> </router-link>
</nav> </nav>
<router-view></router-view> <router-view></router-view>

2
client/src/router/index.js
View File

@ -110,10 +110,10 @@ const routes = [
{path: 'profile', name: 'profile', component: profile, meta: {isProfile: true}}, {path: 'profile', name: 'profile', component: profile, meta: {isProfile: true}},
{path: 'myclasses', name: 'my-classes', component: myClasses, meta: {isProfile: true}}, {path: 'myclasses', name: 'my-classes', component: myClasses, meta: {isProfile: true}},
{path: 'activity', name: 'activity', component: activity, meta: {isProfile: true}}, {path: 'activity', name: 'activity', component: activity, meta: {isProfile: true}},
{path: 'join-class', name: 'join-class', component: joinClass, meta: {isProfile: true}},
{path: '', name: 'profile-activity', component: activity, meta: {isProfile: true}}, {path: '', name: 'profile-activity', component: activity, meta: {isProfile: true}},
] ]
}, },
{path: 'join-class', name: 'join-class', component: joinClass, meta: {layout: 'simple'}},
{ {
path: '/survey/:id', path: '/survey/:id',
component: surveyPage, component: surveyPage,