@department-of-veterans-affairs/css-library 0.7.4 → 0.8.1

package/dist/stylesheets/modules/va-tabs.css

@@ -0,0 +1,53 @@
+/**
+  Variables ported over from Formation so that we can keep those stylesheets
+  working while we work on deprecation.
+**/
+.va-tabs {
+  list-style: none;
+  margin-bottom: -1px;
+  min-width: 260px;
+  padding-left: 0;
+}
+.va-tabs > li {
+  background: #f1f1f1;
+  border-width: 1px 0px 0 1px;
+  border-color: #5b616b;
+  border-style: solid;
+  display: inline-block;
+  margin-bottom: 0;
+}
+.va-tabs > li:last-child {
+  border-right-width: 1px;
+}
+
+.va-tab-trigger {
+  border-width: 5px 1px 1px;
+  border-style: solid;
+  border-color: transparent;
+  border-bottom-color: #5b616b;
+  color: #5b616b;
+  display: inline-block;
+  padding: 0.625rem;
+  margin: 0px -1px;
+  text-decoration: none;
+}
+.va-tab-trigger:hover, .va-tab-trigger:focus, .va-tab-trigger--current {
+  background: #ffffff;
+  border-color: #005ea2;
+  border-bottom-color: #ffffff;
+}
+.va-tab-trigger:visited {
+  color: inherit;
+}
+@media (min-width: 481px) {
+  .va-tab-trigger {
+    padding-left: 1.25rem;
+    padding-right: 1.25rem;
+  }
+}
+
+.va-tab-content {
+  border-top: 1px solid #5b616b;
+}
+
+/*# sourceMappingURL=va-tabs.css.map */

package/dist/stylesheets/shame.css

@@ -0,0 +1,266 @@
+/*
+  Original: @import "~uswds/src/stylesheets/components/forms";
+  ***THIS IS USWDS v1***
+*/
+/**
+  Variables ported over from Formation so that we can keep those stylesheets
+  working while we work on deprecation.
+**/
+/**
+  Variables ported over from Formation so that we can keep those stylesheets
+  working while we work on deprecation.
+**/
+/**
+  /uswds/dist/scss/lib/addons/_margin.scss
+**/
+/**
+  uswds/src/stylesheets/lib/helpers/_directional-values.scss
+**/
+@media screen and (min-width: 768px), print and (min-width: 768px) {
+  [type=submit] {
+    margin-top: calc(3rem - 0.2em);
+  }
+}
+
+fieldset {
+  border: none;
+  margin: 0;
+  padding: 0;
+}
+
+@media screen and (min-width: 768px), print and (min-width: 768px) {
+  .usa-form {
+    max-width: 20rem;
+  }
+}
+
+@media screen and (min-width: 768px), print and (min-width: 768px) {
+  .usa-input-tiny {
+    max-width: 3.75rem;
+  }
+}
+
+@media screen and (min-width: 768px), print and (min-width: 768px) {
+  .usa-input-medium {
+    max-width: 7.5rem;
+  }
+}
+
+.usa-form-note {
+  float: right;
+  font-family: "Source Sans Pro", "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
+  font-size: 0.9375rem;
+  margin: 0 0 scale(1.5rem);
+}
+.usa-form-note + * {
+  clear: both;
+}
+
+@media screen and (min-width: 768px), print and (min-width: 768px) {
+  .usa-form-large {
+    max-width: 28.75rem;
+  }
+}
+
+@media screen and (min-width: 768px), print and (min-width: 768px) {
+  .usa-input-grid {
+    padding-right: 5%;
+  }
+}
+
+@media screen and (min-width: 768px), print and (min-width: 768px) {
+  .usa-input-grid:last-of-type {
+    padding-right: 0;
+  }
+}
+
+@media screen and (min-width: 768px), print and (min-width: 768px) {
+  .usa-input-grid-small {
+    float: left;
+    width: 35%;
+  }
+}
+.usa-input-grid-small input {
+  margin-bottom: 1.875rem;
+}
+.usa-input-grid-small select {
+  margin-bottom: 1.875rem;
+}
+
+@media screen and (min-width: 768px), print and (min-width: 768px) {
+  .usa-input-grid-medium {
+    float: left;
+    width: 65%;
+  }
+}
+.usa-input-grid-medium input {
+  margin-bottom: 1.875rem;
+}
+.usa-input-grid-medium select {
+  margin-bottom: 1.875rem;
+}
+
+@media screen and (min-width: 768px), print and (min-width: 768px) {
+  .usa-input-grid-large {
+    float: left;
+    width: 100%;
+  }
+}
+.usa-input-grid-large input {
+  margin-bottom: 1.875rem;
+}
+.usa-input-grid-large select {
+  margin-bottom: 1.875rem;
+}
+
+.usa-additional_text {
+  font-weight: normal;
+}
+
+.usa-checklist {
+  list-style: none;
+  margin-left: 0;
+  padding-left: 0;
+}
+.usa-checklist li {
+  display: inline-block;
+  list-style: none;
+  margin-bottom: 0;
+  margin-top: 0;
+  padding-left: 3em;
+  text-indent: -2em;
+}
+.usa-checklist li::before {
+  content: " ";
+  display: inline-block;
+  height: 0.8em;
+  margin-right: 0.2em;
+  width: 1.8em;
+}
+
+.usa-checklist-checked::before {
+  background-image: url("/assets/img/correct9.png");
+  background-image: url("/assets/img/correct9.svg");
+  background-position: 100%;
+  background-repeat: no-repeat;
+  background-size: 100%;
+}
+
+/**
+  Variables ported over from Formation so that we can keep those stylesheets
+  working while we work on deprecation.
+**/
+body .row {
+  max-width: 62.5em;
+}
+body .row-padded {
+  max-width: 62.5rem;
+  padding: 0 0.625rem;
+  margin: 0 auto;
+}
+
+@media screen and (min-width: 768px), print and (min-width: 768px) {
+  .form-panel {
+    max-width: 20rem;
+  }
+}
+
+.progress-box button {
+  width: 100%;
+}
+
+.progress-box {
+  border: 1px solid #f1f1f1;
+  margin: 0.9375rem 0;
+  padding: 0.625rem 1.25rem;
+}
+
+.button-icon {
+  font-size: 1.0625rem;
+}
+
+.input-section {
+  margin-bottom: 2em;
+}
+.input-section .row {
+  margin: 0;
+}
+
+.usa-input-error select {
+  border: 3px solid #cd2026;
+}
+
+.hidden {
+  display: none !important;
+}
+
+.csp-inline-patch-footer {
+  display: none;
+  visibility: hidden;
+}
+
+.csp-inline-patch-page-react {
+  padding: 2em 0;
+}
+
+@media screen and (min-width: 768px), print and (min-width: 768px) {
+  .usa-grid .usa-width-one-fourth {
+    margin-right: 2.35765%;
+    width: 23.23176%;
+  }
+  .usa-grid .usa-width-three-fourths {
+    width: 74.41059%;
+  }
+}
+input[type=checkbox],
+input[type=radio] {
+  margin-left: -1.25rem;
+  opacity: 0;
+  position: absolute;
+  left: auto;
+}
+
+[hidden=false] {
+  display: block !important;
+}
+
+@media screen and (min-width: 768px), print and (min-width: 768px) {
+  form [type=submit] {
+    padding-left: 1.25rem;
+    padding-right: 1.25rem;
+    width: 100%;
+  }
+}
+
+#top-of-page-alert-container {
+  width: 100%;
+  background-color: #fef0c8;
+  position: relative;
+}
+#top-of-page-alert-container:before {
+  background-color: #fdb81e;
+  content: "";
+  height: 100%;
+  left: 0;
+  position: absolute;
+  top: 0;
+  width: 0.625rem;
+}
+
+#top-of-page-alert {
+  max-width: 62.5em;
+  margin: 0 auto;
+}
+#top-of-page-alert.usa-alert::before {
+  content: none;
+}
+#top-of-page-alert .usa-alert-body {
+  margin: 0 auto;
+  text-align: left;
+}
+#top-of-page-alert .usa-alert-body .usa-alert-heading {
+  margin: 0 auto;
+  padding: 0;
+}
+
+/*# sourceMappingURL=shame.css.map */

