Skip to content

Commit 8a5b558

Browse files
simeonoffsimeonoff
authored
Merge branch 'master' into didimmova/fix-14933
2 parents 564042e + f9dfa3a commit 8a5b558

File tree

8 files changed

+62
-34
lines changed

8 files changed

+62
-34
lines changed

‎projects/igniteui-angular/src/lib/core/styles/components/dialog/_dialog-theme.scss‎

Lines changed: 5 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -87,7 +87,7 @@
8787
@include css-vars($theme);
8888

8989
$variant: map.get($theme, '_meta', 'variant');
90-
$bootstrap-theme: map.get($theme, variant) == 'bootstrap';
90+
$bootstrap-theme: map.get($theme, '_meta', 'variant') == 'bootstrap';
9191

9292
$dialog-min-width: map.get((
9393
'material': rem(280px),
@@ -96,21 +96,21 @@
9696
), $variant);
9797

9898
$dialog-title-padding: map.get((
99-
'material': rem(24px) rem(24px) rem(12px) rem(24px),
99+
'material': rem(16px) rem(24px) rem(0px) rem(24px),
100100
'fluent': rem(16px) rem(24px) rem(24px) rem(24px),
101101
'bootstrap': rem(16px),
102102
'indigo': rem(24px) rem(24px) 0 rem(24px),
103103
), $variant);
104104

105105
$dialog-message-padding: map.get((
106-
'material': rem(12px) rem(24px),
106+
'material': rem(14px) rem(24px),
107107
'fluent': 0 rem(24px) rem(20px) rem(24px),
108108
'bootstrap': rem(16px),
109109
'indigo': rem(16px) rem(24px),
110110
), $variant);
111111

112112
$dialog-actions-padding: map.get((
113-
'material': rem(8px),
113+
'material': 0 rem(8px) rem(8px),
114114
'fluent': 0 rem(24px) rem(24px) rem(24px),
115115
'bootstrap': rem(16px),
116116
'indigo': rem(16px) rem(24px) rem(24px) rem(24px),
@@ -180,23 +180,16 @@
180180
flex-flow: row nowrap;
181181
justify-content: flex-end;
182182
padding: $dialog-actions-padding;
183+
gap: if($variant == 'indigo', rem(16px), rem(8px));
183184

184185
@if $bootstrap-theme {
185186
border-top: rem(1px) solid var-get($theme, 'border-color');
186187
}
187188

188-
button + button {
189-
margin-inline-start: rem(8px);
190-
}
191-
192189
@if $variant == 'indigo' {
193190
.igx-button {
194191
--ig-size: 2;
195192
}
196-
197-
button + button {
198-
margin-inline-start: rem(16px);
199-
}
200193
}
201194
}
202195
}

‎projects/igniteui-angular/src/lib/core/styles/components/tabs/_tabs-theme.scss‎

Lines changed: 20 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -458,7 +458,7 @@
458458
&:hover,
459459
&:focus {
460460
background: var-get($theme, 'item-active-background');
461-
color: var-get($theme, 'item-active-color');
461+
color: if($variant == 'fluent', var-get($theme, 'item-hover-color'), var-get($theme, 'item-active-color'));
462462

463463
igx-icon {
464464
color: var-get($theme, 'item-active-icon-color');
@@ -473,16 +473,25 @@
473473
background: var-get($theme, 'item-active-background');
474474
position: relative;
475475
box-shadow: inset 0 0 0 rem(1px) var-get($theme, 'border-color');
476+
z-index: 1;
476477

477-
&::after {
478-
content: '';
479-
position: absolute;
480-
bottom: 0;
481-
inset-inline-start: 0;
482-
width: 100%;
483-
height: rem(1px);
484-
background: var-get($theme, 'item-active-background');
485-
z-index: 1;
478+
&:not(:focus) {
479+
&::before {
480+
content: '';
481+
position: absolute;
482+
bottom: 0;
483+
inset-inline-start: 0;
484+
width: 100%;
485+
height: rem(1px);
486+
background: linear-gradient(
487+
to right,
488+
var-get($theme, 'border-color') 1px,
489+
var-get($theme, 'item-active-background') 1px,
490+
var-get($theme, 'item-active-background') calc(100% - 1px),
491+
var-get($theme, 'border-color') calc(100% - 1px)
492+
);
493+
z-index: -1;
494+
}
486495
}
487496

488497
&:hover {
@@ -500,11 +509,6 @@
500509
&:hover,
501510
&:focus-visible {
502511
background: var-get($theme, 'item-hover-background');
503-
color: var-get($theme, 'item-hover-color');
504-
505-
igx-icon {
506-
color: var-get($theme, 'item-hover-icon-color');
507-
}
508512
}
509513
}
510514
}
@@ -638,6 +642,7 @@
638642
@include type-style($label) {
639643
margin-top: 0;
640644
margin-bottom: 0;
645+
@content;
641646
}
642647
}
643648
}

‎projects/igniteui-angular/src/lib/core/styles/typography/_fluent.scss‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -61,7 +61,10 @@
6161
));
6262
@include column-actions-typography();
6363
@include date-range-typography();
64-
@include dialog-typography();
64+
@include dialog-typography($categories: (
65+
title: 'h6',
66+
content: 'body-2'
67+
));
6568
@include dock-manager-typography();
6669
@include drop-down-typography($categories: (
6770
header: 'subtitle-2',

‎projects/igniteui-angular/src/lib/core/styles/typography/_indigo.scss‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -104,7 +104,9 @@
104104
));
105105
@include tabs-typography($categories: (
106106
label: 'subtitle-2',
107-
));
107+
)) {
108+
--ig-subtitle-2-text-transform: uppercase;
109+
};
108110
@include time-picker-typography($categories: (
109111
header-hour: 'h5',
110112
selected-time: 'h6'

‎projects/igniteui-angular/src/lib/slider/slider.component.spec.ts‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -637,6 +637,22 @@ describe('IgxSlider', () => {
637637
expect(slider.value.upper).toBe(60);
638638
});
639639

640+
it('should reach max value with upper thumb in RANGE mode with decimal steps', () => {
641+
slider.minValue = 0;
642+
slider.maxValue = 10;
643+
slider.step = 0.1;
644+
slider.type = IgxSliderType.RANGE;
645+
slider.value = { lower: 0, upper: 10 };
646+
fixture.detectChanges();
647+
648+
const toThumb = fixture.nativeElement.querySelector(THUMB_TO_CLASS);
649+
toThumb.focus();
650+
651+
UIInteractions.triggerKeyDownEvtUponElem('ArrowRight', toThumb, true);
652+
fixture.detectChanges();
653+
654+
expect((slider.value as IRangeSliderValue).upper).toBe(10);
655+
});
640656
});
641657

642658
describe('Slider - List View', () => {

‎projects/igniteui-angular/src/lib/slider/slider.component.ts‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1354,11 +1354,11 @@ export class IgxSliderComponent implements
13541354
private normalizeByStep(value: IRangeSliderValue | number) {
13551355
if (this.isRange) {
13561356
this._value = {
1357-
lower: (value as IRangeSliderValue).lower - ((value as IRangeSliderValue).lower % this.step),
1358-
upper: (value as IRangeSliderValue).upper - ((value as IRangeSliderValue).upper % this.step)
1357+
lower: Math.floor((value as IRangeSliderValue).lower / this.step) * this.step,
1358+
upper: Math.floor((value as IRangeSliderValue).upper / this.step) * this.step
13591359
};
13601360
} else {
1361-
this._value = (value as number) - ((value as number) % this.step);
1361+
this._value = Math.floor((value as number) / this.step) * this.step;
13621362
}
13631363
}
13641364

‎src/app/tabs/tabs.sample.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -30,9 +30,9 @@ <h3 class="sample-title">Different size tabs</h3>
3030
<span igxTabHeaderLabel>{{tab2Label}}</span>
3131
</igx-tab-header>
3232
<igx-tab-content>
33-
<div class="sample-scrollable">
33+
<div class="sample-list">
3434
<igx-list [allowRightPanning]="true" [allowLeftPanning]="true">
35-
<igx-list-item igxRipple="pink" igxRippleTarget=".igx-list__item"
35+
<igx-list-item igxRipple="pink" igxRippleTarget=".igx-list__item-base"
3636
*ngFor="let contact of contacts">
3737
<igx-avatar igxListThumbnail [src]="contact.avatar"></igx-avatar>
3838
<p igxListLineTitle>{{contact.text}}</p>

‎src/app/tabs/tabs.sample.scss‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -31,3 +31,12 @@
3131
font-size: 20px;
3232
font-weight: 900;
3333
}
34+
35+
.sample-list {
36+
padding: 16px;
37+
background: var(--ig-gray-50);
38+
}
39+
40+
.igx-list__item-base {
41+
position: relative;
42+
}

0 commit comments

Comments
 (0)