@primer/brand-css 0.56.1 → 0.56.2-rc.4c6ca969
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/components/Prose/Prose.css +35 -12
- package/package.json +1 -1
|
@@ -80,11 +80,11 @@
|
|
|
80
80
|
}
|
|
81
81
|
|
|
82
82
|
.Prose h3 {
|
|
83
|
-
font-weight: var(--brand-heading-weight-
|
|
84
|
-
font-size: var(--brand-text-size-
|
|
85
|
-
line-height: var(--brand-heading-lineHeight-
|
|
83
|
+
font-weight: var(--brand-heading-weight-400);
|
|
84
|
+
font-size: var(--brand-text-size-400);
|
|
85
|
+
line-height: var(--brand-heading-lineHeight-400);
|
|
86
86
|
font-family: var(--brand-heading-fontFamily);
|
|
87
|
-
letter-spacing: var(--brand-heading-letterSpacing-
|
|
87
|
+
letter-spacing: var(--brand-heading-letterSpacing-400);
|
|
88
88
|
}
|
|
89
89
|
|
|
90
90
|
.Prose--lineLength h1 {
|
|
@@ -93,20 +93,20 @@
|
|
|
93
93
|
|
|
94
94
|
.Prose h4 {
|
|
95
95
|
--spacing: var(--base-size-48);
|
|
96
|
-
font-weight: var(--brand-
|
|
97
|
-
font-size: var(--brand-text-size-
|
|
98
|
-
line-height: var(--brand-text-lineHeight-
|
|
96
|
+
font-weight: var(--brand-text-weight-350);
|
|
97
|
+
font-size: var(--brand-text-size-300);
|
|
98
|
+
line-height: var(--brand-text-lineHeight-300);
|
|
99
99
|
font-family: var(--brand-heading-fontFamily);
|
|
100
|
-
letter-spacing: var(--brand-heading-letterSpacing-
|
|
100
|
+
letter-spacing: var(--brand-heading-letterSpacing-300);
|
|
101
101
|
}
|
|
102
102
|
|
|
103
103
|
.Prose h5 {
|
|
104
104
|
--spacing: var(--base-size-48);
|
|
105
|
-
font-weight: var(--brand-text-subhead-weight-
|
|
106
|
-
font-size: var(--brand-text-subhead-size-
|
|
107
|
-
line-height: var(--brand-text-subhead-lineHeight-
|
|
105
|
+
font-weight: var(--brand-text-subhead-weight-medium);
|
|
106
|
+
font-size: var(--brand-text-subhead-size-medium);
|
|
107
|
+
line-height: var(--brand-text-subhead-lineHeight-medium);
|
|
108
108
|
font-family: var(--brand-heading-fontFamily);
|
|
109
|
-
letter-spacing: var(--brand-heading-letterSpacing-
|
|
109
|
+
letter-spacing: var(--brand-heading-letterSpacing-200);
|
|
110
110
|
}
|
|
111
111
|
|
|
112
112
|
.Prose h6 {
|
|
@@ -318,6 +318,29 @@
|
|
|
318
318
|
border: 1px solid var(--brand-color-border-muted);
|
|
319
319
|
}
|
|
320
320
|
|
|
321
|
+
.Prose video,
|
|
322
|
+
.Prose iframe[src*='youtube.com'],
|
|
323
|
+
.Prose iframe[src*='youtu.be'] {
|
|
324
|
+
--spacing: var(--brand-Prose-img-spacing);
|
|
325
|
+
|
|
326
|
+
border-radius: var(--brand-borderRadius-medium);
|
|
327
|
+
display: block;
|
|
328
|
+
height: auto;
|
|
329
|
+
margin-left: auto;
|
|
330
|
+
margin-right: auto;
|
|
331
|
+
margin-block-end: var(--spacing);
|
|
332
|
+
}
|
|
333
|
+
|
|
334
|
+
.Prose video {
|
|
335
|
+
max-width: 100%;
|
|
336
|
+
}
|
|
337
|
+
|
|
338
|
+
.Prose iframe[src*='youtube.com'],
|
|
339
|
+
.Prose iframe[src*='youtu.be'] {
|
|
340
|
+
width: 100%;
|
|
341
|
+
aspect-ratio: 16 / 9;
|
|
342
|
+
}
|
|
343
|
+
|
|
321
344
|
/* Remove all animations, transitions and smooth scroll for people that prefer not to see them */
|
|
322
345
|
@media (prefers-reduced-motion: reduce) {
|
|
323
346
|
.Prose a,
|