render context list

This commit is contained in:
dcore94 2022-09-13 15:40:17 +02:00
parent edde4a02fa
commit 7f50e2900e
1 changed files with 27 additions and 2 deletions

View File

@ -94,7 +94,7 @@ class CCPMethodEditorController extends HTMLElement{
z-index: 10;
}
ul.author_list{
ul.author_list, ul.context_list{
list-style: none;
display: flex;
flex-direction: row;
@ -115,6 +115,18 @@ class CCPMethodEditorController extends HTMLElement{
color: #9900CC;
border: solid 1px #9900CC;
}
li.context_list_item{
display: inline-block;
padding: 0.25em 0.4em;
line-height: 1;
text-align: center;
white-space: nowrap;
vertical-align: baseline;
border-radius: 0.25rem;
background-color: #eeffff;
color: #0099CC;
border: solid 1px #0099CC;
}
</style>
`
#erase_icon = `
@ -372,6 +384,9 @@ class CCPMethodEditorController extends HTMLElement{
<div class="mb-3 row">
${this.renderAuthors()}
</div>
<div class="mb-3 row">
${this.renderContexts()}
</div>
<div class="mb-3 row">
<div class="col">
<label class="form-label">Title</label>
@ -725,7 +740,17 @@ class CCPMethodEditorController extends HTMLElement{
<ul class="author_list">
${ this.#current.metadata.
filter(md=>md.role === "author").
map(a=>`<li class="author_list_item">${a.title}</li>`) }
map(a=>`<li class="author_list_item" title="${a.title}">${a.title}</li>`).join() }
</ul>
`
}
renderContexts(){
return `
<ul class="context_list">
${ this.#current.metadata.
filter(md=>md.role === "context").
map(c=>`<li class="context_list_item" title="${c.title}">${c.title}</li>`).join("") }
</ul>
`
}