From 5a14501bcdca35cf1a5a2e4354bf5ed3b7bc9ff0 Mon Sep 17 00:00:00 2001 From: afc163 Date: Wed, 17 Jun 2015 21:20:43 +0800 Subject: [PATCH] update datepicker style --- components/datepicker/demo/time.md | 2 +- style/components/datepicker/Calendar.less | 14 +++++++++----- style/components/datepicker/DecadePanel.less | 6 +++--- style/components/datepicker/MonthPanel.less | 8 ++++---- style/components/datepicker/Picker.less | 3 --- style/components/datepicker/TimePanel.less | 6 +++--- style/components/datepicker/YearPanel.less | 6 +++--- style/themes/default/custom.less | 2 +- 8 files changed, 24 insertions(+), 23 deletions(-) diff --git a/components/datepicker/demo/time.md b/components/datepicker/demo/time.md index ecba5f0f8..751f85a74 100644 --- a/components/datepicker/demo/time.md +++ b/components/datepicker/demo/time.md @@ -10,7 +10,7 @@ var Datepicker = antd.Datepicker; React.render( - + , document.getElementById('components-datepicker-demo-time')); ```` diff --git a/style/components/datepicker/Calendar.less b/style/components/datepicker/Calendar.less index 73777ca37..925fe0dbb 100644 --- a/style/components/datepicker/Calendar.less +++ b/style/components/datepicker/Calendar.less @@ -95,7 +95,7 @@ } &-calendar-body { - padding: 5px 10px; + padding: 5px 8px; } table { @@ -148,21 +148,25 @@ text-align: center; &:hover { - background: fadeout(#3fc7fa, 90%); + background: fadeout(#2db7f5, 90%); cursor: pointer; } + &:active { + color: #fff; + background: fadeout(#2db7f5, 80%); + } } &-today &-date { - color: #3fc7fa; + color: #2db7f5; } &-selected-day &-date { - background: #3fc7fa; + background: #2db7f5; color: #fff; &:hover { - background: #3fc7fa; + background: #2db7f5; } } diff --git a/style/components/datepicker/DecadePanel.less b/style/components/datepicker/DecadePanel.less index 946127565..1b4a0d9af 100644 --- a/style/components/datepicker/DecadePanel.less +++ b/style/components/datepicker/DecadePanel.less @@ -40,17 +40,17 @@ border-radius: 4px; &:hover { - background: #ebfaff; + background: fadeout(#2db7f5, 90%); cursor: pointer; } } .@{prefixCalendarClass}-decade-panel-selected-cell .@{prefixCalendarClass}-decade-panel-decade { - background: #3fc7fa; + background: #2db7f5; color: #fff; &:hover { - background: #3fc7fa; + background: #2db7f5; color: #fff; } } diff --git a/style/components/datepicker/MonthPanel.less b/style/components/datepicker/MonthPanel.less index 09e67d723..8b3e42922 100644 --- a/style/components/datepicker/MonthPanel.less +++ b/style/components/datepicker/MonthPanel.less @@ -1,6 +1,6 @@ .@{prefixCalendarClass}-month-panel { left: 0px; - top:0px; + top: 0px; bottom: 0px; right: 0px; background: #ffffff; @@ -40,17 +40,17 @@ border-radius: 4px; &:hover { - background: #ebfaff; + background: fadeout(#2db7f5, 90%); cursor: pointer; } } .@{prefixCalendarClass}-month-panel-selected-cell .@{prefixCalendarClass}-month-panel-month { - background: #3fc7fa; + background: #2db7f5; color: #fff; &:hover { - background: #3fc7fa; + background: #2db7f5; color: #fff; } } diff --git a/style/components/datepicker/Picker.less b/style/components/datepicker/Picker.less index a97674a79..57bcffe53 100644 --- a/style/components/datepicker/Picker.less +++ b/style/components/datepicker/Picker.less @@ -38,7 +38,4 @@ border-color: #23c0fa; box-shadow: 0 0 3px #23c0fa; } - &-open &-icon:after { - color: @primary-color; - } } diff --git a/style/components/datepicker/TimePanel.less b/style/components/datepicker/TimePanel.less index 7b7161ec1..1f42d4427 100644 --- a/style/components/datepicker/TimePanel.less +++ b/style/components/datepicker/TimePanel.less @@ -55,18 +55,18 @@ color: #666; &:hover { - background: #ebfaff; + background: fadeout(#2db7f5, 90%); cursor: pointer; } } .@{prefixCalendarClass}-time-panel-selected-cell .@{prefixCalendarClass}-time-panel-time { - background: #3fc7fa; + background: #2db7f5; color: #fff; &:hover { - background: #3fc7fa; + background: #2db7f5; color: #fff; } } diff --git a/style/components/datepicker/YearPanel.less b/style/components/datepicker/YearPanel.less index 9bc69d613..f00d791f5 100644 --- a/style/components/datepicker/YearPanel.less +++ b/style/components/datepicker/YearPanel.less @@ -40,17 +40,17 @@ border-radius: 4px; &:hover { - background: #ebfaff; + background: fadeout(#2db7f5, 90%); cursor: pointer; } } .@{prefixCalendarClass}-year-panel-selected-cell .@{prefixCalendarClass}-year-panel-year { - background: #3fc7fa; + background: #2db7f5; color: #fff; &:hover { - background: #3fc7fa; + background: #2db7f5; color: #fff; } } diff --git a/style/themes/default/custom.less b/style/themes/default/custom.less index 8030141fb..a8067d7a5 100644 --- a/style/themes/default/custom.less +++ b/style/themes/default/custom.less @@ -19,7 +19,7 @@ // LINK @link-color : #00abea; -@link-hover-color : #23C0FA; +@link-hover-color : fadeout(#00abea, 30%); @link-hover-decoration : none; // Disabled cursor for form controls and buttons.