feat: add Spotlight Section to Basis Theme

nl-design-system · Dec 18, 2024 · 03f8dd9 · 03f8dd9
1 parent ce76d15
commit 03f8dd9
Showing 1 changed file with 116 additions and 0 deletions.
diff --git a/proprietary/basis-design-tokens/figma/basis.tokens.json b/proprietary/basis-design-tokens/figma/basis.tokens.json
@@ -5605,6 +5605,122 @@
       }
     }
   },
+  "components/spotlight-section": {
+    "utrecht": {
+      "spotlight-section": {
+        "background-color": {
+          "$type": "color",
+          "$value": "{basis.feedback.informative}"
+        },
+        "border-color": {
+          "$type": "color",
+          "$value": "transparent"
+        },
+        "border-width": {
+          "$type": "borderWidth",
+          "$value": "{basis.border-width.md}"
+        },
+        "color": {
+          "$type": "color",
+          "$value": "{basis.document.inverse.color}"
+        },
+        "padding-block-end": {
+          "$type": "spacing",
+          "$value": "{basis.space.block.xx-large}"
+        },
+        "padding-block-start": {
+          "$type": "spacing",
+          "$value": "{basis.space.block.x-large}"
+        },
+        "padding-inline-end": {
+          "$type": "spacing",
+          "$value": "{basis.space.inline.x-large}"
+        },
+        "padding-inline-start": {
+          "$type": "spacing",
+          "$value": "{basis.space.inline.x-large}"
+        },
+       "info": {
+          "background-color": {
+            "$type": "color",
+            "$value": "{basis.feedback.informative}"
+          },
+          "border-color": {
+            "$type": "color",
+            "$value": "transparent"
+          },
+          "color": {
+            "$type": "color",
+            "$value": "{basis.document.inverse.color}"
+          }
+        },
+        "error": {
+          "background-color": {
+            "$type": "color",
+            "$value": "{basis.feedback.negative}"
+          },
+          "border-color": {
+            "$type": "color",
+            "$value": "transparent"
+          },
+          "color": {
+            "$type": "color",
+            "$value": "{basis.document.inverse.color}"
+          }
+        },
+        "ok": {
+          "background-color": {
+            "$type": "color",
+            "$value": "{basis.feedback.positive}"
+          },
+          "border-color": {
+            "$type": "color",
+            "$value": "transparent"
+          },
+          "color": {
+            "$type": "color",
+            "$value": "{basis.document.inverse.color}"
+          }
+        },
+        "warning": {
+          "background-color": {
+            "$type": "color",
+            "$value": "{utrecht.feedback.warning}"
+          },
+          "border-color": {
+            "$type": "color",
+            "$value": "transparent"
+          },
+          "color": {
+            "$type": "color",
+            "$value": "{basis.body.color}"
+          }
+        }
+      }
+    },
+    "todo": {
+      "alert": {
+        "heading": {
+          "font-family": {
+            "$type": "fontFamilies",
+            "$value": "{utrecht.heading.font-family}"
+          },
+          "font-weight": {
+            "$type": "fontWeights",
+            "$value": "{utrecht.heading.font-weight}"
+          },
+          "line-height": {
+            "$type": "lineHeights",
+            "$value": "{basis.typography.line-height.sm}"
+          },
+          "font-size": {
+            "$type": "fontSizes",
+            "$value": "{basis.typography.font-size.3}"
+          }
+        }
+      }
+    }
+  },
   "components/status-badge": {
     "todo": {
       "status-badge": {