@department-of-veterans-affairs/css-library 0.7.0 → 0.7.3

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,4 +1,3 @@
1
- /*! This is intentionally left empty for now */
2
1
  /*
3
2
  * * * * * ==============================
4
3
  * * * * * ==============================
@@ -1383,62 +1382,6 @@ Sets:
1383
1382
  Easing
1384
1383
  ----------------------------------------
1385
1384
  */
1386
- html,
1387
- body {
1388
- padding: 0;
1389
- margin: 0;
1390
- }
1391
-
1392
- html {
1393
- font-weight: 500;
1394
- }
1395
-
1396
- body {
1397
- background: #ffffff;
1398
- color: #1b1b1b;
1399
- }
1400
-
1401
- article > h1 {
1402
- margin-top: 0;
1403
- }
1404
-
1405
- hr {
1406
- margin: 2.5em 0;
1407
- margin: 48px 0 40px;
1408
- border: 1px solid #a9aeb1;
1409
- }
1410
-
1411
- #content abbr {
1412
- border-bottom: 0px;
1413
- text-decoration: none;
1414
- font-weight: inherit;
1415
- font-style: inherit;
1416
- color: inherit;
1417
- cursor: pointer;
1418
- }
1419
-
1420
- a {
1421
- color: #005ea2;
1422
- text-decoration: underline;
1423
- -webkit-transition-duration: 0.3s;
1424
- transition-duration: 0.3s;
1425
- -webkit-transition-timing-function: ease-in-out;
1426
- transition-timing-function: ease-in-out;
1427
- -webkit-transition-property: color, background-color, border-color;
1428
- transition-property: color, background-color, border-color;
1429
- }
1430
- a:hover {
1431
- background-color: rgba(0, 0, 0, 0.05);
1432
- color: inherit;
1433
- text-decoration: underline;
1434
- }
1435
- a:active {
1436
- background: rgba(0, 0, 0, 0.05);
1437
- }
1438
- a:visited, a:visited abbr {
1439
- color: #54278f;
1440
- }
1441
-
1442
1385
  h1 {
1443
1386
  margin-top: 0;
1444
1387
  }
@@ -1563,78 +1506,18 @@ h6 {
1563
1506
  font-weight: 700;
1564
1507
  }
1565
1508
 
