Include pin-angle icon via inline SVG

This commit is contained in:
Henrik Giesel 2021-03-28 15:45:51 +02:00
parent dbfbcc36c6
commit 7dcb3ae678
2 changed files with 11 additions and 7 deletions

View file

@ -133,15 +133,18 @@ button.highlighted {
} }
} }
.icon { .icon > svg {
cursor: pointer; fill: var(--text-fg);
color: var(--text-fg); }
&.is-inactive::before { .pin-icon {
cursor: pointer;
&.is-inactive {
opacity: 0.1; opacity: 0.1;
} }
&.icon--hover::before { &.icon--hover {
opacity: 0.5; opacity: 0.5;
} }
} }

View file

@ -1,5 +1,5 @@
import { bridgeCommand } from "./lib"; import { bridgeCommand } from "./lib";
// import pinIcon from "./pin-angle.svg"; import pinIcon from "./pin-angle.svg";
function removeHoverIcon(evt: Event): void { function removeHoverIcon(evt: Event): void {
const icon = evt.currentTarget as HTMLElement; const icon = evt.currentTarget as HTMLElement;
@ -24,7 +24,8 @@ export class LabelContainer extends HTMLDivElement {
this.appendChild(this.label); this.appendChild(this.label);
this.sticky = document.createElement("span"); this.sticky = document.createElement("span");
this.sticky.className = "bi me-1 bi-pin-angle icon"; this.sticky.className = "icon pin-icon me-1";
this.sticky.innerHTML = pinIcon;
this.sticky.hidden = true; this.sticky.hidden = true;
this.appendChild(this.sticky); this.appendChild(this.sticky);