@department-of-veterans-affairs/css-library 0.12.2 → 0.13.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.
Files changed (5) hide show
  1. package/dist/stylesheets/modules/m-action-link.css +18 -11
  2. package/dist/stylesheets/modules/m-alert.css +17 -23
  3. package/dist/tokens/css/variables.css +1 -1
  4. package/dist/tokens/scss/variables.scss +1 -1
  5. package/package.json +1 -1
package/dist/stylesheets/modules/m-action-link.css CHANGED
@@ -1398,29 +1398,36 @@ a.vads-c-action-link--blue, a.vads-c-action-link--green, a.vads-c-action-link--w
1398
1398
  display: inline-block;
1399
1399
  }
1400
1400
  a.vads-c-action-link--blue:before, a.vads-c-action-link--green:before, a.vads-c-action-link--white:before {
1401
- font-family: "Font Awesome 5 Free";
1402
- font-weight: 900;
1403
- font-size: 175%;
1404
- content: "\f138";
1405
- content: "\f138"/"";
1401
+ background-image: url("../../img/arrow-right-white.svg");
1402
+ background-size: 18px 18px;
1403
+ background-repeat: no-repeat;
1404
+ background-position: center;
1405
+ border-radius: 50%;
1406
+ content: "";
1407
+ height: 30px;
1408
+ width: 30px;
1406
1409
  position: absolute;
1407
- left: 0px;
1408
- top: -4px;
1410
+ top: 2px;
1411
+ left: 0;
1412
+ font-family: unset;
1413
+ font-weight: unset;
1414
+ font-size: unset;
1409
1415
  }
1410
1416
 
1411
1417
  a.vads-c-action-link--blue:before {
1412
- color: #005ea2;
1418
+ background-color: #005ea2;
1413
1419
  }
1414
1420
 
1415
1421
  a.vads-c-action-link--green:before {
1416
- color: #008817;
1422
+ background-color: #008817;
1417
1423
  }
1418
1424
 
1419
1425
  a.vads-c-action-link--white {
1420
1426
  color: #ffffff;
1421
1427
  }
1422
1428
  a.vads-c-action-link--white:before {
1423
- color: #ffffff;
1429
+ background-image: url("../../img/arrow-right.svg");
1430
+ background-color: #ffffff;
1424
1431
  -webkit-transition-duration: 0.3s;
1425
1432
  transition-duration: 0.3s;
1426
1433
  -webkit-transition-timing-function: ease-in-out;
@@ -1434,7 +1441,7 @@ a.vads-c-action-link--white:hover {
1434
1441
  background-color: transparent;
1435
1442
  }
1436
1443
  a.vads-c-action-link--white:hover:before {
1437
- color: #face00;
1444
+ background-color: #face00;
1438
1445
  }
1439
1446
 
1440
1447
  /*# sourceMappingURL=m-action-link.css.map */
package/dist/stylesheets/modules/m-alert.css CHANGED
@@ -22,14 +22,19 @@
22
22
  width: 100%;
23
23
  }
24
24
  .usa-alert::before {
25
- display: block;
26
- width: auto;
27
- background: none;
28
- font-family: "Font Awesome 5 Free";
29
- font-size: 1.25rem;
30
- margin-right: units(2);
31
- position: static;
32
- font-weight: 900;
25
+ background-image: url("../../img/alerts/info.svg");
26
+ background-size: 35px 35px;
27
+ background-repeat: no-repeat;
28
+ background-position: center;
29
+ border-radius: 50%;
30
+ content: "";
31
+ height: 31px;
32
+ width: 31px;
33
+ top: 2px;
34
+ left: 0;
35
+ font-family: unset;
36
+ font-weight: unset;
37
+ font-size: unset;
33
38
  }
34
39
  .usa-alert .usa-alert-body {
35
40
  display: table-cell;
@@ -66,7 +71,7 @@
66
71
  border-left-color: #00a6d2;
67
72
  }
68
73
  .usa-alert-info::before {
69
- content: "\f05a";
74
+ background-image: url("../../img/alerts/info.svg");
70
75
  }
71
76
  .usa-alert-info.background-color-only {
72
77
  background-color: #e1f3f8;
@@ -75,8 +80,7 @@
75
80
  border-left-color: #cd2026;
76
81
  }
77
82
  .usa-alert-error::before {
78
- color: #cd2026;
79
- content: "\f06a";
83
+ background-image: url("../../img/alerts/error.svg");
80
84
  }
81
85
  .usa-alert-error.background-color-only {
82
86
  background-color: #f9dede;
@@ -85,8 +89,7 @@
85
89
  border-left-color: #008817;
86
90
  }
87
91
  .usa-alert-success::before {
88
- color: #008817;
89
- content: "\f00c";
92
+ background-image: url("../../img/alerts/success.svg");
90
93
  }
91
94
  .usa-alert-success.background-color-only {
92
95
  background-color: #e7f4e4;
@@ -95,7 +98,7 @@
95
98
  border-left-color: #fdb81e;
96
99
  }
97
100
  .usa-alert-warning::before {
98
- content: "\f071";
101
+ background-image: url("../../img/alerts/warning.svg");
99
102
  }
100
103
  .usa-alert-warning.background-color-only {
101
104
  background-color: #fff1d2;
@@ -103,10 +106,6 @@
103
106
  .usa-alert-continue {
104
107
  border-left-color: #008817;
105
108
  }
106
- .usa-alert-continue::before {
107
- color: #008817;
108
- content: "\f023";
109
- }
110
109
  .usa-alert.background-color-only {
111
110
  border-left: none;
112
111
  padding: 1.25rem;
@@ -243,12 +242,7 @@ p.usa-alert-heading {
243
242
  border-top: 0.625rem solid #00a6d2;
244
243
  }
245
244
  .usa-alert-full-width-info .usa-alert:before, .usa-alert-full-width-information .usa-alert:before {
246
- content: "\f05a";
247
245
  background: none;
248
- font-size: 1.25rem;
249
- margin-right: 0.9375rem;
250
- position: static;
251
- font-weight: 900;
252
246
  }
253
247
 
254
248
  /*# sourceMappingURL=m-alert.css.map */
package/dist/tokens/css/variables.css CHANGED
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Mon, 07 Oct 2024 15:37:16 GMT
3
+ * Generated on Thu, 24 Oct 2024 17:40:22 GMT
4
4
  */
5
5
 
6
6
  :root {
package/dist/tokens/scss/variables.scss CHANGED
@@ -1,6 +1,6 @@
1
1
 
2
2
  // Do not edit directly
3
- // Generated on Mon, 07 Oct 2024 15:37:16 GMT
3
+ // Generated on Thu, 24 Oct 2024 17:40:22 GMT
4
4
 
5
5
  $xsmall-screen: 320px;
6
6
  $small-screen: 481px;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@department-of-veterans-affairs/css-library",
3
- "version": "0.12.2",
3
+ "version": "0.13.0",
4
4
  "description": "Department of Veterans Affairs stylesheets, tokens, and utilities",
5
5
  "packageManager": "yarn@3.2.0",
6
6
  "files": [