Skip to content

Commit fc9113b

Browse files
authored
fix(Calendar) days row height for fluent anf bootstrap theme (#1597)
1 parent 31172b5 commit fc9113b

File tree

2 files changed

+15
-15
lines changed

2 files changed

+15
-15
lines changed

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

Lines changed: 12 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,16 @@ $border-size: rem(1px);
2020

2121
[part~='days-row'][part~='first'] {
2222
background: var-get($theme, 'header-background');
23-
border-bottom: rem(1px) solid var-get($theme, 'border-color');
23+
position: relative;
24+
25+
&::after {
26+
content: '';
27+
position: absolute;
28+
width: 100%;
29+
inset-block-start: 100%;
30+
height: rem(1px);
31+
background: var-get($theme, 'border-color');
32+
}
2433
}
2534

2635
[part~='week-number'] {
@@ -37,7 +46,6 @@ $border-size: rem(1px);
3746

3847
&::after {
3948
width: var-get($theme, 'size');
40-
height: calc(var-get($theme, 'size') / 2);
4149
inset-block-end: 100%;
4250
background: var-get($theme, 'week-number-background');
4351
}
@@ -73,6 +81,8 @@ $border-size: rem(1px);
7381

7482
[part~='date'] {
7583
height: var-get($theme, 'size');
84+
border-top: $border-size solid transparent;
85+
border-bottom: $border-size solid transparent;
7686

7787
&[part~='range'],
7888
&[part~='range'][part~='preview'] {
@@ -121,12 +131,6 @@ $border-size: rem(1px);
121131
}
122132
}
123133

124-
[part~='date'],
125-
[part~='week-number'] {
126-
border-top: $border-size solid transparent;
127-
border-bottom: $border-size solid transparent;
128-
}
129-
130134
[part~='date-inner'] {
131135
width: var-get($theme, 'size');
132136
height: var-get($theme, 'size');

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

Lines changed: 3 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -11,26 +11,23 @@ $row-gap: rem(6px);
1111

1212
[part~='date'] {
1313
height: var-get($theme, 'size');
14+
border-top: $border-size solid transparent;
15+
border-bottom: $border-size solid transparent;
1416
}
1517

1618
[part~='date'],
1719
[part~='date-inner'] {
1820
border-radius: var-get($theme, 'date-border-radius');
1921
}
2022

21-
[part~='date'],
22-
[part~='week-number'] {
23-
border-top: $border-size solid transparent;
24-
border-bottom: $border-size solid transparent;
25-
}
26-
2723
[part~='date-inner'],
2824
[part~='week-number-inner'] {
2925
border: $border-size solid transparent;
3026
}
3127

3228
[part~='week-number'] {
3329
width: var-get($theme, 'size');
30+
height: var-get($theme, 'size');
3431
}
3532

3633
[part~='week-number-inner'] {
@@ -43,7 +40,6 @@ $row-gap: rem(6px);
4340

4441
&::after {
4542
width: var-get($theme, 'size');
46-
height: calc(var-get($theme, 'size') / 2);
4743
background: var-get($theme, 'week-number-background');
4844
border-inline-start: rem(1px) solid var-get($theme, 'week-number-background');
4945
border-inline-end: rem(1px) solid var-get($theme, 'week-number-background');

0 commit comments

Comments
 (0)