1+ import { LitElement , html , css } from 'lit' ;
2+ import { pages } from 'build-time-data' ;
3+ import 'qwc/qwc-extension-link.js' ;
4+
5+ const NAME = "JGit" ;
6+ export class QwcJGitCard extends LitElement {
7+
8+ static styles = css `
9+ .identity {
10+ display: flex;
11+ justify-content: flex-start;
12+ }
13+
14+ .description {
15+ padding-bottom: 10px;
16+ }
17+
18+ .logo {
19+ padding-bottom: 10px;
20+ margin-right: 5px;
21+ }
22+
23+ .card-content {
24+ color: var(--lumo-contrast-90pct);
25+ display: flex;
26+ flex-direction: column;
27+ justify-content: flex-start;
28+ padding: 2px 2px;
29+ height: 100%;
30+ }
31+
32+ .card-content slot {
33+ display: flex;
34+ flex-flow: column wrap;
35+ padding-top: 5px;
36+ }
37+ ` ;
38+
39+ static properties = {
40+ description : { type : String }
41+ } ;
42+
43+ constructor ( ) {
44+ super ( ) ;
45+ }
46+
47+ connectedCallback ( ) {
48+ super . connectedCallback ( ) ;
49+ }
50+
51+ render ( ) {
52+ return html `< div class ="card-content " slot ="content ">
53+ < div class ="identity ">
54+ < div class ="logo ">
55+ < img src ="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI5MnB0IiBoZWlnaHQ9IjkycHQiIHZpZXdCb3g9IjAgMCA5MiA5MiI+PGRlZnM+PGNsaXBQYXRoIGlkPSJhIj48cGF0aCBkPSJNMCAuMTEzaDkxLjg4N1Y5MkgwWm0wIDAiLz48L2NsaXBQYXRoPjwvZGVmcz48ZyBjbGlwLXBhdGg9InVybCgjYSkiPjxwYXRoIHN0eWxlPSJzdHJva2U6bm9uZTtmaWxsLXJ1bGU6bm9uemVybztmaWxsOiNmMDNjMmU7ZmlsbC1vcGFjaXR5OjEiIGQ9Ik05MC4xNTYgNDEuOTY1IDUwLjAzNiAxLjg0OGE1LjkxOCA1LjkxOCAwIDAgMC04LjM3MiAwbC04LjMyOCA4LjMzMiAxMC41NjYgMTAuNTY2YTcuMDMgNy4wMyAwIDAgMSA3LjIzIDEuNjg0IDcuMDM0IDcuMDM0IDAgMCAxIDEuNjY5IDcuMjc3bDEwLjE4NyAxMC4xODRhNy4wMjggNy4wMjggMCAwIDEgNy4yNzggMS42NzIgNy4wNCA3LjA0IDAgMCAxIDAgOS45NTcgNy4wNSA3LjA1IDAgMCAxLTkuOTY1IDAgNy4wNDQgNy4wNDQgMCAwIDEtMS41MjgtNy42NmwtOS41LTkuNDk3VjU5LjM2YTcuMDQgNy4wNCAwIDAgMSAxLjg2IDExLjI5IDcuMDQgNy4wNCAwIDAgMS05Ljk1NyAwIDcuMDQgNy4wNCAwIDAgMSAwLTkuOTU4IDcuMDYgNy4wNiAwIDAgMSAyLjMwNC0xLjUzOVYzMy45MjZhNy4wNDkgNy4wNDkgMCAwIDEtMy44Mi05LjIzNEwyOS4yNDIgMTQuMjcyIDEuNzMgNDEuNzc3YTUuOTI1IDUuOTI1IDAgMCAwIDAgOC4zNzFMNDEuODUyIDkwLjI3YTUuOTI1IDUuOTI1IDAgMCAwIDguMzcgMGwzOS45MzQtMzkuOTM0YTUuOTI1IDUuOTI1IDAgMCAwIDAtOC4zNzEiLz48L2c+PC9zdmc+ "
56+ alt ="${ NAME } "
57+ title ="${ NAME } "
58+ width ="32 "
59+ height ="32 ">
60+ </ div >
61+ < div class ="description "> ${ this . description } </ div >
62+ </ div >
63+ ${ this . _renderCardLinks ( ) }
64+ </ div >
65+ ` ;
66+ }
67+
68+ _renderCardLinks ( ) {
69+ return html `${ pages . map ( page => html `
70+ < qwc-extension-link slot ="link "
71+ extensionName ="${ NAME } "
72+ iconName ="${ page . icon } "
73+ displayName ="${ page . title } "
74+ staticLabel ="${ page . staticLabel } "
75+ dynamicLabel ="${ page . dynamicLabel } "
76+ streamingLabel ="${ page . streamingLabel } "
77+ path ="${ page . id } "
78+ ?embed =${ page . embed }
79+ externalUrl ="${ page . metadata . externalUrl } "
80+ webcomponent="${ page . componentLink } " >
81+ </ qwc-extension-link >
82+ ` ) } `;
83+ }
84+
85+ }
86+ customElements . define ( 'qwc-jgit-card' , QwcJGitCard ) ;
0 commit comments