GitHub
/
ant-design
6
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

update style

pull/520/head
afc163 9 years ago
parent
39a3a8044b
commit
8a48f3c2a5
4 changed files with 265 additions and 340 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 268
      style/components/calendar.less
  2. 36
      style/components/calendar/NoteList.less
  3. 36
      style/components/calendar/Notes.less
  4. 265
      style/components/calendar/index.less

268
style/components/calendar.less
View File

@ -1,3 +1,265 @@
@import "calendar/index"; @full-calendar-prefix-cls: ant-full-calendar;
@import "calendar/NoteList";
@import "calendar/Notes"; .@{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;
}
}

36
style/components/calendar/NoteList.less
View File

@ -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;
}
}
}

36
style/components/calendar/Notes.less
View File

@ -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;
}
}

265
style/components/calendar/index.less
View File

@ -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;
}
}
Write Preview
Loading…
Cancel
Save