js/webawesome
1
0
Fork 0
mirror of https://github.com/shoelace-style/webawesome.git synced 2026-01-12 12:09:26 +00:00
Code Issues Packages Projects Releases Wiki Activity

add labels to zoom buttons

Browse Source
This commit is contained in:
Cory LaViska
2024-12-10 09:45:17 -05:00
parent 1a61bd9583
commit 747f185dc5
1 changed files with 12 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
src/components/viewport-demo/viewport-demo.ts
View File

@@ -291,11 +291,21 @@ export default class WaViewportDemo extends WebAwesomeElement {
<span part="controls">
${dimensions}
<span class="zoom">
<wa-icon-button name="square-minus" variant="regular" @click=${() => this.zoomOut()} part="zoom-out button"
<wa-icon-button
name="square-minus"
variant="regular"
label="Zoom out"
@click=${() => this.zoomOut()}
part="zoom-out button"
>-</wa-icon-button
>
<span class="zoom-level"> ${Math.round(this.computedZoom * 100)}%</span>
<wa-icon-button name="square-plus" variant="regular" @click=${() => this.zoomIn()} part="zoom-in button"
<wa-icon-button
name="square-plus"
variant="regular"
label="Zoom in"
@click=${() => this.zoomIn()}
part="zoom-in button"
>+</wa-icon-button
>
</span>