www
/
www-new
12
3
Fork 5
Code Issues 58 Pull Requests 42 Projects Releases Wiki Activity

Warning Header (Closes #205) #394

Merged
snedadah merged 19 commits from warning-header into main 2022-02-22 23:29:55 -05:00
Conversation 3 Commits 19 Files Changed 10 +14 -5
4 changed files with 14 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit c14de15625 - Show all commits

6
components/WarningHeader.module.css
View File

@ -1,7 +1,11 @@
.warning{
background-color: var(--warning-background);
padding: calc(5rem / 16);
color: var(--primary-accent-light);
color: var(--warning-text);
font-size: calc(15rem / 16);
text-align: center;
opacity: 1;
max-height: 500px; /* just for smooth fade in purposes */
transition: max-height 100ms ease-in;
}

9
components/WarningHeader.tsx
View File

@ -11,7 +11,7 @@ export function WarningHeader() {
const [warning, setWarning] = useState<Warning | null>(null);
useEffect(() => {
fetch("api/currentWarning/")
fetch("/api/currentWarning/")
.then((res) => res.json())
.then((data) => {
setWarning(data);
@ -22,7 +22,12 @@ export function WarningHeader() {
});
if (!warning || !warning.content || warning.content == "") {
return <></>;
return (
<div
className={styles.warning}
style={{ maxHeight: 0, opacity: 0 }}
snedadah marked this conversation as resolved
a258wang commented 2022-02-22 16:41:55 -05:00
Review
Copy Link

Do we really need this comment here? I personally think the comment on line 25, along with the general structure of the code, are already sufficient to convey what is happening and why.

Do we really need this comment here? I personally think the comment on line 25, along with the general structure of the code, are already sufficient to convey what is happening and why.
></div>
);
}
return <div className={styles.warning}>{warning.content}</div>;

3
content/warnings/2022-01-29-testWarning.txt
View File

@ -2,5 +2,4 @@
startDate: 'January 29 2022 21:00'
endDate: 'January 30 2022 18:00'
---
This is a test warning. Again!
Warning: There will be a scheduled system outage on Jan 29, 2022

1
pages/_app.css
View File

@ -23,6 +23,7 @@ body {
--form-invalid: #9f616a;
--warning-background: #dd0014;
--warning-text: #ffffff;
snedadah marked this conversation as resolved
a3thakra commented 2022-02-16 01:52:20 -05:00
Review
Copy Link

Make sure to add these colors in our theme palette as well. That way it will show up in the themer and will be totally customizable!

Themer: https://csclub.uwaterloo.ca/themer

Adding a color to the palette should be as easy as adding a string to this array. If that doesn't work, let me know and we can figure something out.

Make sure to add these colors in our theme palette as well. That way it will show up in the themer and will be totally customizable! Themer: https://csclub.uwaterloo.ca/themer Adding a color to the palette should be as easy as adding a string to [this array](https://git.csclub.uwaterloo.ca/www/www-new/src/branch/main/components/Theme.tsx#L18). If that doesn't work, let me know and we can figure something out.
--input-background: #f0f0f0;
--input-placeholder-text: #bbbbbb;