Open
Conversation
Author
|
Applied fixes. Ready for review. |
Contributor
📝 WalkthroughWalkthroughAdds a self-contained interactive Dino landing page with a sticky navbar, canvas-based animated “DINO” background, a blob-follow cursor, clickable hero words, and three responsive magic-bento cards; updates index and stylesheet to integrate the new page and related styles. Changes
Sequence Diagram(s)sequenceDiagram
participant User
participant Page
participant Blob as BlobCursor
participant Canvas
participant Card as BentoCard
User->>Page: open / mousemove / click
Page->>Canvas: onload -> initLetters()
Canvas-->>Page: start animation loop (requestAnimationFrame)
User->>Page: mousemove
Page->>Blob: update position (smooth transform)
Page->>Card: update CSS vars for glow based on cursor
User->>Page: click .word
Page->>Page: apply translate/rotate/fade, set timeout -> reset
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~25 minutes Poem
🚥 Pre-merge checks | ✅ 1 | ❌ 2❌ Failed checks (1 warning, 1 inconclusive)
✅ Passed checks (1 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
Contributor
There was a problem hiding this comment.
Actionable comments posted: 2
🧹 Nitpick comments (4)
dino_webpage/dino.html (3)
351-362: Add null checks for DOM element selectors.
document.querySelectorcan returnnullif elements aren't found. While unlikely in this self-contained page, adding null checks improves robustness.🛡️ Suggested defensive check
// 1. BLOB CURSOR const blob = document.querySelector('.blob'); const dot = document.querySelector('.inner-dot'); + if (!blob || !dot) return; window.addEventListener('mousemove', (e) => {🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@dino_webpage/dino.html` around lines 351 - 362, The blob cursor code uses document.querySelector('.blob') and document.querySelector('.inner-dot') without null checks; update the block that defines const blob and const dot and the window.addEventListener callback to first verify blob and dot are non-null (or guard early and return) before accessing style or calling blob.animate, and ensure the event listener is only attached if the elements exist (reference symbols: blob, dot, and the window.addEventListener mousemove callback).
324-347: Consider self-hosting card icons for reliability.The card icons are loaded from
cdn-icons-png.flaticon.com. External CDN dependencies may fail due to availability issues, regional blocking, or CORS changes. For a production landing page, consider self-hosting these icons or using inline SVGs.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@dino_webpage/dino.html` around lines 324 - 347, The card images in the magic-bento-card elements currently use external CDN URLs (the <div class="header"><img src="https://cdn-icons-png.flaticon.com/..."> entries); replace those external src references with self-hosted assets or inline SVGs to avoid CDN/CORS/availability issues — add local paths (e.g., assets/icons/change-colors.svg) or embed the SVG markup directly inside each <div class="header">, ensure each <img> has an appropriate alt attribute (or SVG has role/title) and update any build/static asset pipeline to copy the new icons so the magic-bento-card instances (including the card-red variant) load reliably in production.
364-396: Canvas context may be null; animation runs indefinitely.
getContext('2d')can returnnullif the canvas context isn't available, which would causectx.clearRectto throw. Additionally, therequestAnimationFrameloop runs continuously even when the tab is in background, consuming resources.🛡️ Suggested improvements
const canvas = document.getElementById('alphabet-blast-canvas'); const ctx = canvas.getContext('2d'); + if (!ctx) { + console.warn('Canvas 2D context not available'); + return; + } let particles = []; + let animationId; const chars = "DINO"; // ... init function unchanged ... function animate() { ctx.clearRect(0, 0, canvas.width, canvas.height); particles.forEach(p => { // ... particle drawing unchanged ... }); - requestAnimationFrame(animate); + animationId = requestAnimationFrame(animate); } + // Optional: pause when tab is hidden + document.addEventListener('visibilitychange', () => { + if (document.hidden) { + cancelAnimationFrame(animationId); + } else { + animate(); + } + });🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@dino_webpage/dino.html` around lines 364 - 396, The canvas context (ctx) can be null and the animation loop runs continuously; update init() to verify canvas and ctx exist and bail out or disable the effect if ctx is null (check the canvas and ctx variables returned by document.getElementById and getContext), and refactor animate() to store the requestAnimationFrame id so you can cancel it; also hook into the Page Visibility API (document.visibilityState / visibilitychange) to pause (cancelAnimationFrame) when hidden and resume (restart animate with a new requestAnimationFrame id) when visible, and ensure resize listener still calls init() safely after the ctx presence check.dino_webpage/index.html (1)
51-51: Link appears orphaned and unstyled.The link to
dino.htmlis placed directly before</body>without any container or styling, making it visually inconsistent with the rest of the page. Consider placing it within an appropriate section (e.g., insidesection2_download_btnor a new styled container) and applying consistent styling.♻️ Suggested integration
<div class="section2_download_btn"> - <button>Download Now <img src="images_icons/6.png" width="57px" height="60px" style="padding-top: 11px;"></button> + <button>Download Now <img src="images_icons/6.png" width="57px" height="60px" style="padding-top: 11px;"></button> + <a href="dino.html" class="section1_btn" style="text-decoration: none; margin-left: 20px;">Open Dino Extension</a> </div> - -<a href="dino.html">Open Dino Extension</a>🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@dino_webpage/index.html` at line 51, The anchor <a href="dino.html">Open Dino Extension</a> is orphaned right before </body>; move it into an existing container (e.g., the element with id="section2_download_btn") or create a new semantic container (e.g., <div class="extension-link">) so it sits with related content, then apply the page's button/link styling by adding the existing CSS class (e.g., "download-btn" or "btn-primary") to the anchor and update CSS if necessary to match spacing and typography; ensure the link preserves href="dino.html" and accessible text, and verify layout in responsive breakpoints.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@dino_webpage/dino.html`:
- Around line 316-319: The CTA button with class "btn-cta" (text "Know more
about the Extension") has no action; add type="button" and give it a navigation
handler by either wrapping the element in an anchor tag linking to the extension
section or adding an onclick that performs navigation (e.g., location.href =
'#extension-section' or calls a function navigateToExtension()); ensure the
selector remains .btn-cta so styling still applies and update any aria
attributes if needed for accessibility.
- Around line 271-274: The nav bar currently has a non-functional anchor and a
non-focusable user icon: replace the anchor with a real download target or, if
it triggers JS, convert the "Download" <a> (text "Download") into a <button> so
it is keyboard-accessible; convert the user icon <div> into a <button> (replace
the element referenced as the user icon div inside .nav-links) and add an
appropriate aria-label (e.g., aria-label="User menu") and keyboard/focus styles
so screen readers and keyboard users can interact with it; ensure any JS click
handlers are moved from the old div to the new button and preserve the visual
styling (border, size, emoji) via CSS.
---
Nitpick comments:
In `@dino_webpage/dino.html`:
- Around line 351-362: The blob cursor code uses document.querySelector('.blob')
and document.querySelector('.inner-dot') without null checks; update the block
that defines const blob and const dot and the window.addEventListener callback
to first verify blob and dot are non-null (or guard early and return) before
accessing style or calling blob.animate, and ensure the event listener is only
attached if the elements exist (reference symbols: blob, dot, and the
window.addEventListener mousemove callback).
- Around line 324-347: The card images in the magic-bento-card elements
currently use external CDN URLs (the <div class="header"><img
src="https://cdn-icons-png.flaticon.com/..."> entries); replace those external
src references with self-hosted assets or inline SVGs to avoid
CDN/CORS/availability issues — add local paths (e.g.,
assets/icons/change-colors.svg) or embed the SVG markup directly inside each
<div class="header">, ensure each <img> has an appropriate alt attribute (or SVG
has role/title) and update any build/static asset pipeline to copy the new icons
so the magic-bento-card instances (including the card-red variant) load reliably
in production.
- Around line 364-396: The canvas context (ctx) can be null and the animation
loop runs continuously; update init() to verify canvas and ctx exist and bail
out or disable the effect if ctx is null (check the canvas and ctx variables
returned by document.getElementById and getContext), and refactor animate() to
store the requestAnimationFrame id so you can cancel it; also hook into the Page
Visibility API (document.visibilityState / visibilitychange) to pause
(cancelAnimationFrame) when hidden and resume (restart animate with a new
requestAnimationFrame id) when visible, and ensure resize listener still calls
init() safely after the ctx presence check.
In `@dino_webpage/index.html`:
- Line 51: The anchor <a href="dino.html">Open Dino Extension</a> is orphaned
right before </body>; move it into an existing container (e.g., the element with
id="section2_download_btn") or create a new semantic container (e.g., <div
class="extension-link">) so it sits with related content, then apply the page's
button/link styling by adding the existing CSS class (e.g., "download-btn" or
"btn-primary") to the anchor and update CSS if necessary to match spacing and
typography; ensure the link preserves href="dino.html" and accessible text, and
verify layout in responsive breakpoints.
ℹ️ Review info
Configuration used: defaults
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (1)
dino_webpage/images_icons/dino_logo.pngis excluded by!**/*.png
📒 Files selected for processing (2)
dino_webpage/dino.htmldino_webpage/index.html
Author
|
"@developer-diganta I have updated the code to address the CodeRabbit suggestions (added null checks and fixed the orphaned link). The PR is ready for review and Merge. Please also add the OSCG-2026 label so my contribution reflects on the leaderboard. Thank you!" |
Contributor
There was a problem hiding this comment.
Actionable comments posted: 2
🧹 Nitpick comments (2)
dino_webpage/dino.html (2)
324-348: Consider: External CDN images may introduce reliability concerns.The card icons load from
cdn-icons-png.flaticon.com. If Flaticon becomes unavailable or changes URLs, the icons will break.For better reliability, consider hosting these icons locally in the
images_icons/folder, or add fallback styling to gracefully handle missing images.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@dino_webpage/dino.html` around lines 324 - 348, The external icon URLs used in the img tags inside the section with id "extension-info" (each .magic-bento-card .header img) create a reliability risk; replace those external src attributes with locally hosted files in images_icons/ (e.g., add the three SVG/PNG files into images_icons/ and update the img src values), and additionally implement a graceful fallback (add an onerror fallback to point to a local placeholder or use CSS background-image fallback for .magic-bento-card .header) so missing external assets won’t break the UI.
313-313: Inconsistent word span breaks the falling-text interaction.All other words in the description are wrapped in individual
.wordspans, but line 313 lumps the entire phrase "add / remove images, read out pages etc." into a single span. This breaks the visual consistency of the word-click animation pattern.♻️ Suggested fix to maintain consistency
- <span class="word">add / remove images, read out pages etc.</span> + <span class="word">add</span> + <span class="word">/</span> + <span class="word">remove</span> + <span class="word highlighted">images,</span> + <span class="word">read</span> + <span class="word">out</span> + <span class="word">pages</span> + <span class="word">etc.</span>🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@dino_webpage/dino.html` at line 313, The description line currently wraps the whole phrase in one span (<span class="word">add / remove images, read out pages etc.</span>), breaking the per-word falling-text interaction; update this fragment so each token is its own <span class="word"> (e.g., separate spans for "add", "/", "remove", "images,", "read", "out", "pages", "etc.") so the click/animation logic that targets individual .word elements (the code handling word clicks/animations) will operate consistently with the other description lines.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@dino_webpage/dino.html`:
- Around line 271-274: The "Download" anchor in the nav-links div points to a
non-existent ID "#download-section"; fix by either updating the anchor href in
the nav-links (the <a> element) to the existing "#extension-info" ID or by
adding id="download-section" to the intended target section (for example the
element that currently has id="extension-info" or by creating a dedicated
download section element) so the link correctly navigates to the download area.
In `@dino_webpage/styles.css`:
- Around line 1-32: The stylesheet rewrite removed all rules needed by
index.html (e.g., .navbar, .nav__logo, .nav__item, .nav__list, .section1,
.section1_content, .section1_btn, .section2, .section2_btns,
.section2_download_btn, .about__data) and replaced them with styles only used by
the new dino page, breaking index.html; fix by either restoring the original
styles.css content so index.html finds its classes again, or make the shared
styles available to both pages by adding <link rel="stylesheet"
href="styles.css"> to dino.html and removing the duplicated inline rules in
dino.html so the .magic-bento-card, .hero-image-side, .btn-cta, etc. live only
in styles.css and both pages render correctly.
---
Nitpick comments:
In `@dino_webpage/dino.html`:
- Around line 324-348: The external icon URLs used in the img tags inside the
section with id "extension-info" (each .magic-bento-card .header img) create a
reliability risk; replace those external src attributes with locally hosted
files in images_icons/ (e.g., add the three SVG/PNG files into images_icons/ and
update the img src values), and additionally implement a graceful fallback (add
an onerror fallback to point to a local placeholder or use CSS background-image
fallback for .magic-bento-card .header) so missing external assets won’t break
the UI.
- Line 313: The description line currently wraps the whole phrase in one span
(<span class="word">add / remove images, read out pages etc.</span>), breaking
the per-word falling-text interaction; update this fragment so each token is its
own <span class="word"> (e.g., separate spans for "add", "/", "remove",
"images,", "read", "out", "pages", "etc.") so the click/animation logic that
targets individual .word elements (the code handling word clicks/animations)
will operate consistently with the other description lines.
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro
Run ID: c1e1ba68-6701-49b1-831a-8e94bca308f6
📒 Files selected for processing (3)
dino_webpage/dino.htmldino_webpage/index.htmldino_webpage/styles.css
🚧 Files skipped from review as they are similar to previous changes (1)
- dino_webpage/index.html
Comment on lines
+271
to
+274
| <div class="nav-links"> | ||
| <a href="#download-section">Download</a> | ||
| <button aria-label="User profile" style="color:white; border: 2px solid white; border-radius: 50%; padding: 5px; width: 35px; height: 35px; display: flex; align-items: center; justify-content: center; background: transparent; cursor: pointer;">👤</button> | ||
| </div> |
Contributor
There was a problem hiding this comment.
Broken anchor: #download-section does not exist.
The Download link at line 272 references #download-section, but no element in this page has that ID. The only section ID present is #extension-info (line 324).
🔧 Suggested fix
<div class="nav-links">
- <a href="#download-section">Download</a>
+ <a href="#extension-info">Download</a>
<button aria-label="User profile" style="color:white; border: 2px solid white; border-radius: 50%; padding: 5px; width: 35px; height: 35px; display: flex; align-items: center; justify-content: center; background: transparent; cursor: pointer;">👤</button>
</div>Alternatively, add a dedicated download section with id="download-section" if the intent is to separate it from the feature cards.
📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
Suggested change
| <div class="nav-links"> | |
| <a href="#download-section">Download</a> | |
| <button aria-label="User profile" style="color:white; border: 2px solid white; border-radius: 50%; padding: 5px; width: 35px; height: 35px; display: flex; align-items: center; justify-content: center; background: transparent; cursor: pointer;">👤</button> | |
| </div> | |
| <div class="nav-links"> | |
| <a href="#extension-info">Download</a> | |
| <button aria-label="User profile" style="color:white; border: 2px solid white; border-radius: 50%; padding: 5px; width: 35px; height: 35px; display: flex; align-items: center; justify-content: center; background: transparent; cursor: pointer;">👤</button> | |
| </div> |
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.
In `@dino_webpage/dino.html` around lines 271 - 274, The "Download" anchor in the
nav-links div points to a non-existent ID "#download-section"; fix by either
updating the anchor href in the nav-links (the <a> element) to the existing
"#extension-info" ID or by adding id="download-section" to the intended target
section (for example the element that currently has id="extension-info" or by
creating a dedicated download section element) so the link correctly navigates
to the download area.
Comment on lines
+1
to
32
| .magic-bento-card::after { | ||
| --glow-x: 50%; | ||
| --glow-y: 50%; | ||
| --glow-color: var(--primary); | ||
| opacity: 0; | ||
| transition: opacity 0.3s ease; | ||
| } | ||
|
|
||
| ul{ | ||
| display: flex; | ||
| gap: 3.5rem; | ||
| list-style-type: none; | ||
| } | ||
|
|
||
|
|
||
| ul a{ | ||
| text-decoration: none; | ||
| font-family: 'Mulish'; | ||
| font-style: normal; | ||
| font-weight: 600; | ||
| font-size: 1.5rem; | ||
| line-height: 90px; | ||
| color: #FFFFFF; | ||
| .magic-bento-card:hover::after { | ||
| opacity: 1; | ||
| } | ||
|
|
||
| .section1{ | ||
| width:100%; | ||
| height:40rem; | ||
| background-image: url(images_icons/bg2\ low\ transperancy.png); | ||
| } | ||
|
|
||
| .section1_content{ | ||
| .hero-image-side { | ||
| display: flex; | ||
| justify-content: center; | ||
| align-items: center; | ||
| gap: 8.9rem; | ||
| } | ||
|
|
||
| .section1_img{ | ||
| width: 50%; | ||
| height: 30rem; | ||
| margin-left: 170px; | ||
| margin-top: 4%; | ||
| } | ||
|
|
||
| .about__data{ | ||
| font-family: 'Inter'; | ||
| font-style: normal; | ||
| font-weight: 500; | ||
| font-size: 40px; | ||
| color: #0A2647; | ||
| width: 80%; | ||
| height: 15rem; | ||
| } | ||
|
|
||
| .section1_btn{ | ||
| width: 33%; | ||
| height: 10%; | ||
| background: rgba(137, 196, 225, 0.7); | ||
| border-radius: 42px; | ||
| margin-left: 35%; | ||
| margin-top: 5%; | ||
| font-family: 'Mulish'; | ||
| font-style: normal; | ||
| font-weight: 520; | ||
| font-size: 35px; | ||
| /* line-height: 49px; */ | ||
| color: black; | ||
| border: none; | ||
| cursor: pointer; | ||
| text-align: center; | ||
| align-items: center; | ||
| justify-content: center; | ||
| max-width: 320px; | ||
| } | ||
|
|
||
| .section2{ | ||
| display: flex; | ||
| width:100%; | ||
| height:40rem; | ||
| background-image: url(images_icons/bg2\ low\ transperancy.png); | ||
| padding-top: 8%; | ||
| .hero-image-side img { | ||
| width: 100%; | ||
| height: auto; | ||
| } | ||
|
|
||
| .section2_btns button{ | ||
| display: flex; | ||
| flex-direction: column; | ||
| cursor: pointer; | ||
| width: 150%; | ||
| height: 60px; | ||
| background: rgba(137, 196, 225, 0.55); | ||
| border: 1px solid rgba(0, 0, 0, 0.29); | ||
| box-shadow: 5px 4px 10px rgba(0, 0, 0, 0.25); | ||
| border-radius: 25px; | ||
| font-family: 'Mulish'; | ||
| font-style: normal; | ||
| font-weight: 500; | ||
| font-size: 35px; | ||
| color: #1E204A; | ||
| margin-left: 15%; | ||
| margin-bottom: 19%; | ||
| justify-content:start; | ||
| align-items: center; | ||
| text-align: start; | ||
| .btn-cta:hover { | ||
| transform: translateY(-2px); | ||
| transition: all 0.2s ease; | ||
| } | ||
|
|
||
| .section2_download_btn{ | ||
| background-image: url(images_icons/bg2\ low\ transperancy.png); | ||
| height: 10rem; | ||
| } | ||
| .section2_download_btn button{ | ||
| /* margin-top: 1%; */ | ||
| background: rgba(137, 196, 225, 0.55); | ||
| border: 1px solid rgba(0, 0, 0, 0.29); | ||
| box-shadow: 5px 4px 10px rgba(0, 0, 0, 0.25); | ||
| width: 29%; | ||
| height: 25px; | ||
| border-radius: 25px; | ||
| font-family: 'Mulish'; | ||
| font-style: normal; | ||
| font-weight:600; | ||
| font-size: 38px; | ||
| color: #1E204A; | ||
| margin-left: 55%; | ||
| justify-content:center; | ||
| align-items: center; | ||
| text-align: center; | ||
| padding-bottom: 6%; | ||
| .btn-cta:focus-visible { | ||
| outline: 3px solid var(--navy); | ||
| outline-offset: 3px; | ||
| } No newline at end of file |
Contributor
There was a problem hiding this comment.
🧩 Analysis chain
🏁 Script executed:
#!/bin/bash
# Check which HTML files reference styles.css
rg -l 'styles\.css' --type=html
# Check if dino.html has a link to styles.css
rg -n 'stylesheet.*styles\.css' dino_webpage/dino.html || echo "dino.html does not link to styles.css"
# List classes used in index.html that are no longer in styles.css
echo "Classes used in index.html:"
rg -oP 'class="[^"]*"' dino_webpage/index.html | sort -uRepository: developer-diganta/Dino
Length of output: 387
🏁 Script executed:
#!/bin/bash
# Check what classes popup.html uses
echo "Classes used in popup.html:"
rg -oP 'class="[^"]*"' popup.html | sort -uRepository: developer-diganta/Dino
Length of output: 1767
🏁 Script executed:
#!/bin/bash
# Check if popup.html has inline <style> tag
rg -n '<style>' popup.html | head -5
# Check if popup.html has any other stylesheet links
rg -n '<link.*stylesheet' popup.html | head -10Repository: developer-diganta/Dino
Length of output: 122
🏁 Script executed:
#!/bin/bash
# Check the project structure and where stylesheets are located
echo "=== Files and directories with 'styles.css' ==="
find . -name 'styles.css' -type f 2>/dev/null
echo "=== Files and directories with 'css' directory ==="
find . -name 'css' -type d 2>/dev/null
echo "=== Check how index.html links to styles.css ==="
rg -n '<link.*styles\.css' dino_webpage/index.html
echo "=== Check dino_webpage directory structure ==="
ls -la dino_webpage/ | head -20Repository: developer-diganta/Dino
Length of output: 775
Critical: This change breaks dino_webpage/index.html styling.
The dino_webpage/styles.css file has been completely rewritten to only contain styles for the new dino.html page, but:
- dino.html doesn't link to styles.css - it's entirely self-contained with inline
<style>tags. These new styles are unreachable. - dino_webpage/index.html still links to styles.css - but all its required classes (
.navbar,.nav__logo,.nav__item,.nav__list,.section1,.section1_content,.section1_btn,.section2,.section2_btns,.section2_download_btn,.about__data) have been removed.
This causes index.html to render without any CSS styling.
Recommended fix: Either restore the original styles.css content for index.html, or if the intent is to share styles between pages, add <link rel="stylesheet" href="styles.css"> to dino.html and remove the duplicated rules from dino.html's inline styles.
🧰 Tools
🪛 Stylelint (17.4.0)
[error] 5-5: Expected empty line before declaration (declaration-empty-line-before)
(declaration-empty-line-before)
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.
In `@dino_webpage/styles.css` around lines 1 - 32, The stylesheet rewrite removed
all rules needed by index.html (e.g., .navbar, .nav__logo, .nav__item,
.nav__list, .section1, .section1_content, .section1_btn, .section2,
.section2_btns, .section2_download_btn, .about__data) and replaced them with
styles only used by the new dino page, breaking index.html; fix by either
restoring the original styles.css content so index.html finds its classes again,
or make the shared styles available to both pages by adding <link
rel="stylesheet" href="styles.css"> to dino.html and removing the duplicated
inline rules in dino.html so the .magic-bento-card, .hero-image-side, .btn-cta,
etc. live only in styles.css and both pages render correctly.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Fixes #(issue)
Description
Describe your changes in detail
Screenshots (if appropriate):
Types of changes
Checklist:
SWOC Participation
Summary by CodeRabbit
New Features
Style
Accessibility