style: 💄 fix TimePicker column align (#26784)

add `@picker-time-panel-column-width` and `@picker-time-panel-column-height`

close #26781

components/date-picker/style/panel.less

@@ -590,12 +590,12 @@
     .@{picker-prefix-cls}-content {
       display: flex;
       flex: auto;
-      height: 224px;
+      height: @picker-time-panel-column-height;
     }
 
     &-column {
       flex: 1 0 auto;
-      width: 56px;
+      width: @picker-time-panel-column-width;
       margin: 0;
       padding: 0;
       overflow-y: hidden;
@@ -605,10 +605,11 @@
 
       &::after {
         display: block;
-        height: 224px - @picker-time-panel-cell-height;
+        height: @picker-time-panel-column-height - @picker-time-panel-cell-height;
         content: '';
         .@{picker-prefix-cls}-datetime-panel & {
-          height: 224px - @picker-time-panel-cell-height + 2 * @border-width-base;
+          height: @picker-time-panel-column-height - @picker-time-panel-cell-height + 2 *
+            @border-width-base;
         }
       }
 
@@ -634,10 +635,9 @@
             width: 100%;
             height: @picker-time-panel-cell-height;
             margin: 0;
-            padding: 0;
+            padding: 0 0 0 ((@picker-time-panel-column-width - 28px) / 2);
             color: @text-color;
             line-height: @picker-time-panel-cell-height;
-            text-align: center;
             border-radius: 0;
             cursor: pointer;
             transition: background @animation-duration-slow;

components/style/themes/default.less

@@ -631,6 +631,8 @@
 @picker-border-color: @border-color-split;
 @picker-date-hover-range-border-color: lighten(@primary-color, 20%);
 @picker-date-hover-range-color: @picker-basic-cell-hover-with-range-color;
+@picker-time-panel-column-width: 56px;
+@picker-time-panel-column-height: 224px;
 @picker-time-panel-cell-height: 28px;
 @picker-panel-cell-height: 24px;
 @picker-panel-cell-width: 36px;