Verbeter anatomie en plaatsing van avataraccessoires (v0.4.46-beta) #1
2 changed files with 11 additions and 1 deletions
|
|
@ -873,7 +873,7 @@
|
||||||
.an-layer{position:absolute; inset:0;}
|
.an-layer{position:absolute; inset:0;}
|
||||||
.an-cell{
|
.an-cell{
|
||||||
position:absolute; width:128px; height:56px; border-radius:12px; border:2px dashed #dbe4f0;
|
position:absolute; width:128px; height:56px; border-radius:12px; border:2px dashed #dbe4f0;
|
||||||
display:flex; align-items:center; justify-content:center; font-weight:800; font-size:15px;
|
display:flex; align-items:center; justify-content:center; gap:6px; font-weight:800; font-size:15px;
|
||||||
color:var(--ink); padding:2px 8px; overflow:hidden; text-align:center; cursor:pointer;
|
color:var(--ink); padding:2px 8px; overflow:hidden; text-align:center; cursor:pointer;
|
||||||
}
|
}
|
||||||
.an-cell:hover{border-color:#b6c6dc;}
|
.an-cell:hover{border-color:#b6c6dc;}
|
||||||
|
|
@ -882,6 +882,11 @@
|
||||||
.an-cell.root.filled{background:var(--yellow); font-size:16px;}
|
.an-cell.root.filled{background:var(--yellow); font-size:16px;}
|
||||||
.an-cell input{width:100%; border:none; outline:none; font:inherit; text-align:center; background:transparent;}
|
.an-cell input{width:100%; border:none; outline:none; font:inherit; text-align:center; background:transparent;}
|
||||||
.an-word{overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:100%;}
|
.an-word{overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:100%;}
|
||||||
|
.an-pic{
|
||||||
|
flex:none; width:22px; height:22px; display:flex; align-items:center;
|
||||||
|
justify-content:center; font-size:16px; line-height:1;
|
||||||
|
}
|
||||||
|
.an-pic img{width:100%; height:100%; object-fit:contain;}
|
||||||
.an-dot{
|
.an-dot{
|
||||||
position:absolute; right:4px; bottom:4px; width:15px; height:15px; border-radius:50%;
|
position:absolute; right:4px; bottom:4px; width:15px; height:15px; border-radius:50%;
|
||||||
border:1.5px solid #fff; box-shadow:0 1px 3px rgba(0,0,0,.3); cursor:pointer; padding:0;
|
border:1.5px solid #fff; box-shadow:0 1px 3px rgba(0,0,0,.3); cursor:pointer; padding:0;
|
||||||
|
|
|
||||||
|
|
@ -30,6 +30,7 @@ function mountAnchor(root, initState){
|
||||||
}).finally(()=>{
|
}).finally(()=>{
|
||||||
fetching.delete(word);
|
fetching.delete(word);
|
||||||
syncSource();
|
syncSource();
|
||||||
|
render();
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
root.innerHTML = `
|
root.innerHTML = `
|
||||||
|
|
@ -79,6 +80,10 @@ function mountAnchor(root, initState){
|
||||||
c.style.left = (cx + gx*(CW+G) - CW/2)+"px";
|
c.style.left = (cx + gx*(CW+G) - CW/2)+"px";
|
||||||
c.style.top = (cy + gy*(CH+G) - CH/2)+"px";
|
c.style.top = (cy + gy*(CH+G) - CH/2)+"px";
|
||||||
if(word){
|
if(word){
|
||||||
|
const pic = document.createElement("div");
|
||||||
|
pic.className = "an-pic";
|
||||||
|
setPic(pic, S.pics[word.trim().toLowerCase()] || FALLBACK_PIC);
|
||||||
|
c.appendChild(pic);
|
||||||
const span = document.createElement("span");
|
const span = document.createElement("span");
|
||||||
span.className = "an-word";
|
span.className = "an-word";
|
||||||
span.textContent = word;
|
span.textContent = word;
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue