This made both of the text links green ![]()
Topic summary
Goal: Change a specific rich-text link from a faded green to a solid brown (#593D08) on a Shopify page without affecting footer link colors.
Attempts and results:
- Global rule in component-rte.css using the .rte a selector successfully changed the target link, but also altered footer links (undesired).
- A narrower selector intended for the rich-text block (.isolate .rich-text__text rte a) did not work as intended and resulted in both links appearing green.
- Placement confirmed in component-rte.css; issue persisted due to selector scope/specificity.
Final solution:
- Added a highly specific selector targeting the exact section ID in base.css for the anchor element, forcing color: #593D08 with !important. This scoped the change to the intended section only and preserved footer link styling.
Outcome: Desired link now displays solid brown; footer links remain green. Resolved.
Notes: The key was CSS specificity and scoping by section ID within the Shopify theme structure. Screenshots were provided but not essential to the fix.