diff options
Diffstat (limited to 'src/layouts')
-rw-r--r-- | src/layouts/LoginLayout.vue | 51 |
1 files changed, 51 insertions, 0 deletions
diff --git a/src/layouts/LoginLayout.vue b/src/layouts/LoginLayout.vue new file mode 100644 index 00000000..bb89f25e --- /dev/null +++ b/src/layouts/LoginLayout.vue @@ -0,0 +1,51 @@ +<template> + <main> + <b-container class="login-container" fluid> + <b-row class="login-row" align-v="center"> + <b-col class="login-branding mt-5 mb-5 text-center" md="6"> + <div class="login-branding__container"> + <img + class="logo" + width="200px" + src="@/assets/images/openbmc-logo.svg" + alt="" + /> + <h1>OpenBMC</h1> + </div> + </b-col> + <b-col md="6"> + <router-view /> + </b-col> + </b-row> + </b-container> + </main> +</template> + +<script> +export default { + name: 'LoginLayout' +}; +</script> + +<style lang="scss" scoped> +@import 'src/assets/styles/helpers'; + +.login-container { + @include media-breakpoint-up(md) { + background: linear-gradient(to right, $light 50%, $container-bgd 50%); + } +} + +.login-row { + @include media-breakpoint-up(md) { + min-height: 100vh; + } +} + +.login-branding__container { + @include media-breakpoint-up(md) { + float: right; + margin-right: 4rem; + } +} +</style> |