GDGC-MET / GDGC-MET/Codefolio-WEB
Multiple syntax errors and invalid properties in CSS rules causing rendering issues and potential browser inconsistencies
- Dominant language
- CSS
- Stars
- 2
- Forks
- 32
- PR merge metrics
- No merged PRs in 30d
Description
CSS Code Issue Report
Issue Title:
Multiple syntax errors and invalid properties in CSS rules causing rendering issues and potential browser inconsistencies
Issue Description:
While reviewing the provided CSS codebase for the portfolio website, several critical syntax errors, invalid property values, and structural issues were identified. These could lead to broken animations, incorrect styling, failed media queries, and overall layout disruptions across browsers (e.g., Chrome, Firefox, Safari). The issues span various sections like gradients, animations, media queries, and overlays. Below is a detailed breakdown:
1. **Invalid Gradient Syntax in `:root` and Related Rules**:
- In `:root`, the `--gradient` variable is defined as: `linear-gradient(135deg, var(--primary), var(--secondary),));`
- **Problem**: There's an extra closing parenthesis `))` at the end, making the declaration invalid. This will cause the CSS parser to ignore the entire variable, leading to fallback to default colors or no gradient at all in elements using `var(--gradient)`.
- **Impact**: Affects multiple elements like `.logo-text`, `.highlight`, `.cta-button.primary`, `.skill-card::before`, and `.back-to-top`, resulting in plain colors instead of the intended gradient effect.
-**Use of AI has been done to fix the issue
- **Fix Suggestion**: Remove the extra `)`: `--gradient: linear-gradient(135deg, var(--primary), var(--secondary));`
- Similar issue in `.skills-bg`: `background: linear-gradient 45deg, var(--primary), var(--secondary), var(--accent);`
- **Problem**: Missing opening parenthesis after `linear-gradient` (should be `linear-gradient(45deg, ...)`). This invalidates the background, causing it to fall back to a solid color or none.
- **Impact**: The animated background in the skills section won't render properly, breaking the subtle gradient shift animation.
Contributor guide
No contributing guide indexed for this repository
Assessment
This issue has not been assessed yet.