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

Add basic styles to hello page elements

This commit is contained in:
Christian Cueni 2021-06-03 11:19:16 +02:00
parent 2e3cb1d832
commit 34ad66bab7
1 changed files with 33 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -19,17 +19,18 @@
Zusammenarbeit mit dem Eidgenössischen Hochschulinstitut für Berufsbildung.</p> Zusammenarbeit mit dem Eidgenössischen Hochschulinstitut für Berufsbildung.</p>
</div> </div>
<div class="login-actions"> <div class="login-actions">
<h1 <h2
class="hello__title public-page__title" class="login-actions__title"
data-cy="hello-title">Wollen Sie {{ pageTitle }} im Unterricht verwenden?</h1> data-cy="hello-title">Wollen Sie {{ pageTitle }} im Unterricht verwenden?</h2>
<a <a
class="button button--primary button--big actions__submit" class="button button--primary button--big actions__submit"
href="/api/oauth/login/" href="/api/oauth/login/"
data-cy="oauth-login">Mit hep Konto anmelden</a> data-cy="oauth-login">Mit hep Konto anmelden</a>
<div class="register"> <div class="login-actions__register register">
<p>Haben Sie noch kein hep Konto?</p> <p>Haben Sie noch kein hep Konto?</p>
<a <a
class="hep-link"
href="/api/oauth/login/" href="/api/oauth/login/"
data-cy="oauth-login">Jetzt registrieren</a> data-cy="oauth-login">Jetzt registrieren</a>
</div> </div>
@ -37,6 +38,7 @@
<div class="information"> <div class="information">
<p>Was ist ein hep Konto und wie kann ich mich dafür registrieren?</p> <p>Was ist ein hep Konto und wie kann ich mich dafür registrieren?</p>
<a <a
class="hep-link"
href="/api/oauth/login/" href="/api/oauth/login/"
data-cy="oauth-login">Anleitung anschauen</a> data-cy="oauth-login">Anleitung anschauen</a>
</div> </div>
@ -102,4 +104,31 @@
} }
} }
.login-actions {
@include widget-shadow;
margin-top: $large-spacing;
padding: $medium-spacing;
&__title {
font-size: 2.125rem; // 34px
font-weight: 700;
}
&__register {
margin-top: $large-spacing;
> p, a {
@include regular-text;
}
}
}
.information {
margin-top: $large-spacing;
> p, a {
@include regular-text;
}
}
</style> </style>