Make font bigger add to cart button turbo portland theme

Solved
dyarovink
New Member
6 0 0

Hi there.

 

I like to make my font bigger on the add to cart button. On desktop I manage to do it by editing the theme, but on mobile it won't get bigger, so I assume I need to change something in the code.

 

Also I like to make my quantity box as width as my add to cart button, but I have no idea where to find in in the css code.

 

 

I am using Turbo Portland theme.

 

Could someone help me?

Thanks in advance.

CC546486-84DC-47D1-AF78-6BC4A6EE0C61.jpeg

Accepted Solutions (2)

Accepted Solutions
AvadaCommerce
Shopify Partner
3033 696 566

This is an accepted solution.

Hi @dyarovink ,

 

You can follow the instruction below:

1. Go to Online Store->Theme->Edit code
2. Asset->/styles.scss->paste below code at the bottom of the file:

@media (max-width: 749px) {
.purchase-details__buttons span.text {
    font-size: 20px !important;
}

.product-quantity-box {
    width: 100% !important;
}

.purchase-details__quantity input.quantity {
    width: 50% !important;
}
}

If you feel like my answer is helpful, please mark it as a SOLUTION. Let me know if you have any further questions.

AVADA - Top Rated App for Email, SMS, Popups


Check our website for full features and start a FREE TRIAL.
Install another app to boost sales, 100% FREE

View solution in original post

Halothemes
Trailblazer
127 25 20

This is an accepted solution.

Hi @dyarovink , 

You can try follow the instruction below:
1. Go to Online Store -> Theme -> Edit code.
2. Asset -> /styles.css paste code below into end of the file.

 

@media screen and (max-width:767px){
button.add_to_cart .text {
    font-size: 16px !important;
}
.product-quantity-box {
    width: 100% !important;
}
.product-quantity-box .quantity {
    width: 50% !important;
}
}

 

 

If you feel like my answer is helpful, please mark it as a SOLUTION. Let me know if you have any further questions.

Best regards.

HaloThemes - Top Premium Shopify Theme Provider

Ella Shopify Theme OS 2.0 - #1 Best Selling Shopify Theme of All Time
Check Our Portfolio for The Best Premium Shopify themes

View solution in original post

Replies 6 (6)
Halothemes
Trailblazer
127 25 20

Hi @dyarovink , 

 

Please share your store URL and password of front view.

So that I will check and let you know the exact solution here.

 

Best regards.

HaloThemes - Top Premium Shopify Theme Provider

Ella Shopify Theme OS 2.0 - #1 Best Selling Shopify Theme of All Time
Check Our Portfolio for The Best Premium Shopify themes

dyarovink
New Member
6 0 0

Hi thanks for your reply.


Password: kaasje123

 

link: https://mugzapper.myshopify.com/products/mugzapper

AvadaCommerce
Shopify Partner
3033 696 566

This is an accepted solution.

Hi @dyarovink ,

 

You can follow the instruction below:

1. Go to Online Store->Theme->Edit code
2. Asset->/styles.scss->paste below code at the bottom of the file:

@media (max-width: 749px) {
.purchase-details__buttons span.text {
    font-size: 20px !important;
}

.product-quantity-box {
    width: 100% !important;
}

.purchase-details__quantity input.quantity {
    width: 50% !important;
}
}

If you feel like my answer is helpful, please mark it as a SOLUTION. Let me know if you have any further questions.

AVADA - Top Rated App for Email, SMS, Popups


Check our website for full features and start a FREE TRIAL.
Install another app to boost sales, 100% FREE

Halothemes
Trailblazer
127 25 20

This is an accepted solution.

Hi @dyarovink , 

You can try follow the instruction below:
1. Go to Online Store -> Theme -> Edit code.
2. Asset -> /styles.css paste code below into end of the file.

 

@media screen and (max-width:767px){
button.add_to_cart .text {
    font-size: 16px !important;
}
.product-quantity-box {
    width: 100% !important;
}
.product-quantity-box .quantity {
    width: 50% !important;
}
}

 

 

If you feel like my answer is helpful, please mark it as a SOLUTION. Let me know if you have any further questions.

Best regards.

HaloThemes - Top Premium Shopify Theme Provider

Ella Shopify Theme OS 2.0 - #1 Best Selling Shopify Theme of All Time
Check Our Portfolio for The Best Premium Shopify themes

dyarovink
New Member
6 0 0

Thanks a lot! It worked 🙂

dyarovink
New Member
6 0 0

Thanks a lot! It worked 🙂