@aurodesignsystem/auro-hyperlink - npm Package Compare versions

Comparing version 3.3.7 to 3.4.0

CHANGELOG.md

 # Semantic Release Automated Changelog
 
+# [3.4.0](https://github.com/AlaskaAirlines/auro-hyperlink/compare/v3.3.7...v3.4.0) (2023-11-07)
+
+
+### Features
+
+* **cta:** created small cta button [#172](https://github.com/AlaskaAirlines/auro-hyperlink/issues/172) ([3ffacad](https://github.com/AlaskaAirlines/auro-hyperlink/commit/3ffacad4fa535df4ae48fa2191b11d935b33550c))
+
 ## [3.3.7](https://github.com/AlaskaAirlines/auro-hyperlink/compare/v3.3.6...v3.3.7) (2023-10-30)
@@ -4,0 +11,0 @@

demo/apiExamples.md

@@ -21,2 +21,3 @@ <!-- AURO-GENERATED-CONTENT:START (FILE:src=./../api.md) -->
 | [secondary](#secondary)      | `secondary`      | `Boolean` | false   | Modifier for `type="cta"` secondary UI option.   |
+| [small](#small)          | `small`          | `Boolean` | false   | Modifier for `type="cta"` small UI option.       |
 | [target](#target)         | `target`         | `String`  |         | Specifies where to open the linked document.     |
@@ -23,0 +24,0 @@ | [type](#type)           | `type`           | `String`  |         | Enumerable attribute; [`nav`, `cta`]             |

demo/demo.md

@@ -288,2 +288,35 @@ # Hyperlink
 
+### Small call to action buttons
+
+In the following example, see how the `small` attribute alters the size of the button to be smaller than the normal `cta` button.
+
+<div class="exampleWrapper">
+  <!-- AURO-GENERATED-CONTENT:START (FILE:src=./../../demo/partials/cta-small.html) -->
+  <!-- The below content is automatically added from ./../../demo/partials/cta-small.html -->
+  <auro-hyperlink type="cta" small href="https://www.alaskaair.com">CTA Button</auro-hyperlink>
+  <auro-hyperlink type="cta" small href="https://www.alaskaair.com" target="_blank" >CTA Button</auro-hyperlink>
+  <auro-hyperlink type="cta" small href="https://www.portseattle.org/sea-tac" target="_blank" >CTA Button</auro-hyperlink>
+  <br>
+  <auro-hyperlink type="cta" small secondary href="https://www.alaskaair.com">CTA Button</auro-hyperlink>
+  <auro-hyperlink type="cta" small secondary href="https://www.alaskaair.com" target="_blank" >CTA Button</auro-hyperlink>
+  <auro-hyperlink type="cta" small secondary href="https://www.portseattle.org/sea-tac" target="_blank" >CTA Button</auro-hyperlink>
+  <!-- AURO-GENERATED-CONTENT:END -->
+</div>
+<auro-accordion lowProfile justifyRight>
+  <span slot="trigger">See code</span>
+<!-- AURO-GENERATED-CONTENT:START (CODE:src=./../../demo/partials/cta-small.html) -->
+<!-- The below code snippet is automatically added from ./../../demo/partials/cta-small.html -->
+
+```html
+<auro-hyperlink type="cta" small href="https://www.alaskaair.com">CTA Button</auro-hyperlink>
+<auro-hyperlink type="cta" small href="https://www.alaskaair.com" target="_blank" >CTA Button</auro-hyperlink>
+<auro-hyperlink type="cta" small href="https://www.portseattle.org/sea-tac" target="_blank" >CTA Button</auro-hyperlink>
+<br>
+<auro-hyperlink type="cta" small secondary href="https://www.alaskaair.com">CTA Button</auro-hyperlink>
+<auro-hyperlink type="cta" small secondary href="https://www.alaskaair.com" target="_blank" >CTA Button</auro-hyperlink>
+<auro-hyperlink type="cta" small secondary href="https://www.portseattle.org/sea-tac" target="_blank" >CTA Button</auro-hyperlink>
+```
+<!-- AURO-GENERATED-CONTENT:END -->
+</auro-accordion>
+
 ## Using role="button"
@@ -290,0 +323,0 @@

dist/auro-hyperlink__bundled.js

@@ -63,2 +63,3 @@ /**
     this.ondark = false;
+    this.small = false;
 
@@ -106,3 +107,4 @@ /**
       fluid:            { type: Boolean },
-      referrerpolicy:   { type: Boolean }
+      referrerpolicy:   { type: Boolean },
+      small:            { type: Boolean }
     };
@@ -275,3 +277,3 @@ }
 
-var styleCss = i`*,*:before,*:after{box-sizing:border-box}@media(prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}}*:focus-visible{outline:0}*:focus-visible{outline:0}:focus:not(:focus-visible){outline:3px solid transparent}:host{display:inline-block}:host([type=nav]) .hyperlink:focus{text-decoration:underline}:host([fluid][type=cta]),:host([fluid=true][type=cta]){width:100%}:host([fluid][type=cta]) .hyperlink--cta,:host([fluid=true][type=cta]) .hyperlink--cta{width:100%}.hyperlink{transition:all .15s ease;color:var(--ds-color-ui-default-default, #0074c8);text-decoration:underline}.hyperlink:focus{text-decoration:none}.hyperlink:visited{color:var(--ds-color-ui-default-default, #0074c8)}.hyperlink:focus-visible{background-color:var(--ds-color-ui-default-default, #0074c8);color:var(--ds-color-text-primary-inverse, #ffffff);outline:var(--ds-color-ui-default-default, #0074c8) solid var(--ds-size-50, 0.25rem);outline-offset:unset}.hyperlink:focus-visible:hover{color:var(--ds-color-text-primary-inverse, #ffffff)}@media(hover: hover){.hyperlink:hover{color:var(--ds-color-ui-hover-default, #054687);text-decoration:none}.hyperlink--nav:hover{text-decoration:underline}.hyperlink--ondark:hover{color:var(--ds-color-ui-hover-inverse, #5de3f7)}}.hyperlink--button{display:inline-block;padding:0 var(--ds-size-200);text-decoration:none;color:var(--ds-color-text-link-default);border:1px solid transparent;line-height:var(--ds-unitless-scale-300)}:host(:not(.is-touching)) .hyperlink--button:hover{cursor:pointer;text-decoration:underline;color:var(--ds-color-ui-hover-default)}.hyperlink--nav{display:block;text-decoration:none}.hyperlink--cta{display:block;padding:0 var(--ds-size-200);text-decoration:none;color:var(--ds-color-text-link-default);border:1px solid transparent;line-height:var(--ds-unitless-scale-300);border:1px solid var(--ds-color-ui-default-default, #0074c8);border-radius:var(--ds-border-radius, 0.375rem);background-color:var(--ds-color-ui-default-default, #0074c8);color:var(--ds-color-text-primary-inverse, #ffffff);font-family:var(--ds-font-family-default, "AS Circular", Helvetica Neue, Arial, sans-serif);font-size:var(--ds-text-body-size-default, 1rem);font-weight:var(--ds-text-body-default-weight, 500);line-height:calc((var(--ds-size-800, 4rem)) + (var(--ds-size-100, 0.5rem)) - (var(--ds-size-25, 0.125rem)));text-align:center}:host(:not(.is-touching)) .hyperlink--cta:hover{cursor:pointer;text-decoration:underline;color:var(--ds-color-ui-hover-default)}.hyperlink--cta:active{transform:scale(0.95)}:host(:not(.is-touching)) .hyperlink--cta:hover{border:1px solid var(--ds-color-ui-hover-default, #054687);background-color:var(--ds-color-ui-hover-default, #054687);color:var(--ds-color-text-primary-inverse, #ffffff);text-decoration:none}.hyperlink--cta:visited{color:var(--ds-color-text-primary-inverse, #ffffff)}@media screen and (min-width: 576px){.hyperlink--cta{display:inline-block;min-width:calc((var(--ds-size-800, 4rem))*3)}}.hyperlink--cta.hyperlink--secondary{border:1px solid var(--ds-color-ui-default-default, #0074c8);background-color:var(--ds-color-background-lightest, #ffffff);color:var(--ds-color-text-link-default, #0074c8)}:host(:not(.is-touching)) .hyperlink--cta.hyperlink--secondary:hover{border:1px solid var(--ds-color-ui-default-default, #0074c8);background-color:var(--ds-color-background-lighter, #f8f8f8);color:var(--ds-color-text-link-default, #0074c8)}.hyperlink--cta.hyperlink--secondary.hyperlink--ondark{border:1px solid var(--ds-color-ui-default-inverse, #00cff0);background-color:transparent;color:var(--ds-color-ui-default-inverse, #00cff0)}:host(:not(.is-touching)) .hyperlink--cta.hyperlink--secondary.hyperlink--ondark:hover{border:1px solid var(--ds-color-ui-default-inverse, #00cff0);background-color:var(--ds-color-base-black-opacity-15, rgba(0, 0, 0, 0.15));color:var(--ds-color-ui-default-inverse, #00cff0)}:host(:not(.is-touching)) .hyperlink--cta.hyperlink--secondary.hyperlink--ondark:visited{color:var(--ds-color-ui-default-inverse, #00cff0)}.hyperlink--cta.hyperlink--ondark{border:1px solid var(--ds-color-ui-default-inverse, #00cff0);background-color:var(--ds-color-ui-default-inverse, #00cff0);color:var(--ds-color-text-primary-default, #222222)}:host(:not(.is-touching)) .hyperlink--cta.hyperlink--ondark:hover{border:1px solid var(--ds-color-ui-hover-inverse, #5de3f7);background-color:var(--ds-color-ui-hover-inverse, #5de3f7);color:var(--ds-color-text-primary-default, #222222)}:host(:not(.is-touching)) .hyperlink--cta.hyperlink--ondark:visited{color:var(--ds-color-text-primary-default, #222222)}.hyperlink--ondark{color:var(--ds-color-ui-default-inverse, #00cff0)}.hyperlink--ondark:visited{color:var(--ds-color-ui-default-inverse, #00cff0)}svg{--auro-size-lg:1rem;position:relative;top:4px;margin-left:var(--ds-size-25, 0.125rem)}`;
+var styleCss = i`*,*:before,*:after{box-sizing:border-box}@media(prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}}*:focus-visible{outline:0}*:focus-visible{outline:0}:focus:not(:focus-visible){outline:3px solid transparent}:host{display:inline-block}:host([type=nav]) .hyperlink:focus{text-decoration:underline}:host([fluid][type=cta]),:host([fluid=true][type=cta]){width:100%}:host([fluid][type=cta]) .hyperlink--cta,:host([fluid=true][type=cta]) .hyperlink--cta{width:100%}.hyperlink{transition:all .15s ease;color:var(--ds-color-ui-default-default, #0074c8);text-decoration:underline}.hyperlink:focus{text-decoration:none}.hyperlink:visited{color:var(--ds-color-ui-default-default, #0074c8)}.hyperlink:focus-visible{background-color:var(--ds-color-ui-default-default, #0074c8);color:var(--ds-color-text-primary-inverse, #ffffff);outline:var(--ds-color-ui-default-default, #0074c8) solid var(--ds-size-50, 0.25rem);outline-offset:unset}.hyperlink:focus-visible:hover{color:var(--ds-color-text-primary-inverse, #ffffff)}@media(hover: hover){.hyperlink:hover{color:var(--ds-color-ui-hover-default, #054687);text-decoration:none}.hyperlink--nav:hover{text-decoration:underline}.hyperlink--ondark:hover{color:var(--ds-color-ui-hover-inverse, #5de3f7)}}.hyperlink--button{display:inline-block;padding:0 var(--ds-size-200);text-decoration:none;color:var(--ds-color-text-link-default);border:1px solid transparent;line-height:var(--ds-unitless-scale-300)}:host(:not(.is-touching)) .hyperlink--button:hover{cursor:pointer;text-decoration:underline;color:var(--ds-color-ui-hover-default)}.hyperlink--nav{display:block;text-decoration:none}.hyperlink--cta{display:block;padding:0 var(--ds-size-200);text-decoration:none;color:var(--ds-color-text-link-default);border:1px solid transparent;line-height:var(--ds-unitless-scale-300);border:1px solid var(--ds-color-ui-default-default, #0074c8);border-radius:var(--ds-border-radius, 0.375rem);background-color:var(--ds-color-ui-default-default, #0074c8);color:var(--ds-color-text-primary-inverse, #ffffff);font-family:var(--ds-font-family-default, "AS Circular", Helvetica Neue, Arial, sans-serif);font-size:var(--ds-text-body-size-default, 1rem);font-weight:var(--ds-text-body-default-weight, 500);line-height:calc((var(--ds-size-800, 4rem)) + (var(--ds-size-100, 0.5rem)) - (var(--ds-size-25, 0.125rem)));text-align:center}:host(:not(.is-touching)) .hyperlink--cta:hover{cursor:pointer;text-decoration:underline;color:var(--ds-color-ui-hover-default)}.hyperlink--cta:active{transform:scale(0.95)}:host(:not(.is-touching)) .hyperlink--cta:hover{border:1px solid var(--ds-color-ui-hover-default, #054687);background-color:var(--ds-color-ui-hover-default, #054687);color:var(--ds-color-text-primary-inverse, #ffffff);text-decoration:none}.hyperlink--cta:visited{color:var(--ds-color-text-primary-inverse, #ffffff)}@media screen and (min-width: 576px){.hyperlink--cta{display:inline-block;min-width:calc((var(--ds-size-800, 4rem))*3)}}.hyperlink--cta.hyperlink--secondary{border:1px solid var(--ds-color-ui-default-default, #0074c8);background-color:var(--ds-color-background-lightest, #ffffff);color:var(--ds-color-text-link-default, #0074c8)}:host(:not(.is-touching)) .hyperlink--cta.hyperlink--secondary:hover{border:1px solid var(--ds-color-ui-default-default, #0074c8);background-color:var(--ds-color-background-lighter, #f8f8f8);color:var(--ds-color-text-link-default, #0074c8)}.hyperlink--cta.hyperlink--secondary.hyperlink--ondark{border:1px solid var(--ds-color-ui-default-inverse, #00cff0);background-color:transparent;color:var(--ds-color-ui-default-inverse, #00cff0)}:host(:not(.is-touching)) .hyperlink--cta.hyperlink--secondary.hyperlink--ondark:hover{border:1px solid var(--ds-color-ui-default-inverse, #00cff0);background-color:var(--ds-color-base-black-opacity-15, rgba(0, 0, 0, 0.15));color:var(--ds-color-ui-default-inverse, #00cff0)}:host(:not(.is-touching)) .hyperlink--cta.hyperlink--secondary.hyperlink--ondark:visited{color:var(--ds-color-ui-default-inverse, #00cff0)}.hyperlink--cta.hyperlink--ondark{border:1px solid var(--ds-color-ui-default-inverse, #00cff0);background-color:var(--ds-color-ui-default-inverse, #00cff0);color:var(--ds-color-text-primary-default, #222222)}:host(:not(.is-touching)) .hyperlink--cta.hyperlink--ondark:hover{border:1px solid var(--ds-color-ui-hover-inverse, #5de3f7);background-color:var(--ds-color-ui-hover-inverse, #5de3f7);color:var(--ds-color-text-primary-default, #222222)}:host(:not(.is-touching)) .hyperlink--cta.hyperlink--ondark:visited{color:var(--ds-color-text-primary-default, #222222)}.hyperlink--ondark{color:var(--ds-color-ui-default-inverse, #00cff0)}.hyperlink--ondark:visited{color:var(--ds-color-ui-default-inverse, #00cff0)}:host([small][type=cta]) .hyperlink--cta,:host([small=true][type=cta]) .hyperlink--cta{min-width:unset;line-height:unset;padding:var(--ds-size-100, 0.5rem) var(--ds-size-200, 1rem);font-size:var(--ds-text-body-size-sm, 0.875rem)}svg{--auro-size-lg:1rem;position:relative;top:4px;margin-left:var(--ds-size-25, 0.125rem)}`;
 
@@ -291,2 +293,3 @@ // Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
  * @attr {Boolean} secondary - Modifier for `type="cta"` secondary UI option.
+ * @attr {Boolean} small - Modifier for `type="cta"` small UI option.
  * @attr {Boolean} referrerpolicy - Sets `strict-origin-when-cross-origin` to send a full URL when performing a same-origin request, only sends the origin when the protocol security level stays the same (HTTPS→HTTPS), and sends no header to a less secure destination (HTTPS→HTTP).
@@ -293,0 +296,0 @@ * @attr {String} rel - Specifies the relationship between the current document and the linked document.

dist/auro-hyperlink.d.ts

@@ -9,2 +9,3 @@ /**
  * @attr {Boolean} secondary - Modifier for `type="cta"` secondary UI option.
+ * @attr {Boolean} small - Modifier for `type="cta"` small UI option.
  * @attr {Boolean} referrerpolicy - Sets `strict-origin-when-cross-origin` to send a full URL when performing a same-origin request, only sends the origin when the protocol security level stays the same (HTTPS→HTTPS), and sends no header to a less secure destination (HTTPS→HTTP).
@@ -11,0 +12,0 @@ * @attr {String} rel - Specifies the relationship between the current document and the linked document.

dist/component-base.d.ts

@@ -36,2 +36,5 @@ export default class ComponentBase extends LitElement {
         };
+        small: {
+            type: BooleanConstructor;
+        };
     };
@@ -42,2 +45,3 @@ download: boolean;
     ondark: boolean;
+    small: boolean;
     /**
@@ -44,0 +48,0 @@ * @private

dist/component-base.js

@@ -20,2 +20,3 @@ // Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
     this.ondark = false;
+    this.small = false;
 
@@ -63,3 +64,4 @@ /**
       fluid:            { type: Boolean },
-      referrerpolicy:   { type: Boolean }
+      referrerpolicy:   { type: Boolean },
+      small:            { type: Boolean }
     };
@@ -66,0 +68,0 @@ }

package.json

@@ -10,3 +10,3 @@ {
   "name": "@aurodesignsystem/auro-hyperlink",
-  "version": "3.3.7",
+  "version": "3.4.0",
   "description": "auro-hyperlink HTML custom element",
@@ -13,0 +13,0 @@ "repository": {

src/auro-hyperlink.js

@@ -23,2 +23,3 @@ // Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
  * @attr {Boolean} secondary - Modifier for `type="cta"` secondary UI option.
+ * @attr {Boolean} small - Modifier for `type="cta"` small UI option.
  * @attr {Boolean} referrerpolicy - Sets `strict-origin-when-cross-origin` to send a full URL when performing a same-origin request, only sends the origin when the protocol security level stays the same (HTTPS→HTTPS), and sends no header to a less secure destination (HTTPS→HTTP).
@@ -25,0 +26,0 @@ * @attr {String} rel - Specifies the relationship between the current document and the linked document.

src/component-base.js

@@ -20,2 +20,3 @@ // Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
     this.ondark = false;
+    this.small = false;
 
@@ -63,3 +64,4 @@ /**
       fluid:            { type: Boolean },
-      referrerpolicy:   { type: Boolean }
+      referrerpolicy:   { type: Boolean },
+      small:            { type: Boolean }
     };
@@ -66,0 +68,0 @@ }

src/style-css.js

 import { css } from 'lit';
-export default css`*,*:before,*:after{box-sizing:border-box}@media(prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}}*:focus-visible{outline:0}*:focus-visible{outline:0}:focus:not(:focus-visible){outline:3px solid transparent}:host{display:inline-block}:host([type=nav]) .hyperlink:focus{text-decoration:underline}:host([fluid][type=cta]),:host([fluid=true][type=cta]){width:100%}:host([fluid][type=cta]) .hyperlink--cta,:host([fluid=true][type=cta]) .hyperlink--cta{width:100%}.hyperlink{transition:all .15s ease;color:var(--ds-color-ui-default-default, #0074c8);text-decoration:underline}.hyperlink:focus{text-decoration:none}.hyperlink:visited{color:var(--ds-color-ui-default-default, #0074c8)}.hyperlink:focus-visible{background-color:var(--ds-color-ui-default-default, #0074c8);color:var(--ds-color-text-primary-inverse, #ffffff);outline:var(--ds-color-ui-default-default, #0074c8) solid var(--ds-size-50, 0.25rem);outline-offset:unset}.hyperlink:focus-visible:hover{color:var(--ds-color-text-primary-inverse, #ffffff)}@media(hover: hover){.hyperlink:hover{color:var(--ds-color-ui-hover-default, #054687);text-decoration:none}.hyperlink--nav:hover{text-decoration:underline}.hyperlink--ondark:hover{color:var(--ds-color-ui-hover-inverse, #5de3f7)}}.hyperlink--button{display:inline-block;padding:0 var(--ds-size-200);text-decoration:none;color:var(--ds-color-text-link-default);border:1px solid transparent;line-height:var(--ds-unitless-scale-300)}:host(:not(.is-touching)) .hyperlink--button:hover{cursor:pointer;text-decoration:underline;color:var(--ds-color-ui-hover-default)}.hyperlink--nav{display:block;text-decoration:none}.hyperlink--cta{display:block;padding:0 var(--ds-size-200);text-decoration:none;color:var(--ds-color-text-link-default);border:1px solid transparent;line-height:var(--ds-unitless-scale-300);border:1px solid var(--ds-color-ui-default-default, #0074c8);border-radius:var(--ds-border-radius, 0.375rem);background-color:var(--ds-color-ui-default-default, #0074c8);color:var(--ds-color-text-primary-inverse, #ffffff);font-family:var(--ds-font-family-default, "AS Circular", Helvetica Neue, Arial, sans-serif);font-size:var(--ds-text-body-size-default, 1rem);font-weight:var(--ds-text-body-default-weight, 500);line-height:calc((var(--ds-size-800, 4rem)) + (var(--ds-size-100, 0.5rem)) - (var(--ds-size-25, 0.125rem)));text-align:center}:host(:not(.is-touching)) .hyperlink--cta:hover{cursor:pointer;text-decoration:underline;color:var(--ds-color-ui-hover-default)}.hyperlink--cta:active{transform:scale(0.95)}:host(:not(.is-touching)) .hyperlink--cta:hover{border:1px solid var(--ds-color-ui-hover-default, #054687);background-color:var(--ds-color-ui-hover-default, #054687);color:var(--ds-color-text-primary-inverse, #ffffff);text-decoration:none}.hyperlink--cta:visited{color:var(--ds-color-text-primary-inverse, #ffffff)}@media screen and (min-width: 576px){.hyperlink--cta{display:inline-block;min-width:calc((var(--ds-size-800, 4rem))*3)}}.hyperlink--cta.hyperlink--secondary{border:1px solid var(--ds-color-ui-default-default, #0074c8);background-color:var(--ds-color-background-lightest, #ffffff);color:var(--ds-color-text-link-default, #0074c8)}:host(:not(.is-touching)) .hyperlink--cta.hyperlink--secondary:hover{border:1px solid var(--ds-color-ui-default-default, #0074c8);background-color:var(--ds-color-background-lighter, #f8f8f8);color:var(--ds-color-text-link-default, #0074c8)}.hyperlink--cta.hyperlink--secondary.hyperlink--ondark{border:1px solid var(--ds-color-ui-default-inverse, #00cff0);background-color:transparent;color:var(--ds-color-ui-default-inverse, #00cff0)}:host(:not(.is-touching)) .hyperlink--cta.hyperlink--secondary.hyperlink--ondark:hover{border:1px solid var(--ds-color-ui-default-inverse, #00cff0);background-color:var(--ds-color-base-black-opacity-15, rgba(0, 0, 0, 0.15));color:var(--ds-color-ui-default-inverse, #00cff0)}:host(:not(.is-touching)) .hyperlink--cta.hyperlink--secondary.hyperlink--ondark:visited{color:var(--ds-color-ui-default-inverse, #00cff0)}.hyperlink--cta.hyperlink--ondark{border:1px solid var(--ds-color-ui-default-inverse, #00cff0);background-color:var(--ds-color-ui-default-inverse, #00cff0);color:var(--ds-color-text-primary-default, #222222)}:host(:not(.is-touching)) .hyperlink--cta.hyperlink--ondark:hover{border:1px solid var(--ds-color-ui-hover-inverse, #5de3f7);background-color:var(--ds-color-ui-hover-inverse, #5de3f7);color:var(--ds-color-text-primary-default, #222222)}:host(:not(.is-touching)) .hyperlink--cta.hyperlink--ondark:visited{color:var(--ds-color-text-primary-default, #222222)}.hyperlink--ondark{color:var(--ds-color-ui-default-inverse, #00cff0)}.hyperlink--ondark:visited{color:var(--ds-color-ui-default-inverse, #00cff0)}svg{--auro-size-lg:1rem;position:relative;top:4px;margin-left:var(--ds-size-25, 0.125rem)}`;
+export default css`*,*:before,*:after{box-sizing:border-box}@media(prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}}*:focus-visible{outline:0}*:focus-visible{outline:0}:focus:not(:focus-visible){outline:3px solid transparent}:host{display:inline-block}:host([type=nav]) .hyperlink:focus{text-decoration:underline}:host([fluid][type=cta]),:host([fluid=true][type=cta]){width:100%}:host([fluid][type=cta]) .hyperlink--cta,:host([fluid=true][type=cta]) .hyperlink--cta{width:100%}.hyperlink{transition:all .15s ease;color:var(--ds-color-ui-default-default, #0074c8);text-decoration:underline}.hyperlink:focus{text-decoration:none}.hyperlink:visited{color:var(--ds-color-ui-default-default, #0074c8)}.hyperlink:focus-visible{background-color:var(--ds-color-ui-default-default, #0074c8);color:var(--ds-color-text-primary-inverse, #ffffff);outline:var(--ds-color-ui-default-default, #0074c8) solid var(--ds-size-50, 0.25rem);outline-offset:unset}.hyperlink:focus-visible:hover{color:var(--ds-color-text-primary-inverse, #ffffff)}@media(hover: hover){.hyperlink:hover{color:var(--ds-color-ui-hover-default, #054687);text-decoration:none}.hyperlink--nav:hover{text-decoration:underline}.hyperlink--ondark:hover{color:var(--ds-color-ui-hover-inverse, #5de3f7)}}.hyperlink--button{display:inline-block;padding:0 var(--ds-size-200);text-decoration:none;color:var(--ds-color-text-link-default);border:1px solid transparent;line-height:var(--ds-unitless-scale-300)}:host(:not(.is-touching)) .hyperlink--button:hover{cursor:pointer;text-decoration:underline;color:var(--ds-color-ui-hover-default)}.hyperlink--nav{display:block;text-decoration:none}.hyperlink--cta{display:block;padding:0 var(--ds-size-200);text-decoration:none;color:var(--ds-color-text-link-default);border:1px solid transparent;line-height:var(--ds-unitless-scale-300);border:1px solid var(--ds-color-ui-default-default, #0074c8);border-radius:var(--ds-border-radius, 0.375rem);background-color:var(--ds-color-ui-default-default, #0074c8);color:var(--ds-color-text-primary-inverse, #ffffff);font-family:var(--ds-font-family-default, "AS Circular", Helvetica Neue, Arial, sans-serif);font-size:var(--ds-text-body-size-default, 1rem);font-weight:var(--ds-text-body-default-weight, 500);line-height:calc((var(--ds-size-800, 4rem)) + (var(--ds-size-100, 0.5rem)) - (var(--ds-size-25, 0.125rem)));text-align:center}:host(:not(.is-touching)) .hyperlink--cta:hover{cursor:pointer;text-decoration:underline;color:var(--ds-color-ui-hover-default)}.hyperlink--cta:active{transform:scale(0.95)}:host(:not(.is-touching)) .hyperlink--cta:hover{border:1px solid var(--ds-color-ui-hover-default, #054687);background-color:var(--ds-color-ui-hover-default, #054687);color:var(--ds-color-text-primary-inverse, #ffffff);text-decoration:none}.hyperlink--cta:visited{color:var(--ds-color-text-primary-inverse, #ffffff)}@media screen and (min-width: 576px){.hyperlink--cta{display:inline-block;min-width:calc((var(--ds-size-800, 4rem))*3)}}.hyperlink--cta.hyperlink--secondary{border:1px solid var(--ds-color-ui-default-default, #0074c8);background-color:var(--ds-color-background-lightest, #ffffff);color:var(--ds-color-text-link-default, #0074c8)}:host(:not(.is-touching)) .hyperlink--cta.hyperlink--secondary:hover{border:1px solid var(--ds-color-ui-default-default, #0074c8);background-color:var(--ds-color-background-lighter, #f8f8f8);color:var(--ds-color-text-link-default, #0074c8)}.hyperlink--cta.hyperlink--secondary.hyperlink--ondark{border:1px solid var(--ds-color-ui-default-inverse, #00cff0);background-color:transparent;color:var(--ds-color-ui-default-inverse, #00cff0)}:host(:not(.is-touching)) .hyperlink--cta.hyperlink--secondary.hyperlink--ondark:hover{border:1px solid var(--ds-color-ui-default-inverse, #00cff0);background-color:var(--ds-color-base-black-opacity-15, rgba(0, 0, 0, 0.15));color:var(--ds-color-ui-default-inverse, #00cff0)}:host(:not(.is-touching)) .hyperlink--cta.hyperlink--secondary.hyperlink--ondark:visited{color:var(--ds-color-ui-default-inverse, #00cff0)}.hyperlink--cta.hyperlink--ondark{border:1px solid var(--ds-color-ui-default-inverse, #00cff0);background-color:var(--ds-color-ui-default-inverse, #00cff0);color:var(--ds-color-text-primary-default, #222222)}:host(:not(.is-touching)) .hyperlink--cta.hyperlink--ondark:hover{border:1px solid var(--ds-color-ui-hover-inverse, #5de3f7);background-color:var(--ds-color-ui-hover-inverse, #5de3f7);color:var(--ds-color-text-primary-default, #222222)}:host(:not(.is-touching)) .hyperlink--cta.hyperlink--ondark:visited{color:var(--ds-color-text-primary-default, #222222)}.hyperlink--ondark{color:var(--ds-color-ui-default-inverse, #00cff0)}.hyperlink--ondark:visited{color:var(--ds-color-ui-default-inverse, #00cff0)}:host([small][type=cta]) .hyperlink--cta,:host([small=true][type=cta]) .hyperlink--cta{min-width:unset;line-height:unset;padding:var(--ds-size-100, 0.5rem) var(--ds-size-200, 1rem);font-size:var(--ds-text-body-size-sm, 0.875rem)}svg{--auro-size-lg:1rem;position:relative;top:4px;margin-left:var(--ds-size-25, 0.125rem)}`;

No alert changes

Improved metrics

Total package byte prevSize

142371

increased by2.57%

Lines of code

1062

increased by1.43%

No dependency changes