diff --git a/app/assets/stylesheets/new_design/auth.scss b/app/assets/stylesheets/new_design/auth.scss index 6109a22a3..9196f0fa1 100644 --- a/app/assets/stylesheets/new_design/auth.scss +++ b/app/assets/stylesheets/new_design/auth.scss @@ -3,67 +3,6 @@ @import "placeholders"; @import "mixins"; -$auth-breakpoint: $two-columns-breakpoint; - -.preview { - font-size: 24px; - - .paperless-logo { - width: 100%; - margin-bottom: 60px; - - @media (max-width: $auth-breakpoint) { - display: none; - } - } - - h3 { - color: $blue; - font-weight: bold; - } - - .close-procedure { - font-size: 12px; - } - - .procedure-title { - font-size: 30px; - margin: 20px 0 0; - - @media (min-width: $auth-breakpoint) { - margin: 50px 0 32px; - } - } - - .procedure-description { - font-size: 14px; - - p { - margin-bottom: 2 * $default-spacer; - } - - @media (max-width: $auth-breakpoint) { - display: none; // TO FIX : make this description available for small devices - } - } - - .procedure-logos { - display: flex; - justify-content: space-around; - - img { - max-height: 50px; - max-width: 100%; - margin: 0 10px; - - @media (min-width: $auth-breakpoint) { - max-height: 130px; - max-width: 500px; - } - } - } -} - .auth-form { .auth-options { display: flex; @@ -122,14 +61,6 @@ $auth-breakpoint: $two-columns-breakpoint; } } -.identity-form { - @media (max-width: $two-columns-breakpoint) { - input[type=submit] { - margin-bottom: 2 * $default-padding; - } - } -} - .sign-in-form .form { input[type="password"] { margin-bottom: $default-spacer; diff --git a/app/assets/stylesheets/new_design/procedure_context.scss b/app/assets/stylesheets/new_design/procedure_context.scss new file mode 100644 index 000000000..f0772825f --- /dev/null +++ b/app/assets/stylesheets/new_design/procedure_context.scss @@ -0,0 +1,71 @@ +@import "colors"; +@import "constants"; + +$procedure-context-breakpoint: $two-columns-breakpoint; + +.procedure-preview { + font-size: 24px; + + .paperless-logo { + width: 100%; + margin-bottom: 60px; + + @media (max-width: $procedure-context-breakpoint) { + display: none; + } + } + + h3 { + color: $blue; + font-weight: bold; + } + + .close-procedure { + font-size: 12px; + } + + .procedure-title { + font-size: 30px; + margin: 20px 0 0; + + @media (min-width: $procedure-context-breakpoint) { + margin: 50px 0 32px; + } + } + + .procedure-description { + font-size: 14px; + + p { + margin-bottom: 2 * $default-spacer; + } + + @media (max-width: $procedure-context-breakpoint) { + display: none; // TO FIX : make this description available for small devices + } + } + + .procedure-logos { + display: flex; + justify-content: space-around; + + img { + max-height: 50px; + max-width: 100%; + margin: 0 10px; + + @media (min-width: $procedure-context-breakpoint) { + max-height: 130px; + max-width: 500px; + } + } + } +} + +.procedure-context-content { + @media (max-width: $procedure-context-breakpoint) { + input[type=submit] { + margin-bottom: 2 * $default-padding; + } + } +} diff --git a/app/views/layouts/procedure_context.html.haml b/app/views/layouts/procedure_context.html.haml index 5f6098cf0..223bff4c2 100644 --- a/app/views/layouts/procedure_context.html.haml +++ b/app/views/layouts/procedure_context.html.haml @@ -1,8 +1,8 @@ - content_for :content do - .two-columns + .two-columns.procedure-context .columns-container - .column.preview + .column.procedure-preview - procedure = @dossier.procedure .procedure-logos = image_tag logo_img(procedure) @@ -13,7 +13,7 @@ .procedure-description = h string_to_html(procedure.description) - .column.identity-form + .column.procedure-context-content = yield - content_for :footer do