Skip to content

Commit

Permalink
Fixed #1768 - DataTable Focus Row Rectangle on Safari
Browse files Browse the repository at this point in the history
  • Loading branch information
@mertsincan
mertsincan committed Nov 17, 2021
1 parent 9091cdb commit 91635f7
Show file tree
Hide file tree
Showing 43 changed files with 344 additions and 86 deletions.
10 changes: 8 additions & 2 deletions public/themes/arya-blue/theme.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2292,7 +2292,6 @@
background: #1e1e1e;
color: rgba(255, 255, 255, 0.87);
transition: box-shadow 0.2s;
outline-color: #93cbf9;
}
.p-datatable .p-datatable-tbody > tr > td {
text-align: left;
Expand Down Expand Up @@ -2334,6 +2333,10 @@
.p-datatable .p-datatable-tbody > tr > td > .p-column-title {
font-weight: 600;
}
.p-datatable .p-datatable-tbody > tr:focus {
outline: 1px solid #93cbf9;
outline-offset: -1px;
}
.p-datatable .p-datatable-tbody > tr.p-highlight {
background: rgba(100, 181, 246, 0.16);
color: rgba(255, 255, 255, 0.87);
Expand Down Expand Up @@ -3279,7 +3282,6 @@
background: #1e1e1e;
color: rgba(255, 255, 255, 0.87);
transition: box-shadow 0.2s;
outline-color: #93cbf9;
}
.p-treetable .p-treetable-tbody > tr > td {
text-align: left;
Expand Down Expand Up @@ -3313,6 +3315,10 @@
.p-treetable .p-treetable-tbody > tr > td .p-treetable-toggler + .p-checkbox .p-indeterminate .p-checkbox-icon {
color: rgba(255, 255, 255, 0.87);
}
.p-treetable .p-treetable-tbody > tr:focus {
outline: 1px solid #93cbf9;
outline-offset: -1px;
}
.p-treetable .p-treetable-tbody > tr.p-highlight {
background: rgba(100, 181, 246, 0.16);
color: rgba(255, 255, 255, 0.87);
Expand Down
10 changes: 8 additions & 2 deletions public/themes/arya-green/theme.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2292,7 +2292,6 @@
background: #1e1e1e;
color: rgba(255, 255, 255, 0.87);
transition: box-shadow 0.2s;
outline-color: #a7d8a9;
}
.p-datatable .p-datatable-tbody > tr > td {
text-align: left;
Expand Down Expand Up @@ -2334,6 +2333,10 @@
.p-datatable .p-datatable-tbody > tr > td > .p-column-title {
font-weight: 600;
}
.p-datatable .p-datatable-tbody > tr:focus {
outline: 1px solid #a7d8a9;
outline-offset: -1px;
}
.p-datatable .p-datatable-tbody > tr.p-highlight {
background: rgba(129, 199, 132, 0.16);
color: rgba(255, 255, 255, 0.87);
Expand Down Expand Up @@ -3279,7 +3282,6 @@
background: #1e1e1e;
color: rgba(255, 255, 255, 0.87);
transition: box-shadow 0.2s;
outline-color: #a7d8a9;
}
.p-treetable .p-treetable-tbody > tr > td {
text-align: left;
Expand Down Expand Up @@ -3313,6 +3315,10 @@
.p-treetable .p-treetable-tbody > tr > td .p-treetable-toggler + .p-checkbox .p-indeterminate .p-checkbox-icon {
color: rgba(255, 255, 255, 0.87);
}
.p-treetable .p-treetable-tbody > tr:focus {
outline: 1px solid #a7d8a9;
outline-offset: -1px;
}
.p-treetable .p-treetable-tbody > tr.p-highlight {
background: rgba(129, 199, 132, 0.16);
color: rgba(255, 255, 255, 0.87);
Expand Down
10 changes: 8 additions & 2 deletions public/themes/arya-orange/theme.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2292,7 +2292,6 @@
background: #1e1e1e;
color: rgba(255, 255, 255, 0.87);
transition: box-shadow 0.2s;
outline-color: #ffe284;
}
.p-datatable .p-datatable-tbody > tr > td {
text-align: left;
Expand Down Expand Up @@ -2334,6 +2333,10 @@
.p-datatable .p-datatable-tbody > tr > td > .p-column-title {
font-weight: 600;
}
.p-datatable .p-datatable-tbody > tr:focus {
outline: 1px solid #ffe284;
outline-offset: -1px;
}
.p-datatable .p-datatable-tbody > tr.p-highlight {
background: rgba(255, 213, 79, 0.16);
color: rgba(255, 255, 255, 0.87);
Expand Down Expand Up @@ -3279,7 +3282,6 @@
background: #1e1e1e;
color: rgba(255, 255, 255, 0.87);
transition: box-shadow 0.2s;
outline-color: #ffe284;
}
.p-treetable .p-treetable-tbody > tr > td {
text-align: left;
Expand Down Expand Up @@ -3313,6 +3315,10 @@
.p-treetable .p-treetable-tbody > tr > td .p-treetable-toggler + .p-checkbox .p-indeterminate .p-checkbox-icon {
color: rgba(255, 255, 255, 0.87);
}
.p-treetable .p-treetable-tbody > tr:focus {
outline: 1px solid #ffe284;
outline-offset: -1px;
}
.p-treetable .p-treetable-tbody > tr.p-highlight {
background: rgba(255, 213, 79, 0.16);
color: rgba(255, 255, 255, 0.87);
Expand Down
10 changes: 8 additions & 2 deletions public/themes/arya-purple/theme.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2292,7 +2292,6 @@
background: #1e1e1e;
color: rgba(255, 255, 255, 0.87);
transition: box-shadow 0.2s;
outline-color: #cf95d9;
}
.p-datatable .p-datatable-tbody > tr > td {
text-align: left;
Expand Down Expand Up @@ -2334,6 +2333,10 @@
.p-datatable .p-datatable-tbody > tr > td > .p-column-title {
font-weight: 600;
}
.p-datatable .p-datatable-tbody > tr:focus {
outline: 1px solid #cf95d9;
outline-offset: -1px;
}
.p-datatable .p-datatable-tbody > tr.p-highlight {
background: rgba(186, 104, 200, 0.16);
color: rgba(255, 255, 255, 0.87);
Expand Down Expand Up @@ -3279,7 +3282,6 @@
background: #1e1e1e;
color: rgba(255, 255, 255, 0.87);
transition: box-shadow 0.2s;
outline-color: #cf95d9;
}
.p-treetable .p-treetable-tbody > tr > td {
text-align: left;
Expand Down Expand Up @@ -3313,6 +3315,10 @@
.p-treetable .p-treetable-tbody > tr > td .p-treetable-toggler + .p-checkbox .p-indeterminate .p-checkbox-icon {
color: rgba(255, 255, 255, 0.87);
}
.p-treetable .p-treetable-tbody > tr:focus {
outline: 1px solid #cf95d9;
outline-offset: -1px;
}
.p-treetable .p-treetable-tbody > tr.p-highlight {
background: rgba(186, 104, 200, 0.16);
color: rgba(255, 255, 255, 0.87);
Expand Down
10 changes: 8 additions & 2 deletions public/themes/bootstrap4-dark-blue/theme.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2304,7 +2304,6 @@
background: #2a323d;
color: rgba(255, 255, 255, 0.87);
transition: box-shadow 0.15s;
outline-color: #e3f3fe;
}
.p-datatable .p-datatable-tbody > tr > td {
text-align: left;
Expand Down Expand Up @@ -2346,6 +2345,10 @@
.p-datatable .p-datatable-tbody > tr > td > .p-column-title {
font-weight: 600;
}
.p-datatable .p-datatable-tbody > tr:focus {
outline: 1px solid #e3f3fe;
outline-offset: -1px;
}
.p-datatable .p-datatable-tbody > tr.p-highlight {
background: #8dd0ff;
color: #151515;
Expand Down Expand Up @@ -3291,7 +3294,6 @@
background: #2a323d;
color: rgba(255, 255, 255, 0.87);
transition: box-shadow 0.15s;
outline-color: #e3f3fe;
}
.p-treetable .p-treetable-tbody > tr > td {
text-align: left;
Expand Down Expand Up @@ -3325,6 +3327,10 @@
.p-treetable .p-treetable-tbody > tr > td .p-treetable-toggler + .p-checkbox .p-indeterminate .p-checkbox-icon {
color: rgba(255, 255, 255, 0.87);
}
.p-treetable .p-treetable-tbody > tr:focus {
outline: 1px solid #e3f3fe;
outline-offset: -1px;
}
.p-treetable .p-treetable-tbody > tr.p-highlight {
background: #8dd0ff;
color: #151515;
Expand Down
10 changes: 8 additions & 2 deletions public/themes/bootstrap4-dark-purple/theme.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2304,7 +2304,6 @@
background: #2a323d;
color: rgba(255, 255, 255, 0.87);
transition: box-shadow 0.15s;
outline-color: #f0e6f5;
}
.p-datatable .p-datatable-tbody > tr > td {
text-align: left;
Expand Down Expand Up @@ -2346,6 +2345,10 @@
.p-datatable .p-datatable-tbody > tr > td > .p-column-title {
font-weight: 600;
}
.p-datatable .p-datatable-tbody > tr:focus {
outline: 1px solid #f0e6f5;
outline-offset: -1px;
}
.p-datatable .p-datatable-tbody > tr.p-highlight {
background: #c298d8;
color: #151515;
Expand Down Expand Up @@ -3291,7 +3294,6 @@
background: #2a323d;
color: rgba(255, 255, 255, 0.87);
transition: box-shadow 0.15s;
outline-color: #f0e6f5;
}
.p-treetable .p-treetable-tbody > tr > td {
text-align: left;
Expand Down Expand Up @@ -3325,6 +3327,10 @@
.p-treetable .p-treetable-tbody > tr > td .p-treetable-toggler + .p-checkbox .p-indeterminate .p-checkbox-icon {
color: rgba(255, 255, 255, 0.87);
}
.p-treetable .p-treetable-tbody > tr:focus {
outline: 1px solid #f0e6f5;
outline-offset: -1px;
}
.p-treetable .p-treetable-tbody > tr.p-highlight {
background: #c298d8;
color: #151515;
Expand Down
10 changes: 8 additions & 2 deletions public/themes/bootstrap4-light-blue/theme.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2304,7 +2304,6 @@
background: #ffffff;
color: #212529;
transition: box-shadow 0.15s;
outline-color: rgba(38, 143, 255, 0.5);
}
.p-datatable .p-datatable-tbody > tr > td {
text-align: left;
Expand Down Expand Up @@ -2346,6 +2345,10 @@
.p-datatable .p-datatable-tbody > tr > td > .p-column-title {
font-weight: 600;
}
.p-datatable .p-datatable-tbody > tr:focus {
outline: 1px solid rgba(38, 143, 255, 0.5);
outline-offset: -1px;
}
.p-datatable .p-datatable-tbody > tr.p-highlight {
background: #007bff;
color: #ffffff;
Expand Down Expand Up @@ -3291,7 +3294,6 @@
background: #ffffff;
color: #212529;
transition: box-shadow 0.15s;
outline-color: rgba(38, 143, 255, 0.5);
}
.p-treetable .p-treetable-tbody > tr > td {
text-align: left;
Expand Down Expand Up @@ -3325,6 +3327,10 @@
.p-treetable .p-treetable-tbody > tr > td .p-treetable-toggler + .p-checkbox .p-indeterminate .p-checkbox-icon {
color: #212529;
}
.p-treetable .p-treetable-tbody > tr:focus {
outline: 1px solid rgba(38, 143, 255, 0.5);
outline-offset: -1px;
}
.p-treetable .p-treetable-tbody > tr.p-highlight {
background: #007bff;
color: #ffffff;
Expand Down
10 changes: 8 additions & 2 deletions public/themes/bootstrap4-light-purple/theme.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2304,7 +2304,6 @@
background: #ffffff;
color: #212529;
transition: box-shadow 0.15s;
outline-color: rgba(136, 60, 174, 0.5);
}
.p-datatable .p-datatable-tbody > tr > td {
text-align: left;
Expand Down Expand Up @@ -2346,6 +2345,10 @@
.p-datatable .p-datatable-tbody > tr > td > .p-column-title {
font-weight: 600;
}
.p-datatable .p-datatable-tbody > tr:focus {
outline: 1px solid rgba(136, 60, 174, 0.5);
outline-offset: -1px;
}
.p-datatable .p-datatable-tbody > tr.p-highlight {
background: #883cae;
color: #ffffff;
Expand Down Expand Up @@ -3291,7 +3294,6 @@
background: #ffffff;
color: #212529;
transition: box-shadow 0.15s;
outline-color: rgba(136, 60, 174, 0.5);
}
.p-treetable .p-treetable-tbody > tr > td {
text-align: left;
Expand Down Expand Up @@ -3325,6 +3327,10 @@
.p-treetable .p-treetable-tbody > tr > td .p-treetable-toggler + .p-checkbox .p-indeterminate .p-checkbox-icon {
color: #212529;
}
.p-treetable .p-treetable-tbody > tr:focus {
outline: 1px solid rgba(136, 60, 174, 0.5);
outline-offset: -1px;
}
.p-treetable .p-treetable-tbody > tr.p-highlight {
background: #883cae;
color: #ffffff;
Expand Down
10 changes: 8 additions & 2 deletions public/themes/fluent-light/theme.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2292,7 +2292,6 @@
background: #ffffff;
color: #323130;
transition: box-shadow 0.2s;
outline-color: #605e5c;
}
.p-datatable .p-datatable-tbody > tr > td {
text-align: left;
Expand Down Expand Up @@ -2334,6 +2333,10 @@
.p-datatable .p-datatable-tbody > tr > td > .p-column-title {
font-weight: 600;
}
.p-datatable .p-datatable-tbody > tr:focus {
outline: 1px solid #605e5c;
outline-offset: -1px;
}
.p-datatable .p-datatable-tbody > tr.p-highlight {
background: #edebe9;
color: #323130;
Expand Down Expand Up @@ -3279,7 +3282,6 @@
background: #ffffff;
color: #323130;
transition: box-shadow 0.2s;
outline-color: #605e5c;
}
.p-treetable .p-treetable-tbody > tr > td {
text-align: left;
Expand Down Expand Up @@ -3313,6 +3315,10 @@
.p-treetable .p-treetable-tbody > tr > td .p-treetable-toggler + .p-checkbox .p-indeterminate .p-checkbox-icon {
color: #323130;
}
.p-treetable .p-treetable-tbody > tr:focus {
outline: 1px solid #605e5c;
outline-offset: -1px;
}
.p-treetable .p-treetable-tbody > tr.p-highlight {
background: #edebe9;
color: #323130;
Expand Down
10 changes: 8 additions & 2 deletions public/themes/lara-dark-blue/theme.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2327,7 +2327,6 @@
background: #22272d;
color: rgba(255, 255, 255, 0.87);
transition: box-shadow 0.2s;
outline-color: rgba(147, 197, 253, 0.5);
}
.p-datatable .p-datatable-tbody > tr > td {
text-align: left;
Expand Down Expand Up @@ -2369,6 +2368,10 @@
.p-datatable .p-datatable-tbody > tr > td > .p-column-title {
font-weight: 700;
}
.p-datatable .p-datatable-tbody > tr:focus {
outline: 1px solid rgba(147, 197, 253, 0.5);
outline-offset: -1px;
}
.p-datatable .p-datatable-tbody > tr.p-highlight {
background: rgba(147, 197, 253, 0.16);
color: rgba(255, 255, 255, 0.87);
Expand Down Expand Up @@ -3314,7 +3317,6 @@
background: #22272d;
color: rgba(255, 255, 255, 0.87);
transition: box-shadow 0.2s;
outline-color: rgba(147, 197, 253, 0.5);
}
.p-treetable .p-treetable-tbody > tr > td {
text-align: left;
Expand Down Expand Up @@ -3348,6 +3350,10 @@
.p-treetable .p-treetable-tbody > tr > td .p-treetable-toggler + .p-checkbox .p-indeterminate .p-checkbox-icon {
color: rgba(255, 255, 255, 0.87);
}
.p-treetable .p-treetable-tbody > tr:focus {
outline: 1px solid rgba(147, 197, 253, 0.5);
outline-offset: -1px;
}
.p-treetable .p-treetable-tbody > tr.p-highlight {
background: rgba(147, 197, 253, 0.16);
color: rgba(255, 255, 255, 0.87);
Expand Down
Loading

0 comments on commit 91635f7

Please sign in to comment.