diff --git a/src/pages/package/PackageConfigList.vue b/src/pages/package/PackageConfigList.vue
index ef0f8dd..0a11b7a 100644
--- a/src/pages/package/PackageConfigList.vue
+++ b/src/pages/package/PackageConfigList.vue
@@ -28,50 +28,48 @@
class="list fix-last-cell-line empty-cell-title-margin"
theme="card"
>
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
@@ -256,60 +254,66 @@ onUnmounted(() => {
}
.list {
+ gap: 1rem;
+ display: flex;
padding-top: 1rem;
+ flex-direction: column;
.item {
- background: var(--td-bg-color-container);
- border-radius: 1rem;
- overflow: hidden;
+ padding: 10px;
+ min-width: 0;
- .cell {
- padding: 10px;
+ :deep(.t-cell__title) {
+ min-width: 0;
+ }
- .title {
- gap: .5rem;
- flex: 1;
+ .title {
+ gap: .5rem;
+ flex: 1;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ }
+
+ .description {
+ display: flex;
+ flex-direction: column;
+ min-width: 0;
+
+ .products {
+ gap: .35rem;
+ width: 100%;
display: flex;
- align-items: center;
- justify-content: space-between;
- }
+ min-width: 0;
+ max-width: 100%;
+ flex-wrap: nowrap;
+ margin-top: .5rem;
+ overflow-x: auto;
+ overflow-y: hidden;
+ white-space: nowrap;
+ scrollbar-width: none;
+ -webkit-overflow-scrolling: touch;
- .description {
- display: flex;
- flex-direction: column;
-
- .products {
- gap: .35rem;
- display: flex;
- max-width: 100%;
- flex-wrap: nowrap;
- overflow-x: auto;
- overflow-y: hidden;
- white-space: nowrap;
- scrollbar-width: none;
- -webkit-overflow-scrolling: touch;
-
- :deep(.t-tag) {
- flex: 0 0 auto;
- }
-
- &::-webkit-scrollbar {
- display: none;
- }
+ :deep(.t-tag) {
+ flex: 0 0 auto;
}
- .price-actions {
- gap: .5rem;
- display: flex;
- margin-top: .5rem;
- align-items: center;
- justify-content: end;
+ &::-webkit-scrollbar {
+ display: none;
+ }
+ }
- .price {
+ .price-actions {
+ gap: .5rem;
+ display: flex;
+ margin-top: .5rem;
+ align-items: center;
+ justify-content: end;
- .value {
- font-size: 1.25rem;
- }
+ .price {
+
+ .value {
+ font-size: 1.25rem;
}
}
}