diff options
| author | Andrew Lee <alee14498@protonmail.com> | 2023-07-19 00:58:38 -0400 |
|---|---|---|
| committer | Andrew Lee <alee14498@protonmail.com> | 2023-07-19 00:58:38 -0400 |
| commit | 260ea88a873c10738643b6f82ff00bd854246ec4 (patch) | |
| tree | 004104726e0afba3c1af820945690805f72edef1 /app/components/PSA.js | |
| parent | d57226e5a802ecd6607faf67f32621e2da725a35 (diff) | |
| download | alure-website-260ea88a873c10738643b6f82ff00bd854246ec4.tar.gz alure-website-260ea88a873c10738643b6f82ff00bd854246ec4.tar.bz2 alure-website-260ea88a873c10738643b6f82ff00bd854246ec4.zip | |
Sorting out files
Diffstat (limited to 'app/components/PSA.js')
| -rw-r--r-- | app/components/PSA.js | 47 |
1 files changed, 47 insertions, 0 deletions
diff --git a/app/components/PSA.js b/app/components/PSA.js new file mode 100644 index 0000000..06bf9ba --- /dev/null +++ b/app/components/PSA.js @@ -0,0 +1,47 @@ +import psaMessage from './psa.json' assert { type: 'json' }; +import Link from "next/link"; + +const PSA = () => { + let defaultStyle = "flex flex-row md:px-40 px-30 py-0.5 space-x-2"; + let styleImportant; + let important; + switch (psaMessage.important) { + case 0: + styleImportant = "hidden" + defaultStyle += ' ' + styleImportant + break; + case 1: + important = "Latest News:" + styleImportant = "bg-zinc-700" + defaultStyle += ' ' + styleImportant + break; + case 2: + important = "WARNING!" + styleImportant = "bg-yellow-700" + defaultStyle += ' ' + styleImportant + break; + case 3: + important = "EMERGENCY!" + styleImportant = "bg-red-800" + defaultStyle += ' ' + styleImportant + break; + + } + + return ( + <div className={defaultStyle}> + <p className="text-lg font-medium">{important}</p> + <div className="flex flex-row space-x-3"> + <p>{psaMessage.announcement}</p> + <p className="text-blue-200 hover:text-blue-500 active:text-blue-700"> + {psaMessage.link && ( + <Link href={psaMessage.link}> + Learn more ↗ + </Link> + )}</p> + </div> + </div> + ) +} + +export default PSA; |
