From 6b4bd6a619ad09cf7f30376956331245c5dd7bd9 Mon Sep 17 00:00:00 2001
From: Kwong Tung Nan <tungnan5636@gmail.com>
Date: Wed, 5 Oct 2022 01:34:07 +0800
Subject: [PATCH 1/3] Add spacing

Signed-off-by: Kwong Tung Nan <tungnan5636@gmail.com>
---
 devui/datepicker/datepicker.component.html | 1 +
 devui/datepicker/datepicker.component.scss | 4 ++++
 2 files changed, 5 insertions(+)

diff --git a/devui/datepicker/datepicker.component.html b/devui/datepicker/datepicker.component.html
index c8837a50..7ca23978 100755
--- a/devui/datepicker/datepicker.component.html
+++ b/devui/datepicker/datepicker.component.html
@@ -58,6 +58,7 @@
         </td>
         <td colspan="3" class="devui-dropdown">
           <span class="devui-date-title" (click)="toggle($event, 'year')">{{ i18nText?.yearDisplay(currentYear) }}</span>
+          <span class="devui-date-title-buffer"></span>
           <span class="devui-date-title" (click)="toggle($event, 'month')" *ngIf="mode !== 'year'">{{
             (i18nText?.monthsOfYear)[currentMonthIndex]
           }}</span>
diff --git a/devui/datepicker/datepicker.component.scss b/devui/datepicker/datepicker.component.scss
index 386b7685..31219c15 100755
--- a/devui/datepicker/datepicker.component.scss
+++ b/devui/datepicker/datepicker.component.scss
@@ -18,6 +18,10 @@
   position: relative;
 }
 
+.devui-date-title-buffer{
+  width: auto;
+}
+
 .devui-month-view .devui-month-view-table {
   margin-bottom: 0;
   background: $devui-connected-overlay-bg;

From 68f3b8922b4f74872cad418eb09cfeec998a3961 Mon Sep 17 00:00:00 2001
From: Kwong Tung Nan <tungnan5636@gmail.com>
Date: Wed, 5 Oct 2022 18:21:34 +0800
Subject: [PATCH 2/3] Add 'space' to span element

Signed-off-by: Kwong Tung Nan <tungnan5636@gmail.com>
---
 devui/datepicker/datepicker.component.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/devui/datepicker/datepicker.component.html b/devui/datepicker/datepicker.component.html
index 7ca23978..2eb92ab8 100755
--- a/devui/datepicker/datepicker.component.html
+++ b/devui/datepicker/datepicker.component.html
@@ -58,7 +58,7 @@
         </td>
         <td colspan="3" class="devui-dropdown">
           <span class="devui-date-title" (click)="toggle($event, 'year')">{{ i18nText?.yearDisplay(currentYear) }}</span>
-          <span class="devui-date-title-buffer"></span>
+          <span class="devui-date-title-buffer"> </span>
           <span class="devui-date-title" (click)="toggle($event, 'month')" *ngIf="mode !== 'year'">{{
             (i18nText?.monthsOfYear)[currentMonthIndex]
           }}</span>

From 421ee1f280feabc54d8232ea344522eef4c3b274 Mon Sep 17 00:00:00 2001
From: Kwong Tung Nan <tungnan5636@gmail.com>
Date: Wed, 5 Oct 2022 18:28:22 +0800
Subject: [PATCH 3/3] Use width attribute to define space instead

Signed-off-by: Kwong Tung Nan <tungnan5636@gmail.com>
---
 devui/datepicker/datepicker.component.html | 2 +-
 devui/datepicker/datepicker.component.scss | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/devui/datepicker/datepicker.component.html b/devui/datepicker/datepicker.component.html
index 2eb92ab8..7ca23978 100755
--- a/devui/datepicker/datepicker.component.html
+++ b/devui/datepicker/datepicker.component.html
@@ -58,7 +58,7 @@
         </td>
         <td colspan="3" class="devui-dropdown">
           <span class="devui-date-title" (click)="toggle($event, 'year')">{{ i18nText?.yearDisplay(currentYear) }}</span>
-          <span class="devui-date-title-buffer"> </span>
+          <span class="devui-date-title-buffer"></span>
           <span class="devui-date-title" (click)="toggle($event, 'month')" *ngIf="mode !== 'year'">{{
             (i18nText?.monthsOfYear)[currentMonthIndex]
           }}</span>
diff --git a/devui/datepicker/datepicker.component.scss b/devui/datepicker/datepicker.component.scss
index 31219c15..48e3def9 100755
--- a/devui/datepicker/datepicker.component.scss
+++ b/devui/datepicker/datepicker.component.scss
@@ -19,7 +19,7 @@
 }
 
 .devui-date-title-buffer{
-  width: auto;
+  width: 0.5em;
 }
 
 .devui-month-view .devui-month-view-table {