Skip to content
This repository was archived by the owner on Feb 5, 2025. It is now read-only.

Commit 5476682

Browse files
christiemolloyjeff-phillips-18
christiemolloy
authored and
jeff-phillips-18
committed
fix(login alert): created login-basic-alert page and reformatted the alert and danger text
1 parent 3f7b7b8 commit 5476682

File tree

9 files changed

+77
-13
lines changed

9 files changed

+77
-13
lines changed

‎src/less/login.less‎

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -105,6 +105,8 @@
105105
// The following styles are for the new login
106106
// --------------------------------------------------
107107
.login-pf-page {
108+
padding-top: @login-pf-page-padding-top;
109+
108110
.login-pf-brand {
109111
margin-top: @login-pf-brand-margin-top;
110112
max-width:360px;
@@ -158,7 +160,7 @@
158160
}
159161
display:flex;
160162
flex-direction: column;
161-
h1, p {
163+
h1 {
162164
text-align: center;
163165
}
164166
h1 {
@@ -186,6 +188,7 @@
186188
}
187189
}
188190
}
191+
189192
.login-pf-signup {
190193
margin: @login-pf-signup-margin-top 0 0;
191194
font-size: ceil((@font-size-base * 1.25));
@@ -203,6 +206,10 @@
203206
display: flex;
204207
justify-content: center;
205208
flex-wrap:wrap;
209+
padding-bottom: @login-pf-page-footer-padding-bottom-mobile;
210+
@media (min-width: @screen-sm-min) {
211+
padding-bottom: @login-pf-page-footer-padding-bottom-desktop;
212+
}
206213
&-links {
207214
display: flex;
208215
margin: @login-pf-page-footer-links-margin-top 0 0 0;

‎src/less/variables.less‎

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -401,8 +401,9 @@
401401

402402
// Login page
403403
// -------------------
404-
@login-pf-brand-margin-top: 20px;
405-
@login-pf-brand-desktop-margin-top: 62px;
404+
@login-pf-brand-margin-top: 0px;
405+
@login-pf-page-padding-top: 20px;
406+
@login-pf-brand-desktop-margin-top: 22px;
406407
@login-pf-page-header-margin-bottom: 20px;
407408
@login-pf-page-header-desktop-margin-bottom: 40px;
408409
@login-pf-page-header-paragraph-margin-top: 20px;
@@ -413,13 +414,15 @@
413414
@login-pf-dropdown-toggle-padding-right: 15px;
414415
@login-pf-btn-primary-margin-top: 40px;
415416
@login-pf-header-margin-bottom: 20px;
416-
@login-pf-header-desktop-margin-bottom: 30px;
417+
@login-pf-header-desktop-margin-bottom: 10px;
417418
@login-pf-signup-margin-top: 40px;
418419
@login-pf-signup-a-margin-left: 10px;
419420
@login-pf-page-footer-links-margin-top: 60px;
420421
@login-pf-page-footer-links-li-margin-right: 20px;
421422
@login-pf-page-footer-sso-margin-top: 40px;
422423
@login-pf-page-footer-sso-logos-li-margin: 5px;
424+
@login-pf-page-footer-padding-bottom-mobile: 50px;
425+
@login-pf-page-footer-padding-bottom-desktop: 100px;
423426
@login-pf-page-accounts-margin: 20px;
424427
@login-pf-accounts-section-heading-margin-top: 30px;
425428
@login-pf-accounts-section-heading-margin-bottom: 30px;
@@ -438,6 +441,8 @@
438441
@alert-info-border: @color-pf-black-500;
439442
@alert-link-font-weight: 500;
440443
@alert-padding: 11px;
444+
@alert-margin-left: 250px;
445+
@alert-margin-right: 250px;
441446
@body-bg: @color-pf-white;
442447
@border-radius-base: 1px;
443448
@brand-danger: @color-pf-red;
@@ -519,6 +524,7 @@
519524
@alert-warning-bg: lighten(@color-pf-orange-100, 8%);
520525
@alert-warning-border: @brand-warning;
521526
@alert-warning-text: @gray-dark;
527+
@text-danger-p-padding-top: 10px;
522528
@badge-border-radius: @border-radius-base;
523529
@border-radius-large: @border-radius-base;
524530
@border-radius-small: @border-radius-base;

‎src/sass/converted/patternfly/_login.scss‎

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -105,6 +105,9 @@
105105
// The following styles are for the new login
106106
// --------------------------------------------------
107107
.login-pf-page {
108+
padding-top: $login-pf-page-padding-top;
109+
// padding-bottom: $login-pf-page-padding-bottom;
110+
108111
.login-pf-brand {
109112
margin-top: $login-pf-brand-margin-top;
110113
max-width:360px;
@@ -158,7 +161,7 @@
158161
}
159162
display:flex;
160163
flex-direction: column;
161-
h1, p {
164+
h1 {
162165
text-align: center;
163166
}
164167
h1 {
@@ -186,6 +189,7 @@
186189
}
187190
}
188191
}
192+
189193
.login-pf-signup {
190194
margin: $login-pf-signup-margin-top 0 0;
191195
font-size: ceil(($font-size-base * 1.25));
@@ -203,6 +207,10 @@
203207
display: flex;
204208
justify-content: center;
205209
flex-wrap:wrap;
210+
padding-bottom: $login-pf-page-footer-padding-bottom-mobile;
211+
@media (min-width: $screen-sm-min) {
212+
padding-bottom: $login-pf-page-footer-padding-bottom-desktop;
213+
}
206214
&-links {
207215
display: flex;
208216
margin: $login-pf-page-footer-links-margin-top 0 0 0;

‎src/sass/converted/patternfly/_variables.scss‎

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -401,8 +401,9 @@ $navbar-pf-alt-navbar-toggle-icon-bar-hover-bg: $navbar-pf-v
401401

402402
// Login page
403403
// -------------------
404-
$login-pf-brand-margin-top: 20px !default;
405-
$login-pf-brand-desktop-margin-top: 62px !default;
404+
$login-pf-brand-margin-top: 0px !default;
405+
$login-pf-page-padding-top: 20px !default;
406+
$login-pf-brand-desktop-margin-top: 22px !default;
406407
$login-pf-page-header-margin-bottom: 20px !default;
407408
$login-pf-page-header-desktop-margin-bottom: 40px !default;
408409
$login-pf-page-header-paragraph-margin-top: 20px !default;
@@ -413,13 +414,15 @@ $login-pf-checkbox-label-margin-bottom: 15px !
413414
$login-pf-dropdown-toggle-padding-right: 15px !default;
414415
$login-pf-btn-primary-margin-top: 40px !default;
415416
$login-pf-header-margin-bottom: 20px !default;
416-
$login-pf-header-desktop-margin-bottom: 30px !default;
417+
$login-pf-header-desktop-margin-bottom: 10px !default;
417418
$login-pf-signup-margin-top: 40px !default;
418419
$login-pf-signup-a-margin-left: 10px !default;
419420
$login-pf-page-footer-links-margin-top: 60px !default;
420421
$login-pf-page-footer-links-li-margin-right: 20px !default;
421422
$login-pf-page-footer-sso-margin-top: 40px !default;
422423
$login-pf-page-footer-sso-logos-li-margin: 5px !default;
424+
$login-pf-page-footer-padding-bottom-mobile: 50px !default;
425+
$login-pf-page-footer-padding-bottom-desktop: 100px !default;
423426
$login-pf-page-accounts-margin: 20px !default;
424427
$login-pf-accounts-section-heading-margin-top: 30px !default;
425428
$login-pf-accounts-section-heading-margin-bottom: 30px !default;
@@ -438,6 +441,8 @@ $login-pf-social-margin: 40px 0 0 0 !d
438441
$alert-info-border: $color-pf-black-500 !default;
439442
$alert-link-font-weight: 500 !default;
440443
$alert-padding: 11px !default;
444+
$alert-margin-left: 250px !default;
445+
$alert-margin-right: 250px !default;
441446
$body-bg: $color-pf-white !default;
442447
$border-radius-base: 1px !default;
443448
$brand-danger: $color-pf-red !default;
@@ -519,6 +524,7 @@ $alert-success-text: $gray-dark !
519524
$alert-warning-bg: lighten($color-pf-orange-100, 8%) !default;
520525
$alert-warning-border: $brand-warning !default;
521526
$alert-warning-text: $gray-dark !default;
527+
$text-danger-p-padding-top: 10px !default;
522528
$badge-border-radius: $border-radius-base !default;
523529
$border-radius-large: $border-radius-base !default;
524530
$border-radius-small: $border-radius-base !default;

‎src/sass/converted/rcue/_login.scss‎

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -105,6 +105,9 @@
105105
// The following styles are for the new login
106106
// --------------------------------------------------
107107
.login-pf-page {
108+
padding-top: $login-pf-page-padding-top;
109+
// padding-bottom: $login-pf-page-padding-bottom;
110+
108111
.login-pf-brand {
109112
margin-top: $login-pf-brand-margin-top;
110113
max-width:360px;
@@ -158,7 +161,7 @@
158161
}
159162
display:flex;
160163
flex-direction: column;
161-
h1, p {
164+
h1 {
162165
text-align: center;
163166
}
164167
h1 {
@@ -186,6 +189,7 @@
186189
}
187190
}
188191
}
192+
189193
.login-pf-signup {
190194
margin: $login-pf-signup-margin-top 0 0;
191195
font-size: ceil(($font-size-base * 1.25));
@@ -203,6 +207,10 @@
203207
display: flex;
204208
justify-content: center;
205209
flex-wrap:wrap;
210+
padding-bottom: $login-pf-page-footer-padding-bottom-mobile;
211+
@media (min-width: $screen-sm-min) {
212+
padding-bottom: $login-pf-page-footer-padding-bottom-desktop;
213+
}
206214
&-links {
207215
display: flex;
208216
margin: $login-pf-page-footer-links-margin-top 0 0 0;

‎src/sass/converted/rcue/_variables.scss‎

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -401,8 +401,9 @@ $navbar-pf-alt-navbar-toggle-icon-bar-hover-bg: $navbar-pf-v
401401

402402
// Login page
403403
// -------------------
404-
$login-pf-brand-margin-top: 20px !default;
405-
$login-pf-brand-desktop-margin-top: 62px !default;
404+
$login-pf-brand-margin-top: 0px !default;
405+
$login-pf-page-padding-top: 20px !default;
406+
$login-pf-brand-desktop-margin-top: 22px !default;
406407
$login-pf-page-header-margin-bottom: 20px !default;
407408
$login-pf-page-header-desktop-margin-bottom: 40px !default;
408409
$login-pf-page-header-paragraph-margin-top: 20px !default;
@@ -413,13 +414,15 @@ $login-pf-checkbox-label-margin-bottom: 15px !
413414
$login-pf-dropdown-toggle-padding-right: 15px !default;
414415
$login-pf-btn-primary-margin-top: 40px !default;
415416
$login-pf-header-margin-bottom: 20px !default;
416-
$login-pf-header-desktop-margin-bottom: 30px !default;
417+
$login-pf-header-desktop-margin-bottom: 10px !default;
417418
$login-pf-signup-margin-top: 40px !default;
418419
$login-pf-signup-a-margin-left: 10px !default;
419420
$login-pf-page-footer-links-margin-top: 60px !default;
420421
$login-pf-page-footer-links-li-margin-right: 20px !default;
421422
$login-pf-page-footer-sso-margin-top: 40px !default;
422423
$login-pf-page-footer-sso-logos-li-margin: 5px !default;
424+
$login-pf-page-footer-padding-bottom-mobile: 50px !default;
425+
$login-pf-page-footer-padding-bottom-desktop: 100px !default;
423426
$login-pf-page-accounts-margin: 20px !default;
424427
$login-pf-accounts-section-heading-margin-top: 30px !default;
425428
$login-pf-accounts-section-heading-margin-bottom: 30px !default;
@@ -438,6 +441,8 @@ $login-pf-social-margin: 40px 0 0 0 !d
438441
$alert-info-border: $color-pf-black-500 !default;
439442
$alert-link-font-weight: 500 !default;
440443
$alert-padding: 11px !default;
444+
$alert-margin-left: 250px !default;
445+
$alert-margin-right: 250px !default;
441446
$body-bg: $color-pf-white !default;
442447
$border-radius-base: 1px !default;
443448
$brand-danger: $color-pf-red !default;
@@ -519,6 +524,7 @@ $alert-success-text: $gray-dark !
519524
$alert-warning-bg: lighten($color-pf-orange-100, 8%) !default;
520525
$alert-warning-border: $brand-warning !default;
521526
$alert-warning-text: $gray-dark !default;
527+
$text-danger-p-padding-top: 10px !default;
522528
$badge-border-radius: $border-radius-base !default;
523529
$border-radius-large: $border-radius-base !default;
524530
$border-radius-small: $border-radius-base !default;

‎tests/pages/_includes/widgets/framework/login-basic.html‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,15 @@
11
<div class="login-pf-page">
2+
3+
{% if page.login-alert %}
4+
<div class="container-fluid">
5+
<div class="row">
6+
<div class="col-sm-8 col-sm-offset-2">
7+
{% include widgets/communication/alert-danger.html %}
8+
</div>
9+
</div>
10+
</div>
11+
{% endif %}
12+
213
<div class="container-fluid">
314
<div class="row">
415
<div class="col-sm-8 col-sm-offset-2 col-md-6 col-md-offset-3 col-lg-6 col-lg-offset-3">

‎tests/pages/_includes/widgets/framework/login-single-sign-on.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@
1515
<option>Italian</option>
1616
</select>
1717
<h1>Single Sign-On</h1>
18-
<p>Log in to <strong>Application</strong></p>
18+
<p class="text-center">Log in to <strong>Application</strong></p>
1919
</header>
2020
<form>
2121
<div class="form-group">

‎tests/pages/login-basic-alert.html‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
---
2+
categories: [Layouts]
3+
css-extra: false
4+
layout: login
5+
title: Login Basic Alert
6+
resource: true
7+
full-page: true
8+
login-alert: true
9+
url-js-extra: '//cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.2/js/bootstrap-select.min.js'
10+
---
11+
{% include widgets/framework/login-basic.html %}
12+

0 commit comments

Comments
 (0)