fix(calendar) fix fluent range radius (#1650)

Author: desig9stein

src/components/calendar/themes/shared/fluent/days-view.fluent.scss

@@ -13,11 +13,7 @@ $row-gap: rem(6px);
     height: var-get($theme, 'size');
     border-top: $border-size solid transparent;
     border-bottom: $border-size solid transparent;
-}
-
-[part~='date'],
-[part~='date-inner'] {
-    border-radius: var-get($theme, 'date-border-radius');
+    border-radius: 0;
 }
 
 [part~='date-inner'],
@@ -81,6 +77,7 @@ $row-gap: rem(6px);
 [part~='date-inner'] {
     width: var-get($theme, 'size');
     height: var-get($theme, 'size');
+    border-radius: var-get($theme, 'date-border-radius');
 
     &::after {
         content: '';
@@ -108,6 +105,7 @@ $row-gap: rem(6px);
     &[part~='selected'][part~='first'][part~='last'] {
         background: transparent;
         border-color: var-get($theme, 'date-range-preview-border-color');
+        border-radius: var-get($theme, 'date-range-border-radius');
     }
 
     &[part~='disabled'] {
@@ -146,6 +144,10 @@ $row-gap: rem(6px);
             color: var-get($theme, 'date-selected-foreground');
             background: var-get($theme, 'date-selected-background');
             border-color: transparent;
+            border-start-start-radius: var-get($theme, 'date-range-border-radius');
+            border-end-start-radius: var-get($theme, 'date-range-border-radius');
+            border-start-end-radius: var-get($theme, 'date-border-radius');
+            border-end-end-radius: var-get($theme, 'date-border-radius');
 
             &:hover {
                 color: var-get($theme, 'date-selected-hover-foreground');
@@ -167,6 +169,10 @@ $row-gap: rem(6px);
             color: var-get($theme, 'date-selected-foreground');
             background: var-get($theme, 'date-selected-background');
             border-color: transparent;
+            border-start-end-radius: var-get($theme, 'date-range-border-radius');
+            border-end-end-radius: var-get($theme, 'date-range-border-radius');
+            border-start-start-radius: var-get($theme, 'date-border-radius');
+            border-end-start-radius: var-get($theme, 'date-border-radius');
 
             &:hover {
                 color: var-get($theme, 'date-selected-hover-foreground');
@@ -285,7 +291,7 @@ $row-gap: rem(6px);
         }
     }
 
-    &[part~='selected'][part~='special'] {
+    &[part~='selected'][part~='special']:not([part~='current']) {
         &::after {
             border-color: var-get($theme, 'date-selected-special-border-color');
         }
@@ -402,7 +408,7 @@ $row-gap: rem(6px);
         &::before {
             content: '';
             position: absolute;
-            width: calc(var-get($theme, 'size') / 2 + #{$border-size});
+            width: var-get($theme, 'size');
             border-block: $border-size solid var-get($theme, 'date-range-border-color');
             z-index: 3;
             pointer-events: none;
@@ -411,19 +417,27 @@ $row-gap: rem(6px);
 
     &[part~='first'] {
         &::before {
-            inset-inline-end: calc(50% - #{$border-size});
+            inset-inline-end: initial;
             border-inline: $border-size solid;
             border-inline-start-color: var-get($theme, 'date-range-border-color');
             border-inline-end-color: transparent;
+            border-start-start-radius: var-get($theme, 'date-range-border-radius');
+            border-end-start-radius: var-get($theme, 'date-range-border-radius');
+            border-start-end-radius: 0;
+            border-end-end-radius: 0;
         }
     }
 
     &[part~='last'] {
         &::before {
-            inset-inline-start: calc(50% - #{$border-size});
+            inset-inline-start: initial;
             border-inline: $border-size solid;
             border-inline-start-color: transparent;
             border-inline-end-color: var-get($theme, 'date-range-border-color');
+            border-start-end-radius: var-get($theme, 'date-range-border-radius');
+            border-end-end-radius: var-get($theme, 'date-range-border-radius');
+            border-start-start-radius: 0;
+            border-end-start-radius: 0;
         }
     }