Notification page

Hey, hows it going? 👋

Changes To Consider

• Use sass variables not CSS variables since you're using sass.
• Use variables for media queries
• Make a separate file called _variables.scss to write and use variables from that file by using @import

scss variables

:root {
  $primary-red: hsl(1, 90%, 64%);
  $primary-blue: hsl(219, 85%, 26%);
  $white: hsl(0, 0%, 100%);
}

css variables

:root {
  --primary-red: hsl(1, 90%, 64%);
  --primary-blue: hsl(219, 85%, 26%);
  --white: hsl(0, 0%, 100%);
}

Use variables for media quries like this.

_variables.scss file

$phone: 760px;
$tablet: 1024px;
$desktop: 1920px;

main.scss file

@import '_variables.scss';

@media (max-width: $desktop) {
      margin: 3rem;
}

Overall, the project is completed, good job!

Regards, Declan