Merge pull request #9 from DTS-STN/develop

Merge develop to main
DTS-STN · Dec 1, 2021 · d69e2be · d69e2be · vercel · Dec 1, 2021
2 parents 1177002 + a18efee
commit d69e2be
Show file tree

Hide file tree

Showing 7 changed files with 50 additions and 86 deletions.
diff --git a/package.json b/package.json
@@ -21,6 +21,7 @@
   },
   "dependencies": {
     "@babel/core": "^7.16.0",
+    "@tailwindcss/forms": "^0.3.4",
     "isarray": "^2.0.5",
     "next": "^12.0.3",
     "prom-client": "^14.0.1",

diff --git a/pages/index.tsx b/pages/index.tsx
@@ -6,7 +6,7 @@ import styles from '../styles/Home.module.css'
 const Home: NextPage = () => {
   return (
     <main>
-      <div className="container mx-auto flex flex-col mt-8 font-gc space-y-4 mb-16">
+      <div className="container mx-auto flex flex-col mt-8 space-y-4 mb-16">
         <h1 className="h1">
           Implementing a slice of the{' '}
           <a
@@ -30,7 +30,7 @@ const Home: NextPage = () => {
           Once we&apos;ve coordinated with the client, we can finish up
           accessibility and merge any other solutions for components.
         </p>
-        <div className="grid tablet:grid-cols-1 mobile:grid-cols-2 gap-4">
+        <div className="grid grid-cols-1 lg:grid-cols-2 gap-4">
           <div className="rounded border-[1px] border-solid border-default-text px-6 py-4 space-y-4">
             <p className="h5">Inputs</p>
             <input type="text" placeholder="name" className="form-control" />
@@ -70,7 +70,11 @@ const Home: NextPage = () => {
             <div className="checkbox">
               <label htmlFor="checkbox1">
                 <span>Do you live in Canada?</span>
-                <input type="checkbox" id="checkbox1" className="ml-2" />
+                <input
+                  type="checkbox"
+                  id="checkbox1"
+                  className="ml-2 rounded"
+                />
               </label>
             </div>
             <select className="form-control" placeholder="Select from ...">

diff --git a/public/insomnia.yaml b/public/insomnia.yaml
@@ -1,6 +1,6 @@
 _type: export
 __export_format: 4
-__export_date: 2021-11-30T15:32:57.688Z
+__export_date: 2021-11-30T21:17:36.143Z
 __export_source: insomnia.desktop.app:v2021.6.0
 resources:
   - _id: req_wrk_90d4d590fb5a4034b3d98b7c089648520e5d7dae
@@ -83,7 +83,7 @@ resources:
     _type: cookie_jar
   - _id: spc_8baaccaea9424f4b84a71dd08f84ee16
     parentId: wrk_90d4d590fb5a4034b3d98b7c08964852
-    modified: 1638286366923
+    modified: 1638307046353
     created: 1637016450877
     fileName: eligibility-estimator-openapi
     contents: >
@@ -93,11 +93,13 @@ resources:
         title: Benefits Eligibility Estimator API
         version: '1.0'
         description: >
-          Calculates eligibility for OAS, GIS, and more.
-          Support for entitlement value and other benefits is coming soon.
+          Calculates eligibility for OAS, GIS, and more. Support for entitlement value is coming soon.
 
 
-          The code for this project is available [here](https://github.com/DTS-STN/eligibility-estimator-api).
+          Please note that this is simply a testing interface for the backend API, and is not meant to serve as a user-facing frontend interface.
+
+
+          The code for this project is available [here](https://github.com/DTS-STN/eligibility-estimator).
 
 
           **To interact with the API, click the "Try it out" button below on the right.**

diff --git a/public/openapi.yaml b/public/openapi.yaml
@@ -3,11 +3,13 @@ info:
   title: Benefits Eligibility Estimator API
   version: '1.0'
   description: >
-    Calculates eligibility for OAS, GIS, and more.
-    Support for entitlement value and other benefits is coming soon.
+    Calculates eligibility for OAS, GIS, and more. Support for entitlement value is coming soon.
 
 
-    The code for this project is available [here](https://github.com/DTS-STN/eligibility-estimator-api).
+    Please note that this is simply a testing interface for the backend API, and is not meant to serve as a user-facing frontend interface.
+
+
+    The code for this project is available [here](https://github.com/DTS-STN/eligibility-estimator).
 
 
     **To interact with the API, click the "Try it out" button below on the right.**

diff --git a/styles/globals.css b/styles/globals.css
@@ -42,33 +42,27 @@
 
   /* typography gc overrides */
   .h1 {
-    @apply text-h1 font-bold mb-[15px];
+    @apply text-h1 font-bold mb-[15px] font-header-gc;
   }
   .h2 {
-    @apply text-h2 font-bold mb-[15px];
-  }
-  .lead {
-    @apply text-lead font-bold mb-[15px];
+    @apply text-h2 font-bold mb-[15px] font-header-gc;
   }
   .h3 {
-    @apply text-h3 font-bold mb-[15px];
+    @apply text-h3 font-bold mb-[15px] font-header-gc;
   }
   .h4 {
-    @apply text-h4 font-bold mb-[15px];
+    @apply text-h4 font-bold mb-[15px] font-header-gc;
   }
   .h5 {
-    @apply text-h5 font-bold mb-[15px];
+    @apply text-h5 font-bold mb-[15px] font-header-gc;
   }
   .h6 {
-    @apply text-h6 font-bold mb-[15px];
-  }
-  .small {
-    @apply text-small;
+    @apply text-h6 font-bold mb-[15px] font-header-gc;
   }
 
   /* form controls */
   .form-control {
-    @apply max-w-full w-full h-auto min-h-9 block py-[6px] px-3 text-muted bg-white rounded border-[1px] border-solid border-form-border focus:border-form-highlighted focus:shadow-active-form;
+    @apply w-full h-auto min-h-9 block py-[6px] px-3 text-muted bg-white rounded border-[1px] border-solid border-form-border focus:border-form-highlighted focus:shadow-active-form;
     box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
     outline: none;
   }

diff --git a/tailwind.config.js b/tailwind.config.js
@@ -3,66 +3,14 @@ module.exports = {
   purge: ['./pages/**/*.{js,ts,jsx,tsx}', './components/**/*.{js,ts,jsx,tsx}'],
   darkMode: false,
   theme: {
-    screens: {
-      desktop: '1200px',
-      tablet: '992px',
-      mobile: '768px',
-    },
     fontSize: {
-      small: [
-        '87%',
-        {
-          lineHeight: 1.4375,
-        },
-      ],
-      h6: [
-        '14px',
-        {
-          lineHeight: 1.4375,
-        },
-      ],
-      base: [
-        '14px',
-        {
-          lineHeight: 1.4375,
-        },
-      ],
-      h5: [
-        '16px',
-        {
-          lineHeight: 1.1,
-        },
-      ],
-      h4: [
-        '18px',
-        {
-          lineHeight: 1.1,
-        },
-      ],
-      h3: [
-        '22px',
-        {
-          lineHeight: 1.1,
-        },
-      ],
-      lead: [
-        '24px',
-        {
-          lineHeight: 1.1,
-        },
-      ],
-      h2: [
-        '26px',
-        {
-          lineHeight: 1.1,
-        },
-      ],
-      h1: [
-        '34px',
-        {
-          lineHeight: 1.1,
-        },
-      ],
+      h6: ['19px', '21px'],
+      base: ['20px', '33px'],
+      h5: ['20px', '22px'],
+      h4: ['22px', '24px'],
+      h3: ['24px', '26px'],
+      h2: ['36px', '40px'],
+      h1: ['38px', '42px'], // requires red <hr /> below
     },
     colors: {
       'white': '#FFF',
@@ -74,7 +22,7 @@ module.exports = {
       'default-hover': '#cfd1d5',
       'default-border': '#dcdee1',
 
-      // primary - text is white
+      // primary
       'primary': '#2572b4',
       'primary-border': '#091c2d',
       'primary-hover': '#1c578a;',
@@ -109,7 +57,8 @@ module.exports = {
     },
     extend: {
       fontFamily: {
-        gc: 'Helvetica Neue, Helvetica, Arial, sans-serif',
+        'header-gc': 'Lato, sans-serif',
+        'sans': '"Noto Sans", sans-serif',
       },
       minHeight: {
         9: '36px',
@@ -137,5 +86,5 @@ module.exports = {
       ],
     },
   },
-  plugins: [],
+  plugins: [require('@tailwindcss/forms')],
 }
diff --git a/yarn.lock b/yarn.lock
@@ -781,6 +781,13 @@
   dependencies:
     "@sinonjs/commons" "^1.7.0"
 
+"@tailwindcss/forms@^0.3.4":
+  version "0.3.4"
+  resolved "https://registry.yarnpkg.com/@tailwindcss/forms/-/forms-0.3.4.tgz#e4939dc16450eccf4fd2029770096f38cbb556d4"
+  integrity sha512-vlAoBifNJUkagB+PAdW4aHMe4pKmSLroH398UPgIogBFc91D2VlHUxe4pjxQhiJl0Nfw53sHSJSQBSTQBZP3vA==
+  dependencies:
+    mini-svg-data-uri "^1.2.3"
+
 "@testing-library/dom@^8.0.0", "@testing-library/dom@^8.2.0":
   version "8.11.1"
   resolved "https://registry.yarnpkg.com/@testing-library/dom/-/dom-8.11.1.tgz#03fa2684aa09ade589b460db46b4c7be9fc69753"
@@ -4971,6 +4978,11 @@ min-indent@^1.0.0:
   resolved "https://registry.yarnpkg.com/min-indent/-/min-indent-1.0.1.tgz#a63f681673b30571fbe8bc25686ae746eefa9869"
   integrity sha512-I9jwMn07Sy/IwOj3zVkVik2JTvgpaykDZEigL6Rx6N9LbMywwUSMtxET+7lVoDLLd3O3IXwJwvuuns8UB/HeAg==
 
+mini-svg-data-uri@^1.2.3:
+  version "1.4.3"
+  resolved "https://registry.yarnpkg.com/mini-svg-data-uri/-/mini-svg-data-uri-1.4.3.tgz#43177b2e93766ba338931a3e2a84a3dfd3a222b8"
+  integrity sha512-gSfqpMRC8IxghvMcxzzmMnWpXAChSA+vy4cia33RgerMS8Fex95akUyQZPbxJJmeBGiGmK7n/1OpUX8ksRjIdA==
+
 minimalistic-assert@^1.0.0, minimalistic-assert@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/minimalistic-assert/-/minimalistic-assert-1.0.1.tgz#2e194de044626d4a10e7f7fbc00ce73e83e4d5c7"