Update demo

EsriDevEvents · Mar 7, 2023 · 95d9916 · 95d9916
1 parent 4e095c3
commit 95d9916
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 2 deletions.
diff --git a/app.js b/app.js
@@ -5,6 +5,7 @@ const allTypes = [
  "County park",
  "Local park",
 ];
+
 const colors = ["#c66a4a", "#7a81ff", "#3cccb4", "#0096ff", "#f260a1"];
 
 const appState = {

diff --git a/index.html b/index.html
@@ -57,9 +57,12 @@ <h1>US Park Finder</h1>
  <ul>
  <li>The default Calcite theme variables for both light and dark modes are customized.</li>
  <li>Calcite Chip components are themed programmatically and correspond to attribute values.</li>
+ <li>Calcite Modal components override component-specific variables for scrim.</li>
+
  </ul>
- <calcite-link target="_blank" href="https://developers.arcgis.com/calcite-design-system">
- Learn more about theming</calcite-link> in the <calcite-link target="_blank"
+ <calcite-link target="_blank"
+ href="https://developers.arcgis.com/calcite-design-system/foundations/colors/#theming">
+ Learn about theming</calcite-link> in the <calcite-link target="_blank"
  href="https://developers.arcgis.com/calcite-design-system">
  Calcite Design System documentation</calcite-link>.
  <hr />

diff --git a/style.css b/style.css
@@ -39,34 +39,43 @@ body.calcite-mode-dark calcite-modal {
  --calcite-ui-icon-color: #c66a4a;
  outline-color: #c66a4a;
 }
+
 #chip-type-national.chip-active {
  --calcite-ui-foreground-2: rgba(198, 106, 74, 0.3);
 }
+
 #chip-type-regional {
  --calcite-ui-icon-color: #3cccb4;
  outline-color: #3cccb4;
 }
+
 #chip-type-regional.chip-active {
  --calcite-ui-foreground-2: rgba(60, 204, 180, 0.3);
 }
+
 #chip-type-state {
  --calcite-ui-icon-color: #7a81ff;
  outline-color: #7a81ff;
 }
+
 #chip-type-state.chip-active {
  --calcite-ui-foreground-2: rgba(122, 129, 255, 0.3);
 }
+
 #chip-type-county {
  --calcite-ui-icon-color: #0096ff;
  outline-color: #0096ff;
 }
+
 #chip-type-county.chip-active {
  --calcite-ui-foreground-2: rgba(0, 150, 255, 0.3);
 }
+
 #chip-type-local {
  --calcite-ui-icon-color: #f260a1;
  outline-color: #f260a1;
 }
+
 #chip-type-local.chip-active {
  --calcite-ui-foreground-2: rgba(242, 95, 161, 0.3);
 }