imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add zoom buttons to the location view (#7482)

Browse source
This commit is contained in:
Andy Balaam 2022-01-10 09:30:24 +00:00 • committed by GitHub
parent d00483be3e
commit 9cb8ce7c20
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 102 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

46
res/css/views/dialogs/_LocationViewDialog.scss
View file

@ -49,8 +49,48 @@ limitations under the License.
}
}
.mx_MLocationBody .mx_MLocationBody_map {
width: 80vw;
height: 80vh;
.mx_MLocationBody {
position: absolute;
.mx_MLocationBody_map {
width: 80vw;
height: 80vh;
}
.mx_MLocationBody_zoomButtons {
position: absolute;
display: grid;
grid-template-columns: auto;
grid-row-gap: 8px;
right: 24px;
bottom: 48px;
.mx_AccessibleButton {
background-color: $background;
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.25);
border-radius: 4px;
width: 24px;
height: 24px;
.mx_MLocationBody_zoomButton {
background-color: $primary-content;
margin: 4px;
width: 16px;
height: 16px;
mask-repeat: no-repeat;
mask-size: contain;
mask-position: center;
}
.mx_MLocationBody_plusButton {
mask-image: url('$(res)/img/element-icons/plus-button.svg');
}
.mx_MLocationBody_minusButton {
mask-image: url('$(res)/img/element-icons/minus-button.svg');
}
}
}
}
}

3
res/img/element-icons/minus-button.svg Normal file
View file

@ -0,0 +1,3 @@
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M2 8.00001C2 7.56779 2.35038 7.21741 2.78261 7.21741L13.2173 7.21741C13.6496 7.21741 13.9999 7.56779 13.9999 8.00001C13.9999 8.43223 13.6496 8.78262 13.2173 8.78262L2.78261 8.78262C2.35038 8.78262 2 8.43223 2 8.00001Z" fill="#17191C"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 388 B

3
res/img/element-icons/plus-button.svg Normal file
View file

@ -0,0 +1,3 @@
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M8.78269 2.78285C8.78269 2.35063 8.43231 2.00024 8.00009 2.00024C7.56787 2.00024 7.21748 2.35063 7.21748 2.78285V7.21748L2.78285 7.21748C2.35063 7.21748 2.00024 7.56787 2.00024 8.00009C2.00024 8.43231 2.35063 8.78269 2.78285 8.78269L7.21748 8.7827V13.2176C7.21748 13.6498 7.56787 14.0002 8.00009 14.0002C8.43231 14.0002 8.7827 13.6498 8.7827 13.2176V8.7827L13.2176 8.7827C13.6498 8.7827 14.0002 8.43231 14.0002 8.00009C14.0002 7.56787 13.6498 7.21749 13.2176 7.21749L8.78269 7.21748V2.78285Z" fill="#17191C"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 662 B