Home page layout#267
Open
RaphaGil wants to merge 15 commits into
Open
Conversation
Add sticky site header, news banner styling, brand typography, and hero stats animation while restructuring the navbar for tablet and mobile. Co-authored-by: Cursor <cursoragent@cursor.com>
Co-authored-by: Cursor <cursoragent@cursor.com>
Co-authored-by: Cursor <cursoragent@cursor.com>
Add Trusted by and refined partners, projects, capabilities, and contact blocks; update nav links and keyfeatures spacing so design changes render correctly. Co-authored-by: Cursor <cursoragent@cursor.com>
Introduce dedicated contact, OpenMS-lib, partnerships, sponsor, and calendar pages; refresh navbar, publications, news layouts, and unified section spacing; add maintainer guides for updating site content without front-end changes. Co-authored-by: Cursor <cursoragent@cursor.com>
Apply 64rem content width and governance heroes across community pages, add a dedicated donate page with Zeffy config, refresh help and applications listings, and improve navbar mobile layout and search placement. Co-authored-by: Cursor <cursoragent@cursor.com>
Footer social links and partner logos now highlight via icon tint on hover rather than a blue fill behind the icon. Co-authored-by: Cursor <cursoragent@cursor.com>
…news banner. Migrate about, contact, governance, help, research partnerships, and sponsor pages to the openms-lib hero pattern, apply consistent pill button styling across sections, and improve the announcement banner for readability. Co-authored-by: Cursor <cursoragent@cursor.com>
…n layout. Co-authored-by: Cursor <cursoragent@cursor.com>
✅ Deploy Preview for openms ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
Contributor
📝 WalkthroughWalkthroughThe PR adds website-maintenance guidance, new Hugo content templates and pages, a large set of shared and page-specific CSS files, navigation/search scripts, and structured content/config updates for homepage and section pages. ChangesSite config, docs, and content foundations
Homepage, landing sections, and shared marketing modules
Page-specific layouts and content updates
News, publications, and calendar flows
Possibly related PRs
Suggested reviewers
Poem
✨ Finishing Touches🧪 Generate unit tests (beta)
|
![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: 6
Note
Due to the large number of review comments, Critical, Major severity comments were prioritized as inline comments.
🟡 Minor comments (19)
config.yaml-65-68 (1)
65-68:⚠️ Potential issue | 🟡 Minor | ⚡ Quick winUpdate or disable outdated news banner.
The news banner mentions a workshop on "April 30th 2026", but the current date is June 9, 2026. This event is now in the past. Consider updating the banner to reference current/upcoming events or setting
enabled: false.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@config.yaml` around lines 65 - 68, The newsBanner configuration currently shows a past event; update or disable it by adjusting the newsBanner block: either set newsBanner.enabled to false to hide the banner, or update newsBanner.text (and optionally label) to reference a current or upcoming event and ensure the label remains relevant; modify the newsBanner object (fields: enabled, label, text) accordingly.config.yaml-426-427 (1)
426-427:⚠️ Potential issue | 🟡 MinorStandardize GitHub org link casing in footer
config.yaml(lines 426-427) useshttps://github.com/openMS; update it tohttps://github.com/OpenMSfor consistency with the rest of the site.- link: https://github.com/OpenMS icon: github🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@config.yaml` around lines 426 - 427, Update the GitHub footer link string from "https://github.com/openMS" to use the consistent casing "https://github.com/OpenMS" where the footer links are defined (the YAML entry with keys "link" and "icon" and value "https://github.com/openMS"); ensure the change is applied to that YAML list item so the "icon: github" entry still pairs with the corrected "link" value.data/community_events.yaml-9-9 (1)
9-9:⚠️ Potential issue | 🟡 Minor | ⚡ Quick winVerify the Google Forms URL is correct.
The URL points to the edit view of a Google Form (
/edit). If this is meant for public registration, it should likely use/viewforminstead. If it's intentionally for maintainers to edit the form, consider adding a comment clarifying this.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@data/community_events.yaml` at line 9, The URL value under the url key in data/community_events.yaml points to the Google Form edit view (/edit) instead of the public form; if this entry is intended for public registration, replace the trailing path with /viewform (e.g., change the url value to the form's public view URL) otherwise leave it but add a short YAML comment next to the url key explaining that this edit link is intentional for maintainers so reviewers know it's not an accidental publishable link.docs/common-tasks/add-webapp-to-homepage.md-56-56 (1)
56-56:⚠️ Potential issue | 🟡 Minor | ⚡ Quick winBroken documentation reference.
The link to
../reference/shortcodes.mdpoints to a file that is not present in this PR. Either add that documentation file or remove this reference until it's created.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@docs/common-tasks/add-webapp-to-homepage.md` at line 56, The documentation reference to "../reference/shortcodes.md" in docs/common-tasks/add-webapp-to-homepage.md is broken because that target file isn't present in this PR; either add the missing documentation file named reference/shortcodes.md with the expected shortcodes content, or remove/replace the link in the sentence "See [Edit a page](edit-a-page.md) and [Shortcodes](../reference/shortcodes.md) for figures and notices" so it points to an existing page (or a placeholder) and update any related cross-references.docs/common-tasks/edit-a-page.md-64-64 (1)
64-64:⚠️ Potential issue | 🟡 Minor | ⚡ Quick winBroken documentation reference.
The link to
../reference/shortcodes.mdpoints to a file that is not present in this PR. Either add that documentation file or remove this reference until it's created.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@docs/common-tasks/edit-a-page.md` at line 64, The markdown link "Full list: [Shortcodes](../reference/shortcodes.md)." points to a missing file; either add the referenced documentation file (create reference/shortcodes.md with the shortcodes content) or update/remove the link so it doesn't point to a non-existent resource — edit the line "Full list: [Shortcodes](../reference/shortcodes.md)." in edit-a-page.md to reference the correct existing path or remove the sentence until reference/shortcodes.md is added.docs/README.md-28-30 (1)
28-30:⚠️ Potential issue | 🟡 Minor | ⚡ Quick winBroken internal documentation references.
The task table and documentation map reference several files that are not present in this PR:
workflow/pull-requests.md(line 28)workflow/deployment.md(line 29)workflow/who-to-ask.md(line 30)reference/content-front-matter.md(line 58)reference/shortcodes.md(line 60)reference/file-locations.md(line 61)troubleshooting/common-errors.md(line 67)These broken links will confuse maintainers. Either add these files in this PR or remove/comment the references until they are created.
Also applies to: 58-67
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@docs/README.md` around lines 28 - 30, The README contains links to missing docs that break navigation (references to workflow/pull-requests.md, workflow/deployment.md, workflow/who-to-ask.md and reference/content-front-matter.md, reference/shortcodes.md, reference/file-locations.md, troubleshooting/common-errors.md); either add the corresponding markdown files with at least a placeholder and front-matter, or remove/comment the table rows and link entries in docs/README.md that reference those paths so the README only points to existing files, ensuring any newly added placeholders include a short “TODO: add content” note to avoid future confusion.assets/css/hero-saas.css-210-213 (1)
210-213:⚠️ Potential issue | 🟡 Minor | ⚡ Quick winFix CSS keyword casing: use lowercase
currentcolor.Per CSS spec, keyword values should be lowercase. Change
currentColortocurrentcoloron lines 210-213.🔧 Proposed fix
background-image: - linear-gradient(currentColor 0 0), - linear-gradient(currentColor 0 0), - linear-gradient(currentColor 0 0), - linear-gradient(currentColor 0 0); + linear-gradient(currentcolor 0 0), + linear-gradient(currentcolor 0 0), + linear-gradient(currentcolor 0 0), + linear-gradient(currentcolor 0 0);🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@assets/css/hero-saas.css` around lines 210 - 213, The CSS uses the keyword with incorrect casing in the gradient declarations; update each occurrence of "currentColor" inside the linear-gradient(...) calls (e.g., the lines containing linear-gradient(currentColor 0 0)) to the lowercase "currentcolor" to conform to the CSS spec and ensure consistent keyword usage across the gradient declarations.Source: Linters/SAST tools
assets/css/hero-saas.css-86-86 (1)
86-86:⚠️ Potential issue | 🟡 MinorFix browser-support claim for
text-wrap: prettyinassets/css/hero-saas.css
text-wrap: prettyis supported in Chrome 117+, but Firefox has no support. Safari support is not present in Safari 16.4; it only shows up in newer Safari/WebKit (caniuse lists Safari 26.0, i.e., newer WebKit/Safari Technology Preview). Remove/adjust the “Safari 16.4+” statement and ensure the Firefox fallback (default wrapping) matches your audience’s browser support.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@assets/css/hero-saas.css` at line 86, Update the browser-support claim and fallback for the CSS rule using text-wrap: pretty in assets/css/hero-saas.css: remove the incorrect “Safari 16.4+” note (it’s only supported in much newer WebKit/Safari) and clarify that Firefox does not support it (Chrome 117+ only), and wrap the rule in a graceful `@supports` or feature-detection comment so that the default wrapping behavior (no special text-wrap) is used as the Firefox fallback; ensure the identifier to change is the CSS declaration text-wrap: pretty and the surrounding comment/feature-detection logic in assets/css/hero-saas.css.assets/css/heroitems.css-5-5 (1)
5-5:⚠️ Potential issue | 🟡 Minor | ⚡ Quick winStylelint spacing rule is violated at Line 5.
declaration-empty-line-beforeis flagged here; please align formatting so lint remains clean.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@assets/css/heroitems.css` at line 5, The padding declaration "padding: clamp(2.75rem, 5.5vh, 4rem) clamp(1.25rem, 4vw, 2.5rem);" violates the Stylelint declaration-empty-line-before rule; fix it by adding or removing the required empty line(s) before this declaration to match your project's Stylelint config (ensure consistent blank-line placement relative to the previous declaration or rule). Locate the padding declaration in heroitems.css and adjust surrounding blank lines so the declaration-empty-line-before rule is satisfied.Source: Linters/SAST tools
assets/css/heroitems.css-496-504 (1)
496-504:⚠️ Potential issue | 🟡 Minor | ⚡ Quick winAlternating developer panel order selector is targeting the wrong element.
The
:nth-child(even)is applied to.openms-step, but parity should be computed on the grid item wrapper. As written, the even-card reorder styles may never apply as intended.Suggested fix
-.openms-steps--developers .openms-step:nth-child(even) .openms-step__media { +.openms-steps--developers .openms-steps__item:nth-child(even) .openms-step__media { order: 2; border-bottom: none; border-top: 1px solid rgba(var(--openms-white-rgb), 0.12); } -.openms-steps--developers .openms-step:nth-child(even) .openms-step__content { +.openms-steps--developers .openms-steps__item:nth-child(even) .openms-step__content { order: 1; } @@ - .openms-steps--developers .openms-step:nth-child(even) .openms-step__media { + .openms-steps--developers .openms-steps__item:nth-child(even) .openms-step__media { order: 1; border-top: none; } - .openms-steps--developers .openms-step:nth-child(even) .openms-step__content { + .openms-steps--developers .openms-steps__item:nth-child(even) .openms-step__content { order: 2; }Also applies to: 617-624
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@assets/css/heroitems.css` around lines 496 - 504, The parity selector is placed on .openms-step but must be applied to the grid item wrapper that is the direct child of .openms-steps--developers so the even/odd layout flips correctly; change the selectors so :nth-child(even) targets the grid item wrapper (the element that is a direct child of .openms-steps--developers) and then scope .openms-step__media and .openms-step__content inside that wrapper (update both the current .openms-step:nth-child(even) rules and the similar block at 617-624 accordingly).assets/css/home.css-18-18 (1)
18-18:⚠️ Potential issue | 🟡 Minor | ⚡ Quick winStylelint declaration spacing errors need cleanup.
Lines 18, 910, and 1236 are flagged by
declaration-empty-line-before. Please fix these to avoid lint noise/failures.Also applies to: 910-910, 1236-1236
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@assets/css/home.css` at line 18, The Stylelint rule is flagging the three "display: flex;" declarations for incorrect blank-line spacing; for each occurrence (the rule containing the "display: flex;" at the three flagged locations) remove the stray empty line immediately before the declaration so the declaration follows the previous token (or adjust to match the surrounding declarations) to satisfy declaration-empty-line-before; locate the "display: flex;" entries and make their pre-declaration spacing consistent with the file's existing declaration spacing style.Source: Linters/SAST tools
assets/css/keyfeatures-modern.css-242-242 (1)
242-242:⚠️ Potential issue | 🟡 Minor | ⚡ Quick winStylelint spacing issue at Line 242.
declaration-empty-line-beforeis reported here; please align spacing with the lint rule.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@assets/css/keyfeatures-modern.css` at line 242, The Stylelint error flags the declaration "padding-inline: clamp(1.25rem, 5vw, 1.85rem);" for declaration-empty-line-before; fix by aligning spacing with the project's lint rule — insert a single blank line immediately before that declaration (or remove any extra blank line if your rule forbids one) so the spacing around the "padding-inline" declaration matches the configured declaration-empty-line-before behavior in assets/css/keyfeatures-modern.css.Source: Linters/SAST tools
assets/css/hero-sponsors.css-97-97 (1)
97-97:⚠️ Potential issue | 🟡 Minor | ⚡ Quick winHigh-contrast border override is currently a no-op.
Line 97 removes the border entirely, so changing only
border-colorat Line 196 does not render any visible border in high-contrast mode.Suggested fix
`@media` (prefers-contrast: more) { .hero-sponsors__label { color: var(--openms-dark); } .hero-sponsors__logo-link { - border-color: var(--openms-white); + border: 1px solid var(--openms-dark); }Also applies to: 195-197
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@assets/css/hero-sponsors.css` at line 97, The rule that sets "border: none;" (the declaration at line with "border: none;") cancels any later "border-color" adjustments, so restore a visible border baseline instead of removing it; replace the "border: none" declaration with a neutral baseline like a transparent border (e.g., set an explicit border-width and border-style such as 1px solid transparent) so the high-contrast override that changes "border-color" (the rule that sets "border-color" around line 196) will actually render; update both the earlier "border: none" occurrence and the similar block around lines 195-197 to use the explicit border-width/style baseline rather than removing the border.assets/css/navbar-responsive.css-833-838 (1)
833-838:⚠️ Potential issue | 🟡 Minor | ⚡ Quick winNormalize
currentcolorkeyword casing to satisfy stylelint.Line 837, Line 1112, Line 1120, and Line 1132 use
currentColor, which violates the configuredvalue-keyword-caserule.Suggested fix
- fill: currentColor; + fill: currentcolor; ... - fill: currentColor; + fill: currentcolor; ... - fill: currentColor; + fill: currentcolor; ... - fill: currentColor; + fill: currentcolor;Also applies to: 1110-1133
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@assets/css/navbar-responsive.css` around lines 833 - 838, The CSS uses the `currentColor` keyword with incorrect casing which violates stylelint's value-keyword-case rule; update all occurrences (e.g., the `fill` property in rules for `.site-header `#nav.navbar.is-fresh` .navbar-menu .navbar-mobile-social svg.icon` and `#navbar-clone.navbar.is-fresh .navbar-menu .navbar-mobile-social svg.icon`, and the other occurrences around lines 1110–1133) to use the lowercased `currentcolor` so the `fill` declarations conform to the linter.Source: Linters/SAST tools
assets/css/navbar-responsive.css-375-383 (1)
375-383:⚠️ Potential issue | 🟡 Minor | ⚡ Quick winUnify fallback header-height values for overlay alignment.
Line 381 uses
var(--openms-header-height, 4.5rem)while Line 497 usesvar(--openms-header-height, 4.25rem). If the variable is unset, the backdrop and menu start at different offsets.Suggested fix
- top: var(--openms-header-height, 4.25rem); + top: var(--openms-header-height, 4.5rem);Also applies to: 487-499
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@assets/css/navbar-responsive.css` around lines 375 - 383, The backdrop/menu offset fallbacks are inconsistent: replace the differing fallback value used with var(--openms-header-height, 4.25rem) so both selectors use the same fallback (or pick and apply one consistent fallback such as 4.5rem) — update the occurrences for .site-header `#nav.navbar.is-fresh.is-menu-open` .navbar-backdrop and `#navbar-clone.navbar.is-fresh.is-menu-open` .navbar-backdrop (and the matching rule in the 487-499 block) to use the identical var(--openms-header-height, <chosen-rem>) fallback so the overlay aligns when the CSS variable is unset.assets/css/navbar-search.css-66-76 (1)
66-76:⚠️ Potential issue | 🟡 Minor | ⚡ Quick winReplace deprecated
clipin the visually-hidden label utility.Line 73 uses deprecated
clip, which is flagged by stylelint.Suggested fix
.navbar-search__label { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; - clip: rect(0, 0, 0, 0); + clip-path: inset(50%); white-space: nowrap; border: 0; }🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@assets/css/navbar-search.css` around lines 66 - 76, Replace the deprecated clip usage in the .navbar-search__label rule by removing the clip property and adding a modern clipping rule: use clip-path: inset(50%) (and include -webkit-clip-path: inset(50%) for broader support) to achieve the same visually-hidden effect while keeping the existing position, size, overflow and accessibility-related properties; update the .navbar-search__label selector accordingly.Source: Linters/SAST tools
assets/css/openms-lib.css-1366-1368 (1)
1366-1368:⚠️ Potential issue | 🟡 Minor | ⚡ Quick winFix the mismatched resource-card selector.
The sibling selector targets
.openms-resource-card, but the card class defined in this file is.openms-lib-resource-card, so this reset won’t apply.Suggested fix
.openms-lib-list--resource-grid .openms-lib-list__row + .openms-lib-list__row, -.openms-lib-list--resource-grid .openms-resource-card + .openms-resource-card { +.openms-lib-list--resource-grid .openms-lib-resource-card + .openms-lib-resource-card { border-top: none; }🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@assets/css/openms-lib.css` around lines 1366 - 1368, The sibling selector currently targets .openms-resource-card but the actual card class in this stylesheet is .openms-lib-resource-card; update the selector in the rule that begins with .openms-lib-list--resource-grid so the second selector uses .openms-lib-resource-card (i.e., .openms-lib-list--resource-grid .openms-lib-resource-card + .openms-lib-resource-card) so the border-top reset applies to the real card elements.assets/css/openms-lib.css-253-253 (1)
253-253:⚠️ Potential issue | 🟡 Minor | ⚡ Quick winUse lowercase
currentcolorto satisfy the stylelint rule.
currentColorviolatesvalue-keyword-casein the current lint config.Suggested fix
-.openms-steps--lib-list .openms-steps__title-accent { +.openms-steps--lib-list .openms-steps__title-accent { color: var(--openms-blue); background: none; - -webkit-text-fill-color: currentColor; + -webkit-text-fill-color: currentcolor; }🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@assets/css/openms-lib.css` at line 253, The CSS property -webkit-text-fill-color is using the keyword "currentColor" which violates the value-keyword-case lint rule; change the keyword to lowercase "currentcolor" in the -webkit-text-fill-color declaration (search for the -webkit-text-fill-color rule in openms-lib.css) so the value matches the stylelint configuration.Source: Linters/SAST tools
assets/js/community-calendar.js-74-76 (1)
74-76:⚠️ Potential issue | 🟡 Minor | ⚡ Quick winSort may fail silently with invalid event dates.
If
parseDate(a.start)orparseDate(b.start)returnsnull(due to invalid date format), the subtraction will produceNaN, causing unpredictable sort ordering rather than throwing an error.🛡️ Add null guards to ensure stable sorting
.sort(function (a, b) { - return parseDate(a.start) - parseDate(b.start); + var aDate = parseDate(a.start); + var bDate = parseDate(b.start); + if (!aDate || !bDate) return 0; + return aDate - bDate; });🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@assets/js/community-calendar.js` around lines 74 - 76, The current sort callback uses parseDate(a.start) and parseDate(b.start) directly, which can return null and produce NaN; update the comparator used in the .sort(...) call to guard against nulls by converting parseDate(...) to a numeric timestamp with a safe fallback (e.g., treat invalid dates as +Infinity or a very large number so they sort to the end, or as -Infinity to sort to start), and then subtract those safe numeric values; reference the parseDate function and the anonymous comparator passed to .sort to locate and replace the comparison with a null-guarded timestamp comparison.
🧹 Nitpick comments (12)
config.yaml (2)
496-498: ⚡ Quick winHardcoded version in pyOpenMS documentation link.
The "Background" navigation link includes a hardcoded version path
release-3.5.0in the pyOpenMS ReadTheDocs URL. This will become outdated with new releases. Consider using/en/latest/instead of version-specific paths, or document that this link needs updating with each release.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@config.yaml` around lines 496 - 498, The nav entry with title "Background" contains a hardcoded pyOpenMS URL string "https://pyopenms.readthedocs.io/en/release-3.5.0/user_guide/background.html"; update that URL to use a non-versioned path such as "https://pyopenms.readthedocs.io/en/latest/user_guide/background.html" (or make the base docs path configurable) so the link won’t become stale on new releases—locate the "title: Background" entry and change the URL value accordingly.
194-196: ⚡ Quick winComplete or remove placeholder "Korean team" entry.
The "Korean team" entry appears to be a placeholder with a generic name and commented-out URL. Consider either:
- Adding the actual organization name and URL
- Removing this entry until complete information is available
Placeholder data in production config can confuse maintainers.
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@config.yaml` around lines 194 - 196, The "Korean team" placeholder entry (name: "Korean team", abbr: KR, commented url) should be completed or removed: either replace "Korean team" and the commented-out url with the real organization name and its URL (uncomment and set url) ensuring abbr: KR is accurate, or delete the entire placeholder block to avoid shipping dummy data; update any related references that expect abbr: KR if you remove or rename it.content/en/about.md (1)
60-63: ⚡ Quick winVerify consistent button styling.
The two CTA buttons use different CSS class patterns:
- Donate button:
about-cta-btn about-cta-btn--donate- Sponsor button:
openms-step__cta openms-btn-primary about-cta-btn--sponsorThis mixing of class naming conventions (
about-cta-btnvsopenms-btn-primaryvsopenms-step__cta) may result in inconsistent button appearance. Verify this produces the intended visual design.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@content/en/about.md` around lines 60 - 63, Two CTA anchors use inconsistent class naming which can cause visual mismatch: one uses "about-cta-btn about-cta-btn--donate" while the other uses "openms-step__cta openms-btn-primary about-cta-btn--sponsor"; update the sponsor anchor to match the donate button pattern (e.g., use "about-cta-btn about-cta-btn--sponsor") or conversely refactor both to a single shared button component class, and then adjust CSS rules (or remove conflicting "openms-step__cta"/"openms-btn-primary" selectors) so both "about-cta-btn" variants render identically according to the design system.assets/css/community-calendar.css (1)
275-368: 🏗️ Heavy liftButton styling duplication (see comments in about.css and applications-page.css).
This is the third file with the same "Navbar-style CTA motion" button pattern. Consider centralizing as noted in earlier files.
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@assets/css/community-calendar.css` around lines 275 - 368, The community calendar CSS duplicates the shared "Navbar-style CTA motion" button patterns; extract the common rules from selectors like .community-calendar-layout .openms-lib-btn, .openms-lib-btn--primary, .openms-lib-btn--ghost, .community-calendar__nav and .community-calendar__today into a single shared utility (e.g., openms button base and modifiers) in the central shared stylesheet used by about.css and applications-page.css, then update this file to use those shared classes instead of repeating the full rule set and remove the duplicated blocks (keep only calendar-specific overrides such as width/padding in .community-calendar-layout .community-calendar__nav and any unique toolbar/action gaps like .openms-lib-hero__actions and .community-calendar__toolbar).assets/css/applications-page.css (1)
82-163: 🏗️ Heavy liftButton styling duplication (see comment in about.css).
This button styling block duplicates the pattern from
assets/css/about.csslines 267-368. Consider centralizing shared button styles as noted in the review of about.css.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@assets/css/applications-page.css` around lines 82 - 163, The button rules in this diff duplicate styles already defined in assets/css/about.css; extract the shared rules (base button layout: .applications-page-layout .openms-lib-btn and shared state rules for .openms-lib-btn--primary, .openms-lib-btn--ghost and the selector for .applications-page__card .governance-card__link a) into a single shared stylesheet or a common class (e.g., .openms-btn-base and shared modifiers like .openms-lib-btn--primary/.openms-lib-btn--ghost), then replace the duplicated blocks in this file with references to those common classes and keep only page-specific overrides here; update/about.css to use the same shared classes so both pages consume the centralized styles and remove the duplicated declarations from this file.assets/css/about.css (2)
267-368: 🏗️ Heavy liftConsider centralizing button styling to reduce duplication.
The "Navbar-style CTA motion" button styles defined here (lines 267-368) are very similar to button styles in
assets/css/applications-page.css(lines 82-163) andassets/css/community-calendar.css(lines 275-368). This represents significant code duplication across ~100 lines per file.Consider extracting shared button styling (base structure, primary/ghost variants, hover/focus-visible states, focus rings, and reduced-motion handling) into a dedicated
assets/css/buttons.cssor adding these to an existing shared stylesheet, then importing it into page-specific files.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@assets/css/about.css` around lines 267 - 368, The CSS duplicates shared CTA/button styles across pages; extract the common rules (base selector .about-page-layout .openms-lib-btn and variants .openms-lib-btn--primary, .openms-lib-btn--ghost, .about-cta-btn--donate, .openms-btn-primary plus their :hover/:focus-visible/:active and focus-ring box-shadow rules) into a single shared stylesheet (e.g., assets/css/buttons.css) and replace the page-specific blocks with imports or minimal overrides for page-specific colors/gaps; ensure reduced-motion/transition vars remain handled and keep only variant overrides in about.css, community-calendar.css and applications-page.css.
412-434: ⚡ Quick winSponsor tier badge colors could reference brand palette variables.
The sponsor tier badges use hard-coded gradient values and border colors. While these are intentionally distinct from the brand palette, consider defining them as CSS custom properties in
brand-palette.css(e.g.,--sponsor-platinum-gradient,--sponsor-gold-gradient, etc.) for consistency with the rest of the theming system and easier future adjustments.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@assets/css/about.css` around lines 412 - 434, Replace the hard-coded gradient and border color values in the .sponsor-tier--platinum .sponsor-tier__badge, .sponsor-tier--gold .sponsor-tier__badge, .sponsor-tier--silver .sponsor-tier__badge, and .sponsor-tier--bronze .sponsor-tier__badge rules by defining CSS custom properties in your brand-palette.css (e.g., --sponsor-platinum-gradient, --sponsor-platinum-border, --sponsor-gold-gradient, --sponsor-gold-border, --sponsor-silver-gradient, --sponsor-silver-border, --sponsor-bronze-gradient, --sponsor-bronze-border) and then reference them with var(...) in these selectors so the badge gradients and borders are managed from the central theme file.assets/css/content_override.css (1)
9-12: ⚡ Quick winVerify negative margin behavior in all contexts.
The negative
margin-bottomonh4elements could cause unexpected layout issues or content overlap, especially with dynamic content. Ensure this behaves correctly across all page contexts where h4 appears.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@assets/css/content_override.css` around lines 9 - 12, The negative margin-bottom on .content-container h4 (margin-bottom: -0.625rem) can cause overlap; change it to a non-negative spacing strategy and verify in all contexts by replacing the negative margin with a stable approach (e.g., remove negative margin and use positive margin or padding on the following element/container, or use a utility class for consistent spacing), then test .content-container h4 across pages (dynamic content, embedded widgets, and responsive breakpoints) to ensure no overlap or layout shifts occur; if any component relied on the negative offset, adjust that component’s spacing instead of using negative margins.assets/css/contact-area.css (1)
313-313: 💤 Low valueConsider refactoring to avoid
!important.The
!importantflag suggests specificity conflicts. Consider restructuring selectors or increasing specificity naturally to avoid this override.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@assets/css/contact-area.css` at line 313, Replace the use of the hard override "color: var(--openms-white) !important;" by resolving the underlying specificity conflict: locate the CSS rule containing that declaration and either increase its natural specificity (e.g., by using a more specific selector chain or adding a contextual class) or move the rule later in the stylesheet so it naturally wins, or refactor competing selectors so they no longer collide; ensure you remove the "!important" token from the "color: var(--openms-white)" declaration after adjusting selectors so the intended color applies without forcing an override.assets/css/contact-page.css (1)
130-130: ⚡ Quick winReduce reliance on
!importantdeclarations.Multiple
!importantflags throughout this file suggest specificity conflicts. Consider restructuring selectors to achieve proper specificity without forcing overrides.Also applies to: 142-142, 313-313, 536-536, 543-543, 564-564, 573-573
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@assets/css/contact-page.css` at line 130, The rule "color: var(--openms-blue) !important;" in assets/css/contact-page.css (and the other occurrences flagged) should not use !important; remove the !important and instead increase selector specificity or move the rule later in the cascade so it naturally overrides conflicting rules (e.g., change a selector to include the page root or a component class like .contact-page .<existing-selector> or add a modifier class such as .is-active to target elements). Alternatively, extract a utility class (e.g., .text-openms-blue) and apply it to the markup so you can keep a simple, specific selector without !important; repeat this change for the identical declarations flagged elsewhere in the file.assets/js/navbar.js (2)
5-5: VerifyMOBILE_MAXmatches CSS breakpoints.The mobile detection threshold is set to
1279px. Ensure this value matches the navbar breakpoints defined in the CSS files (particularlynavbar-responsive.cssfrom the earlier cohort) to prevent mismatches between JS behavior and visual layout.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@assets/js/navbar.js` at line 5, The constant MOBILE_MAX in navbar.js is set to 1279 which may not match the CSS breakpoint; verify the breakpoint value used in the navbar CSS (e.g., navbar-responsive.css) and update MOBILE_MAX to the same pixel value (or derive it from a single source) so JS mobile detection aligns with the CSS breakpoint; confirm you adjust the value where MOBILE_MAX is declared and any dependent logic that uses MOBILE_MAX.
87-88: ⚖️ Poor tradeoff
stopImmediatePropagationsuggests tight coupling with theme.This workaround prevents the theme's
fresh.jsfrom also handling the burger click. While functional, it creates a brittle dependency on event handler registration order. If the theme updates its event handling or this script loads in a different order, the behavior could break.Consider coordinating with the theme to either disable its burger handler when custom logic is present, or extending the theme's handler instead of blocking it.
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@assets/js/navbar.js` around lines 87 - 88, You have a brittle stopImmediatePropagation() workaround in the burger click handler that couples this script to the theme's fresh.js; remove the e.stopImmediatePropagation() call and instead coordinate via an explicit guard/flag so both handlers won't double-toggle: before toggling the menu in your handler (the code referencing the burger element and the click event), set a short-lived flag (e.g., element.dataset.customBurgerHandled = "1" or window.__customBurgerHandling = true), perform your toggle logic, then clear the flag; update your handler to check that flag at the top and return early if set so the theme handler can check the same flag (or you can dispatch a custom event the theme can listen to), referencing the burger click handler and the fresh.js theme integration rather than using stopImmediatePropagation().
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: b85811d2-0bf9-482b-8aa7-8bea43db07f2
⛔ Files ignored due to path filters (2)
assets/icons/linkedin.svgis excluded by!**/*.svgstatic/images/logos/immatics.pngis excluded by!**/*.png
📒 Files selected for processing (146)
.github/pull_request_template.mdREADME.mdarchetypes/news.mdassets/css/about.cssassets/css/applications-page.cssassets/css/brand-palette.cssassets/css/casestudies.cssassets/css/community-calendar.cssassets/css/contact-area.cssassets/css/contact-page.cssassets/css/content_override.cssassets/css/contribute-page.cssassets/css/donate-page.cssassets/css/governance.cssassets/css/help-page.cssassets/css/hero-saas.cssassets/css/hero-sponsors.cssassets/css/hero.cssassets/css/heroitems.cssassets/css/home.cssassets/css/keyfeatures-modern.cssassets/css/keyfeatures_override.cssassets/css/landing-page.cssassets/css/mailchimp.cssassets/css/members.cssassets/css/navbar-responsive.cssassets/css/navbar-search.cssassets/css/news-banner.cssassets/css/news-section.cssassets/css/openms-buttons.cssassets/css/openms-lib.cssassets/css/publications.cssassets/css/quick-facts.cssassets/css/research-partnerships-page.cssassets/css/shell.cssassets/css/shortcuts_override.cssassets/css/site-header.cssassets/css/sponsor-us-page.cssassets/css/styles_override.cssassets/css/tabs.cssassets/css/terminal.cssassets/css/trusted-by.cssassets/css/typography.cssassets/css/university-partners.cssassets/css/vars_override.cssassets/css/webapps.cssassets/js/back-to-top.jsassets/js/community-calendar.jsassets/js/hero-stats.jsassets/js/home-scroll-reveal.jsassets/js/navbar-search.jsassets/js/navbar.jsassets/js/news-year-filter.jsassets/js/publications-year-filter.jsassets/js/swiper.jsconfig.yamlcontent/en/about.mdcontent/en/applications/_index.mdcontent/en/calendar.mdcontent/en/contact.mdcontent/en/contribute.mdcontent/en/donate.mdcontent/en/governance.mdcontent/en/help.mdcontent/en/news/_index.mdcontent/en/news/gsoc2025.mdcontent/en/openms-lib.mdcontent/en/publications.mdcontent/en/research-partnerships.mdcontent/en/sponsor-us.mddata/community_events.yamldocs/README.mddocs/common-tasks/add-images.mddocs/common-tasks/add-news-post.mddocs/common-tasks/add-webapp-to-homepage.mddocs/common-tasks/configure-donate-zeffy.mddocs/common-tasks/edit-a-page.mddocs/common-tasks/edit-footer-or-navbar.mddocs/common-tasks/edit-homepage-hero.mddocs/common-tasks/update-community-calendar.mddocs/common-tasks/update-news-banner.mddocs/getting-started/edit-via-github.mddocs/getting-started/preview-locally.mddocs/reference/config-yaml-guide.mddocs/reference/content-front-matter.mddocs/reference/file-locations.mddocs/reference/shortcodes.mddocs/troubleshooting/common-errors.mddocs/workflow/deployment.mddocs/workflow/pull-requests.mddocs/workflow/who-to-ask.mdlayouts/_default/baseof.htmllayouts/_default/single.htmllayouts/applications/section.htmllayouts/index.htmllayouts/index.searchindex.jsonlayouts/news/section.htmllayouts/news/single.htmllayouts/partials/about-main.htmllayouts/partials/community-calendar-main.htmllayouts/partials/contact-alternatives.htmllayouts/partials/contact-area.htmllayouts/partials/contact-email-aside.htmllayouts/partials/contact-main.htmllayouts/partials/contact-support.htmllayouts/partials/contribute-main.htmllayouts/partials/css.htmllayouts/partials/donate-main.htmllayouts/partials/footer.htmllayouts/partials/governance-main.htmllayouts/partials/help-main.htmllayouts/partials/hero-sponsors.htmllayouts/partials/hero-stat-card.htmllayouts/partials/hero-stats.htmllayouts/partials/hero.htmllayouts/partials/heroitems.htmllayouts/partials/home-pathways.htmllayouts/partials/keyfeatures.htmllayouts/partials/navbar-clone.htmllayouts/partials/navbar-cta.htmllayouts/partials/navbar-mobile-ctas.htmllayouts/partials/navbar-search.htmllayouts/partials/navbar-social.htmllayouts/partials/navbar-sublinks.htmllayouts/partials/navbar.htmllayouts/partials/news-banner.htmllayouts/partials/news-date-badge.htmllayouts/partials/news-single-main.htmllayouts/partials/openms-lib-main.htmllayouts/partials/publications-main.htmllayouts/partials/publications-year-select.htmllayouts/partials/research-partnerships-main.htmllayouts/partials/single/content.htmllayouts/partials/sponsor-tiers.htmllayouts/partials/sponsor-us-main.htmllayouts/partials/tally-form-embed.htmllayouts/partials/trusted-by.htmllayouts/partials/university-partners.htmllayouts/partials/webapps-project-card.htmllayouts/partials/webapps.htmllayouts/shortcodes/heroitems.htmllayouts/shortcodes/keyfeatures.htmllayouts/shortcodes/partners.htmllayouts/shortcodes/publications-year-select.htmllayouts/shortcodes/sponsor-tiers.htmllayouts/shortcodes/sponsors.html
💤 Files with no reviewable changes (1)
- assets/css/vars_override.css
Comment on lines
+512
to
+588
| .contact-page-layout .openms-lib-btn { | ||
| display: inline-flex; | ||
| align-items: center; | ||
| justify-content: center; | ||
| gap: 0.35rem; | ||
| width: fit-content; | ||
| min-height: 2.75rem; | ||
| padding: var(--openms-btn-padding); | ||
| border-radius: var(--openms-btn-pill-radius); | ||
| font-family: var(--openms-font-body); | ||
| font-size: var(--openms-text-min); | ||
| font-weight: 600; | ||
| line-height: 1.3; | ||
| white-space: nowrap; | ||
| text-decoration: none; | ||
| box-shadow: 0 0 0 0 var(--openms-btn-glow); | ||
| transition: var(--openms-btn-motion); | ||
| } | ||
|
|
||
| .contact-page-layout .openms-lib-btn--primary { | ||
| gap: 0.5rem; | ||
| padding-inline: 1.15rem; | ||
| border: 2px solid var(--openms-navy); | ||
| background: var(--openms-navy); | ||
| color: var(--openms-white) !important; | ||
| } | ||
|
|
||
| .contact-page-layout .openms-lib-btn--ghost { | ||
| border: 2px solid var(--openms-blue); | ||
| background: transparent; | ||
| background-color: transparent; | ||
| color: var(--openms-blue) !important; | ||
| } | ||
|
|
||
| .contact-page-layout .openms-lib-hero__actions { | ||
| gap: 0.75rem; | ||
| } | ||
|
|
||
| .contact-page-layout .openms-lib-btn--primary:hover, | ||
| .contact-page-layout .openms-lib-btn--primary:focus-visible, | ||
| .contact-page-layout .openms-lib-btn--primary:active { | ||
| transform: scale(var(--openms-btn-hover-scale)); | ||
| box-shadow: 0 0 0 var(--openms-btn-glow-size) var(--openms-btn-glow); | ||
| outline: none; | ||
| text-decoration: none; | ||
| } | ||
|
|
||
| .contact-page-layout .openms-lib-btn--primary:hover, | ||
| .contact-page-layout .openms-lib-btn--primary:focus-visible, | ||
| .contact-page-layout .openms-lib-btn--primary:active { | ||
| background: var(--openms-navy); | ||
| border-color: var(--openms-navy); | ||
| color: var(--openms-white) !important; | ||
| } | ||
|
|
||
| .contact-page-layout .openms-lib-btn--ghost:hover, | ||
| .contact-page-layout .openms-lib-btn--ghost:focus-visible, | ||
| .contact-page-layout .openms-lib-btn--ghost:active { | ||
| background: transparent; | ||
| background-color: transparent; | ||
| border-color: var(--openms-blue); | ||
| color: var(--openms-blue) !important; | ||
| transform: scale(var(--openms-btn-hover-scale)); | ||
| box-shadow: 0 0 0 var(--openms-btn-glow-size) var(--openms-btn-glow); | ||
| outline: none; | ||
| text-decoration: none; | ||
| } | ||
|
|
||
| .contact-page-layout .openms-lib-btn--primary:focus-visible { | ||
| box-shadow: 0 0 0 3px var(--openms-navy), 0 0 0 5px var(--openms-blue), | ||
| 0 0 0 calc(5px + var(--openms-btn-glow-size)) var(--openms-btn-glow); | ||
| } | ||
|
|
||
| .contact-page-layout .openms-lib-btn--ghost:focus-visible { | ||
| box-shadow: var(--openms-hero-focus-ring, 0 0 0 3px var(--openms-navy), 0 0 0 5px var(--openms-yellow)), | ||
| 0 0 0 calc(5px + var(--openms-btn-glow-size)) var(--openms-btn-glow); | ||
| } |
Contributor
There was a problem hiding this comment.
🛠️ Refactor suggestion | 🟠 Major | 🏗️ Heavy lift
Extract duplicated CTA button styles into a shared module.
The navbar-style CTA button definitions (lines 512-588) are duplicated across multiple page-specific stylesheets (contact-page.css, contribute-page.css, governance.css, help-page.css). This violates DRY principles and makes maintenance harder.
Consider extracting these common button styles into a shared CSS module (e.g., openms-buttons.css or a base CTA component file) and importing or referencing it across pages.
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@assets/css/contact-page.css` around lines 512 - 588, The CTA button styles
for .contact-page-layout .openms-lib-btn and its variants
.openms-lib-btn--primary, .openms-lib-btn--ghost and related rules are
duplicated across page CSS files; extract these common rules into a shared
stylesheet (e.g., openms-buttons.css or a base CTA component) containing the
base .openms-lib-btn, .openms-lib-btn--primary, .openms-lib-btn--ghost, and
.openms-lib-hero__actions rules plus hover/focus states and focus-ring
box-shadows, then remove the duplicated blocks from contact-page.css and replace
them with an import or reference to the shared module so all pages consume the
single source of truth.
Comment on lines
+232
to
+237
| @media (max-width: 48rem) { | ||
| .hero-sponsors { | ||
| min-height: clamp(14rem, 36vh, 20rem); | ||
| padding-top: clamp(5.5rem, 20vw, 7rem); | ||
| padding-bottom: clamp(2rem, 4.5vh, 2.75rem); | ||
| } |
Contributor
There was a problem hiding this comment.
Cross-component style leak: keyfeatures-modern.css is overriding .hero-sponsors.
Lines 233-237 style .hero-sponsors from within the keyfeatures stylesheet, which creates order-dependent behavior and can regress sponsor layout unexpectedly.
Suggested fix
`@media` (max-width: 48rem) {
- .hero-sponsors {
- min-height: clamp(14rem, 36vh, 20rem);
- padding-top: clamp(5.5rem, 20vw, 7rem);
- padding-bottom: clamp(2rem, 4.5vh, 2.75rem);
- }
-
.keyfeatures-modern {
--kf-section-pad-block: clamp(6.5rem, 13vh, 8.5rem);
--kf-layout-gap: clamp(2.25rem, 5vh, 3rem);
padding-inline: clamp(1.25rem, 5vw, 1.85rem);
}🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@assets/css/keyfeatures-modern.css` around lines 232 - 237, The keyfeatures
stylesheet is unintentionally overriding the global .hero-sponsors rules causing
order-dependent regressions; update the selector or location so keyfeatures
styles no longer leak: either remove the .hero-sponsors block from
keyfeatures-modern.css and move those size/padding rules into the dedicated
sponsor stylesheet, or scope them to the keyfeatures component (e.g., prefix
with a keyfeatures-specific class such as .keyfeatures .hero-sponsors or use a
more specific selector) and ensure you adjust or remove the global
.hero-sponsors rules there to prevent cascading conflicts.
Comment on lines
+1371
to
+1378
| .openms-lib-list--resource-grid .openms-lib-list__row:hover, | ||
| .openms-lib-list--resource-grid .openms-lib-list__row:focus-visible, | ||
| .openms-lib-resource-card:hover, | ||
| .openms-lib-resource-card:focus-visible { | ||
| background: transparent; | ||
| transform: none; | ||
| outline: none; | ||
| } |
Contributor
There was a problem hiding this comment.
Restore a visible keyboard focus indicator on resource cards.
The :focus-visible rule removes outline and doesn’t provide a replacement, which makes keyboard focus hard to track.
Suggested fix
.openms-lib-list--resource-grid .openms-lib-list__row:hover,
-.openms-lib-list--resource-grid .openms-lib-list__row:focus-visible,
-.openms-lib-resource-card:hover,
-.openms-lib-resource-card:focus-visible {
+.openms-lib-resource-card:hover {
background: transparent;
transform: none;
- outline: none;
+}
+
+.openms-lib-list--resource-grid .openms-lib-list__row:focus-visible,
+.openms-lib-resource-card:focus-visible {
+ background: transparent;
+ transform: none;
+ outline: 2px solid var(--openms-blue);
+ outline-offset: 3px;
}🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@assets/css/openms-lib.css` around lines 1371 - 1378, The :focus-visible rules
on .openms-lib-list--resource-grid .openms-lib-list__row:focus-visible and
.openms-lib-resource-card:focus-visible remove the outline without providing a
replacement; restore a visible keyboard focus indicator by adding an accessible
visible style (e.g., outline or high-contrast box-shadow and/or border) to those
:focus-visible selectors instead of setting outline: none and transform: none,
ensure the indicator meets contrast and size guidelines and does not interfere
with hover styles so keyboard-only users can clearly see focused resource cards.
Comment on lines
642
to
+655
| .footer-socials svg.icon { | ||
| width: 1.4rem; | ||
| height: 1.4rem; | ||
| width: 1.5rem; | ||
| height: 1.5rem; | ||
| fill: currentColor; | ||
| } | ||
|
|
||
| /* ---- Copyright ---- */ | ||
| .footer-socials a svg, | ||
| .footer-socials a svg * { | ||
| fill: currentColor !important; | ||
| stroke: currentColor !important; | ||
| color: currentColor !important; | ||
| opacity: 1 !important; | ||
| transition: color 0.2s ease, fill 0.2s ease, stroke 0.2s ease; | ||
| } |
Contributor
There was a problem hiding this comment.
Fix keyword-case lint violations for currentcolor.
Line 645 and Lines 650-652 use currentColor, but the configured rule expects lowercase currentcolor, which will fail style checks.
Proposed fix
.footer-socials svg.icon {
width: 1.5rem;
height: 1.5rem;
- fill: currentColor;
+ fill: currentcolor;
}
.footer-socials a svg,
.footer-socials a svg * {
- fill: currentColor !important;
- stroke: currentColor !important;
- color: currentColor !important;
+ fill: currentcolor !important;
+ stroke: currentcolor !important;
+ color: currentcolor !important;
opacity: 1 !important;
transition: color 0.2s ease, fill 0.2s ease, stroke 0.2s ease;
}#!/bin/bash
# Expect no matches after the fix
rg -n 'currentColor' assets/css/styles_override.css🧰 Tools
🪛 Stylelint (17.12.0)
[error] 645-645: Expected "currentColor" to be "currentcolor" (value-keyword-case)
(value-keyword-case)
[error] 650-650: Expected "currentColor" to be "currentcolor" (value-keyword-case)
(value-keyword-case)
[error] 651-651: Expected "currentColor" to be "currentcolor" (value-keyword-case)
(value-keyword-case)
[error] 652-652: Expected "currentColor" to be "currentcolor" (value-keyword-case)
(value-keyword-case)
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@assets/css/styles_override.css` around lines 642 - 655, The CSS uses the
value "currentColor" in the .footer-socials rules which violates the
keyword-case lint rule; update every occurrence of "currentColor" to lowercase
"currentcolor" in the selectors .footer-socials svg.icon and the .footer-socials
a svg, .footer-socials a svg * rule block (replace fill: currentColor, color:
currentColor, and stroke: currentColor with lowercase "currentcolor") so the
keyword-case rule passes.
Comment on lines
+127
to
+146
| .uni-partners__item { | ||
| display: inline-flex; | ||
| align-items: center; | ||
| justify-content: center; | ||
| height: 5rem; | ||
| min-width: 8.5rem; | ||
| padding: 0.7rem 0.95rem; | ||
| border-radius: 0.6rem; | ||
|
|
||
|
|
||
| text-decoration: none; | ||
| transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease; | ||
| } | ||
|
|
||
| .uni-partners__item:hover, | ||
| .uni-partners__item:focus-visible { | ||
| transform: translateY(-2px); | ||
|
|
||
| outline: none; | ||
| } |
Contributor
There was a problem hiding this comment.
🧩 Analysis chain
🏁 Script executed:
#!/bin/bash
# Quick visual verification around the affected block
nl -ba assets/css/university-partners.css | sed -n '127,151p'Repository: OpenMS/OpenMS-website
Length of output: 106
🏁 Script executed:
#!/bin/bash
python3 - <<'PY'
from pathlib import Path
p = Path("assets/css/university-partners.css")
lines = p.read_text(encoding="utf-8").splitlines()
start, end = 120, 160 # inclusive (1-based line numbers)
for i in range(start, min(end, len(lines))+1):
print(f"{i:4d}: {lines[i-1]}")
PYRepository: OpenMS/OpenMS-website
Length of output: 1115
Remove blank lines before CSS declarations (declaration-empty-line-before) in .uni-partners__item.
- There are blank/whitespace-only lines before
text-decoration: none;and beforeoutline: none;in the shown block (currently lines 135–136 and 144, respectively).
Proposed fix
.uni-partners__item {
display: inline-flex;
align-items: center;
justify-content: center;
height: 5rem;
min-width: 8.5rem;
padding: 0.7rem 0.95rem;
border-radius: 0.6rem;
-
-
text-decoration: none;
transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}
.uni-partners__item:hover,
.uni-partners__item:focus-visible {
transform: translateY(-2px);
-
outline: none;
}📝 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
| .uni-partners__item { | |
| display: inline-flex; | |
| align-items: center; | |
| justify-content: center; | |
| height: 5rem; | |
| min-width: 8.5rem; | |
| padding: 0.7rem 0.95rem; | |
| border-radius: 0.6rem; | |
| text-decoration: none; | |
| transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease; | |
| } | |
| .uni-partners__item:hover, | |
| .uni-partners__item:focus-visible { | |
| transform: translateY(-2px); | |
| outline: none; | |
| } | |
| .uni-partners__item { | |
| display: inline-flex; | |
| align-items: center; | |
| justify-content: center; | |
| height: 5rem; | |
| min-width: 8.5rem; | |
| padding: 0.7rem 0.95rem; | |
| border-radius: 0.6rem; | |
| text-decoration: none; | |
| transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease; | |
| } | |
| .uni-partners__item:hover, | |
| .uni-partners__item:focus-visible { | |
| transform: translateY(-2px); | |
| outline: none; | |
| } |
🧰 Tools
🪛 Stylelint (17.12.0)
[error] 137-137: Expected no empty line before declaration (declaration-empty-line-before)
(declaration-empty-line-before)
[error] 145-145: Expected no empty line before declaration (declaration-empty-line-before)
(declaration-empty-line-before)
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@assets/css/university-partners.css` around lines 127 - 146, Remove the
blank/whitespace-only lines within the .uni-partners__item rule and its
hover/focus rule so there are no empty lines immediately before the
declarations; specifically, inside the .uni-partners__item block (referenced by
the selector .uni-partners__item) remove the blank lines preceding
text-decoration: none; and any other declarations, and inside the
.uni-partners__item:hover, .uni-partners__item:focus-visible block remove the
blank line before outline: none; to satisfy the declaration-empty-line-before
rule.
Source: Linters/SAST tools
Comment on lines
+183
to
+231
| for (var d = 1; d <= daysInMonth; d++) { | ||
| var day = new Date(year, month, d); | ||
| var key = dateKey(day); | ||
| var dayEvents = eventsForDay(day); | ||
| var btn = document.createElement("button"); | ||
| btn.type = "button"; | ||
| btn.className = "community-calendar__day"; | ||
| btn.setAttribute("role", "gridcell"); | ||
| btn.dataset.date = key; | ||
| btn.setAttribute( | ||
| "aria-label", | ||
| day.toLocaleDateString(undefined, { | ||
| weekday: "long", | ||
| month: "long", | ||
| day: "numeric", | ||
| year: "numeric", | ||
| }) + (dayEvents.length ? ", " + dayEvents.length + " event(s)" : "") | ||
| ); | ||
|
|
||
| if (key === todayKey) btn.classList.add("is-today"); | ||
| if (dayEvents.length) btn.classList.add("has-events"); | ||
| if (selected === key) btn.classList.add("is-selected"); | ||
|
|
||
| var num = document.createElement("span"); | ||
| num.className = "community-calendar__day-num"; | ||
| num.textContent = String(d); | ||
| btn.appendChild(num); | ||
|
|
||
| if (dayEvents.length) { | ||
| var dots = document.createElement("span"); | ||
| dots.className = "community-calendar__day-dots"; | ||
| dots.setAttribute("aria-hidden", "true"); | ||
| dayEvents.slice(0, 3).forEach(function () { | ||
| var dot = document.createElement("span"); | ||
| dot.className = "community-calendar__day-dot"; | ||
| dots.appendChild(dot); | ||
| }); | ||
| btn.appendChild(dots); | ||
| } | ||
|
|
||
| btn.addEventListener("click", function () { | ||
| selected = key; | ||
| if (hintEl) hintEl.hidden = true; | ||
| renderList(dayEvents, "No events on this day."); | ||
| renderMonth(); | ||
| }); | ||
|
|
||
| gridEl.appendChild(btn); | ||
| } |
Contributor
There was a problem hiding this comment.
Critical closure bug: All day buttons reference the last day's data.
The for loop uses var to declare key and dayEvents (lines 185-186). Since var is function-scoped (not block-scoped), all iterations share the same variables. When the click handler on line 223 executes later, it captures references to these shared variables, which will hold the values from the final loop iteration. This means every day button will display the same events (those of the last day) when clicked.
🐛 Fix by changing `var` to `const`
for (var d = 1; d <= daysInMonth; d++) {
- var day = new Date(year, month, d);
- var key = dateKey(day);
- var dayEvents = eventsForDay(day);
- var btn = document.createElement("button");
+ const day = new Date(year, month, d);
+ const key = dateKey(day);
+ const dayEvents = eventsForDay(day);
+ const btn = document.createElement("button");Alternatively, wrap the button creation and listener attachment in an IIFE to create a new scope per iteration.
📝 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
| for (var d = 1; d <= daysInMonth; d++) { | |
| var day = new Date(year, month, d); | |
| var key = dateKey(day); | |
| var dayEvents = eventsForDay(day); | |
| var btn = document.createElement("button"); | |
| btn.type = "button"; | |
| btn.className = "community-calendar__day"; | |
| btn.setAttribute("role", "gridcell"); | |
| btn.dataset.date = key; | |
| btn.setAttribute( | |
| "aria-label", | |
| day.toLocaleDateString(undefined, { | |
| weekday: "long", | |
| month: "long", | |
| day: "numeric", | |
| year: "numeric", | |
| }) + (dayEvents.length ? ", " + dayEvents.length + " event(s)" : "") | |
| ); | |
| if (key === todayKey) btn.classList.add("is-today"); | |
| if (dayEvents.length) btn.classList.add("has-events"); | |
| if (selected === key) btn.classList.add("is-selected"); | |
| var num = document.createElement("span"); | |
| num.className = "community-calendar__day-num"; | |
| num.textContent = String(d); | |
| btn.appendChild(num); | |
| if (dayEvents.length) { | |
| var dots = document.createElement("span"); | |
| dots.className = "community-calendar__day-dots"; | |
| dots.setAttribute("aria-hidden", "true"); | |
| dayEvents.slice(0, 3).forEach(function () { | |
| var dot = document.createElement("span"); | |
| dot.className = "community-calendar__day-dot"; | |
| dots.appendChild(dot); | |
| }); | |
| btn.appendChild(dots); | |
| } | |
| btn.addEventListener("click", function () { | |
| selected = key; | |
| if (hintEl) hintEl.hidden = true; | |
| renderList(dayEvents, "No events on this day."); | |
| renderMonth(); | |
| }); | |
| gridEl.appendChild(btn); | |
| } | |
| for (var d = 1; d <= daysInMonth; d++) { | |
| const day = new Date(year, month, d); | |
| const key = dateKey(day); | |
| const dayEvents = eventsForDay(day); | |
| const btn = document.createElement("button"); | |
| btn.type = "button"; | |
| btn.className = "community-calendar__day"; | |
| btn.setAttribute("role", "gridcell"); | |
| btn.dataset.date = key; | |
| btn.setAttribute( | |
| "aria-label", | |
| day.toLocaleDateString(undefined, { | |
| weekday: "long", | |
| month: "long", | |
| day: "numeric", | |
| year: "numeric", | |
| }) + (dayEvents.length ? ", " + dayEvents.length + " event(s)" : "") | |
| ); | |
| if (key === todayKey) btn.classList.add("is-today"); | |
| if (dayEvents.length) btn.classList.add("has-events"); | |
| if (selected === key) btn.classList.add("is-selected"); | |
| var num = document.createElement("span"); | |
| num.className = "community-calendar__day-num"; | |
| num.textContent = String(d); | |
| btn.appendChild(num); | |
| if (dayEvents.length) { | |
| var dots = document.createElement("span"); | |
| dots.className = "community-calendar__day-dots"; | |
| dots.setAttribute("aria-hidden", "true"); | |
| dayEvents.slice(0, 3).forEach(function () { | |
| var dot = document.createElement("span"); | |
| dot.className = "community-calendar__day-dot"; | |
| dots.appendChild(dot); | |
| }); | |
| btn.appendChild(dots); | |
| } | |
| btn.addEventListener("click", function () { | |
| selected = key; | |
| if (hintEl) hintEl.hidden = true; | |
| renderList(dayEvents, "No events on this day."); | |
| renderMonth(); | |
| }); | |
| gridEl.appendChild(btn); | |
| } |
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@assets/js/community-calendar.js` around lines 183 - 231, The click handler is
closing over function-scoped vars so every button ends up using the last loop
values; update the loop to use block-scoped bindings (replace var with let/const
for day, key, dayEvents, btn, num, dots, dot as needed) inside the for loop that
creates buttons (the code that calls dateKey(), eventsForDay(), creates btn and
attaches the click listener which calls renderList() and renderMonth()), or
alternatively wrap the button creation and listener attachment in an IIFE to
capture per-iteration values so each button’s click uses its own key and
dayEvents.
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.
Summary by CodeRabbit
New Features
Documentation
Content Updates
Accessibility & Performance