@aurodesignsystem-dev/auro-hyperlink 0.0.0-pr303.0 → 0.0.0-pr306.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.
package/demo/index.md CHANGED
@@ -26,8 +26,8 @@ If the `href` attribute is not added, the hyperlink element will render back sim
26
26
  <div class="exampleWrapper--ondark" aria-hidden>
27
27
  <!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/basic-ondark.html) -->
28
28
  <!-- The below content is automatically added from ./../apiExamples/basic-ondark.html -->
29
- <auro-hyperlink ondark>No href supplied</auro-hyperlink><br>
30
- Welcome to <auro-hyperlink ondark href="https://www.alaskaair.com">Alaska Airlines</auro-hyperlink>.
29
+ <auro-hyperlink appearance="inverse">No href supplied</auro-hyperlink><br>
30
+ Welcome to <auro-hyperlink appearance="inverse" href="https://www.alaskaair.com">Alaska Airlines</auro-hyperlink>.
31
31
  <!-- AURO-GENERATED-CONTENT:END -->
32
32
  </div>
33
33
  <auro-accordion alignRight>
@@ -44,8 +44,8 @@ Welcome to <auro-hyperlink href="https://www.alaskaair.com">Alaska Airlines</aur
44
44
  <!-- The below code snippet is automatically added from ./../apiExamples/basic-ondark.html -->
45
45
 
46
46
  ```html
47
- <auro-hyperlink ondark>No href supplied</auro-hyperlink><br>
48
- Welcome to <auro-hyperlink ondark href="https://www.alaskaair.com">Alaska Airlines</auro-hyperlink>.
47
+ <auro-hyperlink appearance="inverse">No href supplied</auro-hyperlink><br>
48
+ Welcome to <auro-hyperlink appearance="inverse" href="https://www.alaskaair.com">Alaska Airlines</auro-hyperlink>.
49
49
  ```
50
50
  <!-- AURO-GENERATED-CONTENT:END -->
51
51
  </auro-accordion>
@@ -72,13 +72,13 @@ The `auro-icon` element comes with some pre-defined opinions, but these are easi
72
72
  <div class="exampleWrapper--ondark" style="display: flex; justify-content: space-between;">
73
73
  <!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/navPattern-ondark.html) -->
74
74
  <!-- The below content is automatically added from ./../apiExamples/navPattern-ondark.html -->
75
- <auro-hyperlink ondark href="/last" type="nav">
76
- <auro-icon ondark category="interface" name="chevron-left" customColor style="line-height: 1"></auro-icon>
75
+ <auro-hyperlink appearance="inverse" href="/last" type="nav">
76
+ <auro-icon appearance="inverse" category="interface" name="chevron-left" customColor style="line-height: 1"></auro-icon>
77
77
  Click here to go back
78
78
  </auro-hyperlink>
79
- <auro-hyperlink ondark href="/next" type="nav">
79
+ <auro-hyperlink appearance="inverse" href="/next" type="nav">
80
80
  Click here to go forward
81
- <auro-icon ondark category="interface" name="chevron-right" customColor style="line-height: 1"></auro-icon>
81
+ <auro-icon appearance="inverse" category="interface" name="chevron-right" customColor style="line-height: 1"></auro-icon>
82
82
  </auro-hyperlink>
83
83
  <!-- AURO-GENERATED-CONTENT:END -->
84
84
  </div>
@@ -102,13 +102,13 @@ The `auro-icon` element comes with some pre-defined opinions, but these are easi
102
102
  <!-- The below code snippet is automatically added from ./../apiExamples/navPattern-ondark.html -->
103
103
 
104
104
  ```html
105
- <auro-hyperlink ondark href="/last" type="nav">
106
- <auro-icon ondark category="interface" name="chevron-left" customColor style="line-height: 1"></auro-icon>
105
+ <auro-hyperlink appearance="inverse" href="/last" type="nav">
106
+ <auro-icon appearance="inverse" category="interface" name="chevron-left" customColor style="line-height: 1"></auro-icon>
107
107
  Click here to go back
108
108
  </auro-hyperlink>
109
- <auro-hyperlink ondark href="/next" type="nav">
109
+ <auro-hyperlink appearance="inverse" href="/next" type="nav">
110
110
  Click here to go forward
111
- <auro-icon ondark category="interface" name="chevron-right" customColor style="line-height: 1"></auro-icon>
111
+ <auro-icon appearance="inverse" category="interface" name="chevron-right" customColor style="line-height: 1"></auro-icon>
112
112
  </auro-hyperlink>
113
113
  ```
114
114
  <!-- AURO-GENERATED-CONTENT:END -->
@@ -131,7 +131,7 @@ Aside from the standard hyperlink use-case, the `auro-hyperlink` element is inte
131
131
  <div class="exampleWrapper--ondark">
132
132
  <!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/roleButton-ondark.html) -->
133
133
  <!-- The below content is automatically added from ./../apiExamples/roleButton-ondark.html -->
134
- <auro-hyperlink ondark href="http://www.alaskaair.com" role="button" id="roleButton-ondark">Cancel button</auro-hyperlink>
134
+ <auro-hyperlink appearance="inverse" href="http://www.alaskaair.com" role="button" id="roleButton-ondark">Cancel button</auro-hyperlink>
135
135
  <!-- AURO-GENERATED-CONTENT:END -->
136
136
  </div>
137
137
  <auro-accordion alignRight>
@@ -147,7 +147,7 @@ Aside from the standard hyperlink use-case, the `auro-hyperlink` element is inte
147
147
  <!-- The below code snippet is automatically added from ./../apiExamples/roleButton-ondark.html -->
148
148
 
149
149
  ```html
150
- <auro-hyperlink ondark href="http://www.alaskaair.com" role="button" id="roleButton-ondark">Cancel button</auro-hyperlink>
150
+ <auro-hyperlink appearance="inverse" href="http://www.alaskaair.com" role="button" id="roleButton-ondark">Cancel button</auro-hyperlink>
151
151
  ```
152
152
  <!-- AURO-GENERATED-CONTENT:END -->
153
153
  <!-- AURO-GENERATED-CONTENT:START (CODE:src=./../apiExamples/roleButton.js) -->