qpp-design-system 0.3.0 → 0.4.0
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/dist/styles/qpp-theme.css +37 -19
- package/package.json +1 -1
|
@@ -49,8 +49,8 @@
|
|
|
49
49
|
--color-transparent-white-alpha25: #ffffff40;
|
|
50
50
|
--color-background: #ffffff;
|
|
51
51
|
--color-background-inverse: #004d99;
|
|
52
|
-
|
|
53
|
-
--color-base: #036;
|
|
52
|
+
--color-base: #262626;
|
|
53
|
+
/* --color-base: #036; */
|
|
54
54
|
--color-base-inverse: #ffffff;
|
|
55
55
|
--color-border: #d9d9d9;
|
|
56
56
|
--color-border-dark: #0f1e38;
|
|
@@ -157,7 +157,7 @@
|
|
|
157
157
|
--font-weight-button-md: var(--font-weight-bold);
|
|
158
158
|
--font-weight-button-sm: var(--font-weight-normal);
|
|
159
159
|
--font-weight-normal: 400;
|
|
160
|
-
--font-weight-bold:
|
|
160
|
+
--font-weight-bold: 500;
|
|
161
161
|
--font-weight-semibold: 500;
|
|
162
162
|
--global__color: var(--color-base);
|
|
163
163
|
--global__color--inverse: var(--color-base-inverse);
|
|
@@ -165,16 +165,16 @@
|
|
|
165
165
|
--global__font-size: var(--font-size-base);
|
|
166
166
|
--global__line-height: var(--font-line-height-base);
|
|
167
167
|
--accordion__color: var(--color-base);
|
|
168
|
-
--accordion__border-top-left-radius:
|
|
169
|
-
--accordion__border-top-right-radius:
|
|
168
|
+
--accordion__border-top-left-radius: 0px;
|
|
169
|
+
--accordion__border-top-right-radius: 0px;
|
|
170
170
|
--accordion__border-bottom-left-radius: 0px;
|
|
171
171
|
--accordion__border-bottom-right-radius: 0px;
|
|
172
|
-
--accordion__border-width:
|
|
173
|
-
--accordion-button__color: var(--color-
|
|
172
|
+
--accordion__border-width: 0px;
|
|
173
|
+
--accordion-button__color: var(--color-primary-dark);
|
|
174
174
|
--accordion-content__background-color: var(--color-white);
|
|
175
|
-
--accordion__background-color: var(--color-
|
|
176
|
-
--accordion__background-color--hover: var(--color-
|
|
177
|
-
--accordion__border-color: var(--color-
|
|
175
|
+
--accordion__background-color: var(--color-white);
|
|
176
|
+
--accordion__background-color--hover: var(--color-white);
|
|
177
|
+
--accordion__border-color: var(--color-white);
|
|
178
178
|
--alert__background-color--lightweight: var(--color-white);
|
|
179
179
|
--alert__border-left-color: var(--color-info);
|
|
180
180
|
--alert__border-color--error: var(--color-error);
|
|
@@ -507,45 +507,63 @@ h5,
|
|
|
507
507
|
h6 {
|
|
508
508
|
font-family: var(--font-family-heading);
|
|
509
509
|
line-height: var(--font-line-height-heading);
|
|
510
|
-
margin-block: 0.5em 0;
|
|
511
510
|
}
|
|
512
511
|
|
|
513
|
-
h1 {
|
|
512
|
+
h1, .qpp-h1 {
|
|
514
513
|
font-size: var(--font-size-4xl); /* 3rem */
|
|
515
514
|
font-weight: var(--font-weight-heading-4xl); /* 400 */
|
|
516
515
|
}
|
|
517
516
|
|
|
518
|
-
h2 {
|
|
517
|
+
h2, .qpp-h2 {
|
|
519
518
|
font-size: var(--font-size-3xl); /* 2.25rem */
|
|
520
519
|
font-weight: var(--font-weight-heading-3xl); /* 400 */
|
|
521
520
|
}
|
|
522
521
|
|
|
523
|
-
h3 {
|
|
522
|
+
h3, .qpp-h3 {
|
|
524
523
|
font-size: var(--font-size-2xl); /* 1.5rem */
|
|
525
524
|
font-weight: var(--font-weight-heading-2xl); /* 500 */
|
|
526
525
|
}
|
|
527
526
|
|
|
528
|
-
h4 {
|
|
527
|
+
h4, .qpp-h4 {
|
|
529
528
|
font-size: var(--font-size-xl); /* 1.3125rem */
|
|
530
529
|
font-weight: var(--font-weight-heading-xl); /* 500 */
|
|
531
530
|
}
|
|
532
531
|
|
|
533
|
-
h5 {
|
|
532
|
+
h5, .qpp-h5 {
|
|
534
533
|
font-size: var(--font-size-lg); /* 1.125rem */
|
|
535
534
|
font-weight: var(--font-weight-heading-lg); /* 500 */
|
|
536
535
|
}
|
|
537
536
|
|
|
538
|
-
h6 {
|
|
537
|
+
h6, .qpp-h6 {
|
|
539
538
|
font-size: var(--font-size-md); /* 1rem */
|
|
540
539
|
font-weight: var(--font-weight-heading-md); /* 500 */
|
|
541
540
|
}
|
|
542
541
|
|
|
543
542
|
@media (max-width: 768px) {
|
|
544
|
-
h1 {
|
|
543
|
+
h1, .qpp-h1 {
|
|
545
544
|
font-size: var(--font-size-4xl--mobile); /* 2.25rem */
|
|
546
545
|
}
|
|
547
546
|
|
|
548
|
-
h2 {
|
|
547
|
+
h2, .qpp-h2 {
|
|
549
548
|
font-size: var(--font-size-3xl--mobile); /* 1.875rem */
|
|
550
549
|
}
|
|
551
550
|
}
|
|
551
|
+
|
|
552
|
+
/* Reset CMS default margin-block spacing to prevent unexpected top/bottom margins on consuming apps */
|
|
553
|
+
h1,
|
|
554
|
+
h2,
|
|
555
|
+
h3,
|
|
556
|
+
h4,
|
|
557
|
+
h5,
|
|
558
|
+
h6,
|
|
559
|
+
p,
|
|
560
|
+
ol,
|
|
561
|
+
ul,
|
|
562
|
+
legend,
|
|
563
|
+
label,
|
|
564
|
+
input,
|
|
565
|
+
button,
|
|
566
|
+
textarea,
|
|
567
|
+
select {
|
|
568
|
+
margin-block: 0;
|
|
569
|
+
}
|