Change profile layout

This commit is contained in:
Ramon Wenger 2020-02-27 14:21:56 +01:00
parent c8449e7fe9
commit fffbc47fde
3 changed files with 12 additions and 36 deletions

View File

@ -1,7 +1,6 @@
<template>
<div class="profile">
<h1 class="profile__header">Profil</h1>
<h2 class="profile__avatar profile-avatar">Profilbild</h2>
<h1 class="profile__header">Profilbild</h1>
<div class="profile-avatar" v-if="me.avatarUrl" >
<div class="profile-avatar__image">
<avatar :avatarUrl="me.avatarUrl" />

View File

@ -1,19 +1,5 @@
<template>
<div class="profile">
<nav class="top-navigation profile-submenu profile__submenu">
<router-link to="/me/activity" active-class="top-navigation__link--active"
class="top-navigation__link profile-submenu__item submenu-item">Aktivität
</router-link>
<router-link to="/me/myclasses" active-class="top-navigation__link--active"
class="top-navigation__link profile-submenu__item submenu-item">Klassenliste
</router-link>
<router-link to="/me/profile" active-class="top-navigation__link--active"
class="top-navigation__link profile-submenu__item submenu-item">Profil
</router-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
</router-link>
</nav>
<router-view></router-view>
</div>
</template>
@ -24,26 +10,15 @@
@import "@/styles/_mixins.scss";
.profile {
padding: $medium-spacing;
padding: $large-spacing;
max-width: 640px;
margin: 0 auto;
width: 100%;
box-sizing: border-box;
@include desktop {
max-width: 1024px;
margin: 0;
}
&__submenu {
margin-bottom: $medium-spacing;
margin-left: -$medium-spacing;
max-width: 800px;
margin: 0 auto;
}
}
.profile-submenu {
&__item {
font-family: $sans-serif-font-family;
font-size: toRem(14px);
}
}
</style>

View File

@ -1,8 +1,10 @@
@import "variables";
.uploadcare--panel {
background: $color-silver-light;
height: 200px;
border: none;
border-radius: 0;
background: $color-white;
height: 230px;
border: 1px dashed $color-silver;
border-radius: 12px;
}
.uploadcare--menu {