remove the underline collapsible heading (sense theme)

Topic summary

A user seeks to remove the underline effect that appears when hovering over collapsible headings in their Shopify store using the Sense theme.

Solution Provided:

  • Navigate to Online Store → Theme → Edit Code
  • Open the component-accordion.css file in the Assets folder
  • Add the following CSS at the bottom of the file:
.collapsible-content summary:hover > h3 {
  text-decoration: unset !important;
}

This CSS rule removes the text decoration (underline) from the heading element when users hover over collapsible sections. The solution comes from a PageFly representative and targets the specific component styling in the theme.

Summarized with AI on November 22. AI used: claude-sonnet-4-5-20250929.

How do I remove the underline when hovering over of my collapsible heading

Hi @brianel ,

This is Victor from PageFly - Landing page builder, I’d like to suggest this idea:
Step 1: Go to Online Store->Theme->Edit code
Step 2: Asset->/component-accordion.css->paste below code at the bottom of the file:

.collapsible-content summary:hover >h3 {
  text-decoration: unset !important;
}

Hope my answer will help you.

Best regards,

Victor | PageFly

2 Likes