fix(FloatingBubble): optimized css var (#12009)

This commit is contained in:
ShuGang Zhou 2023-06-22 21:18:36 +08:00 committed by GitHub
parent a59a26931e
commit 4fa8879ed2
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 21 additions and 18 deletions

View File

@ -122,10 +122,11 @@ export type {
The component provides the following CSS variables, which can be used to customize styles. Please refer to [ConfigProvider component](#/en-US/config-provider).
| Name | Default Value | Description |
| --- | --- | --- |
| --van-floating-bubble-size | _48px_ | - |
| --van-floating-bubble-initial-space | _24px_ | - |
| --van-floating-bubble-background | _var(--van-primary-color)_ | - |
| --van-floating-bubble-color | _var(--van-background-2)_ | - |
| --van-floating-bubble-z-index | _999_ | - |
| Name | Default Value | Description |
| --------------------------------- | -------------------------- | ----------- |
| --van-floating-bubble-size | _48px_ | - |
| --van-floating-bubble-initial-gap | _24px_ | - |
| --van-floating-bubble-icon-size | _28px_ | - |
| --van-floating-bubble-background | _var(--van-primary-color)_ | - |
| --van-floating-bubble-color | _var(--van-background-2)_ | - |
| --van-floating-bubble-z-index | _999_ | - |

View File

@ -122,10 +122,11 @@ export type {
组件提供了下列 CSS 变量,可用于自定义样式,使用方法请参考 [ConfigProvider 组件](#/zh-CN/config-provider)。
| 名称 | 默认值 | 描述 |
| ----------------------------------- | -------------------------- | ---- |
| --van-floating-bubble-size | _48px_ | - |
| --van-floating-bubble-initial-space | _24px_ | - |
| --van-floating-bubble-background | _var(--van-primary-color)_ | - |
| --van-floating-bubble-color | _var(--van-background-2)_ | - |
| --van-floating-bubble-z-index | _999_ | - |
| 名称 | 默认值 | 描述 |
| --------------------------------- | -------------------------- | ---- |
| --van-floating-bubble-size | _48px_ | - |
| --van-floating-bubble-initial-gap | _24px_ | - |
| --van-floating-bubble-icon-size | _28px_ | - |
| --van-floating-bubble-background | _var(--van-primary-color)_ | - |
| --van-floating-bubble-color | _var(--van-background-2)_ | - |
| --van-floating-bubble-z-index | _999_ | - |

View File

@ -1,6 +1,7 @@
:root {
--van-floating-bubble-size: 48px;
--van-floating-bubble-initial-space: 24px;
--van-floating-bubble-initial-gap: 24px;
--van-floating-bubble-icon-size: 28px;
--van-floating-bubble-background: var(--van-primary-color);
--van-floating-bubble-color: var(--van-background-2);
--van-floating-bubble-z-index: 999;
@ -10,8 +11,8 @@
position: fixed;
left: 0;
top: 0;
right: var(--van-floating-bubble-initial-space);
bottom: var(--van-floating-bubble-initial-space);
right: var(--van-floating-bubble-initial-gap);
bottom: var(--van-floating-bubble-initial-gap);
width: var(--van-floating-bubble-size);
height: var(--van-floating-bubble-size);
box-sizing: border-box;
@ -33,6 +34,6 @@
}
&__icon {
font-size: 28px;
font-size: var(--van-floating-bubble-icon-size);
}
}