honeymoose
/
angular-cn
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix(docs-infra): remove scrollbar styles for accessibility (#38852) 

This commit removes the scrollbar styles so that the default
styles in the browser render. This widens the webkit scroll bar.
This makes it easier to grab the scrollbar using assistive
technology and devices, and provides a wider target for
those who have dexterity issues. By removing these styles,
We will no longer have to maintain custom scrollbars specific to WebKit
and they will be accessible by default.

PR Close #38852
This commit is contained in:
Kapunahele Wong 2020-09-15 08:52:44 -04:00 committed by Misko Hevery
parent f3f6a42342
commit dfbfabc052
2 changed files with 0 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
aio/src/styles/2-modules/_modules-dir.scss
View File

@ -25,7 +25,6 @@
@import 'progress-bar';
@import 'presskit';
@import 'resources';
@import 'scrollbar';
@import 'search-results';
@import 'select-menu';
@import 'table';

27
aio/src/styles/2-modules/_scrollbar.scss
View File

@ -1,27 +0,0 @@
body::-webkit-scrollbar, mat-sidenav.sidenav::-webkit-scrollbar, .mat-sidenav-content::-webkit-scrollbar {
height: 6px;
width: 6px;
}
body::-webkit-scrollbar-track, mat-sidenav.sidenav::-webkit-scrollbar-track, .mat-sidenav-content::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
}
body::-webkit-scrollbar-thumb, mat-sidenav.sidenav::-webkit-scrollbar-thumb, .mat-sidenav-content::-webkit-scrollbar-thumb {
background-color: $mediumgray;
outline: 1px solid $darkgray;
}
.search-results::-webkit-scrollbar, .toc-container::-webkit-scrollbar {
height: 4px;
width: 4px;
}
.search-results::-webkit-scrollbar-track, .toc-container::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
}
.search-results::-webkit-scrollbar-thumb, .toc-container::-webkit-scrollbar-thumb {
background-color: $mediumgray;
outline: 1px solid slategrey;
}