style(editor): modernize zoom controls

This commit is contained in:
Lucio Lelii 2026-09-30 11:06:16 +02:00
parent 5216116a14
commit 55f838193a
2 changed files with 14 additions and 11 deletions

View File

@ -170,25 +170,28 @@
font-weight: 800;
letter-spacing: 0.08em;
text-transform: uppercase;
user-select: none;
-webkit-user-select: none;
}
.rete-editor-toolbar-btn {
display: inline-flex;
align-items: center;
justify-content: center;
width: 38px;
height: 38px;
border: 1px solid rgba(203, 213, 225, 0.95);
border-radius: 12px;
background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
color: #0f172a;
font-size: 16px;
width: 36px;
height: 36px;
border: 1px solid #d8e0ea;
border-radius: 10px;
background: #ffffff;
color: #334155;
font-size: 14px;
transition: transform 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease, color 0.15s ease;
}
.rete-editor-toolbar-btn:hover {
border-color: #94a3b8;
box-shadow: 0 10px 18px rgba(15, 23, 42, 0.12);
border-color: #60a5fa;
background: #eff6ff;
box-shadow: 0 6px 14px rgba(15, 23, 42, 0.1);
transform: translateY(-1px);
}

View File

@ -59,14 +59,14 @@
class="rete-editor-toolbar-btn"
(click)="zoomIn($event)"
aria-label="Zoom in">
<i class="bi bi-zoom-in" aria-hidden="true"></i>
<i class="bi bi-plus-lg" aria-hidden="true"></i>
</button>
<button
type="button"
class="rete-editor-toolbar-btn"
(click)="zoomOut($event)"
aria-label="Zoom out">
<i class="bi bi-zoom-out" aria-hidden="true"></i>
<i class="bi bi-dash-lg" aria-hidden="true"></i>
</button>
</section>
</div>