WXSS
Make the booking button more noticeable and give it some space around it.
Make the booking button more noticeable and give it some space around it.
.reserve {
padding: 24rpx;
}<button class="reserve">Saturday 14:00 · Pottery workshop
The button already has content and a click handler. This comparison changes its appearance, keeping the booking flow.
A class connects component and style: class="reserve" connects the WXML button to .reserve in WXSS. The same class can style several matching objects.
Styles have a scope: app.wxss provides app-wide page styles; the page’s WXSS styles that page. Custom components may isolate their styles.
Style the booking button in this WeChat page’s WXSS using the project theme color and existing corner and spacing rules. Keep its label, placement, and click handler. Check narrow and wide screens and complete a booking to verify the behavior.