Feat/add named colors

[fowlerztwitch]

Contributor checklist

• This pull request is on a separate branch and not the main branch
• I have run the tests for the backend and frontend depending on what's needed for my changes as described in the testing section of the contributing guide

---

Description

This pull request implements two changes :

• Handling Password Strength indicator colors via CSS-named colors declared in frontend/assets/css/tailwind.css
• Modification of the end-to-end tests so that the test named "Page shows user password strength rating" (frontend/test-e2e/specs/all/sign-in-page.specs.ts) checks the webpage against the named colors instead of the hardcoded hex colors.

This was put through the whole test process documented in the CONTRIBUTING.md file. The End2End tests were performed locally and it is important to note that some tests failed (tests on aspects not modified in this PR). Here are the tests that failed :

• Sign-in page : Page shows error for invalid credentials > The screenshot given by the playwright report shows a user logged-in page so I would expect this to be a db / backend issue in my configuration which has nothing to do with the changes implemented in this PR.

• Landing Page : User can request access > No modification to the landing page was done.

Error: Timed out 5000ms waiting for expect(locator).toHaveAttribute(expected)

Locator: locator('#request-access')
Expected pattern: /^https:\/\/forms.activist.org\/s\/.*$/
Received: <element(s) not found>
Call log:
  - expect.toHaveAttribute with timeout 5000ms
  - waiting for locator('#request-access')


  > 18 |   test("User can request access", async ({ page }) => {
  > 19 |     const requestAccessLink = page.locator("#request-access");
  > 20 |     await expect(requestAccessLink).toHaveAttribute(
  >    |                     ^
  > 21 |       "href",
  > 22 |       /^https:\/\/forms.activist.org\/s\/.*$/
  > 23 |     );
at D:\OSS\activist\frontend\test-e2e\specs\all\landing-page.spec.ts:20:37

• Landing Page : User can change theme (Samsung Mobile) > No modification to the landing page was done.

It is also important to note that the 'yarn format' command for Prettier did not modify any file and gave some warnings. Using yarn format --write modified all files from CRLF to LF. Another commit for linting to transition from CRLF to LF can be added if requested.

Related issue

• Switch over password strength coloration to named Tailwind colors + test update #1101

[github-actions]

Thank you for the pull request!

The activist team will do our best to address your contribution as soon as we can. The following is a checklist for maintainers to make sure this process goes as well as possible. Feel free to address the points below yourself in further commits if you realize that actions are needed :)

If you're not already a member of our public Matrix community, please consider joining! We'd suggest using Element as your Matrix client, and definitely join the General and Development rooms once you're in. Also consider joining our bi-weekly Saturday dev syncs. It'd be great to have you!

Maintainer checklist

• The TypeScript and formatting workflows within the PR checks do not indicate new errors in the files changed

• The Playwright end to end and Zap penetration tests have been ran and are passing (if necessary)

• The changelog has been updated with a description of the changes for the upcoming release and the corresponding issue (if necessary)

[github-actions]

First PR Commit Check

• The commit messages for the remote branch of a new contributor should be checked to make sure their email is set up correctly so that they receive credit for their contribution
  • The contributor's name and icon in remote commits should be the same as what appears in the PR
  • If there's a mismatch, the contributor needs to make sure that the email they use for GitHub matches what they have for git config user.email in their local activist repo (can be set with git config --global user.email "GITHUB_EMAIL")

[netlify]

✅ Deploy Preview for activist-org ready!

Name	Link
🔨 Latest commit	c7113d2
🔍 Latest deploy log	https://app.netlify.com/sites/activist-org/deploys/67956e31da8b410008bd5d32
😎 Deploy Preview	https://deploy-preview-1106--activist-org.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[fowlerztwitch]

To update on my PR, I have checked through the Netlify deploy preview the errors appearing on my end :

• RESOLVED : Landing Page : User can request access -> The #request-access element exists and has the good link.
• THINK IT IS RESOLVED : Landing Page : User can change theme (Samsung Mobile) -> Emulating a mobile browser on Netlify deployment and changing theme works.
• [] CANNOT CHECK MYSELF : Sign-in Page : Page shows error for invalid credentials -> CORS policy prevents me from testing the credentials error.