knapsack-cloud · knapsack-cloud · Jul 12, 2024
diff --git a/data/blocks/block.4NGzpVhoYR.json b/data/blocks/block.4NGzpVhoYR.json
@@ -0,0 +1,9 @@
+{
+  "id": "4NGzpVhoYR",
+  "data": {
+    "url": "https://app.knapsack.cloud/site/public-demo/AqorUCHu4O/prototypes/react/react/eYJV0byNIp",
+    "height": "480",
+    "clickToInteract": false
+  },
+  "blockType": "generic-iframe"
+}
diff --git a/data/blocks/block.Iu6QKbz80R.json b/data/blocks/block.Iu6QKbz80R.json
@@ -12,8 +12,8 @@
           "name": "Design Tokens",
           "path": "/pages/Design-Tokens"
         },
-        "image": "https://knapsack.imgix.net/site/public-demo/46643-lg7przfyjvpng",
-        "title": "🎨 Design Tokens",
+        "image": "https://knapsack.imgix.net/site/public-demo/126408335-ccjpowky94png",
+        "title": "Design Tokens",
         "description": "View and manage building blocks for our digital brand."
       },
       {
@@ -22,18 +22,18 @@
           "name": "Components Overview",
           "path": "/pages/Components-Overview"
         },
-        "image": "https://knapsack.imgix.net/site/public-demo/materialillustrationabs-7b98tg-tfnpng",
-        "title": "🧩 Components Overview",
+        "image": "https://knapsack.imgix.net/site/public-demo/atworkteamcollaborating4x3-jjazdk4pfmjpeg",
+        "title": "Components Overview",
         "description": "Find and understand UI elements in design and code."
       },
       {
         "id": "BIVcAleTv7",
         "link": {
-          "name": "Page-Level Prototyping",
-          "path": "/pages/Page-Level-Prototyping"
+          "path": "https://app.knapsack.cloud/site/public-demo/AqorUCHu4O/develop/patterns",
+          "external": true
         },
-        "image": "https://knapsack.imgix.net/site/public-demo/lego-rainbow-with-cloud-flat-ufftefvcdujpg",
-        "title": "🖼️ Page-Level Prototyping",
+        "image": "https://knapsack.imgix.net/site/public-demo/64e6635c15af3a9d0b7b787164d12d4b5fbaaee55a00c64eprototype-development-sgw-designworks-xuxmmx8uhojpeg",
+        "title": "Page-Level Prototyping",
         "description": "Assemble modular elements into UIs based in code."
       }
     ],

diff --git a/data/blocks/block.WA7jI-VJ8g.json b/data/blocks/block.WA7jI-VJ8g.json
@@ -0,0 +1,7 @@
+{
+  "id": "WA7jI-VJ8g",
+  "data": {
+    "shortcuts": []
+  },
+  "blockType": "shortcut-tiles"
+}
diff --git a/data/blocks/block.uDBmvumiju.json b/data/blocks/block.uDBmvumiju.json
@@ -0,0 +1,9 @@
+{
+  "id": "uDBmvumiju",
+  "data": {
+    "url": "https://public-demo-workspace.herokuapp.com/api/v1/render?patternId=one-pager&templateId=react&assetSetId=default&dataId=cd23cd6787533fe5555d74c4e166f242&isInIframe=false&wrapHtml=true",
+    "height": "480",
+    "clickToInteract": false
+  },
+  "blockType": "generic-iframe"
+}
diff --git a/data/db.yml b/data/db.yml
@@ -27,7 +27,9 @@ settings:
         type: figma
         url: https://www.figma.com/file/rzMpZtZ3PLH3eutORdrJ2o?version-id=5763001927
         version: '5763001927'
-  logoUrl: https://knapsack.imgix.net/site/public-demo/knapsack-logomark-primary@3x-c3fjqx5ll_.png
+  favicon: https://knapsack.imgix.net/site/public-demo/screen-shot-2021-09-07-at-003230-am-gilwsem9mqpng
+  hideTitleInNavigation: false
+  logoUrl: https://knapsack.imgix.net/site/public-demo/kyndrylsmall-lozhbai7nwpng
   prototyping:
     patternId: one-pager
   theme:
