Skip to content

docs(demo): add demo.html page in English (no global.scss changes) #358

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
therunnas wants to merge 7 commits into
base: main
Choose a base branch
from
Open

docs(demo): add demo.html page in English (no global.scss changes) #358

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
b4627af
Adiciona demo.html e suporte a prefers-reduced-motion no global.scss
therunnas Aug 1, 2025
82334e6
Create launch.json
therunnas Aug 13, 2025
6e91d58
docs(demo): use Gardevoir CDN; fix button type | style: comment in En…
therunnas Aug 17, 2025
b98f4c6
docs: move demo.html to /docs
therunnas Aug 17, 2025
36e9581
docs(demo): use official Reseter.css CDN instead of Gardevoir
therunnas Aug 17, 2025
9fbf0f4
fix(a11y): consolidate prefers-reduced-motion rules (WCAG-friendly)
therunnas Sep 22, 2025
657e07d
docs(demo): add demo.html only (no global.scss changes)
therunnas Sep 22, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
44 changes: 44 additions & 0 deletions ...Gardevoir CDN; fix button type  style comment in English  chore remove VSCode launch
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,44 @@
warning: in the working copy of 'demo.html', LF will be replaced by CRLF the next time Git touches it
warning: in the working copy of 'src/components/global.scss', LF will be replaced by CRLF the next time Git touches it
diff --git a/demo.html b/demo.html
index 71b56c3..a3b977d 100644
--- a/demo.html
+++ b/demo.html
@@ -4,7 +4,7 @@
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Reseter.css Demo</title>
- <link rel="stylesheet" href="reseter.css" />
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/gardevoir" />
Comment on lines +11 to +12
Copy link

@coderabbitai coderabbitai bot Sep 22, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue

Do not switch to Gardevoir; keep Reseter.css for this repo’s demo.

This change replaces Reseter.css with Gardevoir in the root demo.html, which conflicts with the project scope and the new docs page using Reseter.css. Revert to Reseter.css (preferably pinned + SRI).

