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 | 125x 127x 125x 125x 125x 125x 125x 125x 125x 125x 135x 135x 125x 125x 125x 125x 125x 125x 125x 125x 125x 125x 125x 125x 125x 125x 125x 125x 125x 125x 125x 125x 125x 125x 125x 125x 125x 125x 125x 125x 125x 125x 125x 125x 125x 125x 125x 125x 125x 125x 125x 125x | 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"
/>
`;
}
}
|