1566
- ul {
1567
- padding: 0 0 0 1.5em;
1568
- list-style: square;
1569
- }
1570
-
1571
- ol {
1572
- margin: 0 0 0 1.25em;
1573
- list-style-position: outside;
1574
- }
1575
-
1576
- ul > ul,
1577
- ul ol,
1578
- ol > ul,
1579
- ol ol {
1580
- margin: 0.5em 0 0.5em 1.2em;
1581
- }
1582
-
1583
- dd {
1584
- margin-left: 0;
1585
- }
1586
-
1587
- dd + dt {
1588
- margin-top: 1.5em;
1589
- }
1590
-
1591
- figure {
1592
- font-size: 0.85em;
1593
- margin-left: -15px;
1594
- margin-right: -15px;
1595
- }
1596
- @media screen and (min-width: 1201px), print and (min-width: 1201px) {
1597
- figure {
1598
- margin-left: -16.66667%;
1599
- margin-right: -16.66667%;
1509
+ @media (max-width: 481px) {
1510
+ h1 {
1511
+ font-size: 30px;
1512
+ }
1513
+ h2 {
1514
+ font-size: 24px;
1600
1515
  }
1601
1516
  }
1602
-
1603
- figcaption {
1604
- color: #162e51;
1605
- }
1606
-
1607
- input::-webkit-input-placeholder {
1608
- color: #565c65;
1609
- }
1610
-
1611
- input::-moz-placeholder {
1612
- color: #565c65;
1613
- }
1614
-
1615
- input:-ms-input-placeholder {
1616
- color: #565c65;
1617
- }
1618
-
1619
- input:focus::-webkit-input-placeholder {
1620
- color: transparent;
1621
- }
1622
-
1623
- input:focus::-moz-placeholder {
1624
- color: transparent;
1625
- }
1626
-
1627
- input:focus:-ms-input-placeholder {
1628
- color: transparent;
1629
- }
1630
-
1631
- .va-notice--banner p {
1632
- margin: 0;
1633
- }
1634
- .va-notice--banner a {
1635
- background-image: none;
1636
- color: inherit;
1637
- padding: 0;
1517
+ h6 {
1518
+ margin: 0.5em 0 0;
1519
+ text-transform: none;
1520
+ font-weight: 700;
1638
1521
  }
1639
1522
 
1640
- /*# sourceMappingURL=elements.css.map */
1523
+ /*# sourceMappingURL=headings.css.map */
package/dist/full.css CHANGED
@@ -3319,126 +3319,126 @@ through all possible variants
3319
3319
  font-style: normal;
3320
3320
  font-weight: 300;
3321
3321
  font-display: fallback;
3322
- src: url(../node_modules/@uswds/uswds/dist/fonts/roboto-mono/roboto-mono-v5-latin-300.woff2) format("woff2");
3322
+ src: url(~@uswds/uswds/dist/fonts/roboto-mono/roboto-mono-v5-latin-300.woff2) format("woff2");
3323
3323
  }
3324
3324
  @font-face {
3325
3325
  font-family: "Roboto Mono Web";
3326
3326
  font-style: normal;
3327
3327
  font-weight: 400;
3328
3328
  font-display: fallback;
3329
- src: url(../node_modules/@uswds/uswds/dist/fonts/roboto-mono/roboto-mono-v5-latin-regular.woff2) format("woff2");
3329
+ src: url(~@uswds/uswds/dist/fonts/roboto-mono/roboto-mono-v5-latin-regular.woff2) format("woff2");
3330
3330
  }
3331
3331
  @font-face {
3332
3332
  font-family: "Roboto Mono Web";
3333
3333
  font-style: normal;
3334
3334
  font-weight: 700;
3335
3335
  font-display: fallback;
3336
- src: url(../node_modules/@uswds/uswds/dist/fonts/roboto-mono/roboto-mono-v5-latin-700.woff2) format("woff2");
3336
+ src: url(~@uswds/uswds/dist/fonts/roboto-mono/roboto-mono-v5-latin-700.woff2) format("woff2");
3337
3337
  }
3338
3338
  @font-face {
3339
3339
  font-family: "Roboto Mono Web";
3340
3340
  font-style: italic;
3341
3341
  font-weight: 300;
3342
3342
  font-display: fallback;
3343
- src: url(../node_modules/@uswds/uswds/dist/fonts/roboto-mono/roboto-mono-v5-latin-300italic.woff2) format("woff2");
3343
+ src: url(~@uswds/uswds/dist/fonts/roboto-mono/roboto-mono-v5-latin-300italic.woff2) format("woff2");
3344
3344
  }
3345
3345
  @font-face {
3346
3346
  font-family: "Roboto Mono Web";
3347
3347
  font-style: italic;
3348
3348
  font-weight: 400;
3349
3349
  font-display: fallback;
3350
- src: url(../node_modules/@uswds/uswds/dist/fonts/roboto-mono/roboto-mono-v5-latin-italic.woff2) format("woff2");
3350
+ src: url(~@uswds/uswds/dist/fonts/roboto-mono/roboto-mono-v5-latin-italic.woff2) format("woff2");
3351
3351
  }
3352
3352
  @font-face {
3353
3353
  font-family: "Roboto Mono Web";
3354
3354
  font-style: italic;
3355
3355
  font-weight: 700;
3356
3356
  font-display: fallback;
3357
- src: url(../node_modules/@uswds/uswds/dist/fonts/roboto-mono/roboto-mono-v5-latin-700italic.woff2) format("woff2");
3357
+ src: url(~@uswds/uswds/dist/fonts/roboto-mono/roboto-mono-v5-latin-700italic.woff2) format("woff2");
3358
3358
  }
3359
3359
  @font-face {
3360
3360
  font-family: "Source Sans Pro Web";
3361
3361
  font-style: normal;
3362
3362
  font-weight: 300;
3363
3363
  font-display: fallback;
3364
- src: url(../node_modules/@uswds/uswds/dist/fonts/source-sans-pro/sourcesanspro-light-webfont.woff2) format("woff2");
3364
+ src: url(~@uswds/uswds/dist/fonts/source-sans-pro/sourcesanspro-light-webfont.woff2) format("woff2");
3365
3365
  }
3366
3366
  @font-face {
3367
3367
  font-family: "Source Sans Pro Web";
3368
3368
  font-style: normal;
3369
3369
  font-weight: 400;
3370
3370
  font-display: fallback;
3371
- src: url(../node_modules/@uswds/uswds/dist/fonts/source-sans-pro/sourcesanspro-regular-webfont.woff2) format("woff2");
3371
+ src: url(~@uswds/uswds/dist/fonts/source-sans-pro/sourcesanspro-regular-webfont.woff2) format("woff2");
3372
3372
  }
3373
3373
  @font-face {
3374
3374
  font-family: "Source Sans Pro Web";
3375
3375
  font-style: normal;
3376
3376
  font-weight: 700;
3377
3377
  font-display: fallback;
3378
- src: url(../node_modules/@uswds/uswds/dist/fonts/source-sans-pro/sourcesanspro-bold-webfont.woff2) format("woff2");
3378
+ src: url(~@uswds/uswds/dist/fonts/source-sans-pro/sourcesanspro-bold-webfont.woff2) format("woff2");
3379
3379
  }
3380
3380
  @font-face {
3381
3381
  font-family: "Source Sans Pro Web";
3382
3382
  font-style: italic;
3383
3383
  font-weight: 300;
3384
3384
  font-display: fallback;
3385
- src: url(../node_modules/@uswds/uswds/dist/fonts/source-sans-pro/sourcesanspro-lightitalic-webfont.woff2) format("woff2");
3385
+ src: url(~@uswds/uswds/dist/fonts/source-sans-pro/sourcesanspro-lightitalic-webfont.woff2) format("woff2");
3386
3386
  }
3387
3387
  @font-face {
3388
3388
  font-family: "Source Sans Pro Web";
3389
3389
  font-style: italic;
3390
3390
  font-weight: 400;
3391
3391
  font-display: fallback;
3392
- src: url(../node_modules/@uswds/uswds/dist/fonts/source-sans-pro/sourcesanspro-italic-webfont.woff2) format("woff2");
3392
+ src: url(~@uswds/uswds/dist/fonts/source-sans-pro/sourcesanspro-italic-webfont.woff2) format("woff2");
3393
3393
  }
3394
3394
  @font-face {
3395
3395
  font-family: "Source Sans Pro Web";
3396
3396
  font-style: italic;
3397
3397
  font-weight: 700;
3398
3398
  font-display: fallback;
3399
- src: url(../node_modules/@uswds/uswds/dist/fonts/source-sans-pro/sourcesanspro-bolditalic-webfont.woff2) format("woff2");
3399
+ src: url(~@uswds/uswds/dist/fonts/source-sans-pro/sourcesanspro-bolditalic-webfont.woff2) format("woff2");
3400
3400
  }
3401
3401
  @font-face {
3402
3402
  font-family: "Merriweather Web";
3403
3403
  font-style: normal;
3404
3404
  font-weight: 300;
3405
3405
  font-display: fallback;
3406
- src: url(../node_modules/@uswds/uswds/dist/fonts/merriweather/Latin-Merriweather-Light.woff2) format("woff2");
3406
+ src: url(~@uswds/uswds/dist/fonts/merriweather/Latin-Merriweather-Light.woff2) format("woff2");
3407
3407
  }
3408
3408
  @font-face {
3409
3409
  font-family: "Merriweather Web";
3410
3410
  font-style: normal;
3411
3411
  font-weight: 400;
3412
3412
  font-display: fallback;
3413
- src: url(../node_modules/@uswds/uswds/dist/fonts/merriweather/Latin-Merriweather-Regular.woff2) format("woff2");
3413
+ src: url(~@uswds/uswds/dist/fonts/merriweather/Latin-Merriweather-Regular.woff2) format("woff2");
3414
3414
  }
3415
3415
  @font-face {
3416
3416
  font-family: "Merriweather Web";
3417
3417
  font-style: normal;
3418
3418
  font-weight: 700;
3419
3419
  font-display: fallback;
3420
- src: url(../node_modules/@uswds/uswds/dist/fonts/merriweather/Latin-Merriweather-Bold.woff2) format("woff2");
3420
+ src: url(~@uswds/uswds/dist/fonts/merriweather/Latin-Merriweather-Bold.woff2) format("woff2");
3421
3421
  }
3422
3422
  @font-face {
3423
3423
  font-family: "Merriweather Web";
3424
3424
  font-style: italic;
3425
3425
  font-weight: 300;
3426
3426
  font-display: fallback;
3427
- src: url(../node_modules/@uswds/uswds/dist/fonts/merriweather/Latin-Merriweather-LightItalic.woff2) format("woff2");
3427
+ src: url(~@uswds/uswds/dist/fonts/merriweather/Latin-Merriweather-LightItalic.woff2) format("woff2");
3428
3428
  }
3429
3429
  @font-face {
3430
3430
  font-family: "Merriweather Web";
3431
3431
  font-style: italic;
3432
3432
  font-weight: 400;
3433
3433
  font-display: fallback;
3434
- src: url(../node_modules/@uswds/uswds/dist/fonts/merriweather/Latin-Merriweather-Italic.woff2) format("woff2");
3434
+ src: url(~@uswds/uswds/dist/fonts/merriweather/Latin-Merriweather-Italic.woff2) format("woff2");
3435
3435
  }
3436
3436
  @font-face {
3437
3437
  font-family: "Merriweather Web";
3438
3438
  font-style: italic;
3439
3439
  font-weight: 700;
3440
3440
  font-display: fallback;
3441
- src: url(../node_modules/@uswds/uswds/dist/fonts/merriweather/Latin-Merriweather-BoldItalic.woff2) format("woff2");
3441
+ src: url(~@uswds/uswds/dist/fonts/merriweather/Latin-Merriweather-BoldItalic.woff2) format("woff2");
3442
3442
  }
3443
3443
  /* stylelint-enable */
3444
3444
  /* latin */
@@ -4465,12 +4465,6 @@ body {
4465
4465
  font-size: 16px;
4466
4466
  }
4467
4467
 
4468
- p {
4469
- line-height: 1.5;
4470
- margin-bottom: 1em;
4471
- margin-top: 1em;
4472
- }
4473
-
4474
4468
  a {
4475
4469
  color: #005ea2;
4476
4470
  text-decoration: underline;
@@ -5564,6 +5558,96 @@ fieldset {
5564
5558
  }
5565
5559
  }
5566
5560
 
5561
+ html,
5562
+ body {
5563
+ padding: 0;
5564
+ margin: 0;
5565
+ }
5566
+
5567
+ html {
5568
+ font-size: 10px;
5569
+ font-weight: 500;
5570
+ }
5571
+
5572
+ body {
5573
+ background: #ffffff;
5574
+ color: #1b1b1b;
5575
+ font-size: 16px;
5576
+ font-family: inherit;
5577
+ }
5578
+ body.modal-open {
5579
+ overflow: hidden;
5580
+ }
5581
+
5582
+ .show-on-focus {
5583
+ position: absolute;
5584
+ top: -10em;
5585
+ background: #ffffff;
5586
+ padding: 1em;
5587
+ margin: 1em;
5588
+ color: #162e51;
5589
+ display: block;
5590
+ font-weight: 600;
5591
+ }
5592
+ .show-on-focus:focus {
5593
+ position: inherit;
5594
+ top: auto;
5595
+ outline: 2px solid #ffbe2e;
5596
+ }
5597
+
5598
+ body .row.full {
5599
+ width: 100%;
5600
+ max-width: 100%;
5601
+ }
5602
+
5603
+ .sr-only {
5604
+ border: 0;
5605
+ clip: rect(0, 0, 0, 0);
5606
+ clip-path: inset(50%);
5607
+ height: 1px;
5608
+ margin: -1px;
5609
+ overflow: hidden;
5610
+ padding: 0;
5611
+ position: absolute !important;
5612
+ width: 1px;
5613
+ word-wrap: normal !important;
5614
+ }
5615
+
5616
+ .no-print-no-sr {
5617
+ display: none !important;
5618
+ }
5619
+
5620
+ #content abbr {
5621
+ border-bottom: 0px;
5622
+ text-decoration: none;
5623
+ font-weight: inherit;
5624
+ font-style: inherit;
5625
+ color: inherit;
5626
+ cursor: pointer;
5627
+ }
5628
+
5629
+ a {
5630
+ color: #005ea2;
5631
+ text-decoration: underline;
5632
+ -webkit-transition-duration: 0.3s;
5633
+ transition-duration: 0.3s;
5634
+ -webkit-transition-timing-function: ease-in-out;
5635
+ transition-timing-function: ease-in-out;
5636
+ -webkit-transition-property: color, background-color, border-color;
5637
+ transition-property: color, background-color, border-color;
5638
+ }
5639
+ a:hover {
5640
+ background-color: rgba(0, 0, 0, 0.05);
5641
+ color: inherit;
5642
+ text-decoration: underline;
5643
+ }
5644
+ a:active {
5645
+ background: rgba(0, 0, 0, 0.05);
5646
+ }
5647
+ a:visited, a:visited abbr {
5648
+ color: #54278f;
5649
+ }
5650
+
5567
5651
  /*
5568
5652
  * * * * * ==============================
5569
5653
  * * * * * ==============================
@@ -6936,96 +7020,6 @@ Sets:
6936
7020
  Easing
6937
7021
  ----------------------------------------
6938
7022
  */
6939
- html,
6940
- body {
6941
- padding: 0;
6942
- margin: 0;
6943
- }
6944
-
6945
- html {
6946
- font-size: 10px;
6947
- font-weight: 500;
6948
- }
6949
-
6950
- body {
6951
- background: #ffffff;
6952
- color: #1b1b1b;
6953
- font-size: 16px;
6954
- font-family: inherit;
6955
- }
6956
- body.modal-open {
6957
- overflow: hidden;
6958
- }
6959
-
6960
- .show-on-focus {
6961
- position: absolute;
6962
- top: -10em;
6963
- background: #ffffff;
6964
- padding: 1em;
6965
- margin: 1em;
6966
- color: #162e51;
6967
- display: block;
6968
- font-weight: 600;
6969
- }
6970
- .show-on-focus:focus {
6971
- position: inherit;
6972
- top: auto;
6973
- outline: 2px solid #ffbe2e;
6974
- }
6975
-
6976
- body .row.full {
6977
- width: 100%;
6978
- max-width: 100%;
6979
- }
6980
-
6981
- .sr-only {
6982
- border: 0;
6983
- clip: rect(0, 0, 0, 0);
6984
- clip-path: inset(50%);
6985
- height: 1px;
6986
- margin: -1px;
6987
- overflow: hidden;
6988
- padding: 0;
6989
- position: absolute !important;
6990
- width: 1px;
6991
- word-wrap: normal !important;
6992
- }
6993
-
6994
- .no-print-no-sr {
6995
- display: none !important;
6996
- }
6997
-
6998
- #content abbr {
6999
- border-bottom: 0px;
7000
- text-decoration: none;
7001
- font-weight: inherit;
7002
- font-style: inherit;
7003
- color: inherit;
7004
- cursor: pointer;
7005
- }
7006
-
7007
- a {
7008
- color: #005ea2;
7009
- text-decoration: underline;
7010
- -webkit-transition-duration: 0.3s;
7011
- transition-duration: 0.3s;
7012
- -webkit-transition-timing-function: ease-in-out;
7013
- transition-timing-function: ease-in-out;
7014
- -webkit-transition-property: color, background-color, border-color;
7015
- transition-property: color, background-color, border-color;
7016
- }
7017
- a:hover {
7018
- background-color: rgba(0, 0, 0, 0.05);
7019
- color: inherit;
7020
- text-decoration: underline;
7021
- }
7022
- a:active {
7023
- background: rgba(0, 0, 0, 0.05);
7024
- }
7025
- a:visited, a:visited abbr {
7026
- color: #54278f;
7027
- }
7028
-
7029
7023
  h1 {
7030
7024
  margin-top: 0;
7031
7025
  }
