Skip to content

Commit 4211a3d

Browse files
ChronosSFChronosSF
authored
Merge branch 'master' into sstoychev/touch-scroll-time-picker
2 parents 2145e22 + 044db87 commit 4211a3d

File tree

12 files changed

+193
-24
lines changed

12 files changed

+193
-24
lines changed

‎package-lock.json‎

Lines changed: 4 additions & 4 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -74,7 +74,7 @@
7474
"@types/source-map": "0.5.2",
7575
"express": "^4.21.1",
7676
"fflate": "^0.8.1",
77-
"igniteui-theming": "^17.1.0",
77+
"igniteui-theming": "^17.2.0",
7878
"igniteui-trial-watermark": "^3.0.2",
7979
"lodash-es": "^4.17.21",
8080
"rxjs": "^7.8.2",

‎projects/igniteui-angular/package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -73,7 +73,7 @@
7373
"tslib": "^2.3.0",
7474
"igniteui-trial-watermark": "^3.0.2",
7575
"lodash-es": "^4.17.21",
76-
"igniteui-theming": "^17.1.0",
76+
"igniteui-theming": "^17.2.0",
7777
"@igniteui/material-icons-extended": "^3.1.0"
7878
},
7979
"peerDependencies": {

‎projects/igniteui-angular/src/lib/core/styles/components/action-strip/_action-strip-theme.scss‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -200,5 +200,11 @@
200200
igx-icon {
201201
color: var-get($theme, 'delete-action');
202202
}
203+
204+
[igxIconButton] {
205+
igx-icon {
206+
color: var-get($theme, 'delete-action');
207+
}
208+
}
203209
}
204210
}

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

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -393,6 +393,18 @@
393393
@extend %date-last-preview-special !optional;
394394
}
395395

396+
@include e(date, $mods: ('first', 'range-preview', 'active')) {
397+
@extend %date-first-preview-active !optional;
398+
}
399+
400+
@include e(date, $mods: ('last', 'range-preview', 'active')) {
401+
@extend %date-last-preview-active !optional;
402+
}
403+
404+
@include e(date, $mods: ('first', 'last', 'selected')) {
405+
@extend %date-first-last-selected !optional;
406+
}
407+
396408
@include e(date, $mods: ('first', 'range-preview', 'special', 'current')) {
397409
@extend %date-first-preview-special-current !optional;
398410
}

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

Lines changed: 86 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1543,7 +1543,9 @@
15431543
%date-selected-special-active {
15441544
%date-inner {
15451545
&::after {
1546-
border-color: var-get($theme, 'date-selected-special-focus-border-color');
1546+
@if $variant != 'fluent' {
1547+
border-color: var-get($theme, 'date-selected-special-focus-border-color');
1548+
}
15471549
}
15481550
}
15491551
}
@@ -1606,7 +1608,9 @@
16061608
%date-selected-special-current-first-last {
16071609
%date-inner {
16081610
&::after {
1609-
border-color: var-get($theme, 'date-selected-special-border-color');
1611+
@if $variant != 'fluent' {
1612+
border-color: var-get($theme, 'date-selected-special-border-color');
1613+
}
16101614
}
16111615
}
16121616
}
@@ -1779,7 +1783,9 @@
17791783
%date-special-current-selected-active {
17801784
%date-inner {
17811785
&::after {
1782-
border-color: var-get($theme, 'date-selected-special-border-color');
1786+
@if $variant != 'fluent' {
1787+
border-color: var-get($theme, 'date-selected-special-border-color');
1788+
}
17831789
}
17841790
}
17851791
}
@@ -1852,6 +1858,16 @@
18521858
}
18531859
}
18541860

