From 26e416c364a49e372448b16ee251301117e4ce7b Mon Sep 17 00:00:00 2001 From: afc163 Date: Mon, 16 Oct 2017 19:53:46 +0800 Subject: [PATCH] Tweak style --- .../__tests__/__snapshots__/demo.test.js.snap | 2 +- components/badge/demo/no-wrapper.md | 2 +- components/card/style/index.less | 2 +- components/collapse/style/index.less | 6 +- components/popconfirm/demo/placement.md | 5 + components/popover/demo/placement.md | 5 + components/popover/style/index.less | 2 +- components/slider/style/index.less | 22 +-- components/style/themes/default.less | 2 +- .../__tests__/__snapshots__/demo.test.js.snap | 144 +++++++++++------- components/tooltip/demo/placement.md | 63 ++++---- components/transfer/style/index.less | 6 +- components/upload/demo/avatar.md | 4 + 13 files changed, 155 insertions(+), 110 deletions(-) diff --git a/components/badge/__tests__/__snapshots__/demo.test.js.snap b/components/badge/__tests__/__snapshots__/demo.test.js.snap index 6212dbda8b..c4e8753b67 100644 --- a/components/badge/__tests__/__snapshots__/demo.test.js.snap +++ b/components/badge/__tests__/__snapshots__/demo.test.js.snap @@ -1108,7 +1108,7 @@ exports[`renders ./components/badge/demo/no-wrapper.md correctly 1`] = ` 99+ diff --git a/components/badge/demo/no-wrapper.md b/components/badge/demo/no-wrapper.md index 4f796443cb..fd0aecca59 100644 --- a/components/badge/demo/no-wrapper.md +++ b/components/badge/demo/no-wrapper.md @@ -22,7 +22,7 @@ ReactDOM.render(
- +
, mountNode); ```` diff --git a/components/card/style/index.less b/components/card/style/index.less index d14736d4d6..9d094e2733 100644 --- a/components/card/style/index.less +++ b/components/card/style/index.less @@ -68,7 +68,7 @@ } &-body { - padding: 20px @card-padding-base; + padding: @card-padding-base; .clearfix; } diff --git a/components/collapse/style/index.less b/components/collapse/style/index.less index 127c255869..a6ed1b6a11 100644 --- a/components/collapse/style/index.less +++ b/components/collapse/style/index.less @@ -94,7 +94,7 @@ } &-borderless > &-item { - border: 0; + border-bottom: 1px solid @border-color-base; } &-borderless > &-item:last-child, @@ -102,10 +102,6 @@ border-radius: 0; } - &-borderless > &-item-active { - border: 0; - } - &-borderless > &-item > &-content { background-color: transparent; } diff --git a/components/popconfirm/demo/placement.md b/components/popconfirm/demo/placement.md index 9487fa26a1..baa75a1dec 100755 --- a/components/popconfirm/demo/placement.md +++ b/components/popconfirm/demo/placement.md @@ -73,6 +73,9 @@ ReactDOM.render( ```` diff --git a/components/popover/demo/placement.md b/components/popover/demo/placement.md index b7b810b81a..e480257ff6 100755 --- a/components/popover/demo/placement.md +++ b/components/popover/demo/placement.md @@ -77,11 +77,16 @@ ReactDOM.render( ```` diff --git a/components/popover/style/index.less b/components/popover/style/index.less index 29ca4f2a70..3fb542d9aa 100644 --- a/components/popover/style/index.less +++ b/components/popover/style/index.less @@ -60,7 +60,7 @@ &-title { min-width: @popover-min-width; margin: 0; // reset heading margin - padding: 8px @padding-md; + padding: 5px @padding-md 4px; min-height: 32px; border-bottom: 1px solid @border-color-split; color: @heading-color; diff --git a/components/slider/style/index.less b/components/slider/style/index.less index 266098afcf..5ed6ed55a1 100644 --- a/components/slider/style/index.less +++ b/components/slider/style/index.less @@ -38,7 +38,7 @@ position: absolute; height: 4px; border-radius: @border-radius-base; - background-color: tint(@primary-color, 60%); + background-color: @primary-3; transition: background-color 0.3s ease; } @@ -50,18 +50,12 @@ height: 14px; cursor: pointer; border-radius: 50%; - border: solid 2px tint(@primary-color, 50%); + border: solid 2px @primary-3; background-color: @component-background; - transition: border-color 0.3s ease, transform .3s cubic-bezier(0.18, 0.89, 0.32, 1.28); + transition: border-color .3s, transform .3s cubic-bezier(0.18, 0.89, 0.32, 1.28); - &:hover { - border-color: @primary-5; - transform: scale(1.2); - transform-origin: center center; - } - - &:active { - box-shadow: 0 0 0 2px fadeout(@primary-color, 80%); + &.@{ant-prefix}-tooltip-open { + border-color: @primary-color; } } @@ -70,10 +64,10 @@ background-color: #e1e1e1; } .@{slider-prefix-cls}-track { - background-color: tint(@primary-color, 40%); + background-color: @primary-4; } - .@{slider-prefix-cls}-handle { - border-color: @primary-5; + .@{slider-prefix-cls}-handle:not(.@{ant-prefix}-tooltip-open) { + border-color: @primary-4; } } diff --git a/components/style/themes/default.less b/components/style/themes/default.less index c8a8b6dee7..8d6afe7579 100644 --- a/components/style/themes/default.less +++ b/components/style/themes/default.less @@ -339,7 +339,7 @@ // Badge // --- @badge-height: 20px; -@badge-dot-size: 8px; +@badge-dot-size: 6px; @badge-font-size: @font-size-sm; @badge-status-size: 6px; diff --git a/components/tooltip/__tests__/__snapshots__/demo.test.js.snap b/components/tooltip/__tests__/__snapshots__/demo.test.js.snap index 017507e89e..8e69c424f0 100644 --- a/components/tooltip/__tests__/__snapshots__/demo.test.js.snap +++ b/components/tooltip/__tests__/__snapshots__/demo.test.js.snap @@ -52,82 +52,120 @@ exports[`renders ./components/tooltip/demo/basic.md correctly 1`] = ` `; exports[`renders ./components/tooltip/demo/placement.md correctly 1`] = ` -
+
- - TL - - + TL + + + +
- - LT - - + LT + + + +
- - RT - - + RT + + + +
- - BL - - + BL + + + +
`; diff --git a/components/tooltip/demo/placement.md b/components/tooltip/demo/placement.md index 8d7b9d0904..ce4aa248f0 100644 --- a/components/tooltip/demo/placement.md +++ b/components/tooltip/demo/placement.md @@ -1,6 +1,6 @@ --- order: 1 -title: +title: zh-CN: 位置 en-US: Placement --- @@ -9,58 +9,61 @@ title: 位置有 12 个方向。 -## en-US +## en-US The ToolTip has 12 placements choice. ````jsx -import { Tooltip } from 'antd'; +import { Tooltip, Button } from 'antd'; + const text = prompt text; +const buttonWidth = 70; + ReactDOM.render( -
-
+
+
- TL + - Top + - TR +
-
+
- LT + - Left + - LB +
-
+
- RT + - Right + - RB +
-
+
- BL + - Bottom + - BR +
@@ -68,16 +71,16 @@ ReactDOM.render( ```` diff --git a/components/transfer/style/index.less b/components/transfer/style/index.less index 598f244545..c3df0fafb0 100644 --- a/components/transfer/style/index.less +++ b/components/transfer/style/index.less @@ -16,10 +16,10 @@ position: relative; width: 180px; height: 200px; - padding-top: 33px; + padding-top: 34px; &-with-footer { - padding-bottom: 33px; + padding-bottom: 34px; } &-search { @@ -79,7 +79,7 @@ } &-body-with-search { - padding-top: 34px; + padding-top: @input-height-base + 8px; } &-content { diff --git a/components/upload/demo/avatar.md b/components/upload/demo/avatar.md index 76281b9eb6..c112c2629c 100644 --- a/components/upload/demo/avatar.md +++ b/components/upload/demo/avatar.md @@ -84,6 +84,10 @@ ReactDOM.render(, mountNode); border: 1px dashed #d9d9d9; border-radius: 6px; cursor: pointer; + transition: all .3s; +} +.avatar-uploader:hover { + border: 1px dashed #1890ff; } .avatar-uploader-trigger { display: table-cell;