From 8a48f3c2a55c86b417f9abac1835ec129e406e20 Mon Sep 17 00:00:00 2001 From: afc163 Date: Fri, 13 Nov 2015 22:40:52 +0800 Subject: [PATCH] update style --- style/components/calendar.less | 268 +++++++++++++++++++++++- style/components/calendar/NoteList.less | 36 ---- style/components/calendar/Notes.less | 36 ---- style/components/calendar/index.less | 265 ----------------------- 4 files changed, 265 insertions(+), 340 deletions(-) delete mode 100644 style/components/calendar/NoteList.less delete mode 100644 style/components/calendar/Notes.less delete mode 100644 style/components/calendar/index.less diff --git a/style/components/calendar.less b/style/components/calendar.less index dc9dd09670..0449de84b0 100644 --- a/style/components/calendar.less +++ b/style/components/calendar.less @@ -1,3 +1,265 @@ -@import "calendar/index"; -@import "calendar/NoteList"; -@import "calendar/Notes"; \ No newline at end of file +@full-calendar-prefix-cls: ant-full-calendar; + +.@{full-calendar-prefix-cls} { + font-size: @font-size-base; + line-height: 1.5; + + &-month-select { + margin-left: 5px; + } + + &-header { + padding: 11px 16px 11px 0; + text-align: right; + + .ant-select { + text-align: left; + } + + .ant-radio-group { + margin-left: 8px; + text-align: left; + } + + label.ant-radio-button { + height: 22px; + line-height: 20px; + padding: 0 10px; + } + } + + outline: none; + border-top: 1px solid @legend-border-color; + &-date-panel { + position: relative; + outline: none; + } + + &-calendar-body { + padding: 8px 8px 14px; + } + + table { + border-collapse: collapse; + max-width: 100%; + background-color: transparent; + width: 100%; + height: 246px; + } + + table, td, th, td { + border: none; + } + + td { + position: relative; + } + + &-calendar-table { + border-spacing: 0; + margin-bottom: 0; + } + + &-column-header { + line-height: 18px; + padding: 0; + width: 33px; + text-align: center; + .@{full-calendar-prefix-cls}-column-header-inner { + display: block; + font-weight: normal; + } + } + + &-week-number-header { + .@{full-calendar-prefix-cls}-column-header-inner { + display: none; + } + } + + &-month, + &-date { + text-align: center; + } + + &-value { + display: block; + margin: 0 auto; + color: @text-color; + border-radius: 4px; + width: 22px; + height: 22px; + padding: 0; + background: transparent; + line-height: 22px; + + &:hover { + background: tint(@primary-color, 90%); + cursor: pointer; + } + } + + &-month-panel-cell &-value { + width: 48px; + } + + &-today &-value { + background: @primary-color; + color: #fff; + } + + &-disabled-cell &-value { + cursor: not-allowed; + color: #bcbcbc; + background: #f3f3f3; + border-radius: 0; + width: auto; + + &:hover { + background: #f3f3f3; + } + } + + &-disabled-cell-first-of-row &-value { + border-top-left-radius: 4px; + border-bottom-left-radius: 4px; + } + + &-disabled-cell-last-of-row &-value { + border-top-right-radius: 4px; + border-bottom-right-radius: 4px; + } + + &-last-month-cell &-value, + &-next-month-btn-day &-value { + color: #ccc; + } + + &-month-panel-table { + table-layout: fixed; + width: 100%; + border-collapse: separate; + } + + &-month-panel-cell { + .@{full-calendar-prefix-cls}-month-panel-month { + display: block; + width: 46px; + margin: 0 auto; + color: @text-color; + border-radius: 4px; + height: 36px; + padding: 0; + background: transparent; + line-height: 36px; + text-align: center; + + &:hover { + background: tint(@primary-color, 90%); + cursor: pointer; + } + } + + &-disabled &-month-panel-month { + color: #bfbfbf; + &:hover { + background: white; + cursor: not-allowed; + } + } + } + + &-month-panel-selected-cell .@{full-calendar-prefix-cls}-month-panel-month { + background: @primary-color; + color: #fff; + + &:hover { + background: @primary-color; + color: #fff; + } + } + + &-content { + position: absolute; + width: 100%; + left: 0; + bottom: -9px; + } + + &-fullscreen { + border-top: none; + } + + &-fullscreen &-table { + table-layout: fixed; + } + + &-fullscreen &-header { + .ant-radio-group { + margin-left: 16px; + } + label.ant-radio-button { + height: 28px; + line-height: 26px; + } + } + + &-fullscreen &-month, + &-fullscreen &-date { + text-align: left; + margin: 0 4px; + display: block; + color: @text-color; + height: 116px; + padding: 4px 8px; + border-top: 2px solid #eee; + transition: background 0.3s ease; + + &:hover { + background: tint(@primary-color, 90%); + cursor: pointer; + } + } + + &-fullscreen &-column-header { + text-align: right; + padding-right: 12px; + padding-bottom: 5px; + } + + &-fullscreen &-value { + text-align: right; + background: transparent; + width: auto; + } + + &-fullscreen &-today &-value { + color: #666; + } + + &-fullscreen &-month-panel-selected-cell &-month { + background-color: tint(@primary-color, 90%); + color: @text-color; + } + + &-fullscreen &-month-panel-selected-cell &-month, + &-fullscreen &-today &-date { + border-top-color: @primary-color; + background-color: tint(@primary-color, 90%); + color: @primary-color; + } + + &-fullscreen &-last-month-cell &-date, + &-fullscreen &-next-month-btn-day &-date { + color: #ccc; + } + + &-fullscreen &-content { + height: 90px; + overflow-y: auto; + position: static; + width: auto; + left: auto; + bottom: auto; + } +} diff --git a/style/components/calendar/NoteList.less b/style/components/calendar/NoteList.less deleted file mode 100644 index db4121b16f..0000000000 --- a/style/components/calendar/NoteList.less +++ /dev/null @@ -1,36 +0,0 @@ -.@{full-calendar-prefix-cls}-note { - &-list { - line-height: 24px; - list-style: none; - text-align: left; - margin: 0; - padding: 0; - - > li { - color: @legend-color; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - - > span { vertical-align: middle; } - - > span:first-child { - font-size: 9px; - margin-right: 4px; - } - } - - &-node-gray { - color: #ccc; - } - &-node-warn { - color: @warning-color; - } - &-node-normal { - color: @primary-color; - } - &-node-error { - color: @error-color; - } - } -} diff --git a/style/components/calendar/Notes.less b/style/components/calendar/Notes.less deleted file mode 100644 index 3d3d5470c8..0000000000 --- a/style/components/calendar/Notes.less +++ /dev/null @@ -1,36 +0,0 @@ -.@{full-calendar-prefix-cls}-notes { - height: 9px; - line-height: 8px; - text-align: center; - overflow: hidden; - border-radius: 4px; - bottom: -5px; - left: 4px; - font-size: 8px; - margin: auto; - width: 19px; - cursor: pointer; - - &-overflow { - border: 1px solid @btn-default-border; - } - - span&-node-gray { - color: #ccc; - } - span&-node-warn { - color: @warning-color; - } - span&-node-normal { - color: @primary-color; - } - span&-node-error { - color: @error-color; - } - - &-date { - width: 20px; - height: 20px; - line-height: 20px; - } -} diff --git a/style/components/calendar/index.less b/style/components/calendar/index.less deleted file mode 100644 index 0449de84b0..0000000000 --- a/style/components/calendar/index.less +++ /dev/null @@ -1,265 +0,0 @@ -@full-calendar-prefix-cls: ant-full-calendar; - -.@{full-calendar-prefix-cls} { - font-size: @font-size-base; - line-height: 1.5; - - &-month-select { - margin-left: 5px; - } - - &-header { - padding: 11px 16px 11px 0; - text-align: right; - - .ant-select { - text-align: left; - } - - .ant-radio-group { - margin-left: 8px; - text-align: left; - } - - label.ant-radio-button { - height: 22px; - line-height: 20px; - padding: 0 10px; - } - } - - outline: none; - border-top: 1px solid @legend-border-color; - &-date-panel { - position: relative; - outline: none; - } - - &-calendar-body { - padding: 8px 8px 14px; - } - - table { - border-collapse: collapse; - max-width: 100%; - background-color: transparent; - width: 100%; - height: 246px; - } - - table, td, th, td { - border: none; - } - - td { - position: relative; - } - - &-calendar-table { - border-spacing: 0; - margin-bottom: 0; - } - - &-column-header { - line-height: 18px; - padding: 0; - width: 33px; - text-align: center; - .@{full-calendar-prefix-cls}-column-header-inner { - display: block; - font-weight: normal; - } - } - - &-week-number-header { - .@{full-calendar-prefix-cls}-column-header-inner { - display: none; - } - } - - &-month, - &-date { - text-align: center; - } - - &-value { - display: block; - margin: 0 auto; - color: @text-color; - border-radius: 4px; - width: 22px; - height: 22px; - padding: 0; - background: transparent; - line-height: 22px; - - &:hover { - background: tint(@primary-color, 90%); - cursor: pointer; - } - } - - &-month-panel-cell &-value { - width: 48px; - } - - &-today &-value { - background: @primary-color; - color: #fff; - } - - &-disabled-cell &-value { - cursor: not-allowed; - color: #bcbcbc; - background: #f3f3f3; - border-radius: 0; - width: auto; - - &:hover { - background: #f3f3f3; - } - } - - &-disabled-cell-first-of-row &-value { - border-top-left-radius: 4px; - border-bottom-left-radius: 4px; - } - - &-disabled-cell-last-of-row &-value { - border-top-right-radius: 4px; - border-bottom-right-radius: 4px; - } - - &-last-month-cell &-value, - &-next-month-btn-day &-value { - color: #ccc; - } - - &-month-panel-table { - table-layout: fixed; - width: 100%; - border-collapse: separate; - } - - &-month-panel-cell { - .@{full-calendar-prefix-cls}-month-panel-month { - display: block; - width: 46px; - margin: 0 auto; - color: @text-color; - border-radius: 4px; - height: 36px; - padding: 0; - background: transparent; - line-height: 36px; - text-align: center; - - &:hover { - background: tint(@primary-color, 90%); - cursor: pointer; - } - } - - &-disabled &-month-panel-month { - color: #bfbfbf; - &:hover { - background: white; - cursor: not-allowed; - } - } - } - - &-month-panel-selected-cell .@{full-calendar-prefix-cls}-month-panel-month { - background: @primary-color; - color: #fff; - - &:hover { - background: @primary-color; - color: #fff; - } - } - - &-content { - position: absolute; - width: 100%; - left: 0; - bottom: -9px; - } - - &-fullscreen { - border-top: none; - } - - &-fullscreen &-table { - table-layout: fixed; - } - - &-fullscreen &-header { - .ant-radio-group { - margin-left: 16px; - } - label.ant-radio-button { - height: 28px; - line-height: 26px; - } - } - - &-fullscreen &-month, - &-fullscreen &-date { - text-align: left; - margin: 0 4px; - display: block; - color: @text-color; - height: 116px; - padding: 4px 8px; - border-top: 2px solid #eee; - transition: background 0.3s ease; - - &:hover { - background: tint(@primary-color, 90%); - cursor: pointer; - } - } - - &-fullscreen &-column-header { - text-align: right; - padding-right: 12px; - padding-bottom: 5px; - } - - &-fullscreen &-value { - text-align: right; - background: transparent; - width: auto; - } - - &-fullscreen &-today &-value { - color: #666; - } - - &-fullscreen &-month-panel-selected-cell &-month { - background-color: tint(@primary-color, 90%); - color: @text-color; - } - - &-fullscreen &-month-panel-selected-cell &-month, - &-fullscreen &-today &-date { - border-top-color: @primary-color; - background-color: tint(@primary-color, 90%); - color: @primary-color; - } - - &-fullscreen &-last-month-cell &-date, - &-fullscreen &-next-month-btn-day &-date { - color: #ccc; - } - - &-fullscreen &-content { - height: 90px; - overflow-y: auto; - position: static; - width: auto; - left: auto; - bottom: auto; - } -}