@@ -50,59 +52,104 @@ settings:
       navigation:
         primaryNav:
           accentColor:
-            tokenName: color.brand.primary
+            tokenName: color.base.orange
             type: design-token
           backgroundColor:
-            tokenName: color.brand.black
+            tokenName: color.base.Bone
             type: design-token
           fontFamily: Inter
           fontWeight: 800
           hoverColor:
-            tokenName: color.brand.secondary
+            tokenName: color.base.orange
             type: design-token
-          lineHeight: ''
           textColor:
-            tokenName: color.text.inverse
+            tokenName: color.brand.Text gray
             type: design-token
+          textTransform: inherit
         secondaryNav:
           accentColor:
-            tokenName: color-brand-secondary
+            tokenName: color.base.orange
+            type: design-token
+          backgroundColor:
+            tokenName: color.base.Bone
             type: design-token
           fontFamily: Inter
           fontWeight: 500
+          textColor:
+            tokenName: color.brand.Text gray
+            type: design-token
+          textTransform: inherit
         tabs:
+          accentColor:
+            tokenName: color.base.orange
+            type: design-token
           fontFamily: Inter
+          textColor:
+            tokenName: color.brand.Text gray
+            type: design-token
+          textTransform: inherit
       pageElements:
-        bodyText: {}
+        bodyText:
+          fontFamily: Inter
+          textColor:
+            tokenName: color.brand.Text gray
+            type: design-token
+          textTransform: inherit
         headingLarge:
           fontFamily: Inter
           fontWeight: 400
+          textColor:
+            tokenName: color.brand.Text gray
+            type: design-token
+          textTransform: inherit
         headingMedium:
-          fontFamily: Nunito
+          fontFamily: Inter
+          textColor:
+            tokenName: color.brand.Text gray
+            type: design-token
           textTransform: inherit
         headingSmall:
           fontFamily: Inter
+          textColor:
+            tokenName: color.brand.Text gray
+            type: design-token
+          textTransform: inherit
         headingXLarge:
           fontFamily: Inter
           fontWeight: 600
+          textColor:
+            tokenName: color.brand.Text gray
+            type: design-token
           textTransform: inherit
         headingXSmall:
           fontFamily: Inter
+          textColor:
+            tokenName: color.brand.Text gray
+            type: design-token
+          textTransform: inherit
         link:
           fontWeight: 600
           textColor:
-            tokenName: color-text-link
+            tokenName: color.base.orange
             type: design-token
+          textTransform: inherit
           underline: true
         pageDescription:
           fontFamily: Inter
           fontWeight: 400
+          textColor:
+            tokenName: color.brand.Text gray
+            type: design-token
+          textTransform: inherit
         pageTitle:
           fontFamily: Inter
           fontWeight: 800
+          textColor:
+            tokenName: color.brand.Text gray
+            type: design-token
           textTransform: inherit
     version: 10
-  title: Public Demo
+  title: Design System
   tokens:
     theming:
       enabledRendererIds:

