Skip to content

Commit e7255a0

Browse files
authored
fix(calendar): fix week number problems on zoom (#15463)
1 parent 217604e commit e7255a0

File tree

1 file changed

+25
-25
lines changed

1 file changed

+25
-25
lines changed

projects/igniteui-angular/src/lib/core/styles/components/calendar/_calendar-theme.scss

Lines changed: 25 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -1158,7 +1158,7 @@
11581158
display: flex;
11591159
justify-content: space-between;
11601160

1161-
@if $variant != 'indigo' {
1161+
@if $variant == 'bootstrap' {
11621162
&:nth-child(2) {
11631163
%date-inner-week-number {
11641164
border-start-start-radius: var-get($theme, 'week-number-border-radius');
@@ -1222,28 +1222,6 @@
12221222
}
12231223
}
12241224

1225-
%date-inner-week-number {
1226-
min-width: auto;
1227-
width: $date-size;
1228-
color: var-get($theme, 'week-number-foreground');
1229-
background: var-get($theme, 'week-number-background');
1230-
1231-
&::after {
1232-
display: none !important;
1233-
}
1234-
1235-
&::before {
1236-
content: '';
1237-
position: absolute;
1238-
background: var-get($theme, 'week-number-background');
1239-
//border-inline: rem(1px) solid var-get($theme, 'week-number-background');
1240-
inset-inline-start: rem(-1px);
1241-
inset-block-start: 100%;
1242-
height: calc($date-size / 2);
1243-
width: $date-size;
1244-
}
1245-
}
1246-
12471225
%label-week-number {
12481226
text-align: center;
12491227

@@ -1272,9 +1250,8 @@
12721250
position: absolute;
12731251
background: var-get($theme, 'week-number-background');
12741252
border-inline: rem(1px) solid var-get($theme, 'week-number-background');
1275-
inset-inline-start: rem(-1px);
12761253
inset-block-start: 100%;
1277-
height: 100%;
1254+
height: calc(#{$date-view-row-gap} + #{rem(if($variant == 'indigo', 0px, 2px))});
12781255
width: $date-size;
12791256
}
12801257
}
@@ -1507,6 +1484,29 @@
15071484
height: $date-size;
15081485
}
15091486
}
1487+
1488+
&%date-inner-week-number {
1489+
min-width: auto;
1490+
width: $date-size;
1491+
color: var-get($theme, 'week-number-foreground');
1492+
background: var-get($theme, 'week-number-background');
1493+
1494+
// This is not an actual date and should not change it's border when changing the date border
1495+
border-color: var-get($theme, 'week-number-background');
1496+
1497+
&::after {
1498+
display: none !important;
1499+
}
1500+
1501+
&::before {
1502+
content: '';
1503+
position: absolute;
1504+
background: var-get($theme, 'week-number-background');
1505+
inset-block-start: 100%;
1506+
height: calc(#{$date-view-row-gap} + #{rem(if($variant == 'indigo', 0, 2px))});
1507+
width: $date-size;
1508+
}
1509+
}
15101510
}
15111511

15121512
%date-weekend {

0 commit comments

Comments
 (0)