diff --git a/client/src/pages/hello.vue b/client/src/pages/hello.vue
index e14a2854..a3d0d361 100644
--- a/client/src/pages/hello.vue
+++ b/client/src/pages/hello.vue
@@ -18,6 +18,7 @@
mySkillbox ist ein Angebot des hep Verlags in
Zusammenarbeit mit dem Eidgenössischen Hochschulinstitut für Berufsbildung.
+
Anleitung anschauen
+
@@ -51,13 +65,15 @@
import pageTitleMixin from '@/mixins/page-title';
import HepLogo from '@/components/icons/HepLogo';
import EhbLogo from '@/components/icons/EhbLogo';
+ import Logo from '@/components/icons/Logo';
export default {
mixins: [pageTitleMixin],
components: {
LoadingButton,
HepLogo,
- EhbLogo
+ EhbLogo,
+ Logo
},
data() {
@@ -75,7 +91,25 @@
@import "@/styles/_variables.scss";
@import "@/styles/_mixins.scss";
+ $hello-block-margin: 2*$medium-spacing;
+
+ .logo {
+ display: block;
+ width: 300px;
+ margin: $small-spacing auto 0;
+
+ @include desktop {
+ display: none;
+ }
+ }
+
.about {
+ display: none;
+
+ @include desktop {
+ display: block;
+ }
+
&__text {
margin-top: $medium-spacing;
@include regular-text;
@@ -107,7 +141,7 @@
.login-actions {
@include widget-shadow;
- margin-top: $large-spacing;
+ margin-top: $hello-block-margin;
padding: $medium-spacing;
&__title {
@@ -125,10 +159,40 @@
}
.information {
- margin-top: $large-spacing;
+ margin-top: $hello-block-margin;
> p, a {
@include regular-text;
}
}
+ .links {
+ margin-top: $hello-block-margin;
+ display: flex;
+
+ &__list-item {
+
+ color: $color-silver-dark;
+
+ > a {
+ @include regular-text;
+ }
+
+ flex-direction: column;
+ margin-top: $medium-spacing;
+
+ &:first-child {
+ margin-top: 0;
+ }
+
+ @include desktop {
+ display: inline-block;
+ flex-direction: row;
+
+ &:not(:last-child) {
+ margin-right: 1rem;
+ }
+ }
+ }
+ }
+