Frame Checkout Fields in Phoca Cart (Cassiopeia)
Posted: 13 Mar 2026, 00:53
Frame Checkout Fields in Phoca Cart (Cassiopeia)
In the checkout of my Phoca Cart, the color difference between the background and the input fields is very small. Users sometimes couldn't see that there was an input field. By placing a frame around the fields, it is more clear.
If you want to provide the checkout input fields with a clear framework in Cassiopeia, you can easily do this via the user.css file.
Goto:
/media/templates/site/cassiopeia/css/user.css
Add this line:
input.form-control,
textarea.form-control {
border: 2px solid #d8dee9 !important;
border-radius: 8px;
}
That's all it takes. The change is immediately visible in the checkout.
Solution found by Copilot after many hours of searching, for which thanks.
In the checkout of my Phoca Cart, the color difference between the background and the input fields is very small. Users sometimes couldn't see that there was an input field. By placing a frame around the fields, it is more clear.
If you want to provide the checkout input fields with a clear framework in Cassiopeia, you can easily do this via the user.css file.
Goto:
/media/templates/site/cassiopeia/css/user.css
Add this line:
input.form-control,
textarea.form-control {
border: 2px solid #d8dee9 !important;
border-radius: 8px;
}
That's all it takes. The change is immediately visible in the checkout.
Solution found by Copilot after many hours of searching, for which thanks.