xmj/element-call
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Try out scroll snapping

Browse source
This commit is contained in:
Robin Townsend 2023-01-30 09:35:40 -05:00
parent 3805a2f20e
commit 4e73c07cb2
2 changed files with 10 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/room/InCallView.module.css
View file

@ -17,7 +17,6 @@ limitations under the License.
.inRoom { .inRoom {
position: relative; position: relative;
display: flex; display: flex;
gap: 8px;
flex-direction: column; flex-direction: column;
overflow: hidden; overflow: hidden;
min-height: 100%; min-height: 100%;
@ -41,6 +40,7 @@ limitations under the License.
.footer { .footer {
position: relative; position: relative;
flex-shrink: 0;
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;

9
src/video-grid/NewVideoGrid.module.css
View file

@ -3,6 +3,7 @@
flex-grow: 1; flex-grow: 1;
padding: 0 22px; padding: 0 22px;
overflow-y: auto; overflow-y: auto;
scroll-snap-type: both mandatory;
} }
.slotGrid { .slotGrid {
@ -14,4 +15,12 @@
} }
.slot { .slot {
scroll-snap-align: start;
}
.slot:last-child {
/* This causes the grid to scroll up smoothly to the last item when its height
shrinks, and ensures that the user can always scroll the last row fully in
view */
scroll-snap-align: end;
} }