From 45b512e2571c11915a9b14e7873d5c7d1c1753f9 Mon Sep 17 00:00:00 2001 From: "knapsack-cloud[bot]" <57459571+knapsack-cloud[bot]@users.noreply.github.com> Date: Wed, 15 Nov 2023 19:53:22 +0000 Subject: [PATCH] final final for real v5 final - Andrew Rohman --- knapsack/data/blocks/block.F8WB9M5sOm.json | 57 +++++++ knapsack/data/blocks/block.YFtGDhZu9V.json | 74 +++++++++ knapsack/data/blocks/block.ejxGgWxbMQ.json | 144 ++++++++++++++++++ .../knapsack.custom-page.icons-wjnma9eisu.yml | 3 + knapsack/data/knapsack.custom-page.motion.yml | 3 + ...apsack.custom-page.overview-6cwfl845ik.yml | 22 ++- .../data/knapsack.custom-page.prominence.yml | 3 + knapsack/data/knapsack.custom-page.radius.yml | 3 + ...apsack.custom-page.untitled-r9prlykxo1.yml | 6 +- knapsack/data/knapsack.navs.yml | 34 ++++- knapsack/data/knapsack.pattern.button.json | 2 + 11 files changed, 342 insertions(+), 9 deletions(-) create mode 100644 knapsack/data/blocks/block.F8WB9M5sOm.json create mode 100644 knapsack/data/blocks/block.YFtGDhZu9V.json create mode 100644 knapsack/data/blocks/block.ejxGgWxbMQ.json create mode 100644 knapsack/data/knapsack.custom-page.icons-wjnma9eisu.yml create mode 100644 knapsack/data/knapsack.custom-page.motion.yml create mode 100644 knapsack/data/knapsack.custom-page.prominence.yml create mode 100644 knapsack/data/knapsack.custom-page.radius.yml diff --git a/knapsack/data/blocks/block.F8WB9M5sOm.json b/knapsack/data/blocks/block.F8WB9M5sOm.json new file mode 100644 index 000000000..614973ff0 --- /dev/null +++ b/knapsack/data/blocks/block.F8WB9M5sOm.json @@ -0,0 +1,57 @@ +{ + "id": "F8WB9M5sOm", + "data": { + "content": { + "type": "doc", + "content": [ + { + "type": "heading", + "attrs": { + "level": 2, + "textAlign": "left" + }, + "content": [ + { + "text": "Cedar UI libraries", + "type": "text" + } + ] + }, + { + "type": "paragraph", + "attrs": { + "textAlign": "left" + }, + "content": [ + { + "text": "We have several ", + "type": "text" + }, + { + "text": "Figma UI libraries", + "type": "text", + "marks": [ + { + "type": "link", + "attrs": { + "href": "https://www.figma.com/community/file/1057372737094902305", + "class": null, + "target": "_blank" + } + }, + { + "type": "underline" + } + ] + }, + { + "text": " housing the Cedar design system. These libraries, as well as a few others, are pre-loaded when you create a new file within the REI Figma ecosystem. To take advantage of everything Cedar offers, make sure these libraries are turned on (and turn off libraries from other teams that you might not need).", + "type": "text" + } + ] + } + ] + } + }, + "blockType": "text-editor" +} diff --git a/knapsack/data/blocks/block.YFtGDhZu9V.json b/knapsack/data/blocks/block.YFtGDhZu9V.json new file mode 100644 index 000000000..efceff423 --- /dev/null +++ b/knapsack/data/blocks/block.YFtGDhZu9V.json @@ -0,0 +1,74 @@ +{ + "id": "YFtGDhZu9V", + "data": { + "shortcuts": [ + { + "id": "RgI6OKTwCA", + "link": { + "name": "Accessibility", + "path": "/pages/untitled-avtjcb414g" + }, + "image": "https://knapsack.imgix.net/site/rei-cedar/tree-rings-kdzj_zmznx.png", + "title": "Accessibility", + "description": "Designing for accessibility means being inclusive to the needs of our users" + }, + { + "id": "uVJLIWSzZ7", + "link": { + "name": "Color", + "path": "/pages/untitled-gmukzugeri" + }, + "title": "Color", + "description": "One of the most important attributes of brand expression" + }, + { + "id": "fWXFA6nndd", + "link": { + "name": "Icons", + "path": "/pages/icons-wjnma9eisu" + }, + "title": "Icons", + "description": "Symbolize commands, navigation, utility, or common actions" + }, + { + "id": "nXSENLg2ol", + "link": { + "name": "Motion", + "path": "/pages/motion" + }, + "title": "Motion", + "description": "Enhance the customer's understanding of REI's digital products" + }, + { + "id": "JlkTja-yVQ", + "link": { + "name": "Prominence", + "path": "/pages/prominence" + }, + "title": "Prominence", + "description": "Elevating interface objects to create a meaningful sense of depth" + }, + { + "id": "EgYFC6Guoh", + "link": { + "name": "Radius", + "path": "/pages/radius" + }, + "title": "Radius", + "description": "Corner appearance of containers" + } + ], + "gridStyles": { + "columns": "3", + "centered": false + }, + "tileStyles": { + "rounded": true, + "outlined": true, + "imageSize": "none", + "titleSize": "xsmall" + } + }, + "size": null, + "blockType": "shortcut-tiles" +} diff --git a/knapsack/data/blocks/block.ejxGgWxbMQ.json b/knapsack/data/blocks/block.ejxGgWxbMQ.json new file mode 100644 index 000000000..f2f7bd483 --- /dev/null +++ b/knapsack/data/blocks/block.ejxGgWxbMQ.json @@ -0,0 +1,144 @@ +{ + "id": "ejxGgWxbMQ", + "data": { + "content": { + "type": "doc", + "content": [ + { + "type": "paragraph", + "attrs": { + "textAlign": "left" + }, + "content": [ + { + "text": "Welcome to the Cedar Design System! Cedar is used as a foundation for REI's digital products, creating consistency by linking UI elements to documentation (this site) and code.", + "type": "text" + } + ] + }, + { + "type": "heading", + "attrs": { + "level": 2, + "textAlign": "left" + }, + "content": [ + { + "text": "Install Figma", + "type": "text" + } + ] + }, + { + "type": "paragraph", + "attrs": { + "textAlign": "start" + }, + "content": [ + { + "text": "Figma is REI's design tool of choice and houses Cedar's UI toolkits. You can use Figma on a web browser, but you'll get the most out of it if you download the desktop app.", + "type": "text" + } + ] + }, + { + "type": "paragraph", + "attrs": { + "textAlign": "start" + }, + "content": [ + { + "text": "Access the Figma desktop app using an REI tool called \"Self Service.\" On a Mac, open your applications folder and navigate to Self Service or open Spotlight Search and search for it. In Self Service, search for \"Figma\" and install. If you need help or have problems installing Figma, please contact REI's IT Help Desk.", + "type": "text" + } + ] + }, + { + "type": "paragraph", + "attrs": { + "textAlign": "start" + }, + "content": [ + { + "text": "REI typefaces are automatically distributed through Figma, so you won't need to install any fonts. However, if you plan on using REI typefaces in other applications you can install \"Stuart TTF • Digital\" and \"Graphic TTF • Digital\" through the Self Service tool.", + "type": "text" + } + ] + }, + { + "type": "heading", + "attrs": { + "level": 3, + "textAlign": "start" + }, + "content": [ + { + "text": "Next steps", + "type": "text" + } + ] + }, + { + "type": "orderedList", + "attrs": { + "start": 1 + }, + "content": [ + { + "type": "listItem", + "content": [ + { + "type": "paragraph", + "attrs": { + "textAlign": "left" + }, + "content": [ + { + "text": "Explore some of REI's guidelines to get a better understanding of the co-op's visual and verbal standards. The DAM (Digital Asset Manager) houses many of these guidelines as well as other important assets. You'll need to request access before viewing documents on the DAM, but the process is fairly quick (about 1-2 days).", + "type": "text" + } + ] + } + ] + }, + { + "type": "listItem", + "content": [ + { + "type": "paragraph", + "attrs": { + "textAlign": "left" + }, + "content": [ + { + "text": "Read about the foundational elements central to designing with Cedar.", + "type": "text" + } + ] + } + ] + }, + { + "type": "listItem", + "content": [ + { + "type": "paragraph", + "attrs": { + "textAlign": "left" + }, + "content": [ + { + "text": "Review Cedar components, the building blocks to creating an interface. The components listed on this site will mirror those available in the Figma Web Components Toolkit.", + "type": "text" + } + ] + } + ] + } + ] + } + ] + } + }, + "blockType": "text-editor" +} diff --git a/knapsack/data/knapsack.custom-page.icons-wjnma9eisu.yml b/knapsack/data/knapsack.custom-page.icons-wjnma9eisu.yml new file mode 100644 index 000000000..4ad377587 --- /dev/null +++ b/knapsack/data/knapsack.custom-page.icons-wjnma9eisu.yml @@ -0,0 +1,3 @@ +id: icons-wjnma9eisu +title: Icons +blockIds: [] diff --git a/knapsack/data/knapsack.custom-page.motion.yml b/knapsack/data/knapsack.custom-page.motion.yml new file mode 100644 index 000000000..5945280dd --- /dev/null +++ b/knapsack/data/knapsack.custom-page.motion.yml @@ -0,0 +1,3 @@ +id: motion +title: Motion +blockIds: [] diff --git a/knapsack/data/knapsack.custom-page.overview-6cwfl845ik.yml b/knapsack/data/knapsack.custom-page.overview-6cwfl845ik.yml index 7f5999bf7..32e77fecf 100644 --- a/knapsack/data/knapsack.custom-page.overview-6cwfl845ik.yml +++ b/knapsack/data/knapsack.custom-page.overview-6cwfl845ik.yml @@ -1,3 +1,21 @@ id: overview-6cwfl845ik -title: Overview -blockIds: [] +title: Guidelines +blockIds: + - YFtGDhZu9V +description: |- + Shared language that guides how we build + high-quality experiences +settings: + pageHeader: + backgroundColor: + type: design-token + tokenName: global.color.background.default + textColorTitle: + type: design-token + tokenName: global.color.text.inverse + textColorDescription: + type: design-token + tokenName: global.color.text.inverse + backgroundImage: https://knapsack.imgix.net/site/rei-cedar/cdr-guidelines-landing-1-h_jrfyqvz.png + backgroundSize: cover + size: large diff --git a/knapsack/data/knapsack.custom-page.prominence.yml b/knapsack/data/knapsack.custom-page.prominence.yml new file mode 100644 index 000000000..92fc22136 --- /dev/null +++ b/knapsack/data/knapsack.custom-page.prominence.yml @@ -0,0 +1,3 @@ +id: prominence +title: Prominence +blockIds: [] diff --git a/knapsack/data/knapsack.custom-page.radius.yml b/knapsack/data/knapsack.custom-page.radius.yml new file mode 100644 index 000000000..6e166d43e --- /dev/null +++ b/knapsack/data/knapsack.custom-page.radius.yml @@ -0,0 +1,3 @@ +id: radius +title: Radius +blockIds: [] diff --git a/knapsack/data/knapsack.custom-page.untitled-r9prlykxo1.yml b/knapsack/data/knapsack.custom-page.untitled-r9prlykxo1.yml index 0200c6f49..abbbf9090 100644 --- a/knapsack/data/knapsack.custom-page.untitled-r9prlykxo1.yml +++ b/knapsack/data/knapsack.custom-page.untitled-r9prlykxo1.yml @@ -1,3 +1,5 @@ id: untitled-r9prlykxo1 -title: Onboarding -blockIds: [] +title: Designer Onboarding +blockIds: + - ejxGgWxbMQ + - F8WB9M5sOm diff --git a/knapsack/data/knapsack.navs.yml b/knapsack/data/knapsack.navs.yml index c14ed7ef4..1db8c2be5 100644 --- a/knapsack/data/knapsack.navs.yml +++ b/knapsack/data/knapsack.navs.yml @@ -134,6 +134,11 @@ byId: name: Icons parentId: contributing-lypzahj610 path: /pages/icons + icons-wjnma9eisu: + id: icons-wjnma9eisu + name: Icons + parentId: design-foundations + path: /pages/icons-wjnma9eisu image: id: image name: Image @@ -159,6 +164,11 @@ byId: name: Messaging parentId: components path: '' + motion: + id: motion + name: Motion + parentId: design-foundations + path: /pages/motion notifications-and-alerts: id: notifications-and-alerts name: Notifications & alerts @@ -176,7 +186,7 @@ byId: path: /pages/overview overview-6cwfl845ik: id: overview-6cwfl845ik - name: Overview + name: Guidelines parentId: guidelines path: /pages/overview-6cwfl845ik patterns: @@ -184,6 +194,16 @@ byId: name: Patterns parentId: design-system path: '' + prominence: + id: prominence + name: Prominence + parentId: design-foundations + path: /pages/prominence + radius: + id: radius + name: Radius + parentId: design-foundations + path: /pages/radius rating: id: rating name: Rating @@ -261,7 +281,7 @@ byId: path: /pages/untitled-nzc5pti-3o untitled-r9prlykxo1: id: untitled-r9prlykxo1 - name: Onboarding + name: Designer Onboarding parentId: designing path: /pages/untitled-r9prlykxo1 untitled-rtj8loz9f7: @@ -303,6 +323,9 @@ order: - what's-new - releases - untitled-nbfepannyu + - cedar-13 + - cedar-12 + - cedar-11 - about - about-_otvuwuigm - untitled-gov8ltndz @@ -322,6 +345,8 @@ order: - overview-6cwfl845ik - design-foundations - untitled-gmukzugeri + - icons-wjnma9eisu + - motion - core-principles - untitled-avtjcb414g - contributing-lypzahj610 @@ -357,6 +382,5 @@ order: - status - update-and-loading - github - - cedar-13 - - cedar-12 - - cedar-11 + - prominence + - radius diff --git a/knapsack/data/knapsack.pattern.button.json b/knapsack/data/knapsack.pattern.button.json index 06c06f93a..dfc6fc79a 100644 --- a/knapsack/data/knapsack.pattern.button.json +++ b/knapsack/data/knapsack.pattern.button.json @@ -17,6 +17,8 @@ "30NNRz18sD", "PnccNj6sKA", "PnccNj6sKA", + "PnccNj6sKA", + "PnccNj6sKA", "PnccNj6sKA" ], "blockIds": []