diff --git a/src/pages/product/select.vue b/src/pages/product/select.vue
index ed84290..0da2256 100644
--- a/src/pages/product/select.vue
+++ b/src/pages/product/select.vue
@@ -14,20 +14,22 @@
-
-
-
- 全部
-
-
- {{ cat.name }}
-
-
+
+
+
+
-
-
-
-
+
+
+
+
{{ item.name }}
@@ -47,6 +49,7 @@
+
@@ -226,32 +229,37 @@ export default {
color: #999;
}
-/* 分类行 */
-.category-row {
+/* 内容区域:侧栏+列表 */
+.content-wrapper {
display: flex;
- background: #fff;
- padding: 20rpx;
- overflow-x: auto;
- white-space: nowrap;
+ height: calc(100vh - 130rpx);
}
-.category-row .category-item {
- display: inline-block;
- padding: 16rpx 32rpx;
+/* 分类侧栏 */
+.category-sidebar {
+ width: 160rpx;
+ background: #fff;
+ flex-shrink: 0;
+ border-right: 1rpx solid #eee;
+}
+
+.category-sidebar .category-item {
+ padding: 28rpx 16rpx;
font-size: 26rpx;
color: #666;
- border-radius: 30rpx;
- margin-right: 16rpx;
- background: #f5f5f5;
+ text-align: center;
+ border-left: 6rpx solid transparent;
}
-.category-row .category-item.active {
- background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
- color: #fff;
+.category-sidebar .category-item.active {
+ background: #f8f9fa;
+ color: #667eea;
+ font-weight: bold;
+ border-left-color: #667eea;
}
.product-scroll {
- height: calc(100vh - 260rpx);
+ flex: 1;
background: #f8f9fa;
}