@@ -7138,6 +7132,20 @@ h6 {
7138
7132
  font-weight: 700;
7139
7133
  }
7140
7134
 
7135
+ @media (max-width: 481px) {
7136
+ h1 {
7137
+ font-size: 30px;
7138
+ }
7139
+ h2 {
7140
+ font-size: 24px;
7141
+ }
7142
+ }
7143
+ h6 {
7144
+ margin: 0.5em 0 0;
7145
+ text-transform: none;
7146
+ font-weight: 700;
7147
+ }
7148
+
7141
7149
  ul {
7142
7150
  padding: 0 0 0 1.5em;
7143
7151
  list-style: square;
@@ -7314,6 +7322,7 @@ table {
7314
7322
  }
7315
7323
 
7316
7324
  .va-notice--banner p {
7325
+ font-size: 16px;
7317
7326
  margin: 0;
7318
7327
  }
7319
7328
  .va-notice--banner a {
@@ -7352,6 +7361,8 @@ article > h1 {
7352
7361
  max-width: 48.125rem;
7353
7362
  }
7354
7363
  .va-introtext p {
7364
+ font-size: 1.25rem;
7365
+ font-weight: 400;
7355
7366
  line-height: 1.7;
7356
7367
  }
7357
7368
 
@@ -7650,6 +7661,7 @@ p.usa-alert-heading {
7650
7661
  }
7651
7662
 
7652
7663
  .va-nav-breadcrumbs-list {
7664
+ font-size: 16px;
7653
7665
  float: none !important;
7654
7666
  position: relative;
7655
7667
  }
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Fri, 17 May 2024 17:25:12 GMT
3
+ * Generated on Thu, 30 May 2024 19:16:32 GMT
4
4
  */
5
5
 
6
6
  :root {
@@ -1,6 +1,6 @@
1
1
 
2
2
  // Do not edit directly
3
- // Generated on Fri, 17 May 2024 17:25:12 GMT
3
+ // Generated on Thu, 30 May 2024 19:16:32 GMT
4
4
 
5
5
  $xsmall-screen: 320px;
6
6
  $small-screen: 481px;