Skip to content

Commit 0c7bd5b

Browse files
jackofdiamond5jackofdiamond5
committed
fix(grid/tGrid/hGrid): move padding on the default template #5764 
1 parent b70d00a commit 0c7bd5b

File tree

8 files changed

+77
-58
lines changed

8 files changed

+77
-58
lines changed

‎projects/igniteui-angular/src/lib/core/styles/components/grid/_grid-component.scss‎

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -331,6 +331,10 @@
331331
@extend %grid-cell-text !optional;
332332
}
333333

334+
@include e(def_tmp_padding) {
335+
@extend %grid__def_tmp_padding !optional;
336+
}
337+
334338
@include e(cbx-selection) {
335339
@extend %grid__cbx-selection !optional;
336340
}
@@ -519,8 +523,8 @@
519523
@extend %igx-grid__drag-indicator--cosy !optional;
520524
}
521525

522-
@include e(cbx-selection) {
523-
@extend %grid__cbx-selection--cosy !optional;
526+
@include e(def_tmp_padding) {
527+
@extend %grid__def_tmp_padding--cosy !optional;
524528
}
525529

526530
@include e(cbx-selection, $m: push) {
@@ -619,8 +623,8 @@
619623
@extend %igx-grid__drag-indicator--compact !optional;
620624
}
621625

622-
@include e(cbx-selection) {
623-
@extend %grid__cbx-selection--compact !optional;
626+
@include e(def_tmp_padding) {
627+
@extend %grid__def_tmp_padding--compact !optional;
624628
}
625629

626630
@include e(cbx-selection, $m: push) {

‎projects/igniteui-angular/src/lib/core/styles/components/grid/_grid-theme.scss‎

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1379,19 +1379,22 @@
13791379
display: flex;
13801380
justify-content: center;
13811381
align-items: center;
1382-
padding: map-get($grid-header-padding, 'comfortable');
13831382
border-right: --var($theme, 'header-border-width')
13841383
--var($theme, 'header-border-style')
13851384
--var($theme, 'header-border-color');
13861385
background: inherit;
13871386
z-index: 4;
13881387
}
13891388

1390-
%grid__cbx-selection--cosy {
1389+
%grid__def_tmp_padding {
1390+
padding: map-get($grid-header-padding, 'comfortable');
1391+
}
1392+
1393+
%grid__def_tmp_padding--cosy {
13911394
padding: map-get($grid-header-padding, 'cosy');
13921395
}
13931396

1394-
%grid__cbx-selection--compact {
1397+
%grid__def_tmp_padding--compact {
13951398
padding: map-get($grid-header-padding, 'compact');
13961399
}
13971400

‎projects/igniteui-angular/src/lib/grids/grid/grid-row.component.html‎

Lines changed: 10 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -112,12 +112,14 @@
112112
</ng-container>
113113

114114
<ng-template #rowSelectorBaseTemplate>
115-
<igx-checkbox
116-
[checked]="selected"
117-
[readonly]="true"
118-
[disabled]="deleted"
119-
disableRipple="true"
120-
[disableTransitions]="grid.disableTransitions"
121-
[aria-label]="rowCheckboxAriaLabel">
122-
</igx-checkbox>
115+
<div class="igx-grid__def_tmp_padding">
116+
<igx-checkbox
117+
[checked]="selected"
118+
[readonly]="true"
119+
[disabled]="deleted"
120+
disableRipple="true"
121+
[disableTransitions]="grid.disableTransitions"
122+
[aria-label]="rowCheckboxAriaLabel">
123+
</igx-checkbox>
124+
</div>
123125
</ng-template>

‎projects/igniteui-angular/src/lib/grids/grid/grid.component.html‎

Lines changed: 11 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -252,15 +252,17 @@
252252
</ng-template>
253253

254254
<ng-template #headSelectorBaseTemplate igxHeadSelector let-context>
255-
<igx-checkbox
256-
[readonly]="true"
257-
[checked]="context.selectedCount > 0 && context.totalCount === context.selectedCount"
258-
disableRipple="true"
259-
[ngStyle]="{'visibility': isMultiRowSelectionEnabled? 'visible' : 'hidden' }"
260-
[indeterminate]="context.selectedCount > 0 && context.selectedCount !== context.totalCount"
261-
[aria-label]="headSelectorBaseAriaLabel"
262-
#headerCheckbox>
263-
</igx-checkbox>
255+
<div class="igx-grid__def_tmp_padding">
256+
<igx-checkbox
257+
[readonly]="true"
258+
[checked]="context.selectedCount > 0 && context.totalCount === context.selectedCount"
259+
disableRipple="true"
260+
[ngStyle]="{'visibility': isMultiRowSelectionEnabled? 'visible' : 'hidden' }"
261+
[indeterminate]="context.selectedCount > 0 && context.selectedCount !== context.totalCount"
262+
[aria-label]="headSelectorBaseAriaLabel"
263+
#headerCheckbox>
264+
</igx-checkbox>
265+
</div>
264266
</ng-template>
265267

266268
<igx-grid-column-resizer *ngIf="colResizingService.showResizer"></igx-grid-column-resizer>

‎projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.component.html‎

Lines changed: 11 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -217,15 +217,17 @@
217217
</ng-template>
218218

219219
<ng-template #headSelectorBaseTemplate igxHeadSelector let-context>
220-
<igx-checkbox
221-
[readonly]="true"
222-
[checked]="context.selectedCount > 0 && context.totalCount === context.selectedCount"
223-
disableRipple="true"
224-
[ngStyle]="{'visibility': isMultiRowSelectionEnabled? 'visible' : 'hidden' }"
225-
[indeterminate]="context.selectedCount > 0 && context.selectedCount !== context.totalCount"
226-
[aria-label]="headSelectorBaseAriaLabel"
227-
#headerCheckbox>
228-
</igx-checkbox>
220+
<div class="igx-grid__def_tmp_padding">
221+
<igx-checkbox
222+
[readonly]="true"
223+
[checked]="context.selectedCount > 0 && context.totalCount === context.selectedCount"
224+
disableRipple="true"
225+
[ngStyle]="{'visibility': isMultiRowSelectionEnabled? 'visible' : 'hidden' }"
226+
[indeterminate]="context.selectedCount > 0 && context.selectedCount !== context.totalCount"
227+
[aria-label]="headSelectorBaseAriaLabel"
228+
#headerCheckbox>
229+
</igx-checkbox>
230+
</div>
229231
</ng-template>
230232

231233
<igx-grid-column-resizer *ngIf="colResizingService.showResizer"></igx-grid-column-resizer>

‎projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-row.component.html‎

Lines changed: 10 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -77,12 +77,14 @@
7777
</ng-template>
7878

7979
<ng-template #rowSelectorBaseTemplate>
80-
<igx-checkbox
81-
[readonly]="true"
82-
[checked]="selected"
83-
disableRipple="true"
84-
[disabled]="deleted"
85-
[disableTransitions]="grid.disableTransitions"
86-
[aria-label]="rowCheckboxAriaLabel">
87-
</igx-checkbox>
80+
<div class="igx-grid__def_tmp_padding">
81+
<igx-checkbox
82+
[readonly]="true"
83+
[checked]="selected"
84+
disableRipple="true"
85+
[disabled]="deleted"
86+
[disableTransitions]="grid.disableTransitions"
87+
[aria-label]="rowCheckboxAriaLabel">
88+
</igx-checkbox>
89+
</div>
8890
</ng-template>

‎projects/igniteui-angular/src/lib/grids/tree-grid/tree-grid-row.component.html‎

Lines changed: 10 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -110,12 +110,14 @@
110110
<ng-container *ngTemplateOutlet="col.visibleIndex === 0 ? treeCellTemplate : cellTemplate"></ng-container>
111111
</ng-template>
112112
<ng-template #rowSelectorBaseTemplate>
113-
<igx-checkbox
114-
[readonly]="true"
115-
[checked]="selected"
116-
[disabled]="deleted"
117-
disableRipple="true"
118-
[disableTransitions]="grid.disableTransitions"
119-
[aria-label]="rowCheckboxAriaLabel">
120-
</igx-checkbox>
113+
<div class="igx-grid__def_tmp_padding">
114+
<igx-checkbox
115+
[readonly]="true"
116+
[checked]="selected"
117+
[disabled]="deleted"
118+
disableRipple="true"
119+
[disableTransitions]="grid.disableTransitions"
120+
[aria-label]="rowCheckboxAriaLabel">
121+
</igx-checkbox>
122+
</div>
121123
</ng-template>

‎projects/igniteui-angular/src/lib/grids/tree-grid/tree-grid.component.html‎

Lines changed: 11 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -192,15 +192,17 @@
192192
</ng-template>
193193

194194
<ng-template #headSelectorBaseTemplate igxHeadSelector let-context>
195-
<igx-checkbox
196-
[checked]="context.selectedCount > 0 && context.totalCount === context.selectedCount"
197-
[ngStyle]="{'visibility': isMultiRowSelectionEnabled? 'visible' : 'hidden' }"
198-
[readonly]="true"
199-
disableRipple="true"
200-
[indeterminate]="context.selectedCount > 0 && context.selectedCount !== context.totalCount"
201-
[aria-label]="headSelectorBaseAriaLabel"
202-
#headerCheckbox>
203-
</igx-checkbox>
195+
<div class="igx-grid__def_tmp_padding">
196+
<igx-checkbox
197+
[checked]="context.selectedCount > 0 && context.totalCount === context.selectedCount"
198+
[ngStyle]="{'visibility': isMultiRowSelectionEnabled? 'visible' : 'hidden' }"
199+
[readonly]="true"
200+
disableRipple="true"
201+
[indeterminate]="context.selectedCount > 0 && context.selectedCount !== context.totalCount"
202+
[aria-label]="headSelectorBaseAriaLabel"
203+
#headerCheckbox>
204+
</igx-checkbox>
205+
</div>
204206
</ng-template>
205207

206208
<igx-grid-column-resizer *ngIf="colResizingService.showResizer"></igx-grid-column-resizer>

0 commit comments

Comments
 (0)