小程序商品列表页优化；添加我的订单页面

weixin-miniprogram/pages/shop/orderDetail.wxss

@@ -0,0 +1,144 @@
+/* pages/shop/orderDetail.wxss */
+.page-title-container {
+  margin-top: 16px;
+  text-align: center;
+}
+
+.page-title-emoji {
+  font-size: 72px;
+}
+
+.page-title {
+  /* border: 2px dashed black; */
+  display: inline-block;
+  padding: 15px 20px;
+  font-size: 20px;
+}
+
+.order-info {
+  background-color: tomato;
+  padding: 10px 18px;
+  margin: 10px;
+  border-radius: 10px;
+  color: #fff3f1;
+  font-weight: 500;
+  line-height: 1.8em;
+}
+
+.good-list-title {
+  text-align: center;
+  margin-top: 20px;
+  margin-bottom: 20px;
+  font-weight: 500;
+  font-size: 18px;
+}
+
+/* 商品列表样式 */
+.good-card-container {
+  /* border: 1px solid grey; */
+  border-radius: 12px;
+  box-shadow: 0 2px 10px 0 rgba(0, 0, 0, .2);
+  margin: 0 14px;
+  padding: 15px 20px;
+  display: grid;
+  grid-template-columns: 120px 1fr 50px;
+  grid-template-rows: 4fr 3fr;
+  place-items: center;
+  gap: 0 8px;
+  margin-bottom: 10px;
+}
+
+.good-card-image {
+  width: 88px;
+  height: 88px;
+  background-color: teal;
+  background-position: center;
+  background-repeat: no-repeat;
+  background-size: cover;
+  border: 1px solid grey;
+  border-radius: 5px;
+  grid-row-start: 1;
+  grid-row-end: 3;
+}
+
+.good-card-info {
+  width: 100%;
+}
+
+/* 商品标题 */
+.good-title-container {
+  grid-column-start: 2;
+  grid-column-end: 4;
+}
+
+.good-title {
+  font-size: 30rpx;
+  color: #333;
+  font-weight: 400;
+  display: -webkit-box;
+  height: 72rpx;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 2;
+  overflow: hidden;
+  word-break: break-word;
+  line-height: 36rpx;
+  margin: 4rpx 0;
+}
+
+/* 商品价格 */
+.good-price {
+  white-space: nowrap;
+  font-weight: 700;
+  margin: 0;
+  display: inline;
+  position: relative;
+}
+
+.good-price-counter {
+  color: #fa4126;
+  font-size: 36rpx;
+}
+
+.good-price .good-price-symbol {
+  font-size: 24rpx;
+  display: inline;
+}
+
+.good-price .good-price-number {
+  display: inline;
+}
+
+/* 屏幕底部 确认支付按钮 */
+.bottom-controlbox {
+  background-color: white;
+  position: fixed;
+  z-index: 999;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  width: 100%;
+  padding-top: 6px;
+  padding-bottom: 12px;
+  border-top: 1px solid grey;
+  text-align: center;
+}
+
+.bottom-buttons {
+  height: 100%;
+  display: inline-block;
+}
+
+.btn {
+  width: 254rpx;
+  height: 80rpx;
+  display: inline-grid;
+  align-items: center;
+  justify-content: center;
+  color: white;
+}
+
+#btn-confirm-payment {
+  background-color: #fa4126;
+  color: #fff;
+  border-radius: 40rpx;
+}