From 9f57b768b2a129ed932cbb989f923181e37dac72 Mon Sep 17 00:00:00 2001 From: David Ernst Date: Thu, 13 Jun 2024 03:56:01 -0700 Subject: [PATCH 01/13] new-intro: Add links text --- src/intro/IntroPage.tsx | 43 ++++++++++++++++++++++++++++++++++------- 1 file changed, 36 insertions(+), 7 deletions(-) diff --git a/src/intro/IntroPage.tsx b/src/intro/IntroPage.tsx index a0e8ea59..9422956c 100644 --- a/src/intro/IntroPage.tsx +++ b/src/intro/IntroPage.tsx @@ -2,18 +2,47 @@ import { TailwindPreflight } from 'src/TailwindPreflight' export const IntroPage = () => { return ( -
+
+ {/* Header */}

SIV

Secure Internet Voting

-
    -
  1. One Person, One Vote
    2. -
  2. Vote in Seconds
    3. -
  3. Cryptographic Privacy
    4. + + {/* 1-2-3 Graphic */} +
      + {['One Person, One Vote', 'Vote in Seconds', 'Cryptographic Privacy'].map((text, index) => ( +
    1. +
      {index + 1}
      + {text} +
      2. + ))}
    -
    +
    ✅
    -
    Voter Verifiable Results
    +
    Voter Verifiable Results
    + + {/* Links */} + {[ + 'Demo — How SIV Works', + 'Bring to my area', + 'Create Own SIV Election', + 'Questions? FAQ', + 'Earn up to $10,000 for finding Security Flaws', + 'Compare vs Paper', + 'Contribute', + 'Blog', + 'Technical Documentation', + 'CS Research Powering SIV', + 'Spoiler-Free Voting Methods', + 'Preventing Future Authoritarianism', + 'Use in War Zones', + 'Malware-Resistant Verification', + ].map((text) => ( + + {text} + + ))} +
) From 23b0900d48d5e9261218407cffa5f379f160f8f0 Mon Sep 17 00:00:00 2001 From: David Ernst Date: Thu, 13 Jun 2024 04:15:17 -0700 Subject: [PATCH 02/13] new-intro: Add color to links --- src/intro/IntroPage.tsx | 45 ++++++++++++++++++++++++----------------- 1 file changed, 27 insertions(+), 18 deletions(-) diff --git a/src/intro/IntroPage.tsx b/src/intro/IntroPage.tsx index 9422956c..21da4596 100644 --- a/src/intro/IntroPage.tsx +++ b/src/intro/IntroPage.tsx @@ -11,38 +11,47 @@ export const IntroPage = () => {
    {['One Person, One Vote', 'Vote in Seconds', 'Cryptographic Privacy'].map((text, index) => (
  1. -
    {index + 1}
    +
    {index + 1}
    {text}
    2. ))}
-
+
✅
Voter Verifiable Results
{/* Links */} {[ - 'Demo — How SIV Works', - 'Bring to my area', - 'Create Own SIV Election', - 'Questions? FAQ', - 'Earn up to $10,000 for finding Security Flaws', - 'Compare vs Paper', - 'Contribute', - 'Blog', - 'Technical Documentation', - 'CS Research Powering SIV', - 'Spoiler-Free Voting Methods', - 'Preventing Future Authoritarianism', - 'Use in War Zones', - 'Malware-Resistant Verification', - ].map((text) => ( - + ['Demo — How SIV Works', 'border-green-800 bg-green-200'], + ['Bring to my area', 'border-orange-800 bg-orange-200'], + ['Create Own SIV Election', 'border-blue-800 bg-blue-200'], + ['Questions? FAQ', 'border-gray-400 bg-gray-200'], + [ + 'Earn up to $10,000 for finding Security Flaws', + 'border-purple-800 text-purple-700 bg-purple-100 bg-opacity-0', + ], + ['Compare vs Paper', 'border-amber-800 bg-amber-800 bg-opacity-10 hover:bg-opacity-20 active:bg-opacity-30'], + ['Contribute', 'border-pink-800 bg-pink-200'], + ['Blog', 'border-gray-600 bg-gray-50 hover:bg-gray-100 active:bg-gray-200/80'], + ['Technical Documentation'], + ['CS Research Powering SIV'], + ['Spoiler-Free Voting Methods'], + ['Preventing Future Authoritarianism'], + ['Use in War Zones'], + ['Malware-Resistant Verification'], + ].map(([text, customClasses = 'border-gray-300 hover:bg-gray-100 active:bg-gray-200/80']) => ( + {text} ))} + {/* Footer */} +
© 2024 SIV, Inc.
+
) From c9dfbb3025d2d00d891eb9d6509f64fb9422a89f Mon Sep 17 00:00:00 2001 From: David Ernst Date: Thu, 13 Jun 2024 04:43:52 -0700 Subject: [PATCH 03/13] intro: Fix className conflicts w/ twMerge --- package.json | 1 + src/intro/IntroPage.tsx | 6 +++++- 2 files changed, 6 insertions(+), 1 deletion(-) diff --git a/package.json b/package.json index 951d8c34..fe9ceecb 100644 --- a/package.json +++ b/package.json @@ -115,6 +115,7 @@ "prettier": "^2.0.2", "prettier-plugin-import-sort": "^0.0.4", "prettier-plugin-packagejson": "^2.2.5", + "tailwind-merge": "^2.3.0", "tailwindcss": "^3.3.1", "typescript": "5.4" }, diff --git a/src/intro/IntroPage.tsx b/src/intro/IntroPage.tsx index 21da4596..04b9a543 100644 --- a/src/intro/IntroPage.tsx +++ b/src/intro/IntroPage.tsx @@ -1,4 +1,5 @@ import { TailwindPreflight } from 'src/TailwindPreflight' +import { twMerge } from 'tailwind-merge' export const IntroPage = () => { return ( @@ -42,7 +43,10 @@ export const IntroPage = () => { ['Malware-Resistant Verification'], ].map(([text, customClasses = 'border-gray-300 hover:bg-gray-100 active:bg-gray-200/80']) => ( {text} From 0ef3a2bad20d6ad11e753d711e5e6199dad24620 Mon Sep 17 00:00:00 2001 From: David Ernst Date: Thu, 13 Jun 2024 05:00:42 -0700 Subject: [PATCH 04/13] new-intro: Add 'Coming Soon' placeholders --- src/intro/IntroPage.tsx | 33 +++-------------------- src/intro/Links.tsx | 58 +++++++++++++++++++++++++++++++++++++++++ 2 files changed, 61 insertions(+), 30 deletions(-) create mode 100644 src/intro/Links.tsx diff --git a/src/intro/IntroPage.tsx b/src/intro/IntroPage.tsx index 04b9a543..4acf53ca 100644 --- a/src/intro/IntroPage.tsx +++ b/src/intro/IntroPage.tsx @@ -1,5 +1,6 @@ import { TailwindPreflight } from 'src/TailwindPreflight' -import { twMerge } from 'tailwind-merge' + +import { Links } from './Links' export const IntroPage = () => { return ( @@ -23,35 +24,7 @@ export const IntroPage = () => { {/* Links */} - {[ - ['Demo — How SIV Works', 'border-green-800 bg-green-200'], - ['Bring to my area', 'border-orange-800 bg-orange-200'], - ['Create Own SIV Election', 'border-blue-800 bg-blue-200'], - ['Questions? FAQ', 'border-gray-400 bg-gray-200'], - [ - 'Earn up to $10,000 for finding Security Flaws', - 'border-purple-800 text-purple-700 bg-purple-100 bg-opacity-0', - ], - ['Compare vs Paper', 'border-amber-800 bg-amber-800 bg-opacity-10 hover:bg-opacity-20 active:bg-opacity-30'], - ['Contribute', 'border-pink-800 bg-pink-200'], - ['Blog', 'border-gray-600 bg-gray-50 hover:bg-gray-100 active:bg-gray-200/80'], - ['Technical Documentation'], - ['CS Research Powering SIV'], - ['Spoiler-Free Voting Methods'], - ['Preventing Future Authoritarianism'], - ['Use in War Zones'], - ['Malware-Resistant Verification'], - ].map(([text, customClasses = 'border-gray-300 hover:bg-gray-100 active:bg-gray-200/80']) => ( - - {text} - - ))} + {/* Footer */}
© 2024 SIV, Inc.
diff --git a/src/intro/Links.tsx b/src/intro/Links.tsx new file mode 100644 index 00000000..30de1390 --- /dev/null +++ b/src/intro/Links.tsx @@ -0,0 +1,58 @@ +import { useState } from 'react' +import { twMerge } from 'tailwind-merge' + +type Text = string +type Href = string | false +type CustomClasses = string +const linkArray: [Text, Href?, CustomClasses?][] = [ + ['Demo — How SIV Works', false, 'border-green-800 bg-green-200'], + ['Bring to my area', false, 'border-orange-800 bg-orange-200'], + ['Create Own SIV Election', false, 'border-blue-800 bg-blue-200'], + ['Questions? FAQ', false, 'border-gray-400 bg-gray-200'], + [ + 'Earn up to $10,000 for finding Security Flaws', + false, + 'border-purple-800 text-purple-700 bg-purple-100 bg-opacity-0', + ], + ['Compare vs Paper', false, 'border-amber-800 bg-amber-800 bg-opacity-10 hover:bg-opacity-20 active:bg-opacity-30'], + ['Contribute', false, 'border-pink-800 bg-pink-200'], + ['Blog', false, 'border-gray-600 bg-gray-50 hover:bg-gray-100 active:bg-gray-200/80'], + ['Technical Documentation'], + ['CS Research Powering SIV'], + ['Spoiler-Free Voting Methods'], + ['Preventing Future Authoritarianism'], + ['Use in War Zones'], + ['Malware-Resistant Verification'], +] + +export const Links = () => { + return ( + <> + {linkArray.map(([text, href, customClasses = 'border-gray-300 hover:bg-gray-100 active:bg-gray-200/80']) => ( + + ))} + + ) +} + +const SingleLink = ({ customClasses, href, text }: { customClasses: CustomClasses; href?: Href; text: Text }) => { + const [showComingSoon, setShowComingSoon] = useState(false) + return ( + <> + { + if (href) return + setShowComingSoon(!showComingSoon) + }} + > + {text} + + {showComingSoon &&
Coming Soon
} + + ) +} From c1233252e1e7df42c25da10771cbd94eac1489b6 Mon Sep 17 00:00:00 2001 From: David Ernst Date: Thu, 13 Jun 2024 05:09:39 -0700 Subject: [PATCH 05/13] intro: Begin adding available links --- src/intro/Links.tsx | 37 +++++++++++++++++++++++-------------- 1 file changed, 23 insertions(+), 14 deletions(-) diff --git a/src/intro/Links.tsx b/src/intro/Links.tsx index 30de1390..c3f00a9e 100644 --- a/src/intro/Links.tsx +++ b/src/intro/Links.tsx @@ -2,26 +2,33 @@ import { useState } from 'react' import { twMerge } from 'tailwind-merge' type Text = string -type Href = string | false +type Href = string type CustomClasses = string const linkArray: [Text, Href?, CustomClasses?][] = [ - ['Demo — How SIV Works', false, 'border-green-800 bg-green-200'], - ['Bring to my area', false, 'border-orange-800 bg-orange-200'], - ['Create Own SIV Election', false, 'border-blue-800 bg-blue-200'], - ['Questions? FAQ', false, 'border-gray-400 bg-gray-200'], + ['Demo — How SIV Works', undefined, 'border-green-800 bg-green-200'], + ['Bring to my area', '/#let-your-govt-know', 'border-orange-800 bg-orange-200'], + ['Create Own SIV Election', '/login', 'border-blue-800 bg-blue-200'], + ['Questions? FAQ', '/faq', 'border-gray-400 bg-gray-200'], [ 'Earn up to $10,000 for finding Security Flaws', - false, + undefined, 'border-purple-800 text-purple-700 bg-purple-100 bg-opacity-0', ], - ['Compare vs Paper', false, 'border-amber-800 bg-amber-800 bg-opacity-10 hover:bg-opacity-20 active:bg-opacity-30'], - ['Contribute', false, 'border-pink-800 bg-pink-200'], - ['Blog', false, 'border-gray-600 bg-gray-50 hover:bg-gray-100 active:bg-gray-200/80'], - ['Technical Documentation'], - ['CS Research Powering SIV'], - ['Spoiler-Free Voting Methods'], - ['Preventing Future Authoritarianism'], - ['Use in War Zones'], + [ + 'Compare vs Paper', + 'https://docs.siv.org/compare', + 'border-amber-800 bg-amber-800 bg-opacity-10 hover:bg-opacity-20 active:bg-opacity-30', + ], + ['Contribute', undefined, 'border-pink-800 bg-pink-200'], + ['Blog', 'https://blog.siv.org', 'border-gray-600 bg-gray-50 hover:bg-gray-100 active:bg-gray-200/80'], + ['Technical Documentation', 'https://docs.siv.org', 'border-red-800 bg-red-200'], + ['CS Research Powering SIV', '/about'], + ['Spoiler-Free Voting Methods', 'https://docs.siv.org/benefits#6-spoiler-resistant-voting-methods'], + [ + 'Preventing Future Authoritarianism', + 'https://docs.siv.org/research-in-progress/ukraine#a-powerful-tool-against-future-authoritarianism', + ], + ['Use in War Zones', '/ukraine'], ['Malware-Resistant Verification'], ] @@ -44,6 +51,8 @@ const SingleLink = ({ customClasses, href, text }: { customClasses: CustomClasse 'block p-2 mb-2 border rounded-lg font-medium bg-opacity-50 hover:bg-opacity-70 active:bg-opacity-100 cursor-pointer', customClasses, )} + href={href} + rel="noreferrer" target="_blank" onClick={() => { if (href) return From 8d2fcc1a37611cc5243f505a475d1d85727d851d Mon Sep 17 00:00:00 2001 From: David Ernst Date: Thu, 13 Jun 2024 05:12:53 -0700 Subject: [PATCH 06/13] Remove stray color added to Docs link --- src/intro/Links.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/intro/Links.tsx b/src/intro/Links.tsx index c3f00a9e..d8afd137 100644 --- a/src/intro/Links.tsx +++ b/src/intro/Links.tsx @@ -21,7 +21,7 @@ const linkArray: [Text, Href?, CustomClasses?][] = [ ], ['Contribute', undefined, 'border-pink-800 bg-pink-200'], ['Blog', 'https://blog.siv.org', 'border-gray-600 bg-gray-50 hover:bg-gray-100 active:bg-gray-200/80'], - ['Technical Documentation', 'https://docs.siv.org', 'border-red-800 bg-red-200'], + ['Technical Documentation', 'https://docs.siv.org'], ['CS Research Powering SIV', '/about'], ['Spoiler-Free Voting Methods', 'https://docs.siv.org/benefits#6-spoiler-resistant-voting-methods'], [ From 3c19dcb5328fa5468693ccb1ab9c279e37eb3250 Mon Sep 17 00:00:00 2001 From: David Ernst Date: Thu, 13 Jun 2024 05:22:56 -0700 Subject: [PATCH 07/13] intro: Improve footer positioning on large screens --- src/intro/IntroPage.tsx | 44 +++++++++++++++++++++-------------------- 1 file changed, 23 insertions(+), 21 deletions(-) diff --git a/src/intro/IntroPage.tsx b/src/intro/IntroPage.tsx index 4acf53ca..6f9e66a4 100644 --- a/src/intro/IntroPage.tsx +++ b/src/intro/IntroPage.tsx @@ -4,32 +4,34 @@ import { Links } from './Links' export const IntroPage = () => { return ( -
- {/* Header */} -

SIV

-

Secure Internet Voting

+ +
+ {/* Header */} +

SIV

+

Secure Internet Voting

- {/* 1-2-3 Graphic */} -
    - {['One Person, One Vote', 'Vote in Seconds', 'Cryptographic Privacy'].map((text, index) => ( -
  1. -
    {index + 1}
    - {text} -
    2. - ))} -
-
-
✅
-
Voter Verifiable Results
-
+ {/* 1-2-3 Graphic */} +
    + {['One Person, One Vote', 'Vote in Seconds', 'Cryptographic Privacy'].map((text, index) => ( +
  1. +
    {index + 1}
    + {text} +
    2. + ))} +
+
+
✅
+
Voter Verifiable Results
+
- {/* Links */} - + {/* Links */} + +
{/* Footer */} -
© 2024 SIV, Inc.
+
© 2024 SIV, Inc.
-
+ ) } From e27d727afa645ef44dd672588d9029d9d0f499d0 Mon Sep 17 00:00:00 2001 From: David Ernst Date: Thu, 13 Jun 2024 05:24:28 -0700 Subject: [PATCH 08/13] intro: Bit less rounded buttons --- src/intro/Links.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/intro/Links.tsx b/src/intro/Links.tsx index d8afd137..e17da1cd 100644 --- a/src/intro/Links.tsx +++ b/src/intro/Links.tsx @@ -48,7 +48,7 @@ const SingleLink = ({ customClasses, href, text }: { customClasses: CustomClasse <> Date: Thu, 13 Jun 2024 05:30:21 -0700 Subject: [PATCH 09/13] intro: More semantic html structure --- src/intro/IntroPage.tsx | 16 +++++++++------- 1 file changed, 9 insertions(+), 7 deletions(-) diff --git a/src/intro/IntroPage.tsx b/src/intro/IntroPage.tsx index 6f9e66a4..c252f985 100644 --- a/src/intro/IntroPage.tsx +++ b/src/intro/IntroPage.tsx @@ -4,11 +4,13 @@ import { Links } from './Links' export const IntroPage = () => { return ( - -
+
+
{/* Header */} -

SIV

-

Secure Internet Voting

+
+

SIV

+

Secure Internet Voting

+
{/* 1-2-3 Graphic */}
    @@ -26,12 +28,12 @@ export const IntroPage = () => { {/* Links */} -
+ {/* Footer */} -
© 2024 SIV, Inc.
+
© 2024 SIV, Inc.
- +
) } From 5338c0c874e28d3d95e8b6dddd860f58d9be9101 Mon Sep 17 00:00:00 2001 From: David Ernst Date: Thu, 13 Jun 2024 05:35:59 -0700 Subject: [PATCH 10/13] intro: Pull out into own file --- src/intro/IntroPage.tsx | 17 ++--------------- src/intro/OneTwoThreeGraphic.tsx | 18 ++++++++++++++++++ 2 files changed, 20 insertions(+), 15 deletions(-) create mode 100644 src/intro/OneTwoThreeGraphic.tsx diff --git a/src/intro/IntroPage.tsx b/src/intro/IntroPage.tsx index c252f985..b5e2e7b2 100644 --- a/src/intro/IntroPage.tsx +++ b/src/intro/IntroPage.tsx @@ -1,6 +1,7 @@ import { TailwindPreflight } from 'src/TailwindPreflight' import { Links } from './Links' +import { OneTwoThreeGraphic } from './OneTwoThreeGraphic' export const IntroPage = () => { return ( @@ -12,21 +13,7 @@ export const IntroPage = () => {

Secure Internet Voting

- {/* 1-2-3 Graphic */} -
    - {['One Person, One Vote', 'Vote in Seconds', 'Cryptographic Privacy'].map((text, index) => ( -
  1. -
    {index + 1}
    - {text} -
    2. - ))} -
-
-
✅
-
Voter Verifiable Results
-
- - {/* Links */} + diff --git a/src/intro/OneTwoThreeGraphic.tsx b/src/intro/OneTwoThreeGraphic.tsx new file mode 100644 index 00000000..92fdd950 --- /dev/null +++ b/src/intro/OneTwoThreeGraphic.tsx @@ -0,0 +1,18 @@ +export const OneTwoThreeGraphic = () => { + return ( + <> +
    + {['One Person, One Vote', 'Vote in Seconds', 'Cryptographic Privacy'].map((text, index) => ( +
  1. +
    {index + 1}
    + {text} +
    2. + ))} +
+
+
✅
+
Voter Verifiable Results
+
+ + ) +} From d23068d2719c2776d7f6b35e032ab4565a1af7bf Mon Sep 17 00:00:00 2001 From: Ariana Ivan Date: Sat, 15 Jun 2024 12:40:19 -0700 Subject: [PATCH 11/13] siv.org/faq: Submit-question input at top --- src/faq/AddYourQuestion.tsx | 2 +- src/faq/FAQPage.tsx | 5 +++-- 2 files changed, 4 insertions(+), 3 deletions(-) diff --git a/src/faq/AddYourQuestion.tsx b/src/faq/AddYourQuestion.tsx index 96558851..b6aefa75 100644 --- a/src/faq/AddYourQuestion.tsx +++ b/src/faq/AddYourQuestion.tsx @@ -8,7 +8,7 @@ import { api } from '../api-helper' export const AddYourQuestion = () => { const [saved, setSaved] = useState(false) return ( -
+
{

Frequently Asked Questions

+ + +
{ )}
))} - -