render context list
This commit is contained in:
parent
edde4a02fa
commit
7f50e2900e
|
@ -94,7 +94,7 @@ class CCPMethodEditorController extends HTMLElement{
|
||||||
z-index: 10;
|
z-index: 10;
|
||||||
}
|
}
|
||||||
|
|
||||||
ul.author_list{
|
ul.author_list, ul.context_list{
|
||||||
list-style: none;
|
list-style: none;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
|
@ -115,6 +115,18 @@ class CCPMethodEditorController extends HTMLElement{
|
||||||
color: #9900CC;
|
color: #9900CC;
|
||||||
border: solid 1px #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>
|
</style>
|
||||||
`
|
`
|
||||||
#erase_icon = `
|
#erase_icon = `
|
||||||
|
@ -372,6 +384,9 @@ class CCPMethodEditorController extends HTMLElement{
|
||||||
<div class="mb-3 row">
|
<div class="mb-3 row">
|
||||||
${this.renderAuthors()}
|
${this.renderAuthors()}
|
||||||
</div>
|
</div>
|
||||||
|
<div class="mb-3 row">
|
||||||
|
${this.renderContexts()}
|
||||||
|
</div>
|
||||||
<div class="mb-3 row">
|
<div class="mb-3 row">
|
||||||
<div class="col">
|
<div class="col">
|
||||||
<label class="form-label">Title</label>
|
<label class="form-label">Title</label>
|
||||||
|
@ -725,7 +740,17 @@ class CCPMethodEditorController extends HTMLElement{
|
||||||
<ul class="author_list">
|
<ul class="author_list">
|
||||||
${ this.#current.metadata.
|
${ this.#current.metadata.
|
||||||
filter(md=>md.role === "author").
|
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>
|
</ul>
|
||||||
`
|
`
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue