FIX: Screen shaking on mobile view navigation (#45)

Setting a border on the `fullscreen-table-wrapper` element causes a
small shake in mobile views, especially on topics with multiple tables.

This PR removes the border on the table entirely. This was an almost
invisible visual effect when selecting the table (small border width,
whole table is set to 50% opacity).

It also makes a small refactor, moving the styles of the button outside
of the hover state.
This commit is contained in:
Penar Musaraj 2023-02-06 10:04:19 -05:00 committed by GitHub
parent f91876f8d3
commit d754e7a2ec
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 4 additions and 6 deletions

View File

View File

@ -18,24 +18,22 @@
.mobile-view {
.btn-edit-table {
display: none;
}
.fullscreen-table-wrapper {
position: relative;
border: 1px solid transparent;
&:hover {
border: 1px solid var(--primary-low);
table {
opacity: 0.5;
}
.btn-edit-table {
z-index: 2;
display: block;
position: absolute;
top: 1rem;
left: 1rem;
}
.fullscreen-table-wrapper {
position: relative;
&:hover {
table {
opacity: 0.5;
}
.btn-edit-table {
display: block;
}
}
}
}