-  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/gardevoir" />
+  <link rel="stylesheet"
+        href="https://cdn.jsdelivr.net/npm/[email protected]/reseter.min.css"
+        integrity="sha384-REPLACE_WITH_REAL_HASH"
+        crossorigin="anonymous" />
📝 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
�[31m- <link rel="stylesheet" href="reseter.css" />�[m
�[32m+�[m�[32m <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/gardevoir" />�[m
<link rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/[email protected]/reseter.min.css"
integrity="sha384-REPLACE_WITH_REAL_HASH"
crossorigin="anonymous" />
🤖 Prompt for AI Agents 
In (demo) use Gardevoir CDN; fix button type  style comment in English 
chore remove VSCode launch around lines 11-12, revert the stylesheet change
that replaced reseter.css with the Gardevoir CDN; restore the original
reseter.css link, and prefer to reference a pinned version (specific versioned
URL) with an integrity (SRI) attribute and crossorigin attribute for security
and reproducibility.

<style>
body { padding: 2rem; font-family: sans-serif; }
section { margin-bottom: 2rem; }
@@ -25,13 +25,13 @@
<form>
<label>Nome: <input type="text" /></label><br><br>
<label>Email: <input type="email" /></label><br><br>
- <button>Enviar</button>
+ <button type="button">Enviar</button>
</form>
</section>

<section>
<h2>Botões e Tipografia</h2>
- <button>Clique Aqui</button>
+ <button type="button">Clique Aqui</button>
<p>Texto comum</p>
<strong>Texto em negrito</strong>
<em>Texto em itálico</em>
diff --git a/src/components/global.scss b/src/components/global.scss
index 2b5da0d..95df3f5 100644
--- a/src/components/global.scss
+++ b/src/components/global.scss
@@ -24,7 +24,7 @@
:where(p + p) {
margin-top: 1rem;
}
-// Acessibilidade: reduz animações para usuários que preferem menos movimento
+// Accessibility: reduce motion for users who prefer less movement
Comment on lines +40 to +41
Copy link

@coderabbitai coderabbitai bot Sep 22, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue

Out of scope: revert global.scss change.

PR description promises “No changes to global.scss”. Please drop this hunk or move it to a separate PR.

-// Accessibility: reduce motion for users who prefer less movement
+// Acessibilidade: reduz animações para usuários que preferem menos movimento
📝 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
�[31m-// Acessibilidade: reduz animações para usuários que preferem menos movimento�[m
�[32m+�[m�[32m// Accessibility: reduce motion for users who prefer less movement�[m
// Acessibilidade: reduz animações para usuários que preferem menos movimento
🤖 Prompt for AI Agents 
In (demo) use Gardevoir CDN; fix button type  style comment in English 
chore remove VSCode launch around lines 40-41, the change to global.scss that
updates a comment from Portuguese to English is out of scope for this PR; either
remove this hunk so global.scss remains untouched in this branch or move the
comment-change into a new separate PR and revert the file in this branch before
merging.

@media (prefers-reduced-motion: reduce) {
*, *::before, *::after {
animation-duration: 0.001ms !important;
40 changes: 40 additions & 0 deletions docs/demo.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,40 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Reseter.css Demo</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/reseter.css/reseter.min.css" />
<style>
body { padding: 2rem; font-family: sans-serif; }
section { margin-bottom: 2rem; }
h2 { border-bottom: 1px solid #ccc; padding-bottom: 0.3rem; }
</style>
</head>
<body>
<h1>Reseter.css Demo</h1>

<section>
<h2>Listas</h2>
<ul><li>Item 1</li><li>Item 2</li></ul>
<ol><li>Item A</li><li>Item B</li></ol>
</section>

<section>
<h2>Formulário</h2>
<form>
<label>Nome: <input type="text" /></label><br><br>
<label>Email: <input type="email" /></label><br><br>
<button type="button">Enviar</button>
</form>
</section>

<section>
<h2>Botões e Tipografia</h2>
<button type="button">Clique Aqui</button>
<p>Texto comum</p>
<strong>Texto em negrito</strong>
<em>Texto em itálico</em>
</section>
Comment on lines +18 to +38
Copy link

@coderabbitai coderabbitai bot Sep 22, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue

Translate all user‑visible strings to English (PR claims “entirely in English”).

Several headings and labels remain in Portuguese. Please update to English for consistency.

-    <h2>Listas</h2>
+    <h2>Lists</h2>
@@
-    <h2>Formulário</h2>
+    <h2>Form</h2>
@@
-      <label>Nome: <input type="text" /></label><br><br>
+      <label>Name: <input type="text" /></label><br><br>
@@
-      <button type="button">Enviar</button>
+      <button type="button">Submit</button>
@@
-    <h2>Botões e Tipografia</h2>
+    <h2>Buttons and Typography</h2>
@@
-    <button type="button">Clique Aqui</button>
+    <button type="button">Click Here</button>
@@
-    <p>Texto comum</p>
-    <strong>Texto em negrito</strong>
-    <em>Texto em itálico</em>
+    <p>Body text</p>
+    <strong>Bold text</strong>
+    <em>Italic text</em>
📝 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
<h2>Listas</h2>
<ul><li>Item 1</li><li>Item 2</li></ul>
<ol><li>Item A</li><li>Item B</li></ol>
</section>
<section>
<h2>Formulário</h2>
<form>
<label>Nome: <input type="text" /></label><br><br>
<label>Email: <input type="email" /></label><br><br>
<button type="button">Enviar</button>
</form>
</section>
<section>
<h2>Botões e Tipografia</h2>
<button type="button">Clique Aqui</button>
<p>Texto comum</p>
<strong>Texto em negrito</strong>
<em>Texto em itálico</em>
</section>
<h2>Lists</h2>
<ul><li>Item 1</li><li>Item 2</li></ul>
<ol><li>Item A</li><li>Item B</li></ol>
</section>
<section>
<h2>Form</h2>
<form>
<label>Name: <input type="text" /></label><br><br>
<label>Email: <input type="email" /></label><br><br>
<button type="button">Submit</button>
</form>
</section>
<section>
<h2>Buttons and Typography</h2>
<button type="button">Click Here</button>
<p>Body text</p>
<strong>Bold text</strong>
<em>Italic text</em>
</section>
🤖 Prompt for AI Agents 
In docs/demo.html around lines 18 to 38, several user-visible strings remain in
Portuguese; update them to English: change headings "Listas"→"Lists",
"Formulário"→"Form", "Botões e Tipografia"→"Buttons and Typography"; change form
labels "Nome"→"Name", "Email"→"Email" (ensure casing consistent), change form
button "Enviar"→"Submit"; change standalone button "Clique Aqui"→"Click Here";
and translate paragraph/inline texts "Texto comum"→"Regular text", "Texto em
negrito"→"Bold text", "Texto em itálico"→"Italic text". Ensure punctuation and
casing remain consistent with surrounding markup.

</body>
</html>