Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 | 92x 93x 92x 92x 92x 92x 92x 92x 92x 92x 103x 103x 92x 92x 92x 92x 92x 92x 92x 92x 92x 92x 92x 92x 92x 92x 92x 92x 92x 92x 92x 92x 92x 92x 92x 92x 92x 92x 92x 92x 92x 92x 92x 92x 92x 92x 92x 92x 92x 92x 92x 92x | import { css, html, TemplateResult } from 'lit';
import { property } from 'lit/decorators.js';
import { RapidElement } from '../RapidElement';
export class ContactUrn extends RapidElement {
@property({ type: String })
urn: string;
@property({ type: String })
scheme: string;
@property({ type: Number })
size = 20;
static get styles() {
return css`
:host {
display: flex;
align-items: center;
}
.urn {
box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.04) inset;
padding: 3px;
border: 1px solid #ddd;
border-radius: 18rem;
background: #eee;
margin-right: 0.2em;
}
.small {
padding: 0px;
border: 0px;
box-shadow: none;
margin-right: 0.5em;
}
`;
}
public render(): TemplateResult {
const scheme = this.scheme || this.urn.split(':')[0];
return html`
<img
class="urn ${this.size < 20 ? 'small' : ''}"
width="${this.size}em"
height="${this.size}em"
src="${this.prefix ||
(window as any).static_url ||
'/static/'}img/schemes/${scheme}.svg"
/>
`;
}
}
|