From 2e40e13271e878ef35e631172c7f66a26e0f099f Mon Sep 17 00:00:00 2001 From: Sebastian Stehle Date: Thu, 16 May 2019 20:25:31 +0200 Subject: [PATCH] Design improvements and custom component. --- .../pages/users/user-page.component.html | 8 +-- .../pages/users/user-page.component.scss | 4 ++ .../pages/content/content-page.component.html | 4 +- .../shared/content-item-editor.component.ts | 60 +++++++++--------- .../shared/field-editor.component.html | 4 +- .../actions/generic-action.component.html | 22 +++---- .../pages/rules/rule-wizard.component.scss | 2 +- .../triggers/usage-trigger.component.html | 8 +-- .../pages/schema/field-wizard.component.html | 8 ++- .../forms/field-form-common.component.html | 16 ++--- .../schema/forms/field-form-ui.component.html | 40 ++++++------ .../field-form-validation.component.html | 40 ++++++------ .../pages/schema/schema-page.component.html | 8 ++- .../schema-preview-urls-form.component.html | 8 ++- .../schema-preview-urls-form.component.scss | 10 +-- .../schema/schema-scripts-form.component.html | 4 +- .../schema/types/boolean-ui.component.html | 8 +-- .../schema/types/date-time-ui.component.html | 8 +-- .../types/geolocation-ui.component.html | 4 +- .../pages/schema/types/json-ui.component.html | 4 +- .../schema/types/number-ui.component.html | 8 +-- .../schema/types/string-ui.component.html | 8 +-- .../pages/schema/types/tags-ui.component.html | 8 +-- .../pages/schemas/schema-form.component.html | 18 ++++-- .../pages/languages/language.component.html | 8 +-- .../forms/control-errors.component.html | 4 +- .../angular/forms/form-alert.component.ts | 21 ++++++ .../angular/forms/form-error.component.html | 3 - .../angular/forms/form-error.component.scss | 2 - .../angular/forms/form-error.component.ts | 6 +- .../angular/forms/form-hint.component.ts | 18 ++++++ .../modals/modal-dialog.component.html | 4 +- src/Squidex/app/framework/declarations.ts | 2 + src/Squidex/app/framework/module.ts | 6 ++ .../shared/components/app-form.component.html | 16 +++-- src/Squidex/app/theme/_bootstrap-vars.scss | 19 +++++- src/Squidex/app/theme/_bootstrap.scss | 34 +++++----- src/Squidex/app/theme/_common.scss | 2 +- src/Squidex/app/theme/_forms.scss | 10 +++ src/Squidex/app/theme/_vars.scss | 5 +- src/Squidex/app/theme/icomoon/demo.html | 20 +++++- .../app/theme/icomoon/fonts/icomoon.eot | Bin 29216 -> 29424 bytes .../app/theme/icomoon/fonts/icomoon.svg | 1 + .../app/theme/icomoon/fonts/icomoon.ttf | Bin 29052 -> 29260 bytes .../app/theme/icomoon/fonts/icomoon.woff | Bin 29128 -> 29336 bytes src/Squidex/app/theme/icomoon/selection.json | 2 +- src/Squidex/app/theme/icomoon/style.css | 13 ++-- src/Squidex/wwwroot/_theme.html | 16 ++--- 48 files changed, 315 insertions(+), 209 deletions(-) create mode 100644 src/Squidex/app/framework/angular/forms/form-alert.component.ts delete mode 100644 src/Squidex/app/framework/angular/forms/form-error.component.html delete mode 100644 src/Squidex/app/framework/angular/forms/form-error.component.scss create mode 100644 src/Squidex/app/framework/angular/forms/form-hint.component.ts diff --git a/src/Squidex/app/features/administration/pages/users/user-page.component.html b/src/Squidex/app/features/administration/pages/users/user-page.component.html index 3f8918635..b9d1bdb51 100644 --- a/src/Squidex/app/features/administration/pages/users/user-page.component.html +++ b/src/Squidex/app/features/administration/pages/users/user-page.component.html @@ -36,14 +36,14 @@
- +
- + @@ -68,9 +68,7 @@
-
- -
+
diff --git a/src/Squidex/app/features/administration/pages/users/user-page.component.scss b/src/Squidex/app/features/administration/pages/users/user-page.component.scss index fa9e8fa87..5742bc927 100644 --- a/src/Squidex/app/features/administration/pages/users/user-page.component.scss +++ b/src/Squidex/app/features/administration/pages/users/user-page.component.scss @@ -5,6 +5,10 @@ margin-top: 2rem; } +.form-group-permissions { + margin-top: 2rem; +} + textarea { height: 200px; font-size: .9rem; diff --git a/src/Squidex/app/features/content/pages/content/content-page.component.html b/src/Squidex/app/features/content/pages/content/content-page.component.html index 48bfeb3d3..6192aac18 100644 --- a/src/Squidex/app/features/content/pages/content/content-page.component.html +++ b/src/Squidex/app/features/content/pages/content/content-page.component.html @@ -111,7 +111,7 @@ Viewing version {{version.value}}.
-
+ -
+ diff --git a/src/Squidex/app/features/content/shared/content-item-editor.component.ts b/src/Squidex/app/features/content/shared/content-item-editor.component.ts index 8e8a95e93..cdfca6e8c 100644 --- a/src/Squidex/app/features/content/shared/content-item-editor.component.ts +++ b/src/Squidex/app/features/content/shared/content-item-editor.component.ts @@ -14,49 +14,49 @@ import { FieldDto } from '@app/shared'; selector: 'sqx-content-item-editor', template: `
-
-
-
-
+ + + + -
-
+ + -
-
-
-
-
-
+ + + + + + -
-
+ + -
-
+ + -
-
-
-
-
-
+ + + + + + -
-
-
+ + + -
-
-
-
-
+ + + + +
`, changeDetection: ChangeDetectionStrategy.OnPush }) diff --git a/src/Squidex/app/features/content/shared/field-editor.component.html b/src/Squidex/app/features/content/shared/field-editor.component.html index 791e317d1..21e87f6f7 100644 --- a/src/Squidex/app/features/content/shared/field-editor.component.html +++ b/src/Squidex/app/features/content/shared/field-editor.component.html @@ -149,8 +149,8 @@
- + {{hints}} - + diff --git a/src/Squidex/app/features/rules/pages/rules/actions/generic-action.component.html b/src/Squidex/app/features/rules/pages/rules/actions/generic-action.component.html index 3ab92a516..c946e9e66 100644 --- a/src/Squidex/app/features/rules/pages/rules/actions/generic-action.component.html +++ b/src/Squidex/app/features/rules/pages/rules/actions/generic-action.component.html @@ -1,36 +1,36 @@
-
-
+ + -
-
+ +
-
-
+ + -
-
+ + - + {{property.description}} You can use advanced formatting: Documentation - +
\ No newline at end of file diff --git a/src/Squidex/app/features/rules/pages/rules/rule-wizard.component.scss b/src/Squidex/app/features/rules/pages/rules/rule-wizard.component.scss index 95a12388f..aa4ab7f00 100644 --- a/src/Squidex/app/features/rules/pages/rules/rule-wizard.component.scss +++ b/src/Squidex/app/features/rules/pages/rules/rule-wizard.component.scss @@ -7,7 +7,7 @@ .wizard-title { background: $color-border; - margin: -1rem; + margin: -1.5rem -1.75rem; margin-bottom: 1rem; font-weight: 400; font-size: 1.05rem; diff --git a/src/Squidex/app/features/rules/pages/rules/triggers/usage-trigger.component.html b/src/Squidex/app/features/rules/pages/rules/triggers/usage-trigger.component.html index 9cac20082..5a0575e7d 100644 --- a/src/Squidex/app/features/rules/pages/rules/triggers/usage-trigger.component.html +++ b/src/Squidex/app/features/rules/pages/rules/triggers/usage-trigger.component.html @@ -6,9 +6,9 @@ - + The monthly api calls to trigger. - +
@@ -18,8 +18,8 @@ - + The number of days to check or empty to check the current month. - +
\ No newline at end of file diff --git a/src/Squidex/app/features/schemas/pages/schema/field-wizard.component.html b/src/Squidex/app/features/schemas/pages/schema/field-wizard.component.html index 4294362ba..00dfdec04 100644 --- a/src/Squidex/app/features/schemas/pages/schema/field-wizard.component.html +++ b/src/Squidex/app/features/schemas/pages/schema/field-wizard.component.html @@ -52,10 +52,14 @@ - + You can the field as localizable. It means that is dependent on the language, for example a city name. - + + + + These values cannot be changed later. + diff --git a/src/Squidex/app/features/schemas/pages/schema/forms/field-form-common.component.html b/src/Squidex/app/features/schemas/pages/schema/forms/field-form-common.component.html index 9fc28e240..b5b2b3aee 100644 --- a/src/Squidex/app/features/schemas/pages/schema/forms/field-form-common.component.html +++ b/src/Squidex/app/features/schemas/pages/schema/forms/field-form-common.component.html @@ -5,9 +5,9 @@
- + The name of the field in the API response. - +
@@ -19,9 +19,9 @@ - + Define the display name for the field for documentation and user interfaces. - + @@ -33,9 +33,9 @@ - + Define some hints for the user and editor for the field for documentation and user interfaces. - + @@ -48,9 +48,9 @@ - + List fields are shown as a column in the content list.
When no list field is defined, the first field is used. - + \ No newline at end of file diff --git a/src/Squidex/app/features/schemas/pages/schema/forms/field-form-ui.component.html b/src/Squidex/app/features/schemas/pages/schema/forms/field-form-ui.component.html index 51058215f..469ffb141 100644 --- a/src/Squidex/app/features/schemas/pages/schema/forms/field-form-ui.component.html +++ b/src/Squidex/app/features/schemas/pages/schema/forms/field-form-ui.component.html @@ -1,29 +1,29 @@ -
-
+ + -
-
+ + -
-
+ + -
-
+ + -
-
+ + -
-
+ + -
-
+ + -
-
+ + -
-
+ + -
-
\ No newline at end of file + + \ No newline at end of file diff --git a/src/Squidex/app/features/schemas/pages/schema/forms/field-form-validation.component.html b/src/Squidex/app/features/schemas/pages/schema/forms/field-form-validation.component.html index 5678d98e3..1cd5d2a74 100644 --- a/src/Squidex/app/features/schemas/pages/schema/forms/field-form-validation.component.html +++ b/src/Squidex/app/features/schemas/pages/schema/forms/field-form-validation.component.html @@ -1,29 +1,29 @@ -
-
+ + -
-
+ + -
-
+ + -
-
+ + -
-
+ + -
-
+ + -
-
+ + -
-
+ + -
-
+ + -
-
\ No newline at end of file + + \ No newline at end of file diff --git a/src/Squidex/app/features/schemas/pages/schema/schema-page.component.html b/src/Squidex/app/features/schemas/pages/schema/schema-page.component.html index 69ccaa9fc..7bb111314 100644 --- a/src/Squidex/app/features/schemas/pages/schema/schema-page.component.html +++ b/src/Squidex/app/features/schemas/pages/schema/schema-page.component.html @@ -70,9 +70,11 @@
-
- -
+ +
diff --git a/src/Squidex/app/framework/declarations.ts b/src/Squidex/app/framework/declarations.ts index d439504f6..7111dde33 100644 --- a/src/Squidex/app/framework/declarations.ts +++ b/src/Squidex/app/framework/declarations.ts @@ -15,7 +15,9 @@ export * from './angular/forms/copy.directive'; export * from './angular/forms/date-time-editor.component'; export * from './angular/forms/file-drop.directive'; export * from './angular/forms/focus-on-init.directive'; +export * from './angular/forms/form-alert.component'; export * from './angular/forms/form-error.component'; +export * from './angular/forms/form-hint.component'; export * from './angular/forms/forms-helper'; export * from './angular/forms/iframe-editor.component'; export * from './angular/forms/indeterminate-value.directive'; diff --git a/src/Squidex/app/framework/module.ts b/src/Squidex/app/framework/module.ts index 4b122488b..5921bf736 100644 --- a/src/Squidex/app/framework/module.ts +++ b/src/Squidex/app/framework/module.ts @@ -37,7 +37,9 @@ import { FileDropDirective, FileSizePipe, FocusOnInitDirective, + FormAlertComponent, FormErrorComponent, + FormHintComponent, FromNowPipe, FullDateTimePipe, HoverBackgroundDirective, @@ -115,7 +117,9 @@ import { FileDropDirective, FileSizePipe, FocusOnInitDirective, + FormAlertComponent, FormErrorComponent, + FormHintComponent, FromNowPipe, FullDateTimePipe, HoverBackgroundDirective, @@ -178,7 +182,9 @@ import { FileDropDirective, FileSizePipe, FocusOnInitDirective, + FormAlertComponent, FormErrorComponent, + FormHintComponent, FormsModule, FromNowPipe, FullDateTimePipe, diff --git a/src/Squidex/app/shared/components/app-form.component.html b/src/Squidex/app/shared/components/app-form.component.html index 5412343e4..0bce4ddb9 100644 --- a/src/Squidex/app/shared/components/app-form.component.html +++ b/src/Squidex/app/shared/components/app-form.component.html @@ -14,21 +14,25 @@
- + - - You can only use letters, numbers and dashes and not more than 40 characters. The name cannot be changed later. - + + You can only use letters, numbers and dashes and not more than 40 characters. + - + The app name becomes part of the api url: - + {{apiUrl.buildUrl("api/content/")}}{{createForm.appName | async}} + + + The app name cannot be changed later. +
diff --git a/src/Squidex/app/theme/_bootstrap-vars.scss b/src/Squidex/app/theme/_bootstrap-vars.scss index 995d0de87..0a3c63d0b 100644 --- a/src/Squidex/app/theme/_bootstrap-vars.scss +++ b/src/Squidex/app/theme/_bootstrap-vars.scss @@ -10,8 +10,12 @@ $h4-font-size: $font-size-base * 1.1; $h5-font-size: $font-size-base; $h6-font-size: $font-size-base; +$small-font-size: 90%; + $body-bg: $color-background; +$border-color: $color-border; + $danger: $color-theme-error; $primary: $color-theme-blue; $secondary: $color-theme-secondary; @@ -20,6 +24,7 @@ $warning: $color-theme-orange; $alert-bg-level: 0; $alert-color-level: -12.5; +$alert-margin-bottom: 0; $input-bg-disabled: $color-input-disabled; $input-border-color: $color-input; @@ -32,4 +37,16 @@ $dropdown-border-color: $color-border; $card-border-color: $color-border; $card-cap-bg: $panel-light-background; -$paragraph-margin-bottom: .5rem; \ No newline at end of file +$paragraph-margin-bottom: .5rem; + +$modal-backdrop-opacity: .35; +$modal-footer-border-width: 1px; +$modal-header-border-width: 0; +$modal-header-padding: 1.25rem 1.75rem; +$modal-inner-padding: 1.5rem 1.75rem; +$modal-md: 560px; +$modal-title-line-height: 1.8rem; + +$close-font-weight: normal; +$close-font-size: 1rem; +$close-text-shadow: none; \ No newline at end of file diff --git a/src/Squidex/app/theme/_bootstrap.scss b/src/Squidex/app/theme/_bootstrap.scss index 5f956012c..4bc1e37a7 100644 --- a/src/Squidex/app/theme/_bootstrap.scss +++ b/src/Squidex/app/theme/_bootstrap.scss @@ -77,8 +77,22 @@ } .alert-info { - background: $color-theme-blue; - border: 0; + @include border-radius(0); + background: lighten($color-theme-blue, 35%); + border: 1px solid $color-border; + font-size: 90%; + color: $color-text; + + .alert-link { + color: $color-text !important; + } + + i { + color: $color-theme-blue; + font-size: 1.2rem; + font-weight: normal; + vertical-align: text-bottom; + } } a { @@ -435,15 +449,6 @@ a { // Restyle modal dialogs. // .modal { - &-content, - &-header { - border: 0; - } - - &-backdrop { - @include opacity(.5); - } - &-header, &-footer { @include flex-shrink(0); @@ -457,8 +462,7 @@ a { & { @include border-radius-top(.25rem); background: $color-modal-header-background; - font-size: 1rem; - font-weight: normal; + border: 0; color: $color-modal-header-foreground; } @@ -469,11 +473,7 @@ a { .close { & { - @include opacity(1); - @include text-shadow-none; color: $color-modal-header-foreground; - font-size: 1.6rem; - font-weight: 400; } &:hover { diff --git a/src/Squidex/app/theme/_common.scss b/src/Squidex/app/theme/_common.scss index cbdc52551..048eaf90c 100644 --- a/src/Squidex/app/theme/_common.scss +++ b/src/Squidex/app/theme/_common.scss @@ -52,7 +52,7 @@ body { // .help { & { - font-size: .9rem; + font-size: 90%; } h2, diff --git a/src/Squidex/app/theme/_forms.scss b/src/Squidex/app/theme/_forms.scss index ba6d680c4..f25da337c 100644 --- a/src/Squidex/app/theme/_forms.scss +++ b/src/Squidex/app/theme/_forms.scss @@ -140,6 +140,16 @@ } } +label { + & { + color: black; + } + + .hint { + color: $color-text-decent2; + } +} + // // Custom search form. // diff --git a/src/Squidex/app/theme/_vars.scss b/src/Squidex/app/theme/_vars.scss index 9cfb5a09a..23e627331 100644 --- a/src/Squidex/app/theme/_vars.scss +++ b/src/Squidex/app/theme/_vars.scss @@ -5,7 +5,8 @@ $color-border-dark: #b3bbbf; $color-title: #000; $color-text: #373a3c; -$color-text-decent: #a9b2bb; +$color-text-decent: #8091a5; +$color-text-decent2: #a9b9c0; $color-tooltip: #1a2129; $color-history: #7f858c; @@ -88,7 +89,7 @@ $color-table-border: $color-border; $color-table-header: $color-text-decent; $color-modal-header-background: #2e3842; -$color-modal-header-foreground: #6a7681; +$color-modal-header-foreground: #9eafbc; $color-dark-black: #000; $color-dark-foreground: #fff; diff --git a/src/Squidex/app/theme/icomoon/demo.html b/src/Squidex/app/theme/icomoon/demo.html index 316c3a7d3..0ddc6603d 100644 --- a/src/Squidex/app/theme/icomoon/demo.html +++ b/src/Squidex/app/theme/icomoon/demo.html @@ -9,10 +9,26 @@
-

Font Name: icomoon (Glyphs: 119)

+

Font Name: icomoon (Glyphs: 120)

Grid Size: 24

+
+
+ + + + icon-info-outline +
+
+ + +
+
+ liga: + +
+
@@ -2120,7 +2136,7 @@ -
  +
 
diff --git a/src/Squidex/app/theme/icomoon/fonts/icomoon.eot b/src/Squidex/app/theme/icomoon/fonts/icomoon.eot index 23c4229213fdca031886c95366998184d7f25d5b..8a48ede5a2c88fc4759d674550418ee5b08ad359 100644 GIT binary patch delta 469 zcmZ4Rgz>{uMz#+{3=BR+6WPpIxYzX>O>`(1JjlSnum^|}l5-OaZu{RhnRr5`{>0CF zk_-%t6Brn>*JPw7rii6HI?uq6YXekgmH`ytWMZua@=Jhxm5khyiVOa-Ux54>Ks_IF z@{wbol>e2RSW&<*nK6oip`ZoGSIA4uO`Yk*`5VYz0#x5tkY8NFzzmdO zDAEDRGcYqVo|~M)*v(in`2(Xe>w19#{!N=Dn6{?ZvoM4)Ffy-V4h5>0XRv0l2kJL9 z7G*Xvw_`LnGc{4yV^mjDR$}L4WM>l<5tm~W7ZWxDQ=%eZL1iVd5>pef24O*CLB?w# zT5k4svC=>gYiH+<%#QH$D^^leR4VrKjRdhhpd9@WChf4We_Bu-cJ>h6_I7UWb|90O z8I%-DeElLKef>%lfuIDe-?v0j>2Cug!+!>b&1W)0m}QK5*Kx=5+k9oV+NC}5bx7{$PlzXixw$V<#ko$1B-8_2%`RNq#RUtGe#43uFg zi~-3rFf%irot(nh%~(A71EVtQI)QxtjhiKywx(~Mnib3}lf=8$KAzv^D+4zRNE5@2 pmluA)=*cX3=8V;wZSo#7PF61X!(C*mXIjL-2$ZhgtXFu55dd`)QcVB= diff --git a/src/Squidex/app/theme/icomoon/fonts/icomoon.svg b/src/Squidex/app/theme/icomoon/fonts/icomoon.svg index ac7ef81fc..dbff92e59 100644 --- a/src/Squidex/app/theme/icomoon/fonts/icomoon.svg +++ b/src/Squidex/app/theme/icomoon/fonts/icomoon.svg @@ -123,6 +123,7 @@ + diff --git a/src/Squidex/app/theme/icomoon/fonts/icomoon.ttf b/src/Squidex/app/theme/icomoon/fonts/icomoon.ttf index 41e95e3a6b665e4908705a7eb3fcd49637840468..34c62bdf6ba43700d37c437b8492ade521698cb3 100644 GIT binary patch delta 462 zcmezKi1Ex5#(D-u1_lOhh6V;^1_S?KeItG$-h)7qJwTk0oSRs1+yAx+0|TQBke`#D zSX=<41%UhxAkC4UQ<-++=RHXve*yzT_L_{;#1yfVN9P$Ba&3U}W*I;MPA1k`Aio62 zSINjNskq=T`vu6K0o3y$CqLOS@x+5QehduxAOnBpCRP+MOlFK?U?^w-@)hzDb5mz} zasCGKmjE@i733F}038YhMLHmP24?1S6AyGVmQ40xRAyZ-P{6-wa|z?tbO{!QFa}2E zRm`D4)$$D14E8|XrpBVolRs#SaEOYC%Q1?J2~VESDqSxuXe`KhEkw)B-Y!-e2x9H* z+>zN4etyMDii%3be!h`NZ2b@>?Xa+aT2Kvk_7KhXc5d!=AcL40loU&R{URcL{Yn&p zpaiVlw?t9tZv!L4f1u-;7#RK^VA-sn>B}r*)Vq#5p5Nvx12+rEa|}0`{ncUgIc~|}+MgZdXc~}4d delta 286 zcmX@}gz?WK#(D-u1_lOhh6V;^1_S?KeItG$-UC39JwTk0oSRs1+wZm^0|TQBke`#D zSX=<41%UhxAkC4UQ<;|a=AJWq$mxVv3mIvr?ea5}>?U22g;LiM0mEUjyW; zWaO4qobi{P2jpJ>>UoospX``8IcW{h&^(ZZKXMZ*3K%9aMlmqtZvpZZ@)C1XXL@n| z2J)`}HMAAv7ncAX3Iv5QAbAF6=CczIbTbxD_F+_JT_=#wzj1R35*PO9>^NifbjFap0|8N(X>X{aS!=id~SHU4h0J@e` AkpKVy diff --git a/src/Squidex/app/theme/icomoon/fonts/icomoon.woff b/src/Squidex/app/theme/icomoon/fonts/icomoon.woff index ec1235808ca818e45ee6a7a4ade6719075ac5f6a..05137a44667901d5b20f4e626aa07aaeae96107f 100644 GIT binary patch delta 533 zcmX@{m~qBaMv-!VH#Y`G1|TS!!N3iseI{=#6rZRqQhzWxH?e?$fiVLpoCCtQ{coG3 zCl-Umt^oNQP%Mz1Q<(-7yTibcy#|C&{JbZbk(!voz>wPkRAUChVkwW#X8;9(Vh4bH z6%giRVy(@{EvW#CJptbEZ~@3y0OQGw zQF)2EsX#H1#x@Y1>BafGAiuZ-=o_G+P<6~e7Blm?$vlkRj3tw2Fem&h%xL zG3s5%9nWv`m4TZDD8s;Tli6P#Mo)f{W6oH!Stj=}BV*X)KY9Np4NR_?PBOg)RKN(t WHH;AqVj#r~Ouz^i-mF}(lo0@JTZSh9 delta 342 zcmbR7l<~x4Mv-!VH#Y`G1|TRr!N3isYbG}qiBHrPsXvgMn^?fWz?cCP&H>@uezy(N z6N^D&SAcvDC>BW1sZ0Zk-CZ~3-XIgfWBD)SH}!wF*Bc?%){8tSUh - We'll never share your email with anyone else. + We'll never share your email with anyone else.
@@ -545,7 +545,7 @@
- This is some placeholder block-level help text for the above input. It's a bit lighter and easily wraps to a new line. + This is some placeholder block-level help text for the above input. It's a bit lighter and easily wraps to a new line.
Radio buttons @@ -848,7 +848,7 @@

Alerts

-
+

Warning!

Best check yo self, you're not looking too good. Nulla vitae elit libero, a pharetra augue. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.

@@ -859,7 +859,7 @@
-
+
Oh snap! Change a few things up and try submitting again.
@@ -867,7 +867,7 @@
-
+
Well done! You successfully read this important alert message.
@@ -875,9 +875,9 @@
-
+
- Heads up! This alert needs your attention, but it's not super important. + Heads up! This alert needs your attention, but it's not super important.
@@ -1192,7 +1192,7 @@

Modals

-
+