Solved

When the Collapsible content is active need to show "+" and "-" icon in dawn theme

Uma489
Shopify Partner
14 0 1

Hi ,I want change my collapsible content icons when it is Active it show an icon in the left side is "-

". And if it is not active show "+" icon. I working in dawn theme. Here I'm attaching the image also please check it once. Can Any one help me this. 

 

Thank YouCapture1.JPG

Accepted Solution (1)

iffikhan30
Shopify Partner
246 35 44

This is an accepted solution.

Hello @Uma489 ,

 

1) Go to theme edit.

2) search collapsible-content open this file

3) search in file icon-caret change to icon-plus

 

then add this css 

 

summary .icon-plus {
      position: absolute;
      height: 0.6rem;
      right: 1.5rem;
      top: calc(50% - 0.2rem);
  }
  .accordion details[open]>summary .icon-plus {
      transform: rotate(45deg);
  }

 

Look 

 

iffikhan30_0-1705916720086.png

 

Custom theme and app [remix] expert.
Buy me a Coffee
Email: irfan.sarwar.khan30@gmail.com
Chat on WhatsApp

View solution in original post

Replies 2 (2)

iffikhan30
Shopify Partner
246 35 44

This is an accepted solution.

Hello @Uma489 ,

 

1) Go to theme edit.

2) search collapsible-content open this file

3) search in file icon-caret change to icon-plus

 

then add this css 

 

summary .icon-plus {
      position: absolute;
      height: 0.6rem;
      right: 1.5rem;
      top: calc(50% - 0.2rem);
  }
  .accordion details[open]>summary .icon-plus {
      transform: rotate(45deg);
  }

 

Look 

 

iffikhan30_0-1705916720086.png

 

Custom theme and app [remix] expert.
Buy me a Coffee
Email: irfan.sarwar.khan30@gmail.com
Chat on WhatsApp
Uma489
Shopify Partner
14 0 1

Thank you so much @iffikhan30