@patternfly/patternfly 6.0.0-alpha.90 → 6.0.0-alpha.92
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.
- package/base/patternfly-common.css +10 -10
- package/base/patternfly-globals.css +3 -3
- package/base/patternfly-icons.css +1 -1
- package/base/patternfly-themes.css +53 -53
- package/base/patternfly-variables.css +236 -245
- package/base/tokens/_tokens-font.scss +0 -11
- package/components/AboutModalBox/about-modal-box.css +102 -102
- package/components/Accordion/accordion.css +118 -118
- package/components/ActionList/action-list.css +16 -16
- package/components/Alert/alert-group.css +50 -50
- package/components/Alert/alert.css +161 -161
- package/components/AppLauncher/app-launcher.css +167 -167
- package/components/Avatar/avatar.css +116 -116
- package/components/BackToTop/back-to-top.css +21 -21
- package/components/Backdrop/backdrop.css +9 -9
- package/components/BackgroundImage/background-image.css +15 -15
- package/components/Badge/badge.css +35 -35
- package/components/Banner/banner.css +114 -114
- package/components/Brand/brand.css +28 -28
- package/components/Breadcrumb/breadcrumb.css +62 -62
- package/components/Button/button.css +514 -514
- package/components/CalendarMonth/calendar-month.css +144 -144
- package/components/Card/card.css +230 -230
- package/components/Check/check.css +43 -43
- package/components/Chip/chip-group.css +60 -60
- package/components/Chip/chip.css +83 -83
- package/components/ClipboardCopy/clipboard-copy.css +71 -71
- package/components/CodeBlock/code-block.css +35 -35
- package/components/CodeEditor/code-editor.css +121 -121
- package/components/Content/content.css +216 -216
- package/components/ContextSelector/context-selector.css +251 -251
- package/components/DataList/data-list-grid.css +182 -182
- package/components/DataList/data-list.css +468 -468
- package/components/DatePicker/date-picker.css +35 -35
- package/components/DescriptionList/description-list-order.css +90 -90
- package/components/DescriptionList/description-list.css +193 -193
- package/components/Divider/divider.css +143 -143
- package/components/DragDrop/drag-drop.css +46 -46
- package/components/Drawer/drawer.css +474 -474
- package/components/Dropdown/dropdown.css +457 -457
- package/components/DualListSelector/dual-list-selector.css +199 -199
- package/components/EmptyState/empty-state.css +104 -104
- package/components/ExpandableSection/expandable-section.css +113 -113
- package/components/FileUpload/file-upload.css +32 -32
- package/components/Form/form.css +281 -281
- package/components/FormControl/form-control.css +197 -197
- package/components/HelperText/helper-text.css +51 -51
- package/components/Hint/hint.css +46 -46
- package/components/Icon/icon.css +218 -218
- package/components/InlineEdit/inline-edit.css +43 -43
- package/components/InputGroup/input-group.css +52 -52
- package/components/JumpLinks/jump-links.css +183 -183
- package/components/Label/label-group.css +86 -86
- package/components/Label/label.css +438 -438
- package/components/List/list.css +53 -53
- package/components/LogViewer/log-viewer.css +138 -138
- package/components/Login/login.css +139 -139
- package/components/Masthead/masthead.css +319 -319
- package/components/Menu/menu.css +415 -415
- package/components/MenuToggle/menu-toggle.css +275 -275
- package/components/ModalBox/modal-box.css +121 -121
- package/components/MultipleFileUpload/multiple-file-upload.css +163 -163
- package/components/Nav/nav.css +225 -225
- package/components/NotificationBadge/notification-badge.css +66 -66
- package/components/NotificationDrawer/notification-drawer.css +179 -179
- package/components/NumberInput/number-input.css +20 -20
- package/components/OptionsMenu/options-menu.css +190 -190
- package/components/OverflowMenu/overflow-menu.css +19 -19
- package/components/Page/page.css +598 -598
- package/components/Pagination/pagination.css +220 -220
- package/components/Panel/panel.css +72 -72
- package/components/Popover/popover.css +148 -148
- package/components/Progress/progress.css +80 -80
- package/components/ProgressStepper/progress-stepper.css +514 -514
- package/components/Radio/radio.css +44 -44
- package/components/Select/select.css +423 -423
- package/components/Sidebar/sidebar.css +166 -166
- package/components/SimpleList/simple-list.css +53 -53
- package/components/Skeleton/skeleton.css +112 -112
- package/components/SkipToContent/skip-to-content.css +8 -8
- package/components/Slider/slider.css +144 -144
- package/components/Spinner/spinner.css +36 -36
- package/components/Switch/switch.css +89 -89
- package/components/TabContent/tab-content.css +34 -34
- package/components/Table/table-grid.css +911 -911
- package/components/Table/table-scrollable.css +38 -38
- package/components/Table/table-tree-view.css +497 -497
- package/components/Table/table.css +660 -660
- package/components/Tabs/tabs.css +616 -616
- package/components/TextInputGroup/text-input-group.css +88 -88
- package/components/Tile/tile.css +68 -68
- package/components/Timestamp/timestamp.css +29 -29
- package/components/Title/title.css +87 -87
- package/components/ToggleGroup/toggle-group.css +86 -86
- package/components/Toolbar/toolbar.css +2279 -2279
- package/components/Tooltip/tooltip.css +85 -85
- package/components/TreeView/tree-view.css +363 -363
- package/components/Truncate/truncate.css +15 -15
- package/components/Wizard/wizard.css +272 -272
- package/docs/components/AboutModalBox/examples/AboutModalBox.md +11 -11
- package/docs/components/Accordion/examples/Accordion.md +188 -188
- package/docs/components/ActionList/examples/ActionList.md +55 -55
- package/docs/components/Alert/examples/Alert.md +222 -222
- package/docs/components/AppLauncher/deprecated/application-launcher.md +146 -146
- package/docs/components/Avatar/examples/Avatar.md +6 -6
- package/docs/components/BackToTop/examples/BackToTop.md +3 -3
- package/docs/components/Backdrop/examples/Backdrop.md +1 -1
- package/docs/components/BackgroundImage/examples/BackgroundImage.md +2 -2
- package/docs/components/Badge/examples/Badge.md +17 -17
- package/docs/components/Banner/examples/Banner.md +42 -42
- package/docs/components/Brand/examples/Brand.md +4 -4
- package/docs/components/Breadcrumb/examples/Breadcrumb.md +90 -90
- package/docs/components/Button/examples/Button.md +364 -364
- package/docs/components/CalendarMonth/examples/CalendarMonth.md +436 -436
- package/docs/components/Card/examples/Card.md +515 -515
- package/docs/components/Check/examples/Check.md +37 -37
- package/docs/components/Chip/examples/Chip.md +216 -216
- package/docs/components/ClipboardCopy/examples/ClipboardCopy.md +82 -82
- package/docs/components/CodeBlock/examples/CodeBlock.md +39 -39
- package/docs/components/CodeEditor/examples/CodeEditor.md +85 -85
- package/docs/components/Content/examples/Content.md +1 -1
- package/docs/components/ContextSelector/deprecated/context-selector.md +160 -160
- package/docs/components/DataList/examples/DataList.md +666 -666
- package/docs/components/DatePicker/examples/DatePicker.md +54 -54
- package/docs/components/DescriptionList/examples/DescriptionList.md +737 -737
- package/docs/components/Divider/examples/Divider.md +18 -18
- package/docs/components/DragDrop/examples/DragDrop.md +27 -27
- package/docs/components/Drawer/examples/Drawer.md +225 -225
- package/docs/components/Dropdown/deprecated/Dropdown.md +541 -541
- package/docs/components/DualListSelector/examples/DualListSelector.md +1012 -1012
- package/docs/components/EmptyState/examples/EmptyState.md +100 -100
- package/docs/components/ExpandableSection/examples/ExpandableSection.md +47 -47
- package/docs/components/FileUpload/examples/FileUpload.md +94 -94
- package/docs/components/Form/examples/Form.md +226 -226
- package/docs/components/FormControl/examples/FormControl.md +65 -65
- package/docs/components/HelperText/examples/HelperText.md +72 -72
- package/docs/components/Hint/examples/Hint.md +44 -44
- package/docs/components/Icon/examples/Icon.md +85 -85
- package/docs/components/InlineEdit/examples/InlineEdit.md +209 -209
- package/docs/components/InputGroup/examples/InputGroup.md +73 -73
- package/docs/components/JumpLinks/examples/JumpLinks.md +285 -285
- package/docs/components/Label/examples/Label.md +1717 -1717
- package/docs/components/List/examples/List.md +30 -30
- package/docs/components/LogViewer/examples/LogViewer.md +1785 -1785
- package/docs/components/Login/examples/Login.md +287 -287
- package/docs/components/Masthead/examples/masthead.md +39 -39
- package/docs/components/Menu/examples/Menu.md +2377 -2377
- package/docs/components/MenuToggle/examples/MenuToggle.md +242 -242
- package/docs/components/ModalBox/examples/ModalBox.md +119 -119
- package/docs/components/MultipleFileUpload/examples/MultipleFileUpload.md +192 -192
- package/docs/components/Nav/examples/Navigation.md +856 -856
- package/docs/components/NotificationBadge/examples/NotificationBadge.md +42 -42
- package/docs/components/NotificationDrawer/examples/NotificationDrawer.md +659 -659
- package/docs/components/NumberInput/examples/NumberInput.md +127 -127
- package/docs/components/OptionsMenu/deprecated/options-menu.md +178 -178
- package/docs/components/OverflowMenu/examples/overflow-menu.md +97 -97
- package/docs/components/Page/deprecated/PageHeader.md +85 -85
- package/docs/components/Page/examples/Page.md +90 -90
- package/docs/components/Pagination/examples/Pagination.md +285 -285
- package/docs/components/Panel/examples/Panel.md +38 -38
- package/docs/components/Popover/examples/Popover.md +169 -169
- package/docs/components/Progress/examples/Progress.md +145 -145
- package/docs/components/ProgressStepper/examples/ProgressStepper.md +295 -295
- package/docs/components/Radio/examples/Radio.md +33 -33
- package/docs/components/Select/deprecated/Select.md +736 -736
- package/docs/components/Sidebar/examples/Sidebar.md +65 -65
- package/docs/components/SimpleList/examples/SimpleList.md +39 -39
- package/docs/components/Skeleton/examples/Skeleton.md +29 -29
- package/docs/components/SkipToContent/examples/SkipToContent.md +3 -3
- package/docs/components/Slider/examples/Slider.md +213 -213
- package/docs/components/Spinner/examples/Spinner.md +14 -14
- package/docs/components/Switch/examples/Switch.md +58 -58
- package/docs/components/TabContent/examples/TabContent.md +24 -24
- package/docs/components/Table/examples/Table.md +6982 -6982
- package/docs/components/Tabs/examples/Tabs.md +2114 -2114
- package/docs/components/TextInputGroup/examples/TextInputGroup.md +373 -373
- package/docs/components/Tile/examples/Tile.md +131 -131
- package/docs/components/Timestamp/examples/Timestamp.md +10 -10
- package/docs/components/Title/examples/Title.md +12 -12
- package/docs/components/ToggleGroup/examples/toggle-group.md +116 -116
- package/docs/components/Toolbar/examples/Toolbar.md +611 -611
- package/docs/components/Tooltip/examples/Tooltip.md +27 -27
- package/docs/components/TreeView/examples/TreeView.md +1166 -1166
- package/docs/components/Truncate/examples/Truncate.md +7 -7
- package/docs/components/Wizard/examples/Wizard.md +522 -522
- package/docs/demos/AboutModal/examples/AboutModal.md +106 -106
- package/docs/demos/Alert/examples/Alert.md +391 -391
- package/docs/demos/BackToTop/examples/BackToTop.md +175 -175
- package/docs/demos/Banner/examples/Banner.md +364 -364
- package/docs/demos/Button/examples/Button.md +50 -50
- package/docs/demos/Card/examples/Card.md +1054 -1054
- package/docs/demos/CardView/examples/CardView.md +378 -378
- package/docs/demos/ContextSelector/examples/ContextSelector.md +449 -449
- package/docs/demos/Dashboard/examples/Dashboard.md +541 -541
- package/docs/demos/DataList/examples/DataList.md +1148 -1148
- package/docs/demos/DescriptionList/examples/DescriptionList.md +544 -544
- package/docs/demos/Drawer/examples/Drawer.md +531 -531
- package/docs/demos/Form/examples/BasicForms.md +444 -444
- package/docs/demos/HelperText/examples/HelperText.md +51 -51
- package/docs/demos/JumpLinks/examples/JumpLinks.md +596 -596
- package/docs/demos/Masthead/examples/Masthead.md +763 -763
- package/docs/demos/Modal/examples/Modal.md +645 -645
- package/docs/demos/Nav/examples/Nav.md +649 -649
- package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +1570 -1570
- package/docs/demos/Page/examples/Page.md +1330 -1330
- package/docs/demos/Page/examples/Penta.md +217 -217
- package/docs/demos/PasswordGenerator/examples/PasswordGenerator.md +23 -23
- package/docs/demos/PasswordStrength/examples/PasswordStrength.md +108 -108
- package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +1890 -1890
- package/docs/demos/Skeleton/examples/Skeleton.md +176 -176
- package/docs/demos/Table/examples/Table.md +4580 -4580
- package/docs/demos/Tabs/examples/Tabs.md +1040 -1040
- package/docs/demos/Toolbar/examples/Toolbar.md +961 -961
- package/docs/demos/Wizard/examples/Wizard.md +1574 -1574
- package/docs/layouts/Bullseye/examples/Bullseye.md +2 -2
- package/docs/layouts/Flex/examples/Flex.md +290 -290
- package/docs/layouts/Gallery/examples/Gallery.md +48 -48
- package/docs/layouts/Grid/examples/Grid.md +121 -121
- package/docs/layouts/Level/examples/Level.md +11 -11
- package/docs/layouts/Split/examples/Split.md +23 -23
- package/docs/layouts/Stack/examples/Stack.md +8 -8
- package/docs/utilities/Accessibility/examples/Accessibility.md +3 -3
- package/docs/utilities/Alignment/examples/Alignment.md +4 -4
- package/docs/utilities/Display/examples/Display.md +16 -16
- package/docs/utilities/Flex/examples/Flex.md +53 -53
- package/docs/utilities/Float/examples/Float.md +2 -2
- package/docs/utilities/Spacing/examples/Spacing.md +16 -16
- package/layouts/Bullseye/bullseye.css +3 -3
- package/layouts/Flex/flex.css +1276 -1276
- package/layouts/Gallery/gallery.css +34 -34
- package/layouts/Grid/grid.css +531 -531
- package/layouts/Level/level.css +4 -4
- package/layouts/Split/split.css +6 -6
- package/layouts/Stack/stack.css +5 -5
- package/package.json +5 -5
- package/patternfly-addons.css +2989 -2989
- package/patternfly-base-no-globals-theme-dark-unversioned.css +269 -278
- package/patternfly-base-no-globals.css +284 -293
- package/patternfly-base-theme-dark-unversioned.css +271 -280
- package/patternfly-base.css +286 -295
- package/patternfly-charts-theme-dark-unversioned.css +66 -66
- package/patternfly-charts-theme-dark.css +66 -66
- package/patternfly-charts.css +320 -320
- package/patternfly-no-globals.css +20217 -20226
- package/patternfly-theme-dark-unversioned.css +20209 -20218
- package/patternfly.css +20219 -20228
- package/patternfly.min.css +1 -1
- package/patternfly.min.css.map +1 -1
- package/sass-utilities/_init.scss +1 -1
- package/utilities/Accessibility/accessibility.css +18 -18
- package/utilities/Alignment/alignment.css +24 -24
- package/utilities/BackgroundColor/BackgroundColor.css +252 -252
- package/utilities/BoxShadow/box-shadow.css +42 -42
- package/utilities/Display/display.css +54 -54
- package/utilities/Flex/flex.css +228 -228
- package/utilities/Float/float.css +12 -12
- package/utilities/Sizing/sizing.css +216 -216
- package/utilities/Spacing/spacing.css +1512 -1512
- package/utilities/Text/text.css +631 -631
|
@@ -9,47 +9,47 @@ wrapperTag: div
|
|
|
9
9
|
|
|
10
10
|
```html isFullscreen
|
|
11
11
|
<div
|
|
12
|
-
class="pf-
|
|
13
|
-
style="--pf-
|
|
12
|
+
class="pf-v6-c-background-image"
|
|
13
|
+
style="--pf-v6-c-background-image--BackgroundImage: url(/assets/images/pf-background.svg)"
|
|
14
14
|
></div>
|
|
15
|
-
<div class="pf-
|
|
16
|
-
<div class="pf-
|
|
17
|
-
<header class="pf-
|
|
15
|
+
<div class="pf-v6-c-login">
|
|
16
|
+
<div class="pf-v6-c-login__container">
|
|
17
|
+
<header class="pf-v6-c-login__header">
|
|
18
18
|
<img
|
|
19
|
-
class="pf-
|
|
19
|
+
class="pf-v6-c-brand"
|
|
20
20
|
src="/assets/images/pf_logo_color.svg"
|
|
21
21
|
alt="PatternFly Logo"
|
|
22
22
|
style="--pf-v5-c-brand--Height:48px;"
|
|
23
23
|
/>
|
|
24
24
|
</header>
|
|
25
|
-
<main class="pf-
|
|
26
|
-
<header class="pf-
|
|
27
|
-
<h1 class="pf-
|
|
25
|
+
<main class="pf-v6-c-login__main">
|
|
26
|
+
<header class="pf-v6-c-login__main-header">
|
|
27
|
+
<h1 class="pf-v6-c-title pf-m-3xl">Log in to your account</h1>
|
|
28
28
|
<p
|
|
29
|
-
class="pf-
|
|
29
|
+
class="pf-v6-c-login__main-header-desc"
|
|
30
30
|
>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
|
|
31
31
|
</header>
|
|
32
|
-
<div class="pf-
|
|
33
|
-
<form class="pf-
|
|
34
|
-
<div class="pf-
|
|
35
|
-
<div class="pf-
|
|
36
|
-
<div class="pf-
|
|
37
|
-
<span class="pf-
|
|
32
|
+
<div class="pf-v6-c-login__main-body">
|
|
33
|
+
<form class="pf-v6-c-form" novalidate>
|
|
34
|
+
<div class="pf-v6-c-form__helper-text" aria-live="polite">
|
|
35
|
+
<div class="pf-v6-c-helper-text pf-m-hidden">
|
|
36
|
+
<div class="pf-v6-c-helper-text__item pf-m-error" id="-helper">
|
|
37
|
+
<span class="pf-v6-c-helper-text__item-icon">
|
|
38
38
|
<i class="fas fa-fw fa-exclamation-circle" aria-hidden="true"></i>
|
|
39
39
|
</span>
|
|
40
40
|
<span
|
|
41
|
-
class="pf-
|
|
41
|
+
class="pf-v6-c-helper-text__item-text"
|
|
42
42
|
>Invalid login credentials.</span>
|
|
43
43
|
</div>
|
|
44
44
|
</div>
|
|
45
45
|
</div>
|
|
46
|
-
<div class="pf-
|
|
47
|
-
<span class="pf-
|
|
48
|
-
class="pf-
|
|
46
|
+
<div class="pf-v6-c-form__group"><label class="pf-v6-c-form__label" for="login-demo-form-username">
|
|
47
|
+
<span class="pf-v6-c-form__label-text">Username</span> <span
|
|
48
|
+
class="pf-v6-c-form__label-required"
|
|
49
49
|
aria-hidden="true"
|
|
50
50
|
>*</span></label>
|
|
51
51
|
|
|
52
|
-
<span class="pf-
|
|
52
|
+
<span class="pf-v6-c-form-control pf-m-required">
|
|
53
53
|
<input
|
|
54
54
|
required
|
|
55
55
|
input="true"
|
|
@@ -59,13 +59,13 @@ wrapperTag: div
|
|
|
59
59
|
/>
|
|
60
60
|
</span>
|
|
61
61
|
</div>
|
|
62
|
-
<div class="pf-
|
|
63
|
-
<span class="pf-
|
|
64
|
-
class="pf-
|
|
62
|
+
<div class="pf-v6-c-form__group"><label class="pf-v6-c-form__label" for="login-demo-form-password">
|
|
63
|
+
<span class="pf-v6-c-form__label-text">Password</span> <span
|
|
64
|
+
class="pf-v6-c-form__label-required"
|
|
65
65
|
aria-hidden="true"
|
|
66
66
|
>*</span></label>
|
|
67
67
|
|
|
68
|
-
<span class="pf-
|
|
68
|
+
<span class="pf-v6-c-form-control pf-m-required">
|
|
69
69
|
<input
|
|
70
70
|
required
|
|
71
71
|
type="password"
|
|
@@ -74,34 +74,34 @@ wrapperTag: div
|
|
|
74
74
|
/>
|
|
75
75
|
</span>
|
|
76
76
|
</div>
|
|
77
|
-
<div class="pf-
|
|
78
|
-
<div class="pf-
|
|
77
|
+
<div class="pf-v6-c-form__group">
|
|
78
|
+
<div class="pf-v6-c-check">
|
|
79
79
|
<input
|
|
80
|
-
class="pf-
|
|
80
|
+
class="pf-v6-c-check__input"
|
|
81
81
|
type="checkbox"
|
|
82
82
|
id="login-demo-checkbox"
|
|
83
83
|
name="login-demo-checkbox"
|
|
84
84
|
/>
|
|
85
85
|
|
|
86
86
|
<label
|
|
87
|
-
class="pf-
|
|
87
|
+
class="pf-v6-c-check__label"
|
|
88
88
|
for="login-demo-checkbox"
|
|
89
89
|
>Keep me logged in for 30 days.</label>
|
|
90
90
|
</div>
|
|
91
91
|
</div>
|
|
92
|
-
<div class="pf-
|
|
92
|
+
<div class="pf-v6-c-form__group pf-m-action">
|
|
93
93
|
<button
|
|
94
|
-
class="pf-
|
|
94
|
+
class="pf-v6-c-button pf-m-primary pf-m-block"
|
|
95
95
|
type="submit"
|
|
96
96
|
>Log in</button>
|
|
97
97
|
</div>
|
|
98
98
|
</form>
|
|
99
99
|
</div>
|
|
100
|
-
<footer class="pf-
|
|
101
|
-
<ul class="pf-
|
|
102
|
-
<li class="pf-
|
|
100
|
+
<footer class="pf-v6-c-login__main-footer">
|
|
101
|
+
<ul class="pf-v6-c-login__main-footer-links" role="list">
|
|
102
|
+
<li class="pf-v6-c-login__main-footer-links-item">
|
|
103
103
|
<button
|
|
104
|
-
class="pf-
|
|
104
|
+
class="pf-v6-c-button pf-m-plain"
|
|
105
105
|
type="button"
|
|
106
106
|
aria-label="Log in with Google"
|
|
107
107
|
>
|
|
@@ -110,7 +110,7 @@ wrapperTag: div
|
|
|
110
110
|
xmlns="http://www.w3.org/2000/svg"
|
|
111
111
|
fill="currentColor"
|
|
112
112
|
viewBox="0 0 488 512"
|
|
113
|
-
class="pf-
|
|
113
|
+
class="pf-v6-svg"
|
|
114
114
|
>
|
|
115
115
|
<path
|
|
116
116
|
d="M488 261.8C488 403.3 391.1 504 248 504 110.8 504 0 393.2 0 256S110.8 8 248 8c66.8 0 123 24.5 166.3 64.9l-67.5 64.9C258.5 52.6 94.3 116.6 94.3 256c0 86.5 69.1 156.6 153.7 156.6 98.2 0 135-70.4 140.8-106.9H248v-85.3h236.1c2.3 12.7 3.9 24.9 3.9 41.4z"
|
|
@@ -118,9 +118,9 @@ wrapperTag: div
|
|
|
118
118
|
</svg>
|
|
119
119
|
</button>
|
|
120
120
|
</li>
|
|
121
|
-
<li class="pf-
|
|
121
|
+
<li class="pf-v6-c-login__main-footer-links-item">
|
|
122
122
|
<button
|
|
123
|
-
class="pf-
|
|
123
|
+
class="pf-v6-c-button pf-m-plain"
|
|
124
124
|
type="button"
|
|
125
125
|
aria-label="Log in with Github"
|
|
126
126
|
>
|
|
@@ -129,7 +129,7 @@ wrapperTag: div
|
|
|
129
129
|
xmlns="http://www.w3.org/2000/svg"
|
|
130
130
|
fill="currentColor"
|
|
131
131
|
viewBox="0 0 496 512"
|
|
132
|
-
class="pf-
|
|
132
|
+
class="pf-v6-svg"
|
|
133
133
|
>
|
|
134
134
|
<path
|
|
135
135
|
d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3.3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5.3-6.2 2.3zm44.2-1.7c-2.9.7-4.9 2.6-4.6 4.9.3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3.7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3.3 2.9 2.3 3.9 1.6 1 3.6.7 4.3-.7.7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3.7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3.7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z"
|
|
@@ -137,9 +137,9 @@ wrapperTag: div
|
|
|
137
137
|
</svg>
|
|
138
138
|
</button>
|
|
139
139
|
</li>
|
|
140
|
-
<li class="pf-
|
|
140
|
+
<li class="pf-v6-c-login__main-footer-links-item">
|
|
141
141
|
<button
|
|
142
|
-
class="pf-
|
|
142
|
+
class="pf-v6-c-button pf-m-plain"
|
|
143
143
|
type="button"
|
|
144
144
|
aria-label="Log in with Dropbox"
|
|
145
145
|
>
|
|
@@ -148,7 +148,7 @@ wrapperTag: div
|
|
|
148
148
|
xmlns="http://www.w3.org/2000/svg"
|
|
149
149
|
fill="currentColor"
|
|
150
150
|
viewBox="0 0 528 512"
|
|
151
|
-
class="pf-
|
|
151
|
+
class="pf-v6-svg"
|
|
152
152
|
>
|
|
153
153
|
<path
|
|
154
154
|
d="M264.4 116.3l-132 84.3 132 84.3-132 84.3L0 284.1l132.3-84.3L0 116.3 132.3 32l132.1 84.3zM131.6 395.7l132-84.3 132 84.3-132 84.3-132-84.3zm132.8-111.6l132-84.3-132-83.6L395.7 32 528 116.3l-132.3 84.3L528 284.8l-132.3 84.3-131.3-85z"
|
|
@@ -156,9 +156,9 @@ wrapperTag: div
|
|
|
156
156
|
</svg>
|
|
157
157
|
</button>
|
|
158
158
|
</li>
|
|
159
|
-
<li class="pf-
|
|
159
|
+
<li class="pf-v6-c-login__main-footer-links-item">
|
|
160
160
|
<button
|
|
161
|
-
class="pf-
|
|
161
|
+
class="pf-v6-c-button pf-m-plain"
|
|
162
162
|
type="button"
|
|
163
163
|
aria-label="Log in with Facebook"
|
|
164
164
|
>
|
|
@@ -167,7 +167,7 @@ wrapperTag: div
|
|
|
167
167
|
xmlns="http://www.w3.org/2000/svg"
|
|
168
168
|
fill="currentColor"
|
|
169
169
|
viewBox="0 0 448 512"
|
|
170
|
-
class="pf-
|
|
170
|
+
class="pf-v6-svg"
|
|
171
171
|
>
|
|
172
172
|
<path
|
|
173
173
|
d="M448 56.7v398.5c0 13.7-11.1 24.7-24.7 24.7H309.1V306.5h58.2l8.7-67.6h-67v-43.2c0-19.6 5.4-32.9 33.5-32.9h35.8v-60.5c-6.2-.8-27.4-2.7-52.2-2.7-51.6 0-87 31.5-87 89.4v49.9h-58.4v67.6h58.4V480H24.7C11.1 480 0 468.9 0 455.3V56.7C0 43.1 11.1 32 24.7 32h398.5c13.7 0 24.8 11.1 24.8 24.7z"
|
|
@@ -175,9 +175,9 @@ wrapperTag: div
|
|
|
175
175
|
</svg>
|
|
176
176
|
</button>
|
|
177
177
|
</li>
|
|
178
|
-
<li class="pf-
|
|
178
|
+
<li class="pf-v6-c-login__main-footer-links-item">
|
|
179
179
|
<button
|
|
180
|
-
class="pf-
|
|
180
|
+
class="pf-v6-c-button pf-m-plain"
|
|
181
181
|
type="button"
|
|
182
182
|
aria-label="Log in with Gitlab"
|
|
183
183
|
>
|
|
@@ -186,7 +186,7 @@ wrapperTag: div
|
|
|
186
186
|
xmlns="http://www.w3.org/2000/svg"
|
|
187
187
|
fill="currentColor"
|
|
188
188
|
viewBox="0 0 512 512"
|
|
189
|
-
class="pf-
|
|
189
|
+
class="pf-v6-svg"
|
|
190
190
|
>
|
|
191
191
|
<path
|
|
192
192
|
d="M29.782 199.732L256 493.714 8.074 309.699c-6.856-5.142-9.712-13.996-7.141-21.993l28.849-87.974zm75.405-174.806c-3.142-8.854-15.709-8.854-18.851 0L29.782 199.732h131.961L105.187 24.926zm56.556 174.806L256 493.714l94.257-293.982H161.743zm349.324 87.974l-28.849-87.974L256 493.714l247.926-184.015c6.855-5.142 9.711-13.996 7.141-21.993zm-85.404-262.78c-3.142-8.854-15.709-8.854-18.851 0l-56.555 174.806h131.961L425.663 24.926z"
|
|
@@ -195,20 +195,20 @@ wrapperTag: div
|
|
|
195
195
|
</button>
|
|
196
196
|
</li>
|
|
197
197
|
</ul>
|
|
198
|
-
<div class="pf-
|
|
199
|
-
<p class="pf-
|
|
198
|
+
<div class="pf-v6-c-login__main-footer-band">
|
|
199
|
+
<p class="pf-v6-c-login__main-footer-band-item">
|
|
200
200
|
Need an account?
|
|
201
201
|
<a href="https://www.patternfly.org/">Sign up.</a>
|
|
202
202
|
</p>
|
|
203
|
-
<p class="pf-
|
|
203
|
+
<p class="pf-v6-c-login__main-footer-band-item">
|
|
204
204
|
<a href="#">Forgot username or password?</a>
|
|
205
205
|
</p>
|
|
206
206
|
</div>
|
|
207
207
|
</footer>
|
|
208
208
|
</main>
|
|
209
|
-
<footer class="pf-
|
|
209
|
+
<footer class="pf-v6-c-login__footer">
|
|
210
210
|
<p>This is placeholder text only. Use this area to place any information or introductory message about your application that may be relevant to users.</p>
|
|
211
|
-
<ul class="pf-
|
|
211
|
+
<ul class="pf-v6-c-list pf-m-inline" role="list">
|
|
212
212
|
<li>
|
|
213
213
|
<a href="#">Terms of use</a>
|
|
214
214
|
</li>
|
|
@@ -229,50 +229,50 @@ wrapperTag: div
|
|
|
229
229
|
|
|
230
230
|
```html isFullscreen
|
|
231
231
|
<div
|
|
232
|
-
class="pf-
|
|
233
|
-
style="--pf-
|
|
232
|
+
class="pf-v6-c-background-image"
|
|
233
|
+
style="--pf-v6-c-background-image--BackgroundImage: url(/assets/images/pf-background.svg)"
|
|
234
234
|
></div>
|
|
235
|
-
<div class="pf-
|
|
236
|
-
<div class="pf-
|
|
237
|
-
<header class="pf-
|
|
235
|
+
<div class="pf-v6-c-login">
|
|
236
|
+
<div class="pf-v6-c-login__container">
|
|
237
|
+
<header class="pf-v6-c-login__header">
|
|
238
238
|
<img
|
|
239
|
-
class="pf-
|
|
239
|
+
class="pf-v6-c-brand"
|
|
240
240
|
src="/assets/images/pf_logo_color.svg"
|
|
241
241
|
alt="PatternFly Logo"
|
|
242
242
|
style="--pf-v5-c-brand--Height:48px;"
|
|
243
243
|
/>
|
|
244
244
|
</header>
|
|
245
|
-
<main class="pf-
|
|
246
|
-
<header class="pf-
|
|
247
|
-
<h1 class="pf-
|
|
245
|
+
<main class="pf-v6-c-login__main">
|
|
246
|
+
<header class="pf-v6-c-login__main-header">
|
|
247
|
+
<h1 class="pf-v6-c-title pf-m-3xl">Log in to your account</h1>
|
|
248
248
|
<p
|
|
249
|
-
class="pf-
|
|
249
|
+
class="pf-v6-c-login__main-header-desc"
|
|
250
250
|
>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
|
|
251
251
|
</header>
|
|
252
|
-
<div class="pf-
|
|
253
|
-
<form class="pf-
|
|
254
|
-
<div class="pf-
|
|
255
|
-
<div class="pf-
|
|
256
|
-
<div class="pf-
|
|
257
|
-
<span class="pf-
|
|
252
|
+
<div class="pf-v6-c-login__main-body">
|
|
253
|
+
<form class="pf-v6-c-form" novalidate>
|
|
254
|
+
<div class="pf-v6-c-form__helper-text" aria-live="polite">
|
|
255
|
+
<div class="pf-v6-c-helper-text">
|
|
256
|
+
<div class="pf-v6-c-helper-text__item pf-m-error" id="-helper">
|
|
257
|
+
<span class="pf-v6-c-helper-text__item-icon">
|
|
258
258
|
<i class="fas fa-fw fa-exclamation-circle" aria-hidden="true"></i>
|
|
259
259
|
</span>
|
|
260
260
|
<span
|
|
261
|
-
class="pf-
|
|
261
|
+
class="pf-v6-c-helper-text__item-text"
|
|
262
262
|
>Invalid login credentials.</span>
|
|
263
263
|
</div>
|
|
264
264
|
</div>
|
|
265
265
|
</div>
|
|
266
|
-
<div class="pf-
|
|
267
|
-
class="pf-
|
|
266
|
+
<div class="pf-v6-c-form__group"><label
|
|
267
|
+
class="pf-v6-c-form__label"
|
|
268
268
|
for="invalid-login-demo-form-username"
|
|
269
269
|
>
|
|
270
|
-
<span class="pf-
|
|
271
|
-
class="pf-
|
|
270
|
+
<span class="pf-v6-c-form__label-text">Username</span> <span
|
|
271
|
+
class="pf-v6-c-form__label-required"
|
|
272
272
|
aria-hidden="true"
|
|
273
273
|
>*</span></label>
|
|
274
274
|
|
|
275
|
-
<span class="pf-
|
|
275
|
+
<span class="pf-v6-c-form-control pf-m-required pf-m-error">
|
|
276
276
|
<input
|
|
277
277
|
required
|
|
278
278
|
type="text"
|
|
@@ -280,23 +280,23 @@ wrapperTag: div
|
|
|
280
280
|
name="invalid-login-demo-form-username"
|
|
281
281
|
aria-invalid="true"
|
|
282
282
|
/>
|
|
283
|
-
<span class="pf-
|
|
284
|
-
<span class="pf-
|
|
283
|
+
<span class="pf-v6-c-form-control__utilities">
|
|
284
|
+
<span class="pf-v6-c-form-control__icon pf-m-status">
|
|
285
285
|
<i class="fas fa-exclamation-circle" aria-hidden="true"></i>
|
|
286
286
|
</span>
|
|
287
287
|
</span>
|
|
288
288
|
</span>
|
|
289
289
|
</div>
|
|
290
|
-
<div class="pf-
|
|
291
|
-
class="pf-
|
|
290
|
+
<div class="pf-v6-c-form__group"><label
|
|
291
|
+
class="pf-v6-c-form__label"
|
|
292
292
|
for="invalid-login-demo-form-password"
|
|
293
293
|
>
|
|
294
|
-
<span class="pf-
|
|
295
|
-
class="pf-
|
|
294
|
+
<span class="pf-v6-c-form__label-text">Password</span> <span
|
|
295
|
+
class="pf-v6-c-form__label-required"
|
|
296
296
|
aria-hidden="true"
|
|
297
297
|
>*</span></label>
|
|
298
298
|
|
|
299
|
-
<span class="pf-
|
|
299
|
+
<span class="pf-v6-c-form-control pf-m-required pf-m-error">
|
|
300
300
|
<input
|
|
301
301
|
required
|
|
302
302
|
type="password"
|
|
@@ -304,41 +304,41 @@ wrapperTag: div
|
|
|
304
304
|
name="invalid-login-demo-form-password"
|
|
305
305
|
aria-invalid="true"
|
|
306
306
|
/>
|
|
307
|
-
<span class="pf-
|
|
308
|
-
<span class="pf-
|
|
307
|
+
<span class="pf-v6-c-form-control__utilities">
|
|
308
|
+
<span class="pf-v6-c-form-control__icon pf-m-status">
|
|
309
309
|
<i class="fas fa-exclamation-circle" aria-hidden="true"></i>
|
|
310
310
|
</span>
|
|
311
311
|
</span>
|
|
312
312
|
</span>
|
|
313
313
|
</div>
|
|
314
|
-
<div class="pf-
|
|
315
|
-
<div class="pf-
|
|
314
|
+
<div class="pf-v6-c-form__group">
|
|
315
|
+
<div class="pf-v6-c-check">
|
|
316
316
|
<input
|
|
317
|
-
class="pf-
|
|
317
|
+
class="pf-v6-c-check__input"
|
|
318
318
|
type="checkbox"
|
|
319
319
|
id="invalid-login-demo-checkbox"
|
|
320
320
|
name="invalid-login-demo-checkbox"
|
|
321
321
|
/>
|
|
322
322
|
|
|
323
323
|
<label
|
|
324
|
-
class="pf-
|
|
324
|
+
class="pf-v6-c-check__label"
|
|
325
325
|
for="invalid-login-demo-checkbox"
|
|
326
326
|
>Keep me logged in for 30 days.</label>
|
|
327
327
|
</div>
|
|
328
328
|
</div>
|
|
329
|
-
<div class="pf-
|
|
329
|
+
<div class="pf-v6-c-form__group pf-m-action">
|
|
330
330
|
<button
|
|
331
|
-
class="pf-
|
|
331
|
+
class="pf-v6-c-button pf-m-primary pf-m-block"
|
|
332
332
|
type="submit"
|
|
333
333
|
>Log in</button>
|
|
334
334
|
</div>
|
|
335
335
|
</form>
|
|
336
336
|
</div>
|
|
337
|
-
<footer class="pf-
|
|
338
|
-
<ul class="pf-
|
|
339
|
-
<li class="pf-
|
|
337
|
+
<footer class="pf-v6-c-login__main-footer">
|
|
338
|
+
<ul class="pf-v6-c-login__main-footer-links" role="list">
|
|
339
|
+
<li class="pf-v6-c-login__main-footer-links-item">
|
|
340
340
|
<button
|
|
341
|
-
class="pf-
|
|
341
|
+
class="pf-v6-c-button pf-m-plain"
|
|
342
342
|
type="button"
|
|
343
343
|
aria-label="Log in with Google"
|
|
344
344
|
>
|
|
@@ -347,7 +347,7 @@ wrapperTag: div
|
|
|
347
347
|
xmlns="http://www.w3.org/2000/svg"
|
|
348
348
|
fill="currentColor"
|
|
349
349
|
viewBox="0 0 488 512"
|
|
350
|
-
class="pf-
|
|
350
|
+
class="pf-v6-svg"
|
|
351
351
|
>
|
|
352
352
|
<path
|
|
353
353
|
d="M488 261.8C488 403.3 391.1 504 248 504 110.8 504 0 393.2 0 256S110.8 8 248 8c66.8 0 123 24.5 166.3 64.9l-67.5 64.9C258.5 52.6 94.3 116.6 94.3 256c0 86.5 69.1 156.6 153.7 156.6 98.2 0 135-70.4 140.8-106.9H248v-85.3h236.1c2.3 12.7 3.9 24.9 3.9 41.4z"
|
|
@@ -355,9 +355,9 @@ wrapperTag: div
|
|
|
355
355
|
</svg>
|
|
356
356
|
</button>
|
|
357
357
|
</li>
|
|
358
|
-
<li class="pf-
|
|
358
|
+
<li class="pf-v6-c-login__main-footer-links-item">
|
|
359
359
|
<button
|
|
360
|
-
class="pf-
|
|
360
|
+
class="pf-v6-c-button pf-m-plain"
|
|
361
361
|
type="button"
|
|
362
362
|
aria-label="Log in with Github"
|
|
363
363
|
>
|
|
@@ -366,7 +366,7 @@ wrapperTag: div
|
|
|
366
366
|
xmlns="http://www.w3.org/2000/svg"
|
|
367
367
|
fill="currentColor"
|
|
368
368
|
viewBox="0 0 496 512"
|
|
369
|
-
class="pf-
|
|
369
|
+
class="pf-v6-svg"
|
|
370
370
|
>
|
|
371
371
|
<path
|
|
372
372
|
d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3.3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5.3-6.2 2.3zm44.2-1.7c-2.9.7-4.9 2.6-4.6 4.9.3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3.7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3.3 2.9 2.3 3.9 1.6 1 3.6.7 4.3-.7.7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3.7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3.7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z"
|
|
@@ -374,9 +374,9 @@ wrapperTag: div
|
|
|
374
374
|
</svg>
|
|
375
375
|
</button>
|
|
376
376
|
</li>
|
|
377
|
-
<li class="pf-
|
|
377
|
+
<li class="pf-v6-c-login__main-footer-links-item">
|
|
378
378
|
<button
|
|
379
|
-
class="pf-
|
|
379
|
+
class="pf-v6-c-button pf-m-plain"
|
|
380
380
|
type="button"
|
|
381
381
|
aria-label="Log in with Dropbox"
|
|
382
382
|
>
|
|
@@ -385,7 +385,7 @@ wrapperTag: div
|
|
|
385
385
|
xmlns="http://www.w3.org/2000/svg"
|
|
386
386
|
fill="currentColor"
|
|
387
387
|
viewBox="0 0 528 512"
|
|
388
|
-
class="pf-
|
|
388
|
+
class="pf-v6-svg"
|
|
389
389
|
>
|
|
390
390
|
<path
|
|
391
391
|
d="M264.4 116.3l-132 84.3 132 84.3-132 84.3L0 284.1l132.3-84.3L0 116.3 132.3 32l132.1 84.3zM131.6 395.7l132-84.3 132 84.3-132 84.3-132-84.3zm132.8-111.6l132-84.3-132-83.6L395.7 32 528 116.3l-132.3 84.3L528 284.8l-132.3 84.3-131.3-85z"
|
|
@@ -393,9 +393,9 @@ wrapperTag: div
|
|
|
393
393
|
</svg>
|
|
394
394
|
</button>
|
|
395
395
|
</li>
|
|
396
|
-
<li class="pf-
|
|
396
|
+
<li class="pf-v6-c-login__main-footer-links-item">
|
|
397
397
|
<button
|
|
398
|
-
class="pf-
|
|
398
|
+
class="pf-v6-c-button pf-m-plain"
|
|
399
399
|
type="button"
|
|
400
400
|
aria-label="Log in with Facebook"
|
|
401
401
|
>
|
|
@@ -404,7 +404,7 @@ wrapperTag: div
|
|
|
404
404
|
xmlns="http://www.w3.org/2000/svg"
|
|
405
405
|
fill="currentColor"
|
|
406
406
|
viewBox="0 0 448 512"
|
|
407
|
-
class="pf-
|
|
407
|
+
class="pf-v6-svg"
|
|
408
408
|
>
|
|
409
409
|
<path
|
|
410
410
|
d="M448 56.7v398.5c0 13.7-11.1 24.7-24.7 24.7H309.1V306.5h58.2l8.7-67.6h-67v-43.2c0-19.6 5.4-32.9 33.5-32.9h35.8v-60.5c-6.2-.8-27.4-2.7-52.2-2.7-51.6 0-87 31.5-87 89.4v49.9h-58.4v67.6h58.4V480H24.7C11.1 480 0 468.9 0 455.3V56.7C0 43.1 11.1 32 24.7 32h398.5c13.7 0 24.8 11.1 24.8 24.7z"
|
|
@@ -412,9 +412,9 @@ wrapperTag: div
|
|
|
412
412
|
</svg>
|
|
413
413
|
</button>
|
|
414
414
|
</li>
|
|
415
|
-
<li class="pf-
|
|
415
|
+
<li class="pf-v6-c-login__main-footer-links-item">
|
|
416
416
|
<button
|
|
417
|
-
class="pf-
|
|
417
|
+
class="pf-v6-c-button pf-m-plain"
|
|
418
418
|
type="button"
|
|
419
419
|
aria-label="Log in with Gitlab"
|
|
420
420
|
>
|
|
@@ -423,7 +423,7 @@ wrapperTag: div
|
|
|
423
423
|
xmlns="http://www.w3.org/2000/svg"
|
|
424
424
|
fill="currentColor"
|
|
425
425
|
viewBox="0 0 512 512"
|
|
426
|
-
class="pf-
|
|
426
|
+
class="pf-v6-svg"
|
|
427
427
|
>
|
|
428
428
|
<path
|
|
429
429
|
d="M29.782 199.732L256 493.714 8.074 309.699c-6.856-5.142-9.712-13.996-7.141-21.993l28.849-87.974zm75.405-174.806c-3.142-8.854-15.709-8.854-18.851 0L29.782 199.732h131.961L105.187 24.926zm56.556 174.806L256 493.714l94.257-293.982H161.743zm349.324 87.974l-28.849-87.974L256 493.714l247.926-184.015c6.855-5.142 9.711-13.996 7.141-21.993zm-85.404-262.78c-3.142-8.854-15.709-8.854-18.851 0l-56.555 174.806h131.961L425.663 24.926z"
|
|
@@ -432,20 +432,20 @@ wrapperTag: div
|
|
|
432
432
|
</button>
|
|
433
433
|
</li>
|
|
434
434
|
</ul>
|
|
435
|
-
<div class="pf-
|
|
436
|
-
<p class="pf-
|
|
435
|
+
<div class="pf-v6-c-login__main-footer-band">
|
|
436
|
+
<p class="pf-v6-c-login__main-footer-band-item">
|
|
437
437
|
Need an account?
|
|
438
438
|
<a href="https://www.patternfly.org/">Sign up.</a>
|
|
439
439
|
</p>
|
|
440
|
-
<p class="pf-
|
|
440
|
+
<p class="pf-v6-c-login__main-footer-band-item">
|
|
441
441
|
<a href="#">Forgot username or password?</a>
|
|
442
442
|
</p>
|
|
443
443
|
</div>
|
|
444
444
|
</footer>
|
|
445
445
|
</main>
|
|
446
|
-
<footer class="pf-
|
|
446
|
+
<footer class="pf-v6-c-login__footer">
|
|
447
447
|
<p>This is placeholder text only. Use this area to place any information or introductory message about your application that may be relevant to users.</p>
|
|
448
|
-
<ul class="pf-
|
|
448
|
+
<ul class="pf-v6-c-list pf-m-inline" role="list">
|
|
449
449
|
<li>
|
|
450
450
|
<a href="#">Terms of use</a>
|
|
451
451
|
</li>
|
|
@@ -466,47 +466,47 @@ wrapperTag: div
|
|
|
466
466
|
|
|
467
467
|
```html isFullscreen
|
|
468
468
|
<div
|
|
469
|
-
class="pf-
|
|
470
|
-
style="--pf-
|
|
469
|
+
class="pf-v6-c-background-image"
|
|
470
|
+
style="--pf-v6-c-background-image--BackgroundImage: url(/assets/images/pf-background.svg)"
|
|
471
471
|
></div>
|
|
472
|
-
<div class="pf-
|
|
473
|
-
<div class="pf-
|
|
474
|
-
<header class="pf-
|
|
472
|
+
<div class="pf-v6-c-login">
|
|
473
|
+
<div class="pf-v6-c-login__container">
|
|
474
|
+
<header class="pf-v6-c-login__header">
|
|
475
475
|
<img
|
|
476
|
-
class="pf-
|
|
476
|
+
class="pf-v6-c-brand"
|
|
477
477
|
src="/assets/images/pf_logo_color.svg"
|
|
478
478
|
alt="PatternFly Logo"
|
|
479
479
|
style="--pf-v5-c-brand--Height:48px;"
|
|
480
480
|
/>
|
|
481
481
|
</header>
|
|
482
|
-
<main class="pf-
|
|
483
|
-
<header class="pf-
|
|
484
|
-
<h1 class="pf-
|
|
482
|
+
<main class="pf-v6-c-login__main">
|
|
483
|
+
<header class="pf-v6-c-login__main-header">
|
|
484
|
+
<h1 class="pf-v6-c-title pf-m-3xl">Log in to your account</h1>
|
|
485
485
|
<p
|
|
486
|
-
class="pf-
|
|
486
|
+
class="pf-v6-c-login__main-header-desc"
|
|
487
487
|
>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
|
|
488
488
|
</header>
|
|
489
|
-
<div class="pf-
|
|
490
|
-
<form class="pf-
|
|
491
|
-
<div class="pf-
|
|
492
|
-
<div class="pf-
|
|
493
|
-
<div class="pf-
|
|
494
|
-
<span class="pf-
|
|
489
|
+
<div class="pf-v6-c-login__main-body">
|
|
490
|
+
<form class="pf-v6-c-form" novalidate>
|
|
491
|
+
<div class="pf-v6-c-form__helper-text" aria-live="polite">
|
|
492
|
+
<div class="pf-v6-c-helper-text pf-m-hidden">
|
|
493
|
+
<div class="pf-v6-c-helper-text__item pf-m-error" id="-helper">
|
|
494
|
+
<span class="pf-v6-c-helper-text__item-icon">
|
|
495
495
|
<i class="fas fa-fw fa-exclamation-circle" aria-hidden="true"></i>
|
|
496
496
|
</span>
|
|
497
497
|
<span
|
|
498
|
-
class="pf-
|
|
498
|
+
class="pf-v6-c-helper-text__item-text"
|
|
499
499
|
>Invalid login credentials.</span>
|
|
500
500
|
</div>
|
|
501
501
|
</div>
|
|
502
502
|
</div>
|
|
503
|
-
<div class="pf-
|
|
504
|
-
<span class="pf-
|
|
505
|
-
class="pf-
|
|
503
|
+
<div class="pf-v6-c-form__group"><label class="pf-v6-c-form__label" for="login-demo-form-username">
|
|
504
|
+
<span class="pf-v6-c-form__label-text">Username</span> <span
|
|
505
|
+
class="pf-v6-c-form__label-required"
|
|
506
506
|
aria-hidden="true"
|
|
507
507
|
>*</span></label>
|
|
508
508
|
|
|
509
|
-
<span class="pf-
|
|
509
|
+
<span class="pf-v6-c-form-control pf-m-required">
|
|
510
510
|
<input
|
|
511
511
|
required
|
|
512
512
|
type="text"
|
|
@@ -515,14 +515,14 @@ wrapperTag: div
|
|
|
515
515
|
/>
|
|
516
516
|
</span>
|
|
517
517
|
</div>
|
|
518
|
-
<div class="pf-
|
|
519
|
-
<span class="pf-
|
|
520
|
-
class="pf-
|
|
518
|
+
<div class="pf-v6-c-form__group"><label class="pf-v6-c-form__label" for="login-demo-form-password">
|
|
519
|
+
<span class="pf-v6-c-form__label-text">Password</span> <span
|
|
520
|
+
class="pf-v6-c-form__label-required"
|
|
521
521
|
aria-hidden="true"
|
|
522
522
|
>*</span></label>
|
|
523
523
|
|
|
524
|
-
<div class="pf-
|
|
525
|
-
<span class="pf-
|
|
524
|
+
<div class="pf-v6-c-input-group">
|
|
525
|
+
<span class="pf-v6-c-form-control pf-m-required">
|
|
526
526
|
<input
|
|
527
527
|
required
|
|
528
528
|
type="password"
|
|
@@ -533,7 +533,7 @@ wrapperTag: div
|
|
|
533
533
|
</span>
|
|
534
534
|
|
|
535
535
|
<button
|
|
536
|
-
class="pf-
|
|
536
|
+
class="pf-v6-c-button pf-m-control"
|
|
537
537
|
type="button"
|
|
538
538
|
aria-label="Show password"
|
|
539
539
|
>
|
|
@@ -541,34 +541,34 @@ wrapperTag: div
|
|
|
541
541
|
</button>
|
|
542
542
|
</div>
|
|
543
543
|
</div>
|
|
544
|
-
<div class="pf-
|
|
545
|
-
<div class="pf-
|
|
544
|
+
<div class="pf-v6-c-form__group">
|
|
545
|
+
<div class="pf-v6-c-check">
|
|
546
546
|
<input
|
|
547
|
-
class="pf-
|
|
547
|
+
class="pf-v6-c-check__input"
|
|
548
548
|
type="checkbox"
|
|
549
549
|
id="login-demo-checkbox"
|
|
550
550
|
name="login-demo-checkbox"
|
|
551
551
|
/>
|
|
552
552
|
|
|
553
553
|
<label
|
|
554
|
-
class="pf-
|
|
554
|
+
class="pf-v6-c-check__label"
|
|
555
555
|
for="login-demo-checkbox"
|
|
556
556
|
>Keep me logged in for 30 days.</label>
|
|
557
557
|
</div>
|
|
558
558
|
</div>
|
|
559
|
-
<div class="pf-
|
|
559
|
+
<div class="pf-v6-c-form__group pf-m-action">
|
|
560
560
|
<button
|
|
561
|
-
class="pf-
|
|
561
|
+
class="pf-v6-c-button pf-m-primary pf-m-block"
|
|
562
562
|
type="submit"
|
|
563
563
|
>Log in</button>
|
|
564
564
|
</div>
|
|
565
565
|
</form>
|
|
566
566
|
</div>
|
|
567
|
-
<footer class="pf-
|
|
568
|
-
<ul class="pf-
|
|
569
|
-
<li class="pf-
|
|
567
|
+
<footer class="pf-v6-c-login__main-footer">
|
|
568
|
+
<ul class="pf-v6-c-login__main-footer-links" role="list">
|
|
569
|
+
<li class="pf-v6-c-login__main-footer-links-item">
|
|
570
570
|
<button
|
|
571
|
-
class="pf-
|
|
571
|
+
class="pf-v6-c-button pf-m-plain"
|
|
572
572
|
type="button"
|
|
573
573
|
aria-label="Log in with Google"
|
|
574
574
|
>
|
|
@@ -577,7 +577,7 @@ wrapperTag: div
|
|
|
577
577
|
xmlns="http://www.w3.org/2000/svg"
|
|
578
578
|
fill="currentColor"
|
|
579
579
|
viewBox="0 0 488 512"
|
|
580
|
-
class="pf-
|
|
580
|
+
class="pf-v6-svg"
|
|
581
581
|
>
|
|
582
582
|
<path
|
|
583
583
|
d="M488 261.8C488 403.3 391.1 504 248 504 110.8 504 0 393.2 0 256S110.8 8 248 8c66.8 0 123 24.5 166.3 64.9l-67.5 64.9C258.5 52.6 94.3 116.6 94.3 256c0 86.5 69.1 156.6 153.7 156.6 98.2 0 135-70.4 140.8-106.9H248v-85.3h236.1c2.3 12.7 3.9 24.9 3.9 41.4z"
|
|
@@ -585,9 +585,9 @@ wrapperTag: div
|
|
|
585
585
|
</svg>
|
|
586
586
|
</button>
|
|
587
587
|
</li>
|
|
588
|
-
<li class="pf-
|
|
588
|
+
<li class="pf-v6-c-login__main-footer-links-item">
|
|
589
589
|
<button
|
|
590
|
-
class="pf-
|
|
590
|
+
class="pf-v6-c-button pf-m-plain"
|
|
591
591
|
type="button"
|
|
592
592
|
aria-label="Log in with Github"
|
|
593
593
|
>
|
|
@@ -596,7 +596,7 @@ wrapperTag: div
|
|
|
596
596
|
xmlns="http://www.w3.org/2000/svg"
|
|
597
597
|
fill="currentColor"
|
|
598
598
|
viewBox="0 0 496 512"
|
|
599
|
-
class="pf-
|
|
599
|
+
class="pf-v6-svg"
|
|
600
600
|
>
|
|
601
601
|
<path
|
|
602
602
|
d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3.3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5.3-6.2 2.3zm44.2-1.7c-2.9.7-4.9 2.6-4.6 4.9.3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3.7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3.3 2.9 2.3 3.9 1.6 1 3.6.7 4.3-.7.7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3.7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3.7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z"
|
|
@@ -604,9 +604,9 @@ wrapperTag: div
|
|
|
604
604
|
</svg>
|
|
605
605
|
</button>
|
|
606
606
|
</li>
|
|
607
|
-
<li class="pf-
|
|
607
|
+
<li class="pf-v6-c-login__main-footer-links-item">
|
|
608
608
|
<button
|
|
609
|
-
class="pf-
|
|
609
|
+
class="pf-v6-c-button pf-m-plain"
|
|
610
610
|
type="button"
|
|
611
611
|
aria-label="Log in with Dropbox"
|
|
612
612
|
>
|
|
@@ -615,7 +615,7 @@ wrapperTag: div
|
|
|
615
615
|
xmlns="http://www.w3.org/2000/svg"
|
|
616
616
|
fill="currentColor"
|
|
617
617
|
viewBox="0 0 528 512"
|
|
618
|
-
class="pf-
|
|
618
|
+
class="pf-v6-svg"
|
|
619
619
|
>
|
|
620
620
|
<path
|
|
621
621
|
d="M264.4 116.3l-132 84.3 132 84.3-132 84.3L0 284.1l132.3-84.3L0 116.3 132.3 32l132.1 84.3zM131.6 395.7l132-84.3 132 84.3-132 84.3-132-84.3zm132.8-111.6l132-84.3-132-83.6L395.7 32 528 116.3l-132.3 84.3L528 284.8l-132.3 84.3-131.3-85z"
|
|
@@ -623,9 +623,9 @@ wrapperTag: div
|
|
|
623
623
|
</svg>
|
|
624
624
|
</button>
|
|
625
625
|
</li>
|
|
626
|
-
<li class="pf-
|
|
626
|
+
<li class="pf-v6-c-login__main-footer-links-item">
|
|
627
627
|
<button
|
|
628
|
-
class="pf-
|
|
628
|
+
class="pf-v6-c-button pf-m-plain"
|
|
629
629
|
type="button"
|
|
630
630
|
aria-label="Log in with Facebook"
|
|
631
631
|
>
|
|
@@ -634,7 +634,7 @@ wrapperTag: div
|
|
|
634
634
|
xmlns="http://www.w3.org/2000/svg"
|
|
635
635
|
fill="currentColor"
|
|
636
636
|
viewBox="0 0 448 512"
|
|
637
|
-
class="pf-
|
|
637
|
+
class="pf-v6-svg"
|
|
638
638
|
>
|
|
639
639
|
<path
|
|
640
640
|
d="M448 56.7v398.5c0 13.7-11.1 24.7-24.7 24.7H309.1V306.5h58.2l8.7-67.6h-67v-43.2c0-19.6 5.4-32.9 33.5-32.9h35.8v-60.5c-6.2-.8-27.4-2.7-52.2-2.7-51.6 0-87 31.5-87 89.4v49.9h-58.4v67.6h58.4V480H24.7C11.1 480 0 468.9 0 455.3V56.7C0 43.1 11.1 32 24.7 32h398.5c13.7 0 24.8 11.1 24.8 24.7z"
|
|
@@ -642,9 +642,9 @@ wrapperTag: div
|
|
|
642
642
|
</svg>
|
|
643
643
|
</button>
|
|
644
644
|
</li>
|
|
645
|
-
<li class="pf-
|
|
645
|
+
<li class="pf-v6-c-login__main-footer-links-item">
|
|
646
646
|
<button
|
|
647
|
-
class="pf-
|
|
647
|
+
class="pf-v6-c-button pf-m-plain"
|
|
648
648
|
type="button"
|
|
649
649
|
aria-label="Log in with Gitlab"
|
|
650
650
|
>
|
|
@@ -653,7 +653,7 @@ wrapperTag: div
|
|
|
653
653
|
xmlns="http://www.w3.org/2000/svg"
|
|
654
654
|
fill="currentColor"
|
|
655
655
|
viewBox="0 0 512 512"
|
|
656
|
-
class="pf-
|
|
656
|
+
class="pf-v6-svg"
|
|
657
657
|
>
|
|
658
658
|
<path
|
|
659
659
|
d="M29.782 199.732L256 493.714 8.074 309.699c-6.856-5.142-9.712-13.996-7.141-21.993l28.849-87.974zm75.405-174.806c-3.142-8.854-15.709-8.854-18.851 0L29.782 199.732h131.961L105.187 24.926zm56.556 174.806L256 493.714l94.257-293.982H161.743zm349.324 87.974l-28.849-87.974L256 493.714l247.926-184.015c6.855-5.142 9.711-13.996 7.141-21.993zm-85.404-262.78c-3.142-8.854-15.709-8.854-18.851 0l-56.555 174.806h131.961L425.663 24.926z"
|
|
@@ -662,20 +662,20 @@ wrapperTag: div
|
|
|
662
662
|
</button>
|
|
663
663
|
</li>
|
|
664
664
|
</ul>
|
|
665
|
-
<div class="pf-
|
|
666
|
-
<p class="pf-
|
|
665
|
+
<div class="pf-v6-c-login__main-footer-band">
|
|
666
|
+
<p class="pf-v6-c-login__main-footer-band-item">
|
|
667
667
|
Need an account?
|
|
668
668
|
<a href="https://www.patternfly.org/">Sign up.</a>
|
|
669
669
|
</p>
|
|
670
|
-
<p class="pf-
|
|
670
|
+
<p class="pf-v6-c-login__main-footer-band-item">
|
|
671
671
|
<a href="#">Forgot username or password?</a>
|
|
672
672
|
</p>
|
|
673
673
|
</div>
|
|
674
674
|
</footer>
|
|
675
675
|
</main>
|
|
676
|
-
<footer class="pf-
|
|
676
|
+
<footer class="pf-v6-c-login__footer">
|
|
677
677
|
<p>This is placeholder text only. Use this area to place any information or introductory message about your application that may be relevant to users.</p>
|
|
678
|
-
<ul class="pf-
|
|
678
|
+
<ul class="pf-v6-c-list pf-m-inline" role="list">
|
|
679
679
|
<li>
|
|
680
680
|
<a href="#">Terms of use</a>
|
|
681
681
|
</li>
|
|
@@ -696,54 +696,54 @@ wrapperTag: div
|
|
|
696
696
|
|
|
697
697
|
```html isFullscreen
|
|
698
698
|
<div
|
|
699
|
-
class="pf-
|
|
700
|
-
style="--pf-
|
|
699
|
+
class="pf-v6-c-background-image"
|
|
700
|
+
style="--pf-v6-c-background-image--BackgroundImage: url(/assets/images/pf-background.svg)"
|
|
701
701
|
></div>
|
|
702
|
-
<div class="pf-
|
|
703
|
-
<div class="pf-
|
|
704
|
-
<header class="pf-
|
|
702
|
+
<div class="pf-v6-c-login">
|
|
703
|
+
<div class="pf-v6-c-login__container">
|
|
704
|
+
<header class="pf-v6-c-login__header">
|
|
705
705
|
<img
|
|
706
|
-
class="pf-
|
|
706
|
+
class="pf-v6-c-brand"
|
|
707
707
|
src="/assets/images/pf_logo_color.svg"
|
|
708
708
|
alt="PatternFly Logo"
|
|
709
709
|
style="--pf-v5-c-brand--Height:48px;"
|
|
710
710
|
/>
|
|
711
711
|
</header>
|
|
712
|
-
<main class="pf-
|
|
713
|
-
<header class="pf-
|
|
714
|
-
<h1 class="pf-
|
|
712
|
+
<main class="pf-v6-c-login__main">
|
|
713
|
+
<header class="pf-v6-c-login__main-header">
|
|
714
|
+
<h1 class="pf-v6-c-title pf-m-3xl">Log in to your account</h1>
|
|
715
715
|
<p
|
|
716
|
-
class="pf-
|
|
716
|
+
class="pf-v6-c-login__main-header-desc"
|
|
717
717
|
>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
|
|
718
718
|
</header>
|
|
719
|
-
<div class="pf-
|
|
720
|
-
<form class="pf-
|
|
721
|
-
<div class="pf-
|
|
722
|
-
<div class="pf-
|
|
723
|
-
<div class="pf-
|
|
724
|
-
<span class="pf-
|
|
719
|
+
<div class="pf-v6-c-login__main-body">
|
|
720
|
+
<form class="pf-v6-c-form" novalidate>
|
|
721
|
+
<div class="pf-v6-c-form__helper-text" aria-live="polite">
|
|
722
|
+
<div class="pf-v6-c-helper-text pf-m-hidden">
|
|
723
|
+
<div class="pf-v6-c-helper-text__item pf-m-error" id="-helper">
|
|
724
|
+
<span class="pf-v6-c-helper-text__item-icon">
|
|
725
725
|
<i class="fas fa-fw fa-exclamation-circle" aria-hidden="true"></i>
|
|
726
726
|
</span>
|
|
727
727
|
<span
|
|
728
|
-
class="pf-
|
|
728
|
+
class="pf-v6-c-helper-text__item-text"
|
|
729
729
|
>Invalid login credentials.</span>
|
|
730
730
|
</div>
|
|
731
731
|
</div>
|
|
732
732
|
</div>
|
|
733
733
|
<div
|
|
734
|
-
class="pf-
|
|
734
|
+
class="pf-v6-c-form__helper-text pf-m-error pf-m-hidden"
|
|
735
735
|
aria-live="polite"
|
|
736
736
|
>
|
|
737
737
|
<i class="fas fa-exclamation-circle" aria-hidden="true"></i>
|
|
738
738
|
Invalid login credentials.
|
|
739
739
|
</div>
|
|
740
|
-
<div class="pf-
|
|
741
|
-
<span class="pf-
|
|
742
|
-
class="pf-
|
|
740
|
+
<div class="pf-v6-c-form__group"><label class="pf-v6-c-form__label" for="login-demo-form-username">
|
|
741
|
+
<span class="pf-v6-c-form__label-text">Username</span> <span
|
|
742
|
+
class="pf-v6-c-form__label-required"
|
|
743
743
|
aria-hidden="true"
|
|
744
744
|
>*</span></label>
|
|
745
745
|
|
|
746
|
-
<span class="pf-
|
|
746
|
+
<span class="pf-v6-c-form-control pf-m-required">
|
|
747
747
|
<input
|
|
748
748
|
required
|
|
749
749
|
type="text"
|
|
@@ -752,14 +752,14 @@ wrapperTag: div
|
|
|
752
752
|
/>
|
|
753
753
|
</span>
|
|
754
754
|
</div>
|
|
755
|
-
<div class="pf-
|
|
756
|
-
<span class="pf-
|
|
757
|
-
class="pf-
|
|
755
|
+
<div class="pf-v6-c-form__group"><label class="pf-v6-c-form__label" for="login-demo-form-password">
|
|
756
|
+
<span class="pf-v6-c-form__label-text">Password</span> <span
|
|
757
|
+
class="pf-v6-c-form__label-required"
|
|
758
758
|
aria-hidden="true"
|
|
759
759
|
>*</span></label>
|
|
760
760
|
|
|
761
|
-
<div class="pf-
|
|
762
|
-
<span class="pf-
|
|
761
|
+
<div class="pf-v6-c-input-group">
|
|
762
|
+
<span class="pf-v6-c-form-control pf-m-required">
|
|
763
763
|
<input
|
|
764
764
|
required
|
|
765
765
|
type="text"
|
|
@@ -770,7 +770,7 @@ wrapperTag: div
|
|
|
770
770
|
</span>
|
|
771
771
|
|
|
772
772
|
<button
|
|
773
|
-
class="pf-
|
|
773
|
+
class="pf-v6-c-button pf-m-control"
|
|
774
774
|
type="button"
|
|
775
775
|
aria-label="Hide password"
|
|
776
776
|
>
|
|
@@ -778,34 +778,34 @@ wrapperTag: div
|
|
|
778
778
|
</button>
|
|
779
779
|
</div>
|
|
780
780
|
</div>
|
|
781
|
-
<div class="pf-
|
|
782
|
-
<div class="pf-
|
|
781
|
+
<div class="pf-v6-c-form__group">
|
|
782
|
+
<div class="pf-v6-c-check">
|
|
783
783
|
<input
|
|
784
|
-
class="pf-
|
|
784
|
+
class="pf-v6-c-check__input"
|
|
785
785
|
type="checkbox"
|
|
786
786
|
id="login-demo-checkbox"
|
|
787
787
|
name="login-demo-checkbox"
|
|
788
788
|
/>
|
|
789
789
|
|
|
790
790
|
<label
|
|
791
|
-
class="pf-
|
|
791
|
+
class="pf-v6-c-check__label"
|
|
792
792
|
for="login-demo-checkbox"
|
|
793
793
|
>Keep me logged in for 30 days.</label>
|
|
794
794
|
</div>
|
|
795
795
|
</div>
|
|
796
|
-
<div class="pf-
|
|
796
|
+
<div class="pf-v6-c-form__group pf-m-action">
|
|
797
797
|
<button
|
|
798
|
-
class="pf-
|
|
798
|
+
class="pf-v6-c-button pf-m-primary pf-m-block"
|
|
799
799
|
type="submit"
|
|
800
800
|
>Log in</button>
|
|
801
801
|
</div>
|
|
802
802
|
</form>
|
|
803
803
|
</div>
|
|
804
|
-
<footer class="pf-
|
|
805
|
-
<ul class="pf-
|
|
806
|
-
<li class="pf-
|
|
804
|
+
<footer class="pf-v6-c-login__main-footer">
|
|
805
|
+
<ul class="pf-v6-c-login__main-footer-links" role="list">
|
|
806
|
+
<li class="pf-v6-c-login__main-footer-links-item">
|
|
807
807
|
<button
|
|
808
|
-
class="pf-
|
|
808
|
+
class="pf-v6-c-button pf-m-plain"
|
|
809
809
|
type="button"
|
|
810
810
|
aria-label="Log in with Google"
|
|
811
811
|
>
|
|
@@ -814,7 +814,7 @@ wrapperTag: div
|
|
|
814
814
|
xmlns="http://www.w3.org/2000/svg"
|
|
815
815
|
fill="currentColor"
|
|
816
816
|
viewBox="0 0 488 512"
|
|
817
|
-
class="pf-
|
|
817
|
+
class="pf-v6-svg"
|
|
818
818
|
>
|
|
819
819
|
<path
|
|
820
820
|
d="M488 261.8C488 403.3 391.1 504 248 504 110.8 504 0 393.2 0 256S110.8 8 248 8c66.8 0 123 24.5 166.3 64.9l-67.5 64.9C258.5 52.6 94.3 116.6 94.3 256c0 86.5 69.1 156.6 153.7 156.6 98.2 0 135-70.4 140.8-106.9H248v-85.3h236.1c2.3 12.7 3.9 24.9 3.9 41.4z"
|
|
@@ -822,9 +822,9 @@ wrapperTag: div
|
|
|
822
822
|
</svg>
|
|
823
823
|
</button>
|
|
824
824
|
</li>
|
|
825
|
-
<li class="pf-
|
|
825
|
+
<li class="pf-v6-c-login__main-footer-links-item">
|
|
826
826
|
<button
|
|
827
|
-
class="pf-
|
|
827
|
+
class="pf-v6-c-button pf-m-plain"
|
|
828
828
|
type="button"
|
|
829
829
|
aria-label="Log in with Github"
|
|
830
830
|
>
|
|
@@ -833,7 +833,7 @@ wrapperTag: div
|
|
|
833
833
|
xmlns="http://www.w3.org/2000/svg"
|
|
834
834
|
fill="currentColor"
|
|
835
835
|
viewBox="0 0 496 512"
|
|
836
|
-
class="pf-
|
|
836
|
+
class="pf-v6-svg"
|
|
837
837
|
>
|
|
838
838
|
<path
|
|
839
839
|
d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3.3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5.3-6.2 2.3zm44.2-1.7c-2.9.7-4.9 2.6-4.6 4.9.3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3.7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3.3 2.9 2.3 3.9 1.6 1 3.6.7 4.3-.7.7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3.7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3.7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z"
|
|
@@ -841,9 +841,9 @@ wrapperTag: div
|
|
|
841
841
|
</svg>
|
|
842
842
|
</button>
|
|
843
843
|
</li>
|
|
844
|
-
<li class="pf-
|
|
844
|
+
<li class="pf-v6-c-login__main-footer-links-item">
|
|
845
845
|
<button
|
|
846
|
-
class="pf-
|
|
846
|
+
class="pf-v6-c-button pf-m-plain"
|
|
847
847
|
type="button"
|
|
848
848
|
aria-label="Log in with Dropbox"
|
|
849
849
|
>
|
|
@@ -852,7 +852,7 @@ wrapperTag: div
|
|
|
852
852
|
xmlns="http://www.w3.org/2000/svg"
|
|
853
853
|
fill="currentColor"
|
|
854
854
|
viewBox="0 0 528 512"
|
|
855
|
-
class="pf-
|
|
855
|
+
class="pf-v6-svg"
|
|
856
856
|
>
|
|
857
857
|
<path
|
|
858
858
|
d="M264.4 116.3l-132 84.3 132 84.3-132 84.3L0 284.1l132.3-84.3L0 116.3 132.3 32l132.1 84.3zM131.6 395.7l132-84.3 132 84.3-132 84.3-132-84.3zm132.8-111.6l132-84.3-132-83.6L395.7 32 528 116.3l-132.3 84.3L528 284.8l-132.3 84.3-131.3-85z"
|
|
@@ -860,9 +860,9 @@ wrapperTag: div
|
|
|
860
860
|
</svg>
|
|
861
861
|
</button>
|
|
862
862
|
</li>
|
|
863
|
-
<li class="pf-
|
|
863
|
+
<li class="pf-v6-c-login__main-footer-links-item">
|
|
864
864
|
<button
|
|
865
|
-
class="pf-
|
|
865
|
+
class="pf-v6-c-button pf-m-plain"
|
|
866
866
|
type="button"
|
|
867
867
|
aria-label="Log in with Facebook"
|
|
868
868
|
>
|
|
@@ -871,7 +871,7 @@ wrapperTag: div
|
|
|
871
871
|
xmlns="http://www.w3.org/2000/svg"
|
|
872
872
|
fill="currentColor"
|
|
873
873
|
viewBox="0 0 448 512"
|
|
874
|
-
class="pf-
|
|
874
|
+
class="pf-v6-svg"
|
|
875
875
|
>
|
|
876
876
|
<path
|
|
877
877
|
d="M448 56.7v398.5c0 13.7-11.1 24.7-24.7 24.7H309.1V306.5h58.2l8.7-67.6h-67v-43.2c0-19.6 5.4-32.9 33.5-32.9h35.8v-60.5c-6.2-.8-27.4-2.7-52.2-2.7-51.6 0-87 31.5-87 89.4v49.9h-58.4v67.6h58.4V480H24.7C11.1 480 0 468.9 0 455.3V56.7C0 43.1 11.1 32 24.7 32h398.5c13.7 0 24.8 11.1 24.8 24.7z"
|
|
@@ -879,9 +879,9 @@ wrapperTag: div
|
|
|
879
879
|
</svg>
|
|
880
880
|
</button>
|
|
881
881
|
</li>
|
|
882
|
-
<li class="pf-
|
|
882
|
+
<li class="pf-v6-c-login__main-footer-links-item">
|
|
883
883
|
<button
|
|
884
|
-
class="pf-
|
|
884
|
+
class="pf-v6-c-button pf-m-plain"
|
|
885
885
|
type="button"
|
|
886
886
|
aria-label="Log in with Gitlab"
|
|
887
887
|
>
|
|
@@ -890,7 +890,7 @@ wrapperTag: div
|
|
|
890
890
|
xmlns="http://www.w3.org/2000/svg"
|
|
891
891
|
fill="currentColor"
|
|
892
892
|
viewBox="0 0 512 512"
|
|
893
|
-
class="pf-
|
|
893
|
+
class="pf-v6-svg"
|
|
894
894
|
>
|
|
895
895
|
<path
|
|
896
896
|
d="M29.782 199.732L256 493.714 8.074 309.699c-6.856-5.142-9.712-13.996-7.141-21.993l28.849-87.974zm75.405-174.806c-3.142-8.854-15.709-8.854-18.851 0L29.782 199.732h131.961L105.187 24.926zm56.556 174.806L256 493.714l94.257-293.982H161.743zm349.324 87.974l-28.849-87.974L256 493.714l247.926-184.015c6.855-5.142 9.711-13.996 7.141-21.993zm-85.404-262.78c-3.142-8.854-15.709-8.854-18.851 0l-56.555 174.806h131.961L425.663 24.926z"
|
|
@@ -899,20 +899,20 @@ wrapperTag: div
|
|
|
899
899
|
</button>
|
|
900
900
|
</li>
|
|
901
901
|
</ul>
|
|
902
|
-
<div class="pf-
|
|
903
|
-
<p class="pf-
|
|
902
|
+
<div class="pf-v6-c-login__main-footer-band">
|
|
903
|
+
<p class="pf-v6-c-login__main-footer-band-item">
|
|
904
904
|
Need an account?
|
|
905
905
|
<a href="https://www.patternfly.org/">Sign up.</a>
|
|
906
906
|
</p>
|
|
907
|
-
<p class="pf-
|
|
907
|
+
<p class="pf-v6-c-login__main-footer-band-item">
|
|
908
908
|
<a href="#">Forgot username or password?</a>
|
|
909
909
|
</p>
|
|
910
910
|
</div>
|
|
911
911
|
</footer>
|
|
912
912
|
</main>
|
|
913
|
-
<footer class="pf-
|
|
913
|
+
<footer class="pf-v6-c-login__footer">
|
|
914
914
|
<p>This is placeholder text only. Use this area to place any information or introductory message about your application that may be relevant to users.</p>
|
|
915
|
-
<ul class="pf-
|
|
915
|
+
<ul class="pf-v6-c-list pf-m-inline" role="list">
|
|
916
916
|
<li>
|
|
917
917
|
<a href="#">Terms of use</a>
|
|
918
918
|
</li>
|
|
@@ -933,93 +933,93 @@ wrapperTag: div
|
|
|
933
933
|
|
|
934
934
|
```html isFullscreen
|
|
935
935
|
<div
|
|
936
|
-
class="pf-
|
|
937
|
-
style="--pf-
|
|
936
|
+
class="pf-v6-c-background-image"
|
|
937
|
+
style="--pf-v6-c-background-image--BackgroundImage: url(/assets/images/pf-background.svg)"
|
|
938
938
|
></div>
|
|
939
|
-
<div class="pf-
|
|
940
|
-
<div class="pf-
|
|
941
|
-
<header class="pf-
|
|
939
|
+
<div class="pf-v6-c-login">
|
|
940
|
+
<div class="pf-v6-c-login__container">
|
|
941
|
+
<header class="pf-v6-c-login__header">
|
|
942
942
|
<img
|
|
943
|
-
class="pf-
|
|
943
|
+
class="pf-v6-c-brand"
|
|
944
944
|
src="/assets/images/pf_logo_color.svg"
|
|
945
945
|
alt="PatternFly Logo"
|
|
946
946
|
style="--pf-v5-c-brand--Height:48px;"
|
|
947
947
|
/>
|
|
948
948
|
</header>
|
|
949
|
-
<main class="pf-
|
|
950
|
-
<header class="pf-
|
|
951
|
-
<h1 class="pf-
|
|
949
|
+
<main class="pf-v6-c-login__main">
|
|
950
|
+
<header class="pf-v6-c-login__main-header">
|
|
951
|
+
<h1 class="pf-v6-c-title pf-m-3xl">Log in to your account</h1>
|
|
952
952
|
<p
|
|
953
|
-
class="pf-
|
|
953
|
+
class="pf-v6-c-login__main-header-desc"
|
|
954
954
|
>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
|
|
955
|
-
<div class="pf-
|
|
956
|
-
<div class="pf-
|
|
955
|
+
<div class="pf-v6-c-login__main-header-utilities">
|
|
956
|
+
<div class="pf-v6-c-select">
|
|
957
957
|
<span id="login-select-label" hidden>Choose one</span>
|
|
958
958
|
|
|
959
959
|
<button
|
|
960
|
-
class="pf-
|
|
960
|
+
class="pf-v6-c-select__toggle"
|
|
961
961
|
type="button"
|
|
962
962
|
id="login-select-toggle"
|
|
963
963
|
aria-haspopup="true"
|
|
964
964
|
aria-expanded="false"
|
|
965
965
|
aria-labelledby="login-select-label login-select-toggle"
|
|
966
966
|
>
|
|
967
|
-
<div class="pf-
|
|
968
|
-
<span class="pf-
|
|
967
|
+
<div class="pf-v6-c-select__toggle-wrapper">
|
|
968
|
+
<span class="pf-v6-c-select__toggle-text">English</span>
|
|
969
969
|
</div>
|
|
970
|
-
<span class="pf-
|
|
970
|
+
<span class="pf-v6-c-select__toggle-arrow">
|
|
971
971
|
<i class="fas fa-caret-down" aria-hidden="true"></i>
|
|
972
972
|
</span>
|
|
973
973
|
</button>
|
|
974
974
|
<ul
|
|
975
|
-
class="pf-
|
|
975
|
+
class="pf-v6-c-select__menu"
|
|
976
976
|
role="listbox"
|
|
977
977
|
aria-labelledby="login-select-label"
|
|
978
978
|
hidden
|
|
979
979
|
>
|
|
980
980
|
<li role="presentation">
|
|
981
981
|
<button
|
|
982
|
-
class="pf-
|
|
982
|
+
class="pf-v6-c-select__menu-item pf-m-selected"
|
|
983
983
|
role="option"
|
|
984
984
|
aria-selected="true"
|
|
985
985
|
>
|
|
986
986
|
English
|
|
987
|
-
<span class="pf-
|
|
987
|
+
<span class="pf-v6-c-select__menu-item-icon">
|
|
988
988
|
<i class="fas fa-check" aria-hidden="true"></i>
|
|
989
989
|
</span>
|
|
990
990
|
</button>
|
|
991
991
|
</li>
|
|
992
992
|
<li role="presentation">
|
|
993
|
-
<button class="pf-
|
|
993
|
+
<button class="pf-v6-c-select__menu-item" role="option">Español</button>
|
|
994
994
|
</li>
|
|
995
995
|
<li role="presentation">
|
|
996
|
-
<button class="pf-
|
|
996
|
+
<button class="pf-v6-c-select__menu-item" role="option">Français</button>
|
|
997
997
|
</li>
|
|
998
998
|
</ul>
|
|
999
999
|
</div>
|
|
1000
1000
|
</div>
|
|
1001
1001
|
</header>
|
|
1002
|
-
<div class="pf-
|
|
1003
|
-
<form class="pf-
|
|
1004
|
-
<div class="pf-
|
|
1005
|
-
<div class="pf-
|
|
1006
|
-
<div class="pf-
|
|
1007
|
-
<span class="pf-
|
|
1002
|
+
<div class="pf-v6-c-login__main-body">
|
|
1003
|
+
<form class="pf-v6-c-form" novalidate>
|
|
1004
|
+
<div class="pf-v6-c-form__helper-text" aria-live="polite">
|
|
1005
|
+
<div class="pf-v6-c-helper-text pf-m-hidden">
|
|
1006
|
+
<div class="pf-v6-c-helper-text__item pf-m-error" id="-helper">
|
|
1007
|
+
<span class="pf-v6-c-helper-text__item-icon">
|
|
1008
1008
|
<i class="fas fa-fw fa-exclamation-circle" aria-hidden="true"></i>
|
|
1009
1009
|
</span>
|
|
1010
1010
|
<span
|
|
1011
|
-
class="pf-
|
|
1011
|
+
class="pf-v6-c-helper-text__item-text"
|
|
1012
1012
|
>Invalid login credentials.</span>
|
|
1013
1013
|
</div>
|
|
1014
1014
|
</div>
|
|
1015
1015
|
</div>
|
|
1016
|
-
<div class="pf-
|
|
1017
|
-
<span class="pf-
|
|
1018
|
-
class="pf-
|
|
1016
|
+
<div class="pf-v6-c-form__group"><label class="pf-v6-c-form__label" for="login-demo-form-username">
|
|
1017
|
+
<span class="pf-v6-c-form__label-text">Username</span> <span
|
|
1018
|
+
class="pf-v6-c-form__label-required"
|
|
1019
1019
|
aria-hidden="true"
|
|
1020
1020
|
>*</span></label>
|
|
1021
1021
|
|
|
1022
|
-
<span class="pf-
|
|
1022
|
+
<span class="pf-v6-c-form-control pf-m-required">
|
|
1023
1023
|
<input
|
|
1024
1024
|
required
|
|
1025
1025
|
type="text"
|
|
@@ -1028,13 +1028,13 @@ wrapperTag: div
|
|
|
1028
1028
|
/>
|
|
1029
1029
|
</span>
|
|
1030
1030
|
</div>
|
|
1031
|
-
<div class="pf-
|
|
1032
|
-
<span class="pf-
|
|
1033
|
-
class="pf-
|
|
1031
|
+
<div class="pf-v6-c-form__group"><label class="pf-v6-c-form__label" for="login-demo-form-password">
|
|
1032
|
+
<span class="pf-v6-c-form__label-text">Password</span> <span
|
|
1033
|
+
class="pf-v6-c-form__label-required"
|
|
1034
1034
|
aria-hidden="true"
|
|
1035
1035
|
>*</span></label>
|
|
1036
1036
|
|
|
1037
|
-
<span class="pf-
|
|
1037
|
+
<span class="pf-v6-c-form-control pf-m-required">
|
|
1038
1038
|
<input
|
|
1039
1039
|
required
|
|
1040
1040
|
type="password"
|
|
@@ -1043,34 +1043,34 @@ wrapperTag: div
|
|
|
1043
1043
|
/>
|
|
1044
1044
|
</span>
|
|
1045
1045
|
</div>
|
|
1046
|
-
<div class="pf-
|
|
1047
|
-
<div class="pf-
|
|
1046
|
+
<div class="pf-v6-c-form__group">
|
|
1047
|
+
<div class="pf-v6-c-check">
|
|
1048
1048
|
<input
|
|
1049
|
-
class="pf-
|
|
1049
|
+
class="pf-v6-c-check__input"
|
|
1050
1050
|
type="checkbox"
|
|
1051
1051
|
id="login-demo-checkbox"
|
|
1052
1052
|
name="login-demo-checkbox"
|
|
1053
1053
|
/>
|
|
1054
1054
|
|
|
1055
1055
|
<label
|
|
1056
|
-
class="pf-
|
|
1056
|
+
class="pf-v6-c-check__label"
|
|
1057
1057
|
for="login-demo-checkbox"
|
|
1058
1058
|
>Keep me logged in for 30 days.</label>
|
|
1059
1059
|
</div>
|
|
1060
1060
|
</div>
|
|
1061
|
-
<div class="pf-
|
|
1061
|
+
<div class="pf-v6-c-form__group pf-m-action">
|
|
1062
1062
|
<button
|
|
1063
|
-
class="pf-
|
|
1063
|
+
class="pf-v6-c-button pf-m-primary pf-m-block"
|
|
1064
1064
|
type="submit"
|
|
1065
1065
|
>Log in</button>
|
|
1066
1066
|
</div>
|
|
1067
1067
|
</form>
|
|
1068
1068
|
</div>
|
|
1069
|
-
<footer class="pf-
|
|
1070
|
-
<ul class="pf-
|
|
1071
|
-
<li class="pf-
|
|
1069
|
+
<footer class="pf-v6-c-login__main-footer">
|
|
1070
|
+
<ul class="pf-v6-c-login__main-footer-links" role="list">
|
|
1071
|
+
<li class="pf-v6-c-login__main-footer-links-item">
|
|
1072
1072
|
<button
|
|
1073
|
-
class="pf-
|
|
1073
|
+
class="pf-v6-c-button pf-m-plain"
|
|
1074
1074
|
type="button"
|
|
1075
1075
|
aria-label="Log in with Google"
|
|
1076
1076
|
>
|
|
@@ -1079,7 +1079,7 @@ wrapperTag: div
|
|
|
1079
1079
|
xmlns="http://www.w3.org/2000/svg"
|
|
1080
1080
|
fill="currentColor"
|
|
1081
1081
|
viewBox="0 0 488 512"
|
|
1082
|
-
class="pf-
|
|
1082
|
+
class="pf-v6-svg"
|
|
1083
1083
|
>
|
|
1084
1084
|
<path
|
|
1085
1085
|
d="M488 261.8C488 403.3 391.1 504 248 504 110.8 504 0 393.2 0 256S110.8 8 248 8c66.8 0 123 24.5 166.3 64.9l-67.5 64.9C258.5 52.6 94.3 116.6 94.3 256c0 86.5 69.1 156.6 153.7 156.6 98.2 0 135-70.4 140.8-106.9H248v-85.3h236.1c2.3 12.7 3.9 24.9 3.9 41.4z"
|
|
@@ -1087,9 +1087,9 @@ wrapperTag: div
|
|
|
1087
1087
|
</svg>
|
|
1088
1088
|
</button>
|
|
1089
1089
|
</li>
|
|
1090
|
-
<li class="pf-
|
|
1090
|
+
<li class="pf-v6-c-login__main-footer-links-item">
|
|
1091
1091
|
<button
|
|
1092
|
-
class="pf-
|
|
1092
|
+
class="pf-v6-c-button pf-m-plain"
|
|
1093
1093
|
type="button"
|
|
1094
1094
|
aria-label="Log in with Github"
|
|
1095
1095
|
>
|
|
@@ -1098,7 +1098,7 @@ wrapperTag: div
|
|
|
1098
1098
|
xmlns="http://www.w3.org/2000/svg"
|
|
1099
1099
|
fill="currentColor"
|
|
1100
1100
|
viewBox="0 0 496 512"
|
|
1101
|
-
class="pf-
|
|
1101
|
+
class="pf-v6-svg"
|
|
1102
1102
|
>
|
|
1103
1103
|
<path
|
|
1104
1104
|
d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3.3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5.3-6.2 2.3zm44.2-1.7c-2.9.7-4.9 2.6-4.6 4.9.3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3.7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3.3 2.9 2.3 3.9 1.6 1 3.6.7 4.3-.7.7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3.7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3.7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z"
|
|
@@ -1106,9 +1106,9 @@ wrapperTag: div
|
|
|
1106
1106
|
</svg>
|
|
1107
1107
|
</button>
|
|
1108
1108
|
</li>
|
|
1109
|
-
<li class="pf-
|
|
1109
|
+
<li class="pf-v6-c-login__main-footer-links-item">
|
|
1110
1110
|
<button
|
|
1111
|
-
class="pf-
|
|
1111
|
+
class="pf-v6-c-button pf-m-plain"
|
|
1112
1112
|
type="button"
|
|
1113
1113
|
aria-label="Log in with Dropbox"
|
|
1114
1114
|
>
|
|
@@ -1117,7 +1117,7 @@ wrapperTag: div
|
|
|
1117
1117
|
xmlns="http://www.w3.org/2000/svg"
|
|
1118
1118
|
fill="currentColor"
|
|
1119
1119
|
viewBox="0 0 528 512"
|
|
1120
|
-
class="pf-
|
|
1120
|
+
class="pf-v6-svg"
|
|
1121
1121
|
>
|
|
1122
1122
|
<path
|
|
1123
1123
|
d="M264.4 116.3l-132 84.3 132 84.3-132 84.3L0 284.1l132.3-84.3L0 116.3 132.3 32l132.1 84.3zM131.6 395.7l132-84.3 132 84.3-132 84.3-132-84.3zm132.8-111.6l132-84.3-132-83.6L395.7 32 528 116.3l-132.3 84.3L528 284.8l-132.3 84.3-131.3-85z"
|
|
@@ -1125,9 +1125,9 @@ wrapperTag: div
|
|
|
1125
1125
|
</svg>
|
|
1126
1126
|
</button>
|
|
1127
1127
|
</li>
|
|
1128
|
-
<li class="pf-
|
|
1128
|
+
<li class="pf-v6-c-login__main-footer-links-item">
|
|
1129
1129
|
<button
|
|
1130
|
-
class="pf-
|
|
1130
|
+
class="pf-v6-c-button pf-m-plain"
|
|
1131
1131
|
type="button"
|
|
1132
1132
|
aria-label="Log in with Facebook"
|
|
1133
1133
|
>
|
|
@@ -1136,7 +1136,7 @@ wrapperTag: div
|
|
|
1136
1136
|
xmlns="http://www.w3.org/2000/svg"
|
|
1137
1137
|
fill="currentColor"
|
|
1138
1138
|
viewBox="0 0 448 512"
|
|
1139
|
-
class="pf-
|
|
1139
|
+
class="pf-v6-svg"
|
|
1140
1140
|
>
|
|
1141
1141
|
<path
|
|
1142
1142
|
d="M448 56.7v398.5c0 13.7-11.1 24.7-24.7 24.7H309.1V306.5h58.2l8.7-67.6h-67v-43.2c0-19.6 5.4-32.9 33.5-32.9h35.8v-60.5c-6.2-.8-27.4-2.7-52.2-2.7-51.6 0-87 31.5-87 89.4v49.9h-58.4v67.6h58.4V480H24.7C11.1 480 0 468.9 0 455.3V56.7C0 43.1 11.1 32 24.7 32h398.5c13.7 0 24.8 11.1 24.8 24.7z"
|
|
@@ -1144,9 +1144,9 @@ wrapperTag: div
|
|
|
1144
1144
|
</svg>
|
|
1145
1145
|
</button>
|
|
1146
1146
|
</li>
|
|
1147
|
-
<li class="pf-
|
|
1147
|
+
<li class="pf-v6-c-login__main-footer-links-item">
|
|
1148
1148
|
<button
|
|
1149
|
-
class="pf-
|
|
1149
|
+
class="pf-v6-c-button pf-m-plain"
|
|
1150
1150
|
type="button"
|
|
1151
1151
|
aria-label="Log in with Gitlab"
|
|
1152
1152
|
>
|
|
@@ -1155,7 +1155,7 @@ wrapperTag: div
|
|
|
1155
1155
|
xmlns="http://www.w3.org/2000/svg"
|
|
1156
1156
|
fill="currentColor"
|
|
1157
1157
|
viewBox="0 0 512 512"
|
|
1158
|
-
class="pf-
|
|
1158
|
+
class="pf-v6-svg"
|
|
1159
1159
|
>
|
|
1160
1160
|
<path
|
|
1161
1161
|
d="M29.782 199.732L256 493.714 8.074 309.699c-6.856-5.142-9.712-13.996-7.141-21.993l28.849-87.974zm75.405-174.806c-3.142-8.854-15.709-8.854-18.851 0L29.782 199.732h131.961L105.187 24.926zm56.556 174.806L256 493.714l94.257-293.982H161.743zm349.324 87.974l-28.849-87.974L256 493.714l247.926-184.015c6.855-5.142 9.711-13.996 7.141-21.993zm-85.404-262.78c-3.142-8.854-15.709-8.854-18.851 0l-56.555 174.806h131.961L425.663 24.926z"
|
|
@@ -1164,20 +1164,20 @@ wrapperTag: div
|
|
|
1164
1164
|
</button>
|
|
1165
1165
|
</li>
|
|
1166
1166
|
</ul>
|
|
1167
|
-
<div class="pf-
|
|
1168
|
-
<p class="pf-
|
|
1167
|
+
<div class="pf-v6-c-login__main-footer-band">
|
|
1168
|
+
<p class="pf-v6-c-login__main-footer-band-item">
|
|
1169
1169
|
Need an account?
|
|
1170
1170
|
<a href="https://www.patternfly.org/">Sign up.</a>
|
|
1171
1171
|
</p>
|
|
1172
|
-
<p class="pf-
|
|
1172
|
+
<p class="pf-v6-c-login__main-footer-band-item">
|
|
1173
1173
|
<a href="#">Forgot username or password?</a>
|
|
1174
1174
|
</p>
|
|
1175
1175
|
</div>
|
|
1176
1176
|
</footer>
|
|
1177
1177
|
</main>
|
|
1178
|
-
<footer class="pf-
|
|
1178
|
+
<footer class="pf-v6-c-login__footer">
|
|
1179
1179
|
<p>This is placeholder text only. Use this area to place any information or introductory message about your application that may be relevant to users.</p>
|
|
1180
|
-
<ul class="pf-
|
|
1180
|
+
<ul class="pf-v6-c-list pf-m-inline" role="list">
|
|
1181
1181
|
<li>
|
|
1182
1182
|
<a href="#">Terms of use</a>
|
|
1183
1183
|
</li>
|