feat: add focus tokens (#18)

gsoft-inc · Dec 14, 2021 · b1a4aa0 · b1a4aa0
1 parent 626060e
commit b1a4aa0
Show file tree

Hide file tree

Showing 6 changed files with 35 additions and 0 deletions.
diff --git a/.changeset/silent-badgers-provide.md b/.changeset/silent-badgers-provide.md
@@ -0,0 +1,5 @@
+---
+'@igloo-ui/tokens': minor
+---
+
+Adding a focus token
diff --git a/docs/base10/tokens.json b/docs/base10/tokens.json
@@ -340,6 +340,13 @@
       }
     ]
   },
+  {
+    "focus": [
+      {
+        "focus": "0 0 0 2px #ffffff, 0 0 0 3.5px #0C46D0"
+      }
+    ]
+  },
   {
     "spacing": [
       {

diff --git a/docs/base10/tokens.scss b/docs/base10/tokens.scss
@@ -140,6 +140,12 @@ $shadow-6: 0 0.1rem 0.6rem 0 rgba(35, 48, 67, 0.1);
 $shadow-12: 0 0.4rem 1rem 0.4rem rgba(35, 48, 67, 0.1);
 $shadow-24: 0 1rem 1.8rem 0.8rem rgba(35, 48, 67, 0.1);
 
+/**
+ * @tokens Focus
+ * @presenter Focus 
+ */
+$focus: 0 0 0 2px #ffffff, 0 0 0 3.5px #0C46D0;
+
 /**
  * @tokens Spacing
  * @presenter Spacing 

diff --git a/docs/tokens.json b/docs/tokens.json
@@ -340,6 +340,13 @@
       }
     ]
   },
+  {
+    "focus": [
+      {
+        "focus": "0 0 0 2px #ffffff, 0 0 0 3.5px #0C46D0"
+      }
+    ]
+  },
   {
     "spacing": [
       {

diff --git a/docs/tokens.scss b/docs/tokens.scss
@@ -140,6 +140,12 @@ $shadow-6: 0 0.1rem 0.6rem 0 rgba(35, 48, 67, 0.1);
 $shadow-12: 0 0.4rem 1rem 0.4rem rgba(35, 48, 67, 0.1);
 $shadow-24: 0 1rem 1.8rem 0.8rem rgba(35, 48, 67, 0.1);
 
+/**
+ * @tokens Focus
+ * @presenter Focus 
+ */
+$focus: 0 0 0 2px #ffffff, 0 0 0 3.5px #0C46D0;
+
 /**
  * @tokens Spacing
  * @presenter Spacing 

diff --git a/tokens/shadow.json b/tokens/shadow.json
@@ -12,5 +12,9 @@
       "value": "0 1rem 1.8rem 0.8rem rgba(35, 48, 67, 0.1)",
       "group": "shadow"
     }
+  },
+  "focus": {
+    "value": "0 0 0 2px {samoyed.value}, 0 0 0 3.5px {electric-blue.600.value}",
+    "group": "focus"
   }
 }