"Add to Cart"-Button protrudes over the edge of the screen

cadtec_2

Hello together,

Where can I adjust the yellow highlighted frames so that the button does not protrude to the right beyond the visible area (red arrow)?
[img]https://i.imgur.com/1PH7EgY.jpeg[/img]

tim

@vilaiporn This is not the checkout, but the product page.

You have three options.
A) Edit the translation "In den Warenkorb" to something shorter.
B) Remix it with some styling in less/app/product.less or css/app.css.
C) Modify the html and place the button somewhere else:
https://github.com/litecart/litecart/blob/2.5.1/public_html/includes/templates/default.catalog/views/box_product.inc.php#L164

cadtec_2

Hello everyone, 

thank you for your help.

The term "In den Warenkorb" has become established in the German-speaking world and should not be called anything else.
I did it as follows: -> Slim "In den Warenkorb" button so that it is not cut off on an iPhone display <-

1.) In file: /includes/templates/default.catalog/css/[b]framework.css[/b]

Adjust this value as follows:

  --input-padding-x: [b]1[/b]em;   (or 0.5em)

2.) In file: /includes/templates/default.catalog/views/[b]box_product.inc.php[/b]

Adjust the distance between the pcs.-text and the green button as follows:

padding-inline-start: [b]0.5[/b]em

(Maybee, it would probably be good if Tim could adjust this in the sources?)

Best regards,
André

This thread has been closed due to long inactivity. Posting to it is not possible.
View code on GitHub