Have your say in Community Polls: What was/is your greatest motivation to start your own business?

Dawn Theme: Icon Required Only for First Popup, but It Appears on All Popups

Dawn Theme: Icon Required Only for First Popup, but It Appears on All Popups

Sivadarshan
Shopify Partner
171 1 28

I am using the latest version of the Dawn theme. On the product page, I need to add a popup with an icon before the text. I successfully added the first popup with the required icon, but when I added three more popups, the same icon is appearing for all of them.

I want:

  1. The first box to have a ruler icon.
  2. The second big box to have a different icon and a different font size.

Please help me resolve this issue. I'll attach the code below, but I cannot provide the website link because another website is already live.

 

Screenshot 2024-11-27 160017.png

 

Website: https://mannavan.myshopify.com/

Password: offnorth

 

 

Thanks in advance

Replies 2 (2)
Sivadarshan
Shopify Partner
171 1 28

Can u please help how to acheive that, I'm newbie for shopify

 

Sivadarshan
Shopify Partner
171 1 28
.product-popup-modal__button::before{

    content: "";

    display: inline-block;

    width: 22px;

    height: 22px;

    background-image: url("https://cdn.shopify.com/s/files/1/0250/8849/1610/files/ruler.gif?v=1732692045");

    background-size: cover;

    margin-right: 5px;

    position: relative;

    top: 5px;

}

</style>

This is the code I've used to apply icon before the popup, where to do the changes, If possible different icon is can be done or else for 1st one alone icon and for others no icon simple text is ok.