login should use generic two columns layout

This commit is contained in:
Mathieu Magnin 2017-06-20 11:42:54 +02:00
parent 3388dc0e1f
commit 3f20d6fb9d
2 changed files with 6 additions and 31 deletions

View file

@ -4,45 +4,20 @@
$login-breakpoint: 820px; $login-breakpoint: 820px;
.login-wrapper {
@extend %page-width-container;
display: flex;
flex-direction: row;
align-items: center;
}
$login-padding: 60px;
.preview,
.login-form {
width: 50%;
padding: $login-padding;
}
@media (max-width: $login-breakpoint) { @media (max-width: $login-breakpoint) {
.preview { .preview {
display: none; display: none;
} }
.login-form { .two-columns .column.login-form {
@include horizontal-padding(0); @include horizontal-padding(0);
width: 100%; width: 100%;
} }
} }
@media (min-width: $login-breakpoint) { @media (max-width: $login-breakpoint) {
.two-columns { .two-columns {
background: linear-gradient(to right, #FFFFFF 0%, #FFFFFF 50%, $light-grey 50%, $light-grey 100%); background: #FFFFFF;
}
}
@media (min-width: $page-width + (2 * $login-padding)) {
.preview {
padding-left: 0;
}
.login-form {
padding-right: 0;
} }
} }

View file

@ -1,6 +1,6 @@
.two-columns .two-columns
.login-wrapper .columns-container
.preview .column.preview
- unless @dossier - unless @dossier
= image_tag "landing/hero/dematerialiser.svg", class: "paperless-logo" = image_tag "landing/hero/dematerialiser.svg", class: "paperless-logo"
.baseline.center .baseline.center
@ -22,7 +22,7 @@
%p.procedure-description %p.procedure-description
= h @dossier.procedure.description.html_safe = h @dossier.procedure.description.html_safe
.login-form .column.login-form
= form_for @user, url: user_session_path, html: { class: "form" } do |f| = form_for @user, url: user_session_path, html: { class: "form" } do |f|
%h1 Connectez-vous %h1 Connectez-vous