1861+
@if $variant == 'fluent' {
1862+
%date-selected-current-special {
1863+
%date-inner {
1864+
&::after {
1865+
border-color: var-get($theme, 'date-selected-current-background');
1866+
}
1867+
}
1868+
}
1869+
}
1870+
18551871
%date-inactive {
18561872
cursor: default;
18571873

@@ -2007,7 +2023,7 @@
20072023
%date-selected-current-range-special-active:not(%date-selected-current-range-special-first),
20082024
%date-selected-current-range-special-active:not(%date-selected-current-range-special-last) {
20092025
%date-inner {
2010-
@if not $bootstrap-theme {
2026+
@if not $bootstrap-theme and not $variant == 'fluent' {
20112027
color: var-get($theme, 'date-special-focus-foreground');
20122028
}
20132029

@@ -2157,7 +2173,6 @@
21572173
position: absolute;
21582174
height: $date-size;
21592175
width: $date-size;
2160-
border-radius: var-get($theme, 'date-border-radius');
21612176
}
21622177
}
21632178

@@ -2183,7 +2198,32 @@
21832198
&::after {
21842199
width: $date-inner-size;
21852200
height: $date-inner-size;
2186-
border-color: var-get($theme, 'date-selected-special-border-color');
2201+
2202+
@if $variant != 'fluent' {
2203+
border-color: var-get($theme, 'date-selected-special-border-color');
2204+
}
2205+
}
2206+
}
2207+
}
2208+
2209+
@if $variant == 'fluent' {
2210+
%date-first-preview-active {
2211+
%date-inner {
2212+
background: transparent;
2213+
border-inline-end-color: transparent;
2214+
}
2215+
}
2216+
2217+
%date-last-preview-active {
2218+
%date-inner {
2219+
background: transparent;
2220+
border-inline-start-color: transparent;
2221+
}
2222+
}
2223+
2224+
%date-first-last-selected {
2225+
%date-inner {
2226+
background: transparent;
21872227
}
21882228
}
21892229
}
@@ -2303,24 +2343,61 @@
23032343
content: '';
23042344
position: absolute;
23052345
height: $date-size;
2306-
width: calc($date-size / 2 + #{$border-size});
2346+
width: $date-size;
23072347
border: rem(1px) solid var-get($theme, 'date-range-border-color');
23082348
z-index: 3;
23092349
pointer-events: none;
23102350
}
23112351
}
23122352

23132353
%date-range-selected-first {
2354+
%date-inner {
2355+
border-start-end-radius: var-get($theme, 'date-border-radius');
2356+
border-end-end-radius: var-get($theme, 'date-border-radius');
2357+
}
2358+
23142359
&::before {
2315-
inset-inline-end: calc(50% - #{$border-size});
23162360
border-inline-end-color: transparent;
2361+
border-start-start-radius: var-get($theme, 'date-range-border-radius');
2362+
border-end-start-radius: var-get($theme, 'date-range-border-radius');
23172363
}
23182364
}
23192365

23202366
%date-range-selected-last {
2367+
%date-inner {
2368+
border-start-start-radius: var-get($theme, 'date-border-radius');
2369+
border-end-start-radius: var-get($theme, 'date-border-radius');
2370+
}
2371+
23212372
&::before {
2322-
inset-inline-start: calc(50% - #{$border-size});
23232373
border-inline-start-color: transparent;
2374+
border-start-end-radius: var-get($theme, 'date-range-border-radius');
2375+
border-end-end-radius: var-get($theme, 'date-range-border-radius');
2376+
}
2377+
}
2378+
2379+
2380+
%date-first-preview {
2381+
%date-inner {
2382+
border-start-start-radius: var-get($theme, 'date-range-border-radius');
2383+
border-end-start-radius: var-get($theme, 'date-range-border-radius');
2384+
border-start-end-radius: 0;
2385+
border-end-end-radius: 0;
2386+
}
2387+
}
2388+
2389+
%date-last-preview {
2390+
%date-inner {
2391+
border-start-end-radius: var-get($theme, 'date-range-border-radius');
2392+
border-end-end-radius: var-get($theme, 'date-range-border-radius');
2393+
border-start-start-radius: 0;
2394+
border-end-start-radius: 0;
2395+
}
2396+
}
2397+
2398+
%date-first-last {
2399+
%date-inner {
2400+
border-radius: var-get($theme, 'date-range-border-radius');
23242401
}
23252402
}
23262403
}

‎projects/igniteui-angular/src/lib/core/styles/components/card/_card-theme.scss‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -327,6 +327,10 @@
327327
margin-inline-start: auto;
328328
gap: rem(8px);
329329

330+
[igxIconButton] {
331+
color: var-get($theme, 'actions-text-color');
332+
}
333+
330334
&:empty {
331335
display: none;
332336
}
@@ -338,6 +342,10 @@
338342
order: 0;
339343
gap: rem(8px);
340344

345+
[igxIconButton] {
346+
color: var-get($theme, 'actions-text-color');
347+
}
348+
341349
&:empty {
342350
display: none;
343351
}

‎projects/igniteui-angular/src/lib/core/styles/components/input/_input-group-theme.scss‎

Lines changed: 16 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1648,6 +1648,18 @@
16481648
[igxPrefix] {
16491649
overflow: hidden;
16501650
}
1651+
1652+
igx-prefix,
1653+
[igxPrefix] {
1654+
background: var(--igx-input-group-input-prefix-background, transparent);
1655+
color: var(--igx-input-group-input-prefix-color, var(--ig-primary-500));
1656+
}
1657+
1658+
igx-suffix,
1659+
[igxSuffix] {
1660+
background: var(--igx-input-group-input-suffix-background, transparent);
1661+
color: var(--igx-input-group-input-suffix-color, var(--ig-primary-500));
1662+
}
16511663
}
16521664

