duanshuwen/nianxx-h5
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(SumCard): replace SCSS with Tailwind, clean up files

Browse Source 
remove unused SCSS stylesheet and associated image asset, convert component styles to Tailwind utilities, fix invalid #333-grey color value, and remove the deprecated style import from the vue SFC
This commit is contained in:
DEV_DSW
2026-05-29 11:29:12 +08:00
parent 8468301806
commit 64c378c5fd
3 changed files with 7 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
src/components/SumCard/images/2025-07-15_154422.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 15 KiB

18
src/components/SumCard/index.vue
View File

@@ -1,12 +1,12 @@
<template> <template>
<div class="sum-wrapper"> <div class="rounded-lg bg-[#f5f5f5] px-3">
<div class="sum-item"> <div class="flex justify-between items-center py-3 border-b border-[#ddd]">
<span class="sum-label">价格</span> <span class="text-[15px] text-[#333]">价格</span>
<span class="sum-value">¥{{ referencePrice }}</span> <span class="text-[14px] text-[#333]">¥{{ referencePrice }}</span>
</div> </div>
<div class="sum-item"> <div class="flex justify-between items-center py-3">
<span class="sum-label">折扣优惠</span> <span class="text-[15px] text-[#333]">折扣优惠</span>
<span class="sum-discount">-¥{{ discount }}</span> <span class="text-[14px] text-[#ff5722]">-¥{{ discount }}</span>
</div> </div>
</div> </div>
</template> </template>
@@ -23,7 +23,3 @@ defineProps({
}, },
}); });
</script> </script>
<style scoped lang="scss">
@import "./styles/index.scss";
</style>

33
src/components/SumCard/styles/index.scss
View File

@@ -1,33 +0,0 @@
.sum-wrapper {
border-radius: 8px;
background-color: #f5f5f5;
padding: 0 12px;
box-sizing: border-box;
}
.sum-item {
display: flex;
justify-content: space-between;
align-items: center;
padding: 12px 0;
border-bottom: 1px solid #ddd;
&:last-child {
border-bottom: none;
}
}
.sum-label {
font-size: 15px;
color: #333;
}
.sum-value {
font-size: 14px;
color: #333-grey;
}
.sum-discount {
font-size: 14px;
color: #ff5722;
}