diff --git a/data/demos/demo.2ysfvm4ShE.json b/data/demos/demo.2ysfvm4ShE.json
@@ -2,16 +2,16 @@
   "data": {
     "props": {
       "mode": "info",
-      "size": "medium",
+      "size": "large",
       "type": "solid",
       "url": "#url",
-      "outline": false,
+      "outline": true,
       "icon": false
     },
     "slots": {
       "children": [
         {
-          "text": "Button",
+          "text": "Best Button",
           "type": "text"
         }
       ]

diff --git a/data/knapsack.custom-page.Components-Overview.yml b/data/knapsack.custom-page.Components-Overview.yml
@@ -11,7 +11,10 @@ settings:
     textColorDescription:
       type: design-token
       colorValue: '#FFFFFF'
-      tokenName: color-brand-black
+      tokenName: color.brand.Text gray
+    backgroundColor:
+      type: design-token
+      tokenName: color.base.Bone
   hideTableOfContents: true
 description: Browse all available components and understand current status
 blockIds:

diff --git a/data/knapsack.custom-page.Design-Tokens-lNWaUqkDSo.yml b/data/knapsack.custom-page.Design-Tokens-lNWaUqkDSo.yml
@@ -6,11 +6,17 @@ settings:
     textColorTitle:
       type: design-token
       colorValue: '#000000'
-      tokenName: color-brand-primary
+      tokenName: color.base.orange
     backgroundImage: null
     textColorDescription:
-      type: value
+      type: design-token
       colorValue: '#000000'
+      tokenName: color.brand.Text gray
+    backgroundSize: contain
+    backgroundPosition: right
+    backgroundColor:
+      type: design-token
+      tokenName: color.base.Bone
 description: Building blocks of your digital brand
 blockIds:
   - RX3sN_L-4o

diff --git a/data/knapsack.custom-page.Page-Level-Prototyping.yml b/data/knapsack.custom-page.Page-Level-Prototyping.yml
@@ -2,17 +2,21 @@ id: Page-Level-Prototyping
 title: Page-Level Prototyping
 settings:
   pageHeader:
-    size: large
+    size: small
     textColorTitle:
       type: design-token
       colorValue: '#000000'
       tokenName: color-brand-primary
-    backgroundImage: https://knapsack.imgix.net/site/public-demo/lego-clipart27-w46dfphz5ljpg
+    backgroundImage: null
     textColorDescription:
-      type: value
+      type: design-token
       colorValue: '#000000'
+      tokenName: color.brand.Text gray
     backgroundSize: contain
     backgroundPosition: right
+    backgroundColor:
+      type: design-token
+      tokenName: color.base.Bone
 description: |-
   Work with patterns to create new experiences.
   Collaborate to build, share, and test your ideas with real code!

diff --git a/data/knapsack.custom-page.homepage.yml b/data/knapsack.custom-page.homepage.yml
@@ -1,17 +1,19 @@
 id: homepage
-title: Welcome to Knapsack
+title: Welcome to the Kyndryl Design System
 settings:
   pageHeader:
-    size: full
+    size: large
     textColorTitle:
       type: design-token
-      tokenName: color-brand-primary
+      tokenName: color.brand.white
       colorValue: '#FFFFFF'
-    backgroundImage: https://knapsack.imgix.net/site/public-demo/clark-van-der-beken-596baa0mpym-unsplash-o5drv55uvq.jpg
+    backgroundImage: https://knapsack.imgix.net/site/public-demo/homepage-flora-01-7opysbetejjpeg
     textColorDescription:
       type: design-token
-      tokenName: color-Meh-black
+      tokenName: color.brand.white
       colorValue: '#FFFFFF'
+    backgroundSize: cover
+    backgroundOverlay: false
 description: |-
   A shared platform for product teams to collaborate
   on documenting, designing, building, testing, and shipping

diff --git a/data/knapsack.custom-page.mobile.yml b/data/knapsack.custom-page.mobile.yml
@@ -10,3 +10,14 @@ blockIds:
   - XKsi6dzLr
   - ivlDfFw6Nl
 description: A Comprehensive Guide To Mobile App Design
+settings:
+  pageHeader:
+    backgroundColor:
+      type: design-token
+      tokenName: color.base.Bone
+    textColorTitle:
+      type: design-token
+      tokenName: color.base.orange
+    textColorDescription:
+      type: design-token
+      tokenName: color.brand.Text gray
diff --git a/data/knapsack.custom-page.welcome-to-knapsack.yml b/data/knapsack.custom-page.welcome-to-knapsack.yml
@@ -9,12 +9,18 @@ settings:
     backgroundImage: null
     textColorDescription:
       type: design-token
-      tokenName: color-brand-black
+      tokenName: color.brand.Text gray
       colorValue: '#000000'
     size: small
+    backgroundColor:
+      type: design-token
+      tokenName: color.base.Bone
 description: The collaborative design system
 blockIds:
   - 6-qXFUJ0eH
+  - 4NGzpVhoYR
+  - uDBmvumiju
+  - WA7jI-VJ8g
   - tY2rt92bob
   - oa-y7sAwqr
   - 7Y7v_lnZJh