16531665
%igx-input-group-fluent-search--focused {
@@ -1731,6 +1743,10 @@
17311743
%form-group-bundle--fluent--focus {
17321744
border-color: var-get($theme, 'focused-border-color');
17331745
border-width: rem(2px);
1746+
1747+
&:hover {
1748+
border-color: var-get($theme, 'focused-border-color');
1749+
}
17341750
}
17351751

17361752
%form-group-bundle-error--fluent,
@@ -1846,7 +1862,6 @@
18461862
}
18471863

18481864
%fluent-label-focused {
1849-
color: color(null, 'gray', 800);
18501865
transform: translateY(0) scale(1);
18511866
}
18521867

‎projects/igniteui-angular/src/lib/core/styles/components/list/_list-theme.scss‎

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -425,7 +425,6 @@
425425
justify-content: center;
426426
border-radius: var-get($theme, 'item-border-radius');
427427
color: var-get($theme, 'item-text-color');
428-
background: var-get($theme, 'item-background');
429428

430429
@if $bootstrap-theme or $variant == 'fluent' {
431430
border-bottom: var-get($theme, 'border-width') solid var-get($theme, 'border-color');
@@ -436,9 +435,6 @@
436435
}
437436

438437
&:hover {
439-
color: var-get($theme, 'item-text-color-hover');
440-
background: var-get($theme, 'item-background-hover');
441-
442438
%igx-list__item-lines {
443439
color: currentColor;
444440
}
@@ -544,9 +540,15 @@
544540
align-items: center;
545541
position: relative;
546542
border-radius: var-get($theme, 'item-border-radius');
547-
background: inherit;
543+
background: var-get($theme, 'item-background');
548544
z-index: 2;
549545
gap: if($variant == 'indigo', rem(8px), rem(16px));
546+
547+
&:hover,
548+
&:focus-within {
549+
color: var-get($theme, 'item-text-color-hover');
550+
background: var-get($theme, 'item-background-hover');
551+
}
550552
}
551553

552554
%igx-list-header,

‎src/app/list/list.sample.html‎

Lines changed: 11 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,17 @@
22
<section class="sample-content" [igSize]="properties.size">
33
<article class="sample-column">
44
<h5 class="sample-title">Angular List</h5>
5-
<igx-list>
5+
<igx-list [allowLeftPanning]="properties.enablePanning" [allowRightPanning]="properties.enablePanning">
6+
<ng-template igxListItemLeftPanning>
7+
<div class="pan pan--left">
8+
<igx-icon>delete</igx-icon>Delete
9+
</div>
10+
</ng-template>
11+
<ng-template igxListItemRightPanning>
12+
<div class="pan pan--right">
13+
<igx-icon>call</igx-icon>Dial
14+
</div>
15+
</ng-template>
616
<igx-list-item [isHeader]="true" selected>Employees List</igx-list-item>
717
@for (employee of employeeItems; track employee) {
818
<igx-list-item [selected]="employee.selected">

0 commit comments

Comments
 (0)