Skip to content

fix(css): exclude webgui styles from buttons/selects in api components #2543

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

Draft
Ajit-Mehrotra wants to merge 1 commit into
base: master
Choose a base branch
from
Draft

fix(css): exclude webgui styles from buttons/selects in api components #2543

Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
8 changes: 4 additions & 4 deletions emhttp/plugins/dynamix/styles/default-base.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2274,9 +2274,9 @@ div#title.ud {
input[type="button"],
input[type="reset"],
input[type="submit"],
button,
button[type="button"],
a.button {
button:where(:not(.unapi *)),
button[type="button"]:where(:not(.unapi *)),
a.button:where(:not(.unapi *)) {
Comment on lines 2274 to +2279
Copy link
Contributor

@coderabbitai coderabbitai bot Feb 10, 2026

Choose a reason for hiding this comment

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

⚠️ Potential issue | 🟠 Major

Inconsistent exclusion: input[type] selectors in the same rule are not wrapped with :where(:not(.unapi *)).

Lines 2274–2276 (input[type="button"], input[type="reset"], input[type="submit"]) are left unmodified while button, button[type="button"], and a.button on lines 2277–2279 are wrapped. If API components can also contain <input type="button|reset|submit"> elements, those will still receive the sidebar overrides.

Proposed fix for consistency 
-    input[type="button"],
-    input[type="reset"],
-    input[type="submit"],
-    button:where(:not(.unapi *)),
-    button[type="button"]:where(:not(.unapi *)),
-    a.button:where(:not(.unapi *)) {
+    input[type="button"]:where(:not(.unapi *)),
+    input[type="reset"]:where(:not(.unapi *)),
+    input[type="submit"]:where(:not(.unapi *)),
+    button:where(:not(.unapi *)),
+    button[type="button"]:where(:not(.unapi *)),
+    a.button:where(:not(.unapi *)) {
📝 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
input[type="button"],
input[type="reset"],
input[type="submit"],
button,
button[type="button"],
a.button {
button:where(:not(.unapi *)),
button[type="button"]:where(:not(.unapi *)),
a.button:where(:not(.unapi *)) {
input[type="button"]:where(:not(.unapi *)),
input[type="reset"]:where(:not(.unapi *)),
input[type="submit"]:where(:not(.unapi *)),
button:where(:not(.unapi *)),
button[type="button"]:where(:not(.unapi *)),
a.button:where(:not(.unapi *)) {
🤖 Prompt for AI Agents 
In `@emhttp/plugins/dynamix/styles/default-base.css` around lines 2274 - 2279, The
rule inconsistently excludes API components: add the same :where(:not(.unapi *))
exclusion to the input selectors so input[type="button"], input[type="reset"],
and input[type="submit"] are wrapped the same way as button,
button[type="button"], and a.button; update the selector list containing
input[type="button"], input[type="reset"], input[type="submit"],
button:where(:not(.unapi *)), button[type="button"]:where(:not(.unapi *)),
a.button:where(:not(.unapi *)) so the input[type=...] selectors include
:where(:not(.unapi *)) (or alternatively add separate
input[type="..."]:where(:not(.unapi *)) entries) to ensure API (.unapi) children
are consistently excluded.

font-family: clear-sans;
font-size: 1.2rem;
font-weight: normal;
Expand Down Expand Up @@ -2346,7 +2346,7 @@ div#title.ud {
color: var(--blue-700);
}

select {
select:where(:not(.unapi *)) {
min-width: 188px;
max-width: 314px;
padding: 6px 14px 6px 6px;
Expand Down
Loading