@patternfly/patternfly 4.164.3 → 4.165.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (23) hide show
  1. package/base/_base.scss +2 -0
  2. package/base/_fa-icons.scss +2 -0
  3. package/base/_fonts.scss +2 -2
  4. package/components/ExpandableSection/expandable-section.css +6 -0
  5. package/components/ExpandableSection/expandable-section.scss +9 -0
  6. package/components/LogViewer/log-viewer.css +17 -15
  7. package/components/LogViewer/log-viewer.scss +17 -20
  8. package/components/Login/login.css +1 -0
  9. package/components/Login/login.scss +1 -0
  10. package/docs/components/ExpandableSection/examples/ExpandableSection.md +22 -0
  11. package/docs/components/NotificationBadge/examples/NotificationBadge.css +3 -0
  12. package/docs/components/NotificationBadge/examples/NotificationBadge.md +132 -108
  13. package/docs/pages/contribution.md +1 -1
  14. package/layouts/_all.scss +7 -7
  15. package/package.json +1 -1
  16. package/patternfly-no-reset.css +24 -15
  17. package/patternfly.css +24 -15
  18. package/patternfly.min.css +1 -1
  19. package/patternfly.min.css.map +1 -1
  20. package/sass-utilities/bs-variables.scss +2 -3
  21. package/sass-utilities/functions.scss +0 -1
  22. package/sass-utilities/mixins.scss +5 -5
  23. package/sass-utilities/scss-variables.scss +1 -1
package/patternfly-no-reset.css CHANGED
@@ -1,5 +1,6 @@
1
1
  @charset "UTF-8";
2
- .pf-c-table, .pf-c-select, .pf-c-page__sidebar.pf-m-light, .pf-c-menu, .pf-c-masthead.pf-m-light-200, .pf-c-masthead.pf-m-light, .pf-c-log-viewer__header, .pf-c-input-group, .pf-c-form-control, .pf-c-data-list, .pf-c-context-selector__menu, .pf-c-chip-group, .pf-c-chip, .pf-c-calendar-month, .pf-c-banner.pf-m-warning, .pf-c-banner.pf-m-info, .pf-c-alert, .pf-c-accordion, .pf-t-light {
2
+ .pf-c-table, .pf-c-select, .pf-c-page__sidebar.pf-m-light, .pf-c-menu, .pf-c-masthead.pf-m-light-200, .pf-c-masthead.pf-m-light, .pf-c-log-viewer__header,
3
+ .pf-c-log-viewer__footer, .pf-c-input-group, .pf-c-form-control, .pf-c-data-list, .pf-c-context-selector__menu, .pf-c-chip-group, .pf-c-chip, .pf-c-calendar-month, .pf-c-banner.pf-m-warning, .pf-c-banner.pf-m-info, .pf-c-alert, .pf-c-accordion, .pf-t-light {
3
4
  --pf-global--Color--100: var(--pf-global--Color--dark-100);
4
5
  --pf-global--Color--200: var(--pf-global--Color--dark-200);
5
6
  --pf-global--BorderColor--100: var(--pf-global--BorderColor--dark-100);
@@ -12935,6 +12936,7 @@ label.pf-c-check, .pf-c-check__label,
12935
12936
  --pf-c-expandable-section__toggle--active--Color: var(--pf-global--link--Color--hover);
12936
12937
  --pf-c-expandable-section__toggle--focus--Color: var(--pf-global--link--Color--hover);
12937
12938
  --pf-c-expandable-section__toggle--m-expanded--Color: var(--pf-global--link--Color--hover);
12939
+ --pf-c-expandable-section__toggle-icon--MinWidth: 1em;
12938
12940
  --pf-c-expandable-section__toggle-icon--Color: var(--pf-global--Color--100);
12939
12941
  --pf-c-expandable-section__toggle-icon--Transition: .2s ease-in 0s;
12940
12942
  --pf-c-expandable-section__toggle-icon--Rotate: 0;
@@ -12957,6 +12959,7 @@ label.pf-c-check, .pf-c-check__label,
12957
12959
  --pf-c-expandable-section--m-display-lg--after--BackgroundColor: transparent;
12958
12960
  --pf-c-expandable-section--m-display-lg--after--Width: var(--pf-global--BorderWidth--lg);
12959
12961
  --pf-c-expandable-section--m-display-lg--m-expanded--after--BackgroundColor: var(--pf-global--primary-color--100);
12962
+ --pf-c-expandable-section--m-indented__content--PaddingLeft: calc(var(--pf-c-expandable-section__toggle-text--MarginLeft) + var(--pf-c-expandable-section__toggle-icon--MinWidth));
12960
12963
  }
12961
12964
  .pf-c-expandable-section.pf-m-expanded {
12962
12965
  --pf-c-expandable-section__toggle--Color: var(--pf-c-expandable-section__toggle--m-expanded--Color);
@@ -12991,6 +12994,9 @@ label.pf-c-check, .pf-c-check__label,
12991
12994
  content: "";
12992
12995
  background-color: var(--pf-c-expandable-section--m-display-lg--after--BackgroundColor);
12993
12996
  }
12997
+ .pf-c-expandable-section.pf-m-indented {
12998
+ --pf-c-expandable-section__content--PaddingLeft: var(--pf-c-expandable-section--m-indented__content--PaddingLeft);
12999
+ }
12994
13000
 
12995
13001
  .pf-c-expandable-section__toggle {
12996
13002
  display: flex;
@@ -13009,6 +13015,7 @@ label.pf-c-check, .pf-c-check__label,
13009
13015
  }
13010
13016
 
13011
13017
  .pf-c-expandable-section__toggle-icon {
13018
+ min-width: var(--pf-c-expandable-section__toggle-icon--MinWidth);
13012
13019
  color: var(--pf-c-expandable-section__toggle-icon--Color);
13013
13020
  transition: var(--pf-c-expandable-section__toggle-icon--Transition);
13014
13021
  transform: rotate(var(--pf-c-expandable-section__toggle-icon--Rotate));
@@ -15085,7 +15092,15 @@ ul.pf-c-list {
15085
15092
  position: absolute;
15086
15093
  right: 0;
15087
15094
  left: var(--pf-c-log-viewer--m-line-numbers__list--Left);
15088
- overflow: auto;
15095
+ }
15096
+ .pf-c-log-viewer.pf-m-line-numbers .pf-c-log-viewer__list::before {
15097
+ position: absolute;
15098
+ top: var(--pf-c-log-viewer--m-line-numbers__main--before--Top);
15099
+ bottom: var(--pf-c-log-viewer--m-line-numbers__main--before--Bottom);
15100
+ left: 0;
15101
+ width: var(--pf-c-log-viewer--m-line-numbers__main--before--Width);
15102
+ content: "";
15103
+ background: var(--pf-c-log-viewer--m-line-numbers__main--before--BackgroundColor);
15089
15104
  }
15090
15105
  .pf-c-log-viewer .pf-c-toolbar {
15091
15106
  --pf-c-toolbar--PaddingTop: var(--pf-c-log-viewer--c-toolbar--PaddingTop);
@@ -15103,10 +15118,14 @@ ul.pf-c-list {
15103
15118
  }
15104
15119
 
15105
15120
  .pf-c-log-viewer__header {
15106
- color: var(--pf-global--Color--100);
15107
15121
  margin-bottom: var(--pf-c-log-viewer__header--MarginBottom);
15108
15122
  }
15109
15123
 
15124
+ .pf-c-log-viewer__header,
15125
+ .pf-c-log-viewer__footer {
15126
+ color: var(--pf-global--Color--100);
15127
+ }
15128
+
15110
15129
  .pf-c-log-viewer__main {
15111
15130
  display: flex;
15112
15131
  flex-direction: column;
@@ -15114,18 +15133,6 @@ ul.pf-c-list {
15114
15133
  background-color: var(--pf-c-log-viewer__main--BackgroundColor);
15115
15134
  border: var(--pf-c-log-viewer__main--BorderWidth) solid var(--pf-c-log-viewer__main--BorderColor);
15116
15135
  }
15117
- .pf-m-line-numbers .pf-c-log-viewer__main {
15118
- position: relative;
15119
- }
15120
- .pf-m-line-numbers .pf-c-log-viewer__main::before {
15121
- position: absolute;
15122
- top: var(--pf-c-log-viewer--m-line-numbers__main--before--Top);
15123
- bottom: var(--pf-c-log-viewer--m-line-numbers__main--before--Bottom);
15124
- left: var(--pf-c-log-viewer__index--Width);
15125
- width: var(--pf-c-log-viewer--m-line-numbers__main--before--Width);
15126
- content: "";
15127
- background: var(--pf-c-log-viewer--m-line-numbers__main--before--BackgroundColor);
15128
- }
15129
15136
 
15130
15137
  .pf-c-log-viewer__scroll-container {
15131
15138
  position: relative;
@@ -15166,6 +15173,7 @@ ul.pf-c-list {
15166
15173
  font-family: var(--pf-c-log-viewer__index--FontFamily);
15167
15174
  font-size: var(--pf-c-log-viewer__index--FontSize);
15168
15175
  color: var(--pf-c-log-viewer__index--Color);
15176
+ user-select: none;
15169
15177
  background-color: var(--pf-c-log-viewer__index--BackgroundColor);
15170
15178
  }
15171
15179
 
@@ -15338,6 +15346,7 @@ ul.pf-c-list {
15338
15346
  }
15339
15347
 
15340
15348
  .pf-c-login__main {
15349
+ align-self: start;
15341
15350
  margin-bottom: var(--pf-c-login__main--MarginBottom);
15342
15351
  background-color: var(--pf-c-login__main--BackgroundColor);
15343
15352
  grid-area: main;
package/patternfly.css CHANGED
@@ -1,5 +1,6 @@
1
1
  @charset "UTF-8";
2
- .pf-c-table, .pf-c-select, .pf-c-page__sidebar.pf-m-light, .pf-c-menu, .pf-c-masthead.pf-m-light-200, .pf-c-masthead.pf-m-light, .pf-c-log-viewer__header, .pf-c-input-group, .pf-c-form-control, .pf-c-data-list, .pf-c-context-selector__menu, .pf-c-chip-group, .pf-c-chip, .pf-c-calendar-month, .pf-c-banner.pf-m-warning, .pf-c-banner.pf-m-info, .pf-c-alert, .pf-c-accordion, .pf-t-light {
2
+ .pf-c-table, .pf-c-select, .pf-c-page__sidebar.pf-m-light, .pf-c-menu, .pf-c-masthead.pf-m-light-200, .pf-c-masthead.pf-m-light, .pf-c-log-viewer__header,
3
+ .pf-c-log-viewer__footer, .pf-c-input-group, .pf-c-form-control, .pf-c-data-list, .pf-c-context-selector__menu, .pf-c-chip-group, .pf-c-chip, .pf-c-calendar-month, .pf-c-banner.pf-m-warning, .pf-c-banner.pf-m-info, .pf-c-alert, .pf-c-accordion, .pf-t-light {
3
4
  --pf-global--Color--100: var(--pf-global--Color--dark-100);
4
5
  --pf-global--Color--200: var(--pf-global--Color--dark-200);
5
6
  --pf-global--BorderColor--100: var(--pf-global--BorderColor--dark-100);
@@ -13057,6 +13058,7 @@ label.pf-c-check, .pf-c-check__label,
13057
13058
  --pf-c-expandable-section__toggle--active--Color: var(--pf-global--link--Color--hover);
13058
13059
  --pf-c-expandable-section__toggle--focus--Color: var(--pf-global--link--Color--hover);
13059
13060
  --pf-c-expandable-section__toggle--m-expanded--Color: var(--pf-global--link--Color--hover);
13061
+ --pf-c-expandable-section__toggle-icon--MinWidth: 1em;
13060
13062
  --pf-c-expandable-section__toggle-icon--Color: var(--pf-global--Color--100);
13061
13063
  --pf-c-expandable-section__toggle-icon--Transition: .2s ease-in 0s;
13062
13064
  --pf-c-expandable-section__toggle-icon--Rotate: 0;
@@ -13079,6 +13081,7 @@ label.pf-c-check, .pf-c-check__label,
13079
13081
  --pf-c-expandable-section--m-display-lg--after--BackgroundColor: transparent;
13080
13082
  --pf-c-expandable-section--m-display-lg--after--Width: var(--pf-global--BorderWidth--lg);
13081
13083
  --pf-c-expandable-section--m-display-lg--m-expanded--after--BackgroundColor: var(--pf-global--primary-color--100);
13084
+ --pf-c-expandable-section--m-indented__content--PaddingLeft: calc(var(--pf-c-expandable-section__toggle-text--MarginLeft) + var(--pf-c-expandable-section__toggle-icon--MinWidth));
13082
13085
  }
13083
13086
  .pf-c-expandable-section.pf-m-expanded {
13084
13087
  --pf-c-expandable-section__toggle--Color: var(--pf-c-expandable-section__toggle--m-expanded--Color);
@@ -13113,6 +13116,9 @@ label.pf-c-check, .pf-c-check__label,
13113
13116
  content: "";
13114
13117
  background-color: var(--pf-c-expandable-section--m-display-lg--after--BackgroundColor);
13115
13118
  }
13119
+ .pf-c-expandable-section.pf-m-indented {
13120
+ --pf-c-expandable-section__content--PaddingLeft: var(--pf-c-expandable-section--m-indented__content--PaddingLeft);
13121
+ }
13116
13122
 
13117
13123
  .pf-c-expandable-section__toggle {
13118
13124
  display: flex;
@@ -13131,6 +13137,7 @@ label.pf-c-check, .pf-c-check__label,
13131
13137
  }
13132
13138
 
13133
13139
  .pf-c-expandable-section__toggle-icon {
13140
+ min-width: var(--pf-c-expandable-section__toggle-icon--MinWidth);
13134
13141
  color: var(--pf-c-expandable-section__toggle-icon--Color);
13135
13142
  transition: var(--pf-c-expandable-section__toggle-icon--Transition);
13136
13143
  transform: rotate(var(--pf-c-expandable-section__toggle-icon--Rotate));
@@ -15207,7 +15214,15 @@ ul.pf-c-list {
15207
15214
  position: absolute;
15208
15215
  right: 0;
15209
15216
  left: var(--pf-c-log-viewer--m-line-numbers__list--Left);
15210
- overflow: auto;
15217
+ }
15218
+ .pf-c-log-viewer.pf-m-line-numbers .pf-c-log-viewer__list::before {
15219
+ position: absolute;
15220
+ top: var(--pf-c-log-viewer--m-line-numbers__main--before--Top);
15221
+ bottom: var(--pf-c-log-viewer--m-line-numbers__main--before--Bottom);
15222
+ left: 0;
15223
+ width: var(--pf-c-log-viewer--m-line-numbers__main--before--Width);
15224
+ content: "";
15225
+ background: var(--pf-c-log-viewer--m-line-numbers__main--before--BackgroundColor);
15211
15226
  }
15212
15227
  .pf-c-log-viewer .pf-c-toolbar {
15213
15228
  --pf-c-toolbar--PaddingTop: var(--pf-c-log-viewer--c-toolbar--PaddingTop);
@@ -15225,10 +15240,14 @@ ul.pf-c-list {
15225
15240
  }
15226
15241
 
15227
15242
  .pf-c-log-viewer__header {
15228
- color: var(--pf-global--Color--100);
15229
15243
  margin-bottom: var(--pf-c-log-viewer__header--MarginBottom);
15230
15244
  }
15231
15245
 
15246
+ .pf-c-log-viewer__header,
15247
+ .pf-c-log-viewer__footer {
15248
+ color: var(--pf-global--Color--100);
15249
+ }
15250
+
15232
15251
  .pf-c-log-viewer__main {
15233
15252
  display: flex;
15234
15253
  flex-direction: column;
@@ -15236,18 +15255,6 @@ ul.pf-c-list {
15236
15255
  background-color: var(--pf-c-log-viewer__main--BackgroundColor);
15237
15256
  border: var(--pf-c-log-viewer__main--BorderWidth) solid var(--pf-c-log-viewer__main--BorderColor);
15238
15257
  }
15239
- .pf-m-line-numbers .pf-c-log-viewer__main {
15240
- position: relative;
15241
- }
15242
- .pf-m-line-numbers .pf-c-log-viewer__main::before {
15243
- position: absolute;
15244
- top: var(--pf-c-log-viewer--m-line-numbers__main--before--Top);
15245
- bottom: var(--pf-c-log-viewer--m-line-numbers__main--before--Bottom);
15246
- left: var(--pf-c-log-viewer__index--Width);
15247
- width: var(--pf-c-log-viewer--m-line-numbers__main--before--Width);
15248
- content: "";
15249
- background: var(--pf-c-log-viewer--m-line-numbers__main--before--BackgroundColor);
15250
- }
15251
15258
 
15252
15259
  .pf-c-log-viewer__scroll-container {
15253
15260
  position: relative;
@@ -15288,6 +15295,7 @@ ul.pf-c-list {
15288
15295
  font-family: var(--pf-c-log-viewer__index--FontFamily);
15289
15296
  font-size: var(--pf-c-log-viewer__index--FontSize);
15290
15297
  color: var(--pf-c-log-viewer__index--Color);
15298
+ user-select: none;
15291
15299
  background-color: var(--pf-c-log-viewer__index--BackgroundColor);
15292
15300
  }
15293
15301
 
@@ -15460,6 +15468,7 @@ ul.pf-c-list {
15460
15468
  }
15461
15469
 
15462
15470
  .pf-c-login__main {
15471
+ align-self: start;
15463
15472
  margin-bottom: var(--pf-c-login__main--MarginBottom);
15464
15473
  background-color: var(--pf-c-login__main--BackgroundColor);
15465
15474
  grid-area: main;