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

Add hello illustration

This commit is contained in:
Christian Cueni 2021-06-08 14:45:53 +02:00
parent 5188d2a061
commit 03a5a522dd
4 changed files with 171 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

139
client/src/components/illustrations/HelloIllustration.vue Normal file
View File

File diff suppressed because one or more lines are too long

14
client/src/layouts/SplitLayout.vue
View File

@ -1,6 +1,6 @@
<template> <template>
<div :class="['split-view', {'split-view--illustration': illustration}]"> <div :class="['split-view', {'split-view--illustration': illustration}]">
<div class="split-view__illustration"> <div :class="['split-view__illustration', illustrationAlignment]">
<component :is="illustration"/> <component :is="illustration"/>
</div> </div>
<div class="split-view__content"> <div class="split-view__content">
@ -13,17 +13,22 @@
import ContentsIllustration from '@/components/illustrations/ContentsIllustration'; import ContentsIllustration from '@/components/illustrations/ContentsIllustration';
import PortfolioIllustration from '@/components/illustrations/PortfolioIllustration'; import PortfolioIllustration from '@/components/illustrations/PortfolioIllustration';
import RoomsIllustration from '@/components/illustrations/RoomsIllustration'; import RoomsIllustration from '@/components/illustrations/RoomsIllustration';
import HelloIllustration from '@/components/illustrations/HelloIllustration';
export default { export default {
components: { components: {
contents: ContentsIllustration, contents: ContentsIllustration,
portfolio: PortfolioIllustration, portfolio: PortfolioIllustration,
rooms: RoomsIllustration rooms: RoomsIllustration,
hello: HelloIllustration
}, },
computed: { computed: {
illustration() { illustration() {
return this.$route.meta.illustration; return this.$route.meta.illustration;
},
illustrationAlignment() {
return this.$route.meta.illustrationAlign ? `split-view__illustration--${this.$route.meta.illustrationAlign}` : '';
} }
}, },
}; };
@ -59,6 +64,11 @@
z-index: 1; z-index: 1;
display: none; display: none;
&--top {
align-self: start;
margin-top: $large-spacing;
}
@include desktop { @include desktop {
display: flex; display: flex;
justify-content: center; justify-content: center;

43
client/src/pages/hello.vue
View File

@ -4,16 +4,6 @@
data-cy="hello-page"> data-cy="hello-page">
<div class="about"> <div class="about">
<div class="about__logos"> <div class="about__logos">
<a
href="https://www.hep-verlag.ch/"
target="_blank">
<hep-logo class="about__logo-hep"/>
</a>
<a
href="https://www.ehb.swiss/"
target="_blank">
<ehb-logo class="about__logo-ehb"/>
</a>
</div> </div>
<p class="about__text">mySkillbox ist ein Angebot des hep Verlags in <p class="about__text">mySkillbox ist ein Angebot des hep Verlags in
Zusammenarbeit mit dem Eidgenössischen Hochschulinstitut für Berufsbildung.</p> Zusammenarbeit mit dem Eidgenössischen Hochschulinstitut für Berufsbildung.</p>
@ -66,11 +56,14 @@
import HepLogo from '@/components/icons/HepLogo'; import HepLogo from '@/components/icons/HepLogo';
import EhbLogo from '@/components/icons/EhbLogo'; import EhbLogo from '@/components/icons/EhbLogo';
import Logo from '@/components/icons/Logo'; import Logo from '@/components/icons/Logo';
import HelloIllustration from '@/components/illustrations/HelloIllustration';
export default { export default {
mixins: [pageTitleMixin], mixins: [pageTitleMixin],
components: { components: {
LoadingButton, LoadingButton,
HelloIllustration,
HepLogo, HepLogo,
EhbLogo, EhbLogo,
Logo Logo
@ -121,21 +114,21 @@
} }
} }
&__logo-hep { //&__logo-hep {
width: auto; // width: auto;
height: 30px; // height: 30px;
margin-bottom: $large-spacing; // margin-bottom: $large-spacing;
//
@include desktop { // @include desktop {
width: 147px; // width: 147px;
margin-bottom: 0; // margin-bottom: 0;
} // }
} //}
//
&__logo-ehb { //&__logo-ehb {
width: 100px; // width: 100px;
height: 30px; // height: 30px;
} //}
} }
.login-actions { .login-actions {

2
client/src/router/auth.routes.js
View File

@ -9,6 +9,8 @@ export default [
meta: { meta: {
layout: 'split', layout: 'split',
public: true, public: true,
illustration: 'hello',
illustrationAlign: 'top'
}, },
}, },
{ {