Merge branch 'release/0.9.2'

coggen · Apr 2, 2024 · edf26cd · edf26cd
2 parents 004a767 + 7f47355
commit edf26cd
Show file tree

Hide file tree

Showing 119 changed files with 1,049 additions and 347 deletions.
diff --git a/.github/workflows/deploy-storybook-pages.yml b/.github/workflows/deploy-storybook-pages.yml
@@ -27,8 +27,9 @@ jobs:
         npm ci
         npm run build
         npm run build-storybook
+        mv www storybook-static/prototypes
     
-    - name: Upload artifact
+    - name: Upload storybook artifact
       uses: actions/[email protected]
       with:
         path: storybook-static

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -2,7 +2,7 @@
   "name": "@sharpen-com/kezuri",
   "description": "The Sharpen Design System",
   "license": "MIT",
-  "version": "0.9.1",
+  "version": "0.9.2",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",
   "es2015": "dist/esm/index.mjs",

diff --git a/src/components/sharpen-simple-navigation/sharpen-simple-navigation.scss b/src/components/sharpen-simple-navigation/sharpen-simple-navigation.scss
@@ -1,19 +1,19 @@
 sharpen-simple-navigation {
   .navbar {
-    height: 4.5rem;
+    padding: 1em 0 1.5em;
     background-color: var(--color-mint);
     color: var(--color-evergreen);
-    display: flex;
-    align-items: center;
-    justify-content: space-around;
+    text-align: center;
     --mask: 
-      linear-gradient(to top,#0000 10px,#000 0),
-      radial-gradient(10px,#000 98%,#0000) bottom/18.5px 20px;
+      linear-gradient(to top,#0000 15px,#000 0),
+      radial-gradient(15px,#000 98%,#0000) bottom/30px 30px;
     -webkit-mask: var(--mask);
             mask: var(--mask);
+    font-family: var(--font-family-serif);     
+    letter-spacing: 8pt;
   }
 
-  .navbar .brand img { height: 31px;  }
+  .navbar .brand img { height: 31px; vertical-align: -6px;  }
 
   &[background="sunrise"] .navbar {
     background-color: var(--color-sunrise);

diff --git a/src/components/sharpen-simple-navigation/sharpen-simple-navigation.tsx b/src/components/sharpen-simple-navigation/sharpen-simple-navigation.tsx
@@ -10,17 +10,24 @@ export class SharpenSimpleNavigation {
   @Prop() brandHref: string;
 
   render() {
-
-    // Logo mark without the text
-    const markSrc = getAssetPath('assets/images/brand/sharpen_mark_evergreen.png');
-
     return (
       <Host>
         <div class="navbar container-fluid">
-          <a class="brand" href={this.brandHref}><img src={markSrc} /></a>
+          <slot>{this.getBrand()}</slot>
         </div>
       </Host>
     );
   }
 
+  getBrand() {
+    if (this.brandHref) {
+      // Logo mark without the text
+      const markSrc = getAssetPath('assets/images/brand/sharpen_mark_evergreen.png');
+
+      return (
+        <a class="brand" href={this.brandHref}><img src={markSrc} /></a>
+      )
+    }
+  }
+
 }
diff --git a/src/index.html b/src/index.html
@@ -4,9 +4,9 @@
     <meta charset="utf-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=5.0" />
     <title>prototypes.sharpen.com</title>
-    <link rel="stylesheet" href="/build/kezuri.css" />
-    <script type="module" src="/build/kezuri.esm.js"></script>
-    <script nomodule src="/build/kezuri.js"></script>
+    <link rel="stylesheet" href="build/kezuri.css" />
+    <script type="module" src="build/kezuri.esm.js"></script>
+    <script nomodule src="build/kezuri.js"></script>
     <style>
       body {
         padding: 3rem;
@@ -34,91 +34,95 @@ <h1 class="sharpen-heading-2xl">prototypes.sharpen.com</h1>
         </thead>
         <tbody>
           <tr>
-            <td><a href="/storymaker/">Storymaker Round 1</a></td>
+            <td><a href="storymaker-integration/">Storymaker integrated into the app</a></td>
             <td>Mar 2024</td>
           </tr>
           <tr>
-            <td><a href="/back-button-bug/">Back Button Bug</a></td>
+            <td><a href="storymaker/">Storymaker</a></td>
+            <td>Mar 2024</td>
+          </tr>
+          <tr>
+            <td><a href="back-button-bug/">Back Button Bug</a></td>
             <td>Feb 2024</td>
           </tr>
           <tr>
-            <td><a href="/parent-portal/">Parent Portal</a></td>
+            <td><a href="parent-portal/">Parent Portal</a></td>
             <td>Feb 2024</td>
           </tr>
           <tr>
-            <td><a href="/script-typography/">Enhanced typography for instructor script</a></td>
+            <td><a href="script-typography/">Enhanced typography for instructor script</a></td>
             <td>Feb 2024</td>
           </tr>
           <tr>
-            <td><a href="/easier-script/">More supportive instructor script</a></td>
+            <td><a href="easier-script/">More supportive instructor script</a></td>
             <td>Feb 2024</td>
           </tr>
           <tr>
-            <td><a href="/onboarding-wizard/">Onboarding Wizard</a></td>
+            <td><a href="onboarding-wizard/">Onboarding Wizard</a></td>
             <td>Dec 2023</td>
           </tr>
           <tr>
-            <td><a href="/responsive-nav/">Responsive Primary Navigation</a></td>
+            <td><a href="responsive-nav/">Responsive Primary Navigation</a></td>
             <td>Dec 2023</td>
           </tr>
           <tr>
-            <td><a href="/dashboard-cards/">Dashboard Card Variations</a></td>
+            <td><a href="dashboard-cards/">Dashboard Card Variations</a></td>
             <td>Dec 2023</td>
           </tr>
           <tr>
-            <td><a href="/mobile-placement/">Mobile-friendly Placement Assessment</a></td>
+            <td><a href="mobile-placement/">Mobile-friendly Placement Assessment</a></td>
             <td>Oct 2023</td>
           </tr>
           <tr>
-            <td><a href="/pricing/">Pricing Plans</a></td>
+            <td><a href="pricing/">Pricing Plans</a></td>
             <td>Oct 2023</td>
           </tr>
           <tr>
-            <td><a href="/cancellation/">Cancellation Question</a></td>
+            <td><a href="cancellation/">Cancellation Question</a></td>
             <td>Oct 2023</td>
           </tr>
           <tr>
-            <td><a href="/onboarding-v3/">New onboarding flow, iteration 3</a></td>
+            <td><a href="onboarding-v3/">New onboarding flow, iteration 3</a></td>
             <td>Sep 2023</td>
           </tr>
           <tr>
-            <td><a href="/onboarding-v2/">New onboarding flow, iteration 2</a></td>
+            <td><a href="onboarding-v2/">New onboarding flow, iteration 2</a></td>
             <td>Sep 2023</td>
           </tr>
           <tr>
-            <td><a href="/cancellation/">Cancellation process</a></td>
+            <td><a href="cancellation/">Cancellation process</a></td>
             <td>Sep 2023</td>
           </tr>
           <tr>
-            <td><a href="/onboarding/">New onboarding flow</a></td>
+            <td><a href="onboarding/">New onboarding flow</a></td>
             <td>Sep 2023</td>
           </tr>
           <tr>
-            <td><a href="/placement-result/">Reading Placement Result</a></td>
+            <td><a href="placement-result/">Reading Placement Result</a></td>
             <td>Sep 2023</td>
           </tr>
           <tr>
-            <td><a href="/practice-pdfs/">Extra Practice PDFs</a></td>
+            <td><a href="practice-pdfs/">Extra Practice PDFs</a></td>
             <td>Aug 2023</td>
           </tr>
           <tr>
-            <td><a href="/dashboard-spelling/">Dashboard with Spelling cards</a></td>
+            <td><a href="dashboard-spelling/">Dashboard with Spelling cards</a></td>
             <td>Aug 2023</td>
           </tr>
           <tr>
-            <td><a href="/new-learner/">New learner increases subscription quantity</a></td>
+            <td><a href="new-learner/">New learner increases subscription quantity</a></td>
             <td>Aug 2023</td>
           </tr>
           <tr>
-            <td><a href="/assessments/">Assessments with new components</a></td>
+            <td><a href="assessments/">Assessments with new components</a></td>
             <td>Aug 2023</td>
           </tr>
           <tr>
-            <td><a href="/forms/">Form elements</a></td>
+            <td><a href="forms/">Form elements</a></td>
             <td>Aug 2023</td>
           </tr>
           <tr>
-            <td><a href="/account/">Multiple subscriptions with monthly invoices</a></td>
+            <td><a href="account/">Multiple subscriptions with monthly invoices</a></td>
             <td>July 2023</td>
           </tr>
         </tbody>

diff --git a/src/prototypes/account/index.html b/src/prototypes/account/index.html
@@ -4,9 +4,9 @@
     <meta charset="utf-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=5.0" />
     <title>Sharpen Prototype: Account</title>
-    <link rel="stylesheet" href="/build/kezuri.css" />
-    <script type="module" src="/build/kezuri.esm.js"></script>
-    <script nomodule src="/build/kezuri.js"></script>
+    <link rel="stylesheet" href="../build/kezuri.css" />
+    <script type="module" src="../build/kezuri.esm.js"></script>
+    <script nomodule src="../build/kezuri.js"></script>
   </head>
   <body>
 

diff --git a/src/prototypes/account/invoices.html b/src/prototypes/account/invoices.html
@@ -4,9 +4,9 @@
     <meta charset="utf-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=5.0" />
     <title>Sharpen Prototype: Account</title>
-    <link rel="stylesheet" href="/build/kezuri.css" />
-    <script type="module" src="/build/kezuri.esm.js"></script>
-    <script nomodule src="/build/kezuri.js"></script>
+    <link rel="stylesheet" href="../build/kezuri.css" />
+    <script type="module" src="../build/kezuri.esm.js"></script>
+    <script nomodule src="../build/kezuri.js"></script>
   </head>
   <body>
 

diff --git a/src/prototypes/account/learners.html b/src/prototypes/account/learners.html
@@ -4,9 +4,9 @@
     <meta charset="utf-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=5.0" />
     <title>Sharpen Prototype: Account</title>
-    <link rel="stylesheet" href="/build/kezuri.css" />
-    <script type="module" src="/build/kezuri.esm.js"></script>
-    <script nomodule src="/build/kezuri.js"></script>
+    <link rel="stylesheet" href="../build/kezuri.css" />
+    <script type="module" src="../build/kezuri.esm.js"></script>
+    <script nomodule src="../build/kezuri.js"></script>
   </head>
   <body>
 

diff --git a/src/prototypes/account/learners_add.html b/src/prototypes/account/learners_add.html
@@ -4,9 +4,9 @@
     <meta charset="utf-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=5.0" />
     <title>Sharpen Prototype: Account</title>
-    <link rel="stylesheet" href="/build/kezuri.css" />
-    <script type="module" src="/build/kezuri.esm.js"></script>
-    <script nomodule src="/build/kezuri.js"></script>
+    <link rel="stylesheet" href="../build/kezuri.css" />
+    <script type="module" src="../build/kezuri.esm.js"></script>
+    <script nomodule src="../build/kezuri.js"></script>
   </head>
   <body>
 

diff --git a/src/prototypes/account/learners_select.html b/src/prototypes/account/learners_select.html
@@ -4,9 +4,9 @@
     <meta charset="utf-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=5.0" />
     <title>Sharpen Prototype: Account</title>
-    <link rel="stylesheet" href="/build/kezuri.css" />
-    <script type="module" src="/build/kezuri.esm.js"></script>
-    <script nomodule src="/build/kezuri.js"></script>
+    <link rel="stylesheet" href="../build/kezuri.css" />
+    <script type="module" src="../build/kezuri.esm.js"></script>
+    <script nomodule src="../build/kezuri.js"></script>
   </head>
   <body>
 

diff --git a/src/prototypes/account/payment.html b/src/prototypes/account/payment.html
@@ -4,9 +4,9 @@
     <meta charset="utf-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=5.0" />
     <title>Sharpen Prototype: Account</title>
-    <link rel="stylesheet" href="/build/kezuri.css" />
-    <script type="module" src="/build/kezuri.esm.js"></script>
-    <script nomodule src="/build/kezuri.js"></script>
+    <link rel="stylesheet" href="../build/kezuri.css" />
+    <script type="module" src="../build/kezuri.esm.js"></script>
+    <script nomodule src="../build/kezuri.js"></script>
   </head>
   <body>
 

diff --git a/src/prototypes/assessments/index.html b/src/prototypes/assessments/index.html
@@ -4,9 +4,9 @@
   <meta charset="utf-8" />
   <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=5.0" />
   <title>Sharpen Prototype: Assessments</title>
-  <link rel="stylesheet" href="/build/kezuri.css" />
-  <script type="module" src="/build/kezuri.esm.js"></script>
-  <script nomodule src="/build/kezuri.js"></script>
+  <link rel="stylesheet" href="../build/kezuri.css" />
+  <script type="module" src="../build/kezuri.esm.js"></script>
+  <script nomodule src="../build/kezuri.js"></script>
   <style>
     .assessment-collection + .assessment-collection, 
     .assessment-collection sharpen-card + sharpen-card {