ui tuning
This commit is contained in:
parent
c6c058efc5
commit
4eafb4ab12
|
@ -24,12 +24,22 @@
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
gap: .25rem;
|
gap: .25rem;
|
||||||
|
user-select: none;
|
||||||
}
|
}
|
||||||
li.process_list_item{
|
li.process_list_item{
|
||||||
margin-bottom: .4rem;
|
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
gap: .25rem;
|
gap: 0.25rem;
|
||||||
|
cursor: pointer;
|
||||||
|
border: solid 1px rgba(0,0,0,.3);
|
||||||
|
padding: 0.3rem;
|
||||||
|
border-radius: 0.3rem;
|
||||||
|
box-shadow: #333333 1px 1px 4px;
|
||||||
|
background: #eeeeee;
|
||||||
|
transition: background .3s;
|
||||||
|
}
|
||||||
|
li.process_list_item:hover{
|
||||||
|
background: #ffffff;
|
||||||
}
|
}
|
||||||
ul.keyword_list{
|
ul.keyword_list{
|
||||||
list-style: none;
|
list-style: none;
|
||||||
|
@ -37,12 +47,12 @@
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
gap:2px;
|
gap:2px;
|
||||||
padding-left: 0;
|
padding-left: 0;
|
||||||
|
font-size: x-small;
|
||||||
|
font-weight: 300;
|
||||||
}
|
}
|
||||||
li.keyword_list_item{
|
li.keyword_list_item{
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
padding: 0.25em 0.4em;
|
padding: 0.25em 0.4em;
|
||||||
font-size: small;
|
|
||||||
font-weight: 300;
|
|
||||||
line-height: 1;
|
line-height: 1;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
|
@ -52,16 +62,18 @@
|
||||||
color: #0099CC;
|
color: #0099CC;
|
||||||
border: solid 1px #0099CC;
|
border: solid 1px #0099CC;
|
||||||
}
|
}
|
||||||
|
.process_list_item_header{
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
<template id="PROCESS_LIST_TEMPLATE">
|
<template id="PROCESS_LIST_TEMPLATE">
|
||||||
<ul class="process_list" name="process_list">
|
<ul class="process_list" name="process_list">
|
||||||
<li class="process_list_item">
|
<li class="process_list_item">
|
||||||
<div style="display:flex;flex-direction:row;gap:1rem">
|
<h4 class="process_list_item_header"></h4>
|
||||||
<b></b>
|
|
||||||
<ul name="keywords" class="keyword_list">
|
<ul name="keywords" class="keyword_list">
|
||||||
<li class="keyword_list_item"></li>
|
<li class="keyword_list_item"></li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
|
||||||
<i></i>
|
<i></i>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
|
|
@ -78,7 +78,7 @@ class CCPMethodList extends HTMLElement{
|
||||||
"in" : (e,d)=>this.#filtered,
|
"in" : (e,d)=>this.#filtered,
|
||||||
"recurse" : [
|
"recurse" : [
|
||||||
{
|
{
|
||||||
"target" : "b",
|
"target" : "h5",
|
||||||
"apply" : (e,d)=>{ e.textContent = d.title }
|
"apply" : (e,d)=>{ e.textContent = d.title }
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
|
|
Loading…
Reference in New Issue