@brightspace-ui/core 3.191.1 → 3.192.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.
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import '../colors/colors.js';
|
|
2
2
|
import { css, unsafeCSS } from 'lit';
|
|
3
3
|
import { _isValidCssSelector } from '../../helpers/internal/css.js';
|
|
4
|
+
import { getFocusRingStyles } from '../../helpers/focus.js';
|
|
4
5
|
import { svgToCSS } from '../../helpers/svg-to-css.js';
|
|
5
6
|
|
|
6
7
|
/**
|
|
@@ -160,12 +161,20 @@ export const _generateBodySmallStyles = (selector, includeSkeleton = true) => {
|
|
|
160
161
|
|
|
161
162
|
export const bodySmallStyles = _generateBodySmallStyles('.d2l-body-small', true);
|
|
162
163
|
|
|
164
|
+
const getHeadingFocusStyles = (selector) => {
|
|
165
|
+
return getFocusRingStyles(
|
|
166
|
+
selector,
|
|
167
|
+
{ extraStyles: css`border-radius: 0.3rem;` }
|
|
168
|
+
);
|
|
169
|
+
};
|
|
170
|
+
|
|
163
171
|
/**
|
|
164
172
|
* A private helper method that should not be used by general consumers
|
|
165
173
|
*/
|
|
166
174
|
export const _generateHeading1Styles = (selector) => {
|
|
167
175
|
if (!_isValidCssSelector(selector)) return;
|
|
168
176
|
|
|
177
|
+
const focusStyles = getHeadingFocusStyles(selector);
|
|
169
178
|
selector = unsafeCSS(selector);
|
|
170
179
|
return css`
|
|
171
180
|
${selector} {
|
|
@@ -174,6 +183,7 @@ export const _generateHeading1Styles = (selector) => {
|
|
|
174
183
|
line-height: 2.4rem;
|
|
175
184
|
margin: 1.5rem 0 1.5rem 0;
|
|
176
185
|
}
|
|
186
|
+
${focusStyles}
|
|
177
187
|
@media (max-width: 615px) {
|
|
178
188
|
${selector} {
|
|
179
189
|
font-size: 1.5rem;
|
|
@@ -210,6 +220,7 @@ export const heading1Styles = css`
|
|
|
210
220
|
export const _generateHeading2Styles = (selector) => {
|
|
211
221
|
if (!_isValidCssSelector(selector)) return;
|
|
212
222
|
|
|
223
|
+
const focusStyles = getHeadingFocusStyles(selector);
|
|
213
224
|
selector = unsafeCSS(selector);
|
|
214
225
|
return css`
|
|
215
226
|
${selector} {
|
|
@@ -218,6 +229,7 @@ export const _generateHeading2Styles = (selector) => {
|
|
|
218
229
|
line-height: 1.8rem;
|
|
219
230
|
margin: 1.5rem 0 1.5rem 0;
|
|
220
231
|
}
|
|
232
|
+
${focusStyles}
|
|
221
233
|
@media (max-width: 615px) {
|
|
222
234
|
${selector} {
|
|
223
235
|
font-size: 1rem;
|
|
@@ -255,6 +267,7 @@ export const heading2Styles = css`
|
|
|
255
267
|
export const _generateHeading3Styles = (selector) => {
|
|
256
268
|
if (!_isValidCssSelector(selector)) return;
|
|
257
269
|
|
|
270
|
+
const focusStyles = getHeadingFocusStyles(selector);
|
|
258
271
|
selector = unsafeCSS(selector);
|
|
259
272
|
return css`
|
|
260
273
|
${selector} {
|
|
@@ -263,6 +276,7 @@ export const _generateHeading3Styles = (selector) => {
|
|
|
263
276
|
line-height: 1.5rem;
|
|
264
277
|
margin: 1.5rem 0 1.5rem 0;
|
|
265
278
|
}
|
|
279
|
+
${focusStyles}
|
|
266
280
|
@media (max-width: 615px) {
|
|
267
281
|
${selector} {
|
|
268
282
|
font-size: 0.8rem;
|
|
@@ -299,6 +313,7 @@ export const heading3Styles = css`
|
|
|
299
313
|
export const _generateHeading4Styles = (selector) => {
|
|
300
314
|
if (!_isValidCssSelector(selector)) return;
|
|
301
315
|
|
|
316
|
+
const focusStyles = getHeadingFocusStyles(selector);
|
|
302
317
|
selector = unsafeCSS(selector);
|
|
303
318
|
return css`
|
|
304
319
|
${selector} {
|
|
@@ -307,6 +322,7 @@ export const _generateHeading4Styles = (selector) => {
|
|
|
307
322
|
line-height: 1.2rem;
|
|
308
323
|
margin: 1.5rem 0 1.5rem 0;
|
|
309
324
|
}
|
|
325
|
+
${focusStyles}
|
|
310
326
|
`;
|
|
311
327
|
};
|
|
312
328
|
export const heading4Styles = css`
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@brightspace-ui/core",
|
|
3
|
-
"version": "3.
|
|
3
|
+
"version": "3.192.0",
|
|
4
4
|
"description": "A collection of accessible, free, open-source web components for building Brightspace applications",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"repository": "https://github.com/BrightspaceUI/core.git",
|