From 785a60c93a11abc952333424b8b5c5070960d324 Mon Sep 17 00:00:00 2001 From: Andrey Medvedev Date: Tue, 24 Sep 2024 18:55:59 +0300 Subject: [PATCH 1/3] Fix CellButton icon padding inside before We compensate it with negative margin to keep right distance --- .../src/components/CellButton/CellButton.e2e-playground.tsx | 1 + packages/vkui/src/components/CellButton/CellButton.module.css | 4 ++++ packages/vkui/src/components/SimpleCell/SimpleCell.module.css | 4 +++- 3 files changed, 8 insertions(+), 1 deletion(-) diff --git a/packages/vkui/src/components/CellButton/CellButton.e2e-playground.tsx b/packages/vkui/src/components/CellButton/CellButton.e2e-playground.tsx index d361035e40..a51d39be1e 100644 --- a/packages/vkui/src/components/CellButton/CellButton.e2e-playground.tsx +++ b/packages/vkui/src/components/CellButton/CellButton.e2e-playground.tsx @@ -12,6 +12,7 @@ export const CellButtonPlayground = (props: ComponentPlaygroundProps) => { { centered: [true], children: ['Создать что-нибудь'], + before: [undefined, ], }, { mode: [undefined, 'danger'], diff --git a/packages/vkui/src/components/CellButton/CellButton.module.css b/packages/vkui/src/components/CellButton/CellButton.module.css index 6319e45ed2..f178412fa2 100644 --- a/packages/vkui/src/components/CellButton/CellButton.module.css +++ b/packages/vkui/src/components/CellButton/CellButton.module.css @@ -38,6 +38,10 @@ /* stylelint-disable-next-line selector-pseudo-class-disallowed-list */ .CellButton--centered :global(.vkuiIcon) { + /* компенсируем отступ заданные в SimpleCell__before */ + margin-inline-end: calc( + -1 * var(--vkui_internal--SimpleCell-before-inline-padding-end, var(--vkui--spacing_size_xl)) + ); padding-inline-end: 8px; } diff --git a/packages/vkui/src/components/SimpleCell/SimpleCell.module.css b/packages/vkui/src/components/SimpleCell/SimpleCell.module.css index 3f641f2fbd..d263aec285 100644 --- a/packages/vkui/src/components/SimpleCell/SimpleCell.module.css +++ b/packages/vkui/src/components/SimpleCell/SimpleCell.module.css @@ -1,4 +1,6 @@ .SimpleCell { + --vkui_internal--SimpleCell-before-inline-padding-end: var(--vkui--spacing_size_xl); + display: flex; align-items: center; min-block-size: 48px; @@ -24,7 +26,7 @@ display: flex; align-items: center; padding-block: var(--vkui--spacing_size_s); - padding-inline-end: var(--vkui--spacing_size_xl); + padding-inline-end: var(--vkui_internal--SimpleCell-before-inline-padding-end); color: var(--vkui_internal--icon_color, var(--vkui--color_icon_accent)); } From 2940cf8f567bf90c3ecd465973208abc802c92e8 Mon Sep 17 00:00:00 2001 From: Andrey Medvedev Date: Tue, 24 Sep 2024 19:09:34 +0300 Subject: [PATCH 2/3] Use spacing --- packages/vkui/src/components/CellButton/CellButton.module.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/vkui/src/components/CellButton/CellButton.module.css b/packages/vkui/src/components/CellButton/CellButton.module.css index f178412fa2..ebb786cb92 100644 --- a/packages/vkui/src/components/CellButton/CellButton.module.css +++ b/packages/vkui/src/components/CellButton/CellButton.module.css @@ -42,7 +42,7 @@ margin-inline-end: calc( -1 * var(--vkui_internal--SimpleCell-before-inline-padding-end, var(--vkui--spacing_size_xl)) ); - padding-inline-end: 8px; + padding-inline-end: var(--vkui--spacing_size_m); } .CellButton { From 4eadae4bcb286cc03bd9c0f5ea2906ac15329ca5 Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Tue, 24 Sep 2024 16:17:51 +0000 Subject: [PATCH 3/3] CHORE: Update screenshots --- .../cellbutton-android-chromium-dark-1-snap.png | 4 ++-- .../cellbutton-android-chromium-light-1-snap.png | 4 ++-- .../__image_snapshots__/cellbutton-ios-webkit-dark-1-snap.png | 4 ++-- .../cellbutton-ios-webkit-light-1-snap.png | 4 ++-- .../cellbutton-vkcom-chromium-dark-1-snap.png | 4 ++-- .../cellbutton-vkcom-chromium-light-1-snap.png | 4 ++-- .../cellbutton-vkcom-firefox-dark-1-snap.png | 4 ++-- .../cellbutton-vkcom-firefox-light-1-snap.png | 4 ++-- .../cellbutton-vkcom-webkit-dark-1-snap.png | 4 ++-- .../cellbutton-vkcom-webkit-light-1-snap.png | 4 ++-- 10 files changed, 20 insertions(+), 20 deletions(-) diff --git a/packages/vkui/src/components/CellButton/__image_snapshots__/cellbutton-android-chromium-dark-1-snap.png b/packages/vkui/src/components/CellButton/__image_snapshots__/cellbutton-android-chromium-dark-1-snap.png index cd47aef355..0fcced554e 100644 --- a/packages/vkui/src/components/CellButton/__image_snapshots__/cellbutton-android-chromium-dark-1-snap.png +++ b/packages/vkui/src/components/CellButton/__image_snapshots__/cellbutton-android-chromium-dark-1-snap.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:1d3be212905d96149a5349f9633062dc3e879f5365f22500a47761346d784707 -size 48744 +oid sha256:aee46af8202d5f263324eafaf6269160c94a527bfae1ff10f28a0f1920752944 +size 56911 diff --git a/packages/vkui/src/components/CellButton/__image_snapshots__/cellbutton-android-chromium-light-1-snap.png b/packages/vkui/src/components/CellButton/__image_snapshots__/cellbutton-android-chromium-light-1-snap.png index b91a7946ea..683e6e7c2d 100644 --- a/packages/vkui/src/components/CellButton/__image_snapshots__/cellbutton-android-chromium-light-1-snap.png +++ b/packages/vkui/src/components/CellButton/__image_snapshots__/cellbutton-android-chromium-light-1-snap.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:e17c3e97d131bd5de7c31370a19c25962f96548ed023f894428975a7e7f629a0 -size 59309 +oid sha256:48c1b75cf7f1d0f6f0e537edf6e2cf7bc66e984ed9591332b7ccafd9f9f23e43 +size 61143 diff --git a/packages/vkui/src/components/CellButton/__image_snapshots__/cellbutton-ios-webkit-dark-1-snap.png b/packages/vkui/src/components/CellButton/__image_snapshots__/cellbutton-ios-webkit-dark-1-snap.png index 567ab24239..0bea2b97ec 100644 --- a/packages/vkui/src/components/CellButton/__image_snapshots__/cellbutton-ios-webkit-dark-1-snap.png +++ b/packages/vkui/src/components/CellButton/__image_snapshots__/cellbutton-ios-webkit-dark-1-snap.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:f85d8e468e3950da63845227a6a1c54c67e694be0a13be53b93a9cc3aa25035a -size 50149 +oid sha256:40b717f68ca8416dd9eb969a19ebd1a3d152a6dcc6a09c9cbd0b05cca1d7f3d9 +size 58990 diff --git a/packages/vkui/src/components/CellButton/__image_snapshots__/cellbutton-ios-webkit-light-1-snap.png b/packages/vkui/src/components/CellButton/__image_snapshots__/cellbutton-ios-webkit-light-1-snap.png index 5f7a0fdd42..86211635a5 100644 --- a/packages/vkui/src/components/CellButton/__image_snapshots__/cellbutton-ios-webkit-light-1-snap.png +++ b/packages/vkui/src/components/CellButton/__image_snapshots__/cellbutton-ios-webkit-light-1-snap.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:400ec28f534e90afa67dd1f5d29b2d7702a66ae2c7324041f447454a16f9ac29 -size 55048 +oid sha256:f32c22b7154d1cf31f071cf1de2075020b376a29759e73659ecf92d282d6309f +size 63067 diff --git a/packages/vkui/src/components/CellButton/__image_snapshots__/cellbutton-vkcom-chromium-dark-1-snap.png b/packages/vkui/src/components/CellButton/__image_snapshots__/cellbutton-vkcom-chromium-dark-1-snap.png index 88f30d4fc7..175623cef1 100644 --- a/packages/vkui/src/components/CellButton/__image_snapshots__/cellbutton-vkcom-chromium-dark-1-snap.png +++ b/packages/vkui/src/components/CellButton/__image_snapshots__/cellbutton-vkcom-chromium-dark-1-snap.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:8f02533fe444b3a0adc9ec14d539799d2fe1a9ad883cb045103120f13a877c4a -size 50537 +oid sha256:b536b6f608ed03cbd77f6d3a41ec46f3170ecb24239e2a8ea86acefda7b4a145 +size 57429 diff --git a/packages/vkui/src/components/CellButton/__image_snapshots__/cellbutton-vkcom-chromium-light-1-snap.png b/packages/vkui/src/components/CellButton/__image_snapshots__/cellbutton-vkcom-chromium-light-1-snap.png index ca592f72b0..6419855aa1 100644 --- a/packages/vkui/src/components/CellButton/__image_snapshots__/cellbutton-vkcom-chromium-light-1-snap.png +++ b/packages/vkui/src/components/CellButton/__image_snapshots__/cellbutton-vkcom-chromium-light-1-snap.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:6b9bc6f5a6b34712e61bead933755368eba6f63c90cc326409d01e40c145f6f4 -size 51141 +oid sha256:5febb0f9fb46ebc90b8b2ae3fe8c02a10889ae638f03a1d4febb79621a092e3b +size 58141 diff --git a/packages/vkui/src/components/CellButton/__image_snapshots__/cellbutton-vkcom-firefox-dark-1-snap.png b/packages/vkui/src/components/CellButton/__image_snapshots__/cellbutton-vkcom-firefox-dark-1-snap.png index 39993da3e9..738fc558fd 100644 --- a/packages/vkui/src/components/CellButton/__image_snapshots__/cellbutton-vkcom-firefox-dark-1-snap.png +++ b/packages/vkui/src/components/CellButton/__image_snapshots__/cellbutton-vkcom-firefox-dark-1-snap.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:49bcae31495afe829b5afd9effc06a360aba5595e7cf57bc6419928b442a6d2e -size 63816 +oid sha256:91dbd88e4c095ac4d3aa9cb246e06dacc93e270ecfa57d3beddc0c219fe7cba5 +size 73042 diff --git a/packages/vkui/src/components/CellButton/__image_snapshots__/cellbutton-vkcom-firefox-light-1-snap.png b/packages/vkui/src/components/CellButton/__image_snapshots__/cellbutton-vkcom-firefox-light-1-snap.png index 9d250cac46..39d16aac56 100644 --- a/packages/vkui/src/components/CellButton/__image_snapshots__/cellbutton-vkcom-firefox-light-1-snap.png +++ b/packages/vkui/src/components/CellButton/__image_snapshots__/cellbutton-vkcom-firefox-light-1-snap.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:6b1a0906b30f988dfb24db2758ee269dfae2772e627e337db8c6b5197f2708ea -size 63754 +oid sha256:2268028c8e126c38f31ef54d45e05af799dbe4d759de92939aa3ed21916862af +size 73028 diff --git a/packages/vkui/src/components/CellButton/__image_snapshots__/cellbutton-vkcom-webkit-dark-1-snap.png b/packages/vkui/src/components/CellButton/__image_snapshots__/cellbutton-vkcom-webkit-dark-1-snap.png index ddb911e252..6b18dde41c 100644 --- a/packages/vkui/src/components/CellButton/__image_snapshots__/cellbutton-vkcom-webkit-dark-1-snap.png +++ b/packages/vkui/src/components/CellButton/__image_snapshots__/cellbutton-vkcom-webkit-dark-1-snap.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:ce46ca1805150d55f5f1a4b7c5bb0de996bf94e0678116555d268c3384547b9b -size 51897 +oid sha256:089c97ac712a867ae2158c676e6ab43635b2fb1ecb515ab9e3271130548c3765 +size 58942 diff --git a/packages/vkui/src/components/CellButton/__image_snapshots__/cellbutton-vkcom-webkit-light-1-snap.png b/packages/vkui/src/components/CellButton/__image_snapshots__/cellbutton-vkcom-webkit-light-1-snap.png index 50fcb32eb0..454c4037c1 100644 --- a/packages/vkui/src/components/CellButton/__image_snapshots__/cellbutton-vkcom-webkit-light-1-snap.png +++ b/packages/vkui/src/components/CellButton/__image_snapshots__/cellbutton-vkcom-webkit-light-1-snap.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:3884649a4013f76297b03f45746a76375f0fa47b17bc7668a4d24fc5d2f3cec0 -size 52699 +oid sha256:c2f15eb05a36e5d932b17fd30a76728fcbd4ea1202f26a932c5286b8d882dbe5 +size 59932