From a7056174175451228f1358c777bf44c8765fb13e Mon Sep 17 00:00:00 2001 From: Haoxin Yang <1810849666@qq.com> Date: Wed, 12 Jun 2024 18:07:57 +0800 Subject: [PATCH 1/3] style: date picker panel row main axis between --- src/date-picker/calendar/panel/picker-panel.style.scss | 1 + 1 file changed, 1 insertion(+) diff --git a/src/date-picker/calendar/panel/picker-panel.style.scss b/src/date-picker/calendar/panel/picker-panel.style.scss index 0b47ba56d..a138c1fe2 100644 --- a/src/date-picker/calendar/panel/picker-panel.style.scss +++ b/src/date-picker/calendar/panel/picker-panel.style.scss @@ -61,6 +61,7 @@ $left-mask-shadow: -12px 0 0 0 use-rgb(popper-bg); flex: 1; display: flex; align-items: center; + justify-content: space-between; @include text-set(m); width: 100%; From e83e52cdf4d37726c35c3673080b93c74af0e4a3 Mon Sep 17 00:00:00 2001 From: Mrlang <1810849666@qq.com> Date: Wed, 12 Jun 2024 18:17:18 +0800 Subject: [PATCH 2/3] Create itchy-planets-brush.md --- .changeset/itchy-planets-brush.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/itchy-planets-brush.md diff --git a/.changeset/itchy-planets-brush.md b/.changeset/itchy-planets-brush.md new file mode 100644 index 000000000..4d31aa2b4 --- /dev/null +++ b/.changeset/itchy-planets-brush.md @@ -0,0 +1,5 @@ +--- +"@alauda/ui": patch +--- + +style: date picker panel row main axis between From 65c6c0aff180784087b32c021a11e57c4dd5109b Mon Sep 17 00:00:00 2001 From: Haoxin Yang <1810849666@qq.com> Date: Thu, 13 Jun 2024 13:34:06 +0800 Subject: [PATCH 3/3] feat: mod picker panel header separator and style --- src/date-picker/calendar/header/style.scss | 20 ++++++++++++---- src/date-picker/calendar/header/template.html | 23 +++++++++++-------- 2 files changed, 30 insertions(+), 13 deletions(-) diff --git a/src/date-picker/calendar/header/style.scss b/src/date-picker/calendar/header/style.scss index a80b3a177..0fa8a9ef1 100644 --- a/src/date-picker/calendar/header/style.scss +++ b/src/date-picker/calendar/header/style.scss @@ -13,23 +13,35 @@ $block: aui-calendar-header; &__nav-content { flex: 1; display: flex; + flex-wrap: wrap; justify-content: center; align-items: center; font-size: use-var(font-size-l); color: use-text-color(main); font-weight: use-var(font-weight-bolder); - a { + .separator { + margin: 0 use-var(spacing-s); + } + + .aui-button--text { color: use-text-color(main); + .aui-button__content { + font-size: use-var(font-size-l); + font-weight: use-var(font-weight-bolder); + padding: 0; + } + &:hover { + background-color: transparent; color: use-rgb(primary); text-decoration: none !important; } - } - a + a { - margin-left: 5px; + + .aui-button--text { + margin-left: 0; + } } } } diff --git a/src/date-picker/calendar/header/template.html b/src/date-picker/calendar/header/template.html index f3c428d62..51cedfb9d 100644 --- a/src/date-picker/calendar/header/template.html +++ b/src/date-picker/calendar/header/template.html @@ -17,30 +17,35 @@ *ngIf="dateNavRange === DateNavRange.Month" [class]="bem.element('nav-content')" > - {{ headerRange?.start?.year() }}{{ 'year_suffix' | auiI18n }} - - +
+ + / + +
+
- {{ headerRange?.start?.year() }}{{ 'year_suffix' | auiI18n }} - +