diff --git a/app/assets/stylesheets/newflow_layout.scss b/app/assets/stylesheets/newflow_layout.scss index 720c9755b..570e8e7ee 100644 --- a/app/assets/stylesheets/newflow_layout.scss +++ b/app/assets/stylesheets/newflow_layout.scss @@ -54,27 +54,25 @@ body { } .form-divider { + font-size: 1.2rem; + font-weight: bold; + color: #424242; + display: grid; + grid-column-gap: 2rem; + grid-template-columns: 1fr auto 1fr; + justify-items: center; text-align: center; - position: relative; - &:after { - border-top: 0.1rem solid #d5d5d5; - content: ''; - display: block; - width: calc(50% - 7rem); - right: 0px; - position: absolute; - top: 50%; + .line { + border-bottom: 0.1rem solid #d5d5d5; + width: 100%; + height: 0.1rem; + transform: translateY(1rem); } - &:before { - border-top: 0.1rem solid #d5d5d5; - content: ''; - display: block; - width: calc(50% - 7rem); - left: 0px; - position: absolute; - top: 50%; + .the-content { + max-width: calc(100vw - 18rem); + text-align: center; } } @@ -508,16 +506,6 @@ input.has-error { } } - .form-divider { - @include width-up-to($phone-max) { - margin-top: -1.5rem; - } - - font-weight: bold; - font-size: 1.2rem; - text-align: center; - } - // informational messages shown to users, for example on email confirmation screen .info-message { @include set-font(body-regular); diff --git a/app/views/newflow/login_signup/_password_show_hide.html.erb b/app/views/newflow/login_signup/_password_show_hide.html.erb index 65fae927d..e81df5f3c 100644 --- a/app/views/newflow/login_signup/_password_show_hide.html.erb +++ b/app/views/newflow/login_signup/_password_show_hide.html.erb @@ -1,6 +1,10 @@ - SHOW - + + <%= I18n.t(:"login_signup_form.show_password_btn") %> + +