Добавить радиус границы в строке таблицы - PullRequest
Новая
       18

Добавить радиус границы в строке таблицы

0 голосов
/ 23 марта 2020

Я использую сетку данных для представления некоторой информации.

Я хочу добавить радиус границы для всех строк в моей таблице, но я не получаю его.

Кто-нибудь знает Как я могу добавить border-radius для всех строк в таблице?

Есть ли способ поместить текст полностью выровненным по левому краю и "удалить" столбец, который там есть, но без удаления индексации?

Спасибо

DEMO

Код 

<dx-data-grid class="tableTask" id="gridContainer" [dataSource]="Data" [remoteOperations]="false"
    [allowColumnReordering]="true" [showRowLines]="false" [showColumnLines]="false" [rowAlternationEnabled]="true"
    [showBorders]="false">   
    <dxo-group-panel [visible]="true"></dxo-group-panel>
    <dxo-grouping [autoExpandAll]="false"></dxo-grouping>
    <dxi-column dataField="name" [groupIndex]="0"></dxi-column>
    <dxi-column dataField="name" dataType="string"></dxi-column>
    <dxi-column dataField="name1" dataType="string"></dxi-column>
    <dxi-column dataField="name2" dataType="string"></dxi-column>
    <dxi-column dataField="name3" dataType="string" [width]="150"></dxi-column>
</dx-data-grid>

image

1 Ответ

1 голос
/ 23 марта 2020

Вам необходимо добавить border-radius непосредственно в ячейки таблицы (первый и последний дочерний элемент): 

 ::ng-deep .tableTask .dx-datagrid-rowsview .dx-data-row td:first-child {
   border-bottom-left-radius: 8px;
   border-top-left-radius: 8px;
 }

  ::ng-deep .tableTask .dx-datagrid-rowsview .dx-data-row td:last-child {
   border-bottom-right-radius: 8px;
   border-top-right-radius: 8px;
 }
...