package/dist/{uswds-typography.css → stylesheets/uswds-typography.css}

@@ -4192,7 +4192,7 @@ Sets:
 
   https://designsystem.digital.gov/design-tokens/typesetting/overview/
 */
-p, ol, ul, li, dl, dt, dd, form, label {
+p, a, ol, ul, li, dl, dt, dd, form, label, button {
   font-family: Source Sans Pro Web, "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans;
   font-size: 1.06rem;
   line-height: 1.5;

package/dist/tokens/css/variables.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 04 Jun 2024 16:53:11 GMT
+ * Generated on Fri, 07 Jun 2024 19:53:59 GMT
  */
 
 :root {

package/dist/tokens/scss/variables.scss

@@ -1,6 +1,6 @@
 
 // Do not edit directly
-// Generated on Tue, 04 Jun 2024 16:53:11 GMT
+// Generated on Fri, 07 Jun 2024 19:53:59 GMT
 
 $xsmall-screen: 320px;
 $small-screen: 481px;

package/package.json

@@ -1,30 +1,32 @@
 {
   "name": "@department-of-veterans-affairs/css-library",
-  "version": "0.7.4",
+  "version": "0.8.1",
   "description": "Department of Veterans Affairs stylesheets, tokens, and utilities",
   "packageManager": "yarn@3.2.0",
   "files": [
     "dist/**/*.css",
     "dist/**/*.scss",
-    "dist/**/*.json"
+    "dist/**/*.json",
+    "dist/fonts/*"
   ],
   "scripts": {
     "build:tokens": "style-dictionary build",
-    "build:stylesheets": "sass --load-path=./node_modules/@uswds/uswds/packages/ src/stylesheets:dist/",
+    "build:stylesheets": "sass --load-path=./node_modules/@uswds/uswds/packages/ src/stylesheets:dist/stylesheets",
     "build:minify": "yarn build:stylesheets --style compressed",
     "build:minify-core": "sass --style compressed dist/core.css:dist/core.min.css",
-    "build": "yarn run clean-dist && yarn run copy && yarn build:tokens && yarn build:stylesheets",
+    "build": "yarn run clean-dist && yarn run copy && yarn build:tokens && yarn build:stylesheets && yarn copy:scss-files",
     "clean-dist": "rimraf dist/*",
+    "copy:scss-files": "cp -rv src/stylesheets/_mixins.scss dist/stylesheets/_mixins.scss && cp -rv src/stylesheets/formation-overrides/_variables.scss dist/stylesheets/formation-overrides/_variables.scss",
     "copy-assets": "cp -rv src/assets/fonts dist/fonts/ && cp -rv src/assets/img dist/img/",
     "copy": "node ./copy-uswds-color-tokens.js && yarn run copy-assets"
   },
   "devDependencies": {
-    "@uswds/uswds": "^3.7.1",
     "sass": "^1.64.1",
-    "style-dictionary": "^3.8.0"
+    "style-dictionary": "3.8.0"
   },
   "dependencies": {
     "@divriots/style-dictionary-to-figma": "^0.4.0",
+    "@uswds/uswds": "^3.7.1",
     "rimraf": "^5.0.5"
   }
 }