From 391cfb24a6fb927a03228a9c18d7bdcf6b98bfcc Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=A5=81=E7=9B=8A=E9=9F=9C?= Date: Fri, 10 Dec 2021 09:36:50 +0800 Subject: [PATCH 1/2] fix(fix the offset problem when the divider is vertical): remove transformY,use align-items: center affects: @varlet/ui --- packages/varlet-ui/src/divider/divider.less | 1 - packages/varlet-ui/src/divider/example/index.vue | 4 +--- 2 files changed, 1 insertion(+), 4 deletions(-) diff --git a/packages/varlet-ui/src/divider/divider.less b/packages/varlet-ui/src/divider/divider.less index 488973a4109..38c0e696c20 100644 --- a/packages/varlet-ui/src/divider/divider.less +++ b/packages/varlet-ui/src/divider/divider.less @@ -31,7 +31,6 @@ padding: var(--divider-text-margin); border-top: none; border-left: 1px solid var(--divider-color); - transform: translateY(-10%); } &--inset { diff --git a/packages/varlet-ui/src/divider/example/index.vue b/packages/varlet-ui/src/divider/example/index.vue index 594a43f66f2..70ed0ffba28 100644 --- a/packages/varlet-ui/src/divider/example/index.vue +++ b/packages/varlet-ui/src/divider/example/index.vue @@ -53,7 +53,6 @@ export default { setup() { watchLang(use) watchDarkMode(dark) - return { pack, } @@ -65,9 +64,8 @@ export default { .vertical-divider-wrapper { display: flex; justify-content: center; + align-items: center; color: #333; - height: 36px; - line-height: 36px; span { font-size: 14px; From d69045ef4fd2b645b401f8867f5c7a8fb34a9382 Mon Sep 17 00:00:00 2001 From: qytayh <13255238145@163.com> Date: Fri, 10 Dec 2021 16:14:19 +0800 Subject: [PATCH 2/2] fix(card): fix image css problem in card affects: @varlet/ui --- packages/varlet-ui/src/card/card.less | 4 ++-- packages/varlet-ui/src/card/docs/en-US.md | 4 ++-- packages/varlet-ui/src/card/docs/zh-CN.md | 4 ++-- 3 files changed, 6 insertions(+), 6 deletions(-) diff --git a/packages/varlet-ui/src/card/card.less b/packages/varlet-ui/src/card/card.less index ac34a6f7142..2697eb1289b 100644 --- a/packages/varlet-ui/src/card/card.less +++ b/packages/varlet-ui/src/card/card.less @@ -1,4 +1,4 @@ -@card-padding: 5px 0 15px 0; +@card-padding: 0 0 15px 0; @card-background: #fff; @card-border-radius: 4px; @card-image-width: 100%; @@ -6,7 +6,7 @@ @card-title-color: #333; @card-title-font-size: 20px; @card-title-padding: 0 12px; -@card-title-margin: 10px 0 0 0; +@card-title-margin: 15px 0 0 0; @card-subtitle-color: rgba(0, 0, 0, 0.6); @card-subtitle-font-size: 14px; @card-subtitle-padding: 0 13px; diff --git a/packages/varlet-ui/src/card/docs/en-US.md b/packages/varlet-ui/src/card/docs/en-US.md index e4923aab0bb..bdd23fc39d1 100644 --- a/packages/varlet-ui/src/card/docs/en-US.md +++ b/packages/varlet-ui/src/card/docs/en-US.md @@ -100,14 +100,14 @@ Here are the CSS variables used by the component, Styles can be customized using | Variable | Default | | ------------------------------ | -------------------- | | `--card-background` | `#fff` | -| `--card-padding` | `5px 0 15px 0` | +| `--card-padding` | `0px 0 15px 0` | | `--card-border-radius` | `4px` | | `--card-image-width` | `100%` | | `--card-image-height` | `200px` | | `--card-title-color` | `#333` | | `--card-title-font-size` | `20px` | | `--card-title-padding` | `0 12px` | -| `--card-title-margin` | `10px 0 0 0` | +| `--card-title-margin` | `15px 0 0 0` | | `--card-subtitle-color` | `rgba(0, 0, 0, 0.6)` | | `--card-subtitle-font-size` | `14px` | | `--card-subtitle-padding` | `0 13px` | diff --git a/packages/varlet-ui/src/card/docs/zh-CN.md b/packages/varlet-ui/src/card/docs/zh-CN.md index 09c5515ecc4..41e49770b02 100644 --- a/packages/varlet-ui/src/card/docs/zh-CN.md +++ b/packages/varlet-ui/src/card/docs/zh-CN.md @@ -105,14 +105,14 @@ createApp().use(Card) | 变量名 | 默认值 | | ------------------------------ | -------------------- | | `--card-background` | `#fff` | -| `--card-padding` | `5px 0 15px 0` | +| `--card-padding` | `0px 0 15px 0` | | `--card-border-radius` | `4px` | | `--card-image-width` | `100%` | | `--card-image-height` | `200px` | | `--card-title-color` | `#333` | | `--card-title-font-size` | `20px` | | `--card-title-padding` | `0 12px` | -| `--card-title-margin` | `10px 0 0 0` | +| `--card-title-margin` | `15px 0 0 0` | | `--card-subtitle-color` | `rgba(0, 0, 0, 0.6)` | | `--card-subtitle-font-size` | `14px` | | `--card-subtitle-padding` | `0 13px` |