chameleon-company / chameleon-website Goto Github PK

The green which is used as the background colour for several of our pages is not filling the entire display on larger screens in the resources page section.

Steps to replicate - simply run the website on a larger display (32 inch tested on my end) end maximise the browser window.

Required fixes - Update styling on resources page to ensure background colour fills entire screen area.

Screenshot of issue:

Issue Summary

The footer does not seem to be at the bottom of the page for certain pages.

Steps to reproduce

• Access Contact us, Resources from the headers

The signup page (for creating new accounts on the Chameleon website) is completely broken, in terms of displaying assets and is missing functionality in code to allow new users to signup through existing Firebase implementation. Old logo and design language also present.

Steps to replicate - none required, this is represented simply by the current state of component.

Required fixes - Implement Tailwind CSS to ensure design is correctly displaying. Collaborate with design team on refreshing the design to be consistent with rest of the website. Update component code to integrate feature with our Google Firebase implementation.

Screenshot of how the page currently displays through web browser:

Some pages, such as news and pages within the resources section, appear to have excessively large headers on the page, which leads to unprofessional looking presentation standards.

Steps to replicate - Run the website and navigate to the previously listed pages.

Required fixes - Remove the unnecessary styling components causing this issue on effected pages.

Screenshots of issue:

When using the light theme, the footer appears to have a black border placed around it.

Steps to replicate - Run the website and switch to the light theme with the theme switcher, found in the footer in the current build.

Required fixes - Update styling of footer component to ensure no border is present when switching themes.

Screenshots of issue:

Tailwind nested CSS has not been properly configured in the following components:

/src/components/portfolio_card/portfolio_card-media.css
/src/pages/about/aboutUs-media.css

Steps to replicate - simply start the web application from the command terminal and you will receive the error warning within the front_end_project terminal. Does not effect ability to run the website but leaves us with un-configured code, which does not meet professional presentation practices.

Required fixes - Configure Tailwind in the listed components for nested functionality.

Refer to this documentation source for more information: https://tailwindcss.com/docs/using-with-preprocessors#nesting

Error message as captured from terminal:

When using the light theme on the website, some pages display blue background instead of white in whitespace.

Steps to replicate - Run the website, ensure light theme is active and navigate to pages such as resources or forgot my password.

Required fixes - Update styling to ensure whitespace is displayed correctly instead of blue colouring when using light theme. May require examination of theme component and each pages stylings.

Screenshots of issues:

Issue summary

The Readme.md documentation would need update on the file structure (Tree Linux command) and instructions on running the app on local host. The command needs to be updated to npm ci

Steps to reproduce

• Access Readme.md from the repo
  

Images on home screen of "Our Projects" are displaying in different sizes, leading to unprofessional presentation.

Steps to replicate - Simply run the website and navigate to the home screen.

Required fixes - Update styling to ensure all images remain consistent in their displayed sizes.

Screenshot of issue:

The infinite scroll feature in the news section of the website is leading to sluggish performance and eventual crashes of the website. Issue tested and replicated across Chrome, Edge and Safari web browsers.

Steps to replicate - Run the website and navigate to the news section and scroll through the page. Performance will decline until crash occurs. Pressing back will not always help exit the page.

Required fixes - Analyse infinite scroll feature for potential issues leading to poor performance and crashes. May require extensive updates.