Adds global CSS variables and changes website's color

[elefrodi]

Pull Request

Related Issues: [List any related issues or reference them using the syntax #issue_number.]

References #238

Description: i added global variables --primary,--border,--icons used to style the website's colors. As seen in the second screenshot the colors match those of the first one that shows figma as it was asked in the issue. Login/signup page also adjusted to match the blue theme(third screenshot). The other page (4th screenshot) was left untouched.

The changes i made apply to light mode.

Since changes are style-related/css mostly they don't break the websites functionality.

Note: some format changes in the src code (placement of {} and some \n and spaces) have happened due to Prettier-formatter autoformatting.

Checklist:

• [x] I have tested my changes.
• [x] My code follows the project's coding standards.
• [ ] I have updated the documentation (if applicable).

Screenshots:

[vercel[bot]]

Someone is attempting to deploy a commit to a Personal Account owned by @ani1609 on Vercel.

@ani1609 first needs to authorize it.

[vercel[bot]]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
spendwise	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Dec 28, 2023 5:37pm
spendwise-server	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Dec 28, 2023 5:37pm

[elefrodi]

sure ill do it

[ani1609]

@elefrodi appreciated