zoujing/YGChatCS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 替换sass版本，定义全局样式，实现简单的页面布局操作，比如颜色、边距、圆角等

Browse Source
This commit is contained in:
duanshuwen
2025-10-06 13:13:16 +08:00
parent e0f0e90635
commit c8e51e4975
108 changed files with 366 additions and 517 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/pages-order/order/components/CustomEmpty/index.vue
View File

@@ -22,5 +22,5 @@ const props = defineProps({
</script>
<style scoped lang="scss">
@use "./styles/index.scss";
@import "./styles/index.scss";
</style>

4
src/pages-order/order/components/CustomEmpty/styles/index.scss
View File

@@ -14,6 +14,6 @@
.empty-text {
margin-top: 10px;
font-size: 14px;
font-size: $uni-font-size-base;
color: #666666;
}
}

2
src/pages-order/order/components/GoodsInfo/index.vue
View File

@@ -123,5 +123,5 @@ const formatServiceAmount = (amount) => {
</script>
<style scoped lang="scss">
@use "./styles/index.scss";
@import "./styles/index.scss";
</style>

2
src/pages-order/order/components/NoticeInfo/index.vue
View File

@@ -26,5 +26,5 @@ const props = defineProps({
</script>
<style scoped lang="scss">
@use "./styles/index.scss";
@import "./styles/index.scss";
</style>

2
src/pages-order/order/components/NoticeInfo/styles/index.scss
View File

@@ -9,5 +9,5 @@
align-items: center;
font-size: 16px;
font-weight: 500;
color: #333;
color: $uni-text-color;
}

6
src/pages-order/order/components/OrderCard/InfoRow.vue
View File

@@ -31,15 +31,15 @@ const props = defineProps({
}
.label {
font-size: 12px;
font-size: $uni-font-size-sm;
color: #666666;
flex-shrink: 0;
margin-right: 8px;
}
.value {
font-size: 14px;
color: #333333;
font-size: $uni-font-size-base;
color: $uni-text-color;
flex: 1;
}
</style>

2
src/pages-order/order/components/OrderCard/index.vue
View File

@@ -117,5 +117,5 @@ const handleCardClick = () => {
</script>
<style scoped lang="scss">
@use "./styles/index.scss";
@import "./styles/index.scss";
</style>

6
src/pages-order/order/components/OrderCard/styles/index.scss
View File

@@ -41,9 +41,9 @@
}
.order-title {
font-size: 14px;
font-size: $uni-font-size-base;
font-weight: 500;
color: #333333;
color: $uni-text-color;
line-height: 1.4;
}
@@ -56,7 +56,7 @@
box-sizing: border-box;
padding: 6px 16px;
border-radius: 20px;
font-size: 12px;
font-size: $uni-font-size-sm;
font-weight: 500;
&.tag-0 {

2
src/pages-order/order/components/OrderInfo/index.vue
View File

@@ -160,5 +160,5 @@ const openFeedback = () => {
</script>
<style scoped lang="scss">
@use "./styles/index.scss";
@import "./styles/index.scss";
</style>

5
src/pages-order/order/components/OrderInfo/styles/index.scss
View File

@@ -1,14 +1,9 @@
@use "sass:color";
// SASS变量定义，提高可维护性和编译性能
// 颜色系统
$order-bg-color: #fff;
$text-color-primary: #333;
$text-color-secondary: #666;
$text-color-accent: #ff5722;
$button-color: #00a6ff;
$button-hover-color: color.scale($button-color, $lightness: -16%);
$button-disabled-color: #ccc;
$border-color: #ececec;
$shadow-color: rgba(0, 0, 0, 0.08);

2
src/pages-order/order/components/OrderQrcode/index.vue
View File

@@ -31,5 +31,5 @@ const props = defineProps({
</script>
<style scoped lang="scss">
@use "./styles/index.scss";
@import "./styles/index.scss";
</style>

4
src/pages-order/order/components/OrderQrcode/styles/index.scss
View File

@@ -1,5 +1,5 @@
.order-qrcode {
background: #ffffff;
background-color: $uni-bg-color;
border-radius: 10px;
box-sizing: border-box;
display: flex;
@@ -10,7 +10,7 @@
margin-bottom: 12px;
text {
font-size: 12px;
font-size: $uni-font-size-sm;
color: #666666;
line-height: 17px;
margin-top: 4px;

2
src/pages-order/order/components/OrderStatusInfo/index.vue
View File

@@ -85,5 +85,5 @@ const statusDescription = computed(() => {
</script>
<style scoped lang="scss">
@use "./styles/index.scss";
@import "./styles/index.scss";
</style>

4
src/pages-order/order/components/OrderStatusInfo/styles/index.scss
View File

@@ -24,5 +24,5 @@
}
.status-description {
font-size: 12px;
}
font-size: $uni-font-size-sm;
}

2
src/pages-order/order/components/RefundPopup/index.vue
View File

@@ -150,5 +150,5 @@ const handleConfirmClick = (text) => {
</script>
<style lang="scss" scoped>
@use "./styles/index.scss";
@import "./styles/index.scss";
</style>

16
src/pages-order/order/components/RefundPopup/styles/index.scss
View File

@@ -27,7 +27,7 @@
&__title {
font-size: 16px;
font-weight: 500;
color: #333;
color: $uni-text-color;
line-height: 22px;
margin-bottom: 12px;
text-align: center;
@@ -40,7 +40,7 @@
margin-bottom: 4px;
.amount-symbol {
font-size: 12px;
font-size: $uni-font-size-sm;
color: #ff6a00;
}
@@ -51,14 +51,14 @@
}
.amount-unit {
font-size: 12px;
font-size: $uni-font-size-sm;
color: #ff6a00;
}
}
&__amount-label {
font-size: 12px;
color: #333;
font-size: $uni-font-size-sm;
color: $uni-text-color;
margin-bottom: 16px;
}
@@ -67,15 +67,15 @@
margin-bottom: 16px;
.policy-title {
font-size: 14px;
font-size: $uni-font-size-base;
color: #007aff;
font-weight: 600;
margin-bottom: 8px;
}
.policy-content {
font-size: 12px;
color: #333333;
font-size: $uni-font-size-sm;
color: $uni-text-color;
line-height: 22px;
text-align: justify;
}

2
src/pages-order/order/components/Tabs/index.vue
View File

@@ -271,5 +271,5 @@ defineExpose({
</script>
<style scoped lang="scss">
@use "./styles/index.scss";
@import "./styles/index.scss";
</style>

16
src/pages-order/order/components/Tabs/styles/index.scss
View File

@@ -21,7 +21,7 @@
}
.tab-text {
font-size: 14px;
font-size: $uni-font-size-base;
color: #666;
font-weight: 400;
transition: all 0.3s ease;
@@ -29,14 +29,14 @@
}
.tab-text-active {
color: #333;
color: $uni-text-color;
font-size: 16px;
font-weight: 600;
}
.tab-item-active {
.tab-text {
color: #333;
color: $uni-text-color;
font-weight: 600;
}
}
@@ -46,13 +46,14 @@
bottom: 0;
height: 3px;
min-height: 3px; /* 确保最小高度 */
background-color: #007AFF;
background-color: #007aff;
border-radius: 10px;
transition: left 0.3s cubic-bezier(0.4, 0, 0.2, 1), width 0.3s cubic-bezier(0.4, 0, 0.2, 1);
transition: left 0.3s cubic-bezier(0.4, 0, 0.2, 1),
width 0.3s cubic-bezier(0.4, 0, 0.2, 1);
z-index: 1;
transform: translateZ(0); /* 启用硬件加速 */
will-change: left, width; /* 优化动画性能 */
/* 初始状态：未初始化时隐藏 */
opacity: 0;
width: 15px; /* 默认宽度15px */
@@ -64,7 +65,6 @@
opacity: 1;
}
/* 点击效果 */
.tab-item:active {
opacity: 0.7;
@@ -97,4 +97,4 @@
.tab-indicator.animating {
animation: tabSwitch 0.3s ease-out;
}
}

2
src/pages-order/order/components/UserInfo/index.vue
View File

@@ -92,5 +92,5 @@ const formatPhone = (phone) => {
</script>
<style scoped lang="scss">
@use "./styles/index.scss";
@import "./styles/index.scss";
</style>

8
src/pages-order/order/components/UserInfo/styles/index.scss
View File

@@ -17,12 +17,12 @@
}
.label {
font-size: 14px;
font-size: $uni-font-size-base;
color: #666;
margin-right: 8px;
}
.value {
font-size: 14px;
color: #333;
}
font-size: $uni-font-size-base;
color: $uni-text-color;
}

2
src/pages-order/order/detail.vue
View File

@@ -108,5 +108,5 @@ const handleRefundConfirm = async ({ orderId }) => {
</script>
<style lang="scss" scoped>
@use "./styles/detail.scss";
@import "./styles/detail.scss";
</style>