akanealw/misode.github.io
1
0
Fork 0
mirror of https://github.com/misode/misode.github.io.git synced 2026-05-02 07:55:29 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Fix rounded corners before node icons

Browse Source
This commit is contained in:
Misode
2020-12-05 17:37:12 +01:00
parent 19265feb0c
commit 5806d26f42
2 changed files with 13 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/hooks/renderHtml.ts
+6 -6
View File
@@ -81,12 +81,12 @@ export const renderHtml: Hook<[any, Mounter], [string, string, string]> = {
const [cPrefix, cSuffix, cBody] = children.hook(this, childPath, childValue, mounter)
return `<div class="node-entry"><div class="node ${children.type(childPath)}-node" ${category ? `data-category="${htmlEncode(category)}"` : ''}>
<div class="node-header">
${error(childPath, mounter)}
${help(childPath, mounter)}
<button class="remove" data-id="${removeId}">${Octicon.trashcan}</button>
${cPrefix}
<label>${htmlEncode(pathLocale(path.contextPush('entry'), [`${index}`]))}</label>
${cSuffix}
${error(childPath, mounter)}
${help(childPath, mounter)}
</div>
${cBody ? `<div class="node-body">${cBody}</div>` : ''}
</div></div>`
@@ -120,12 +120,12 @@ export const renderHtml: Hook<[any, Mounter], [string, string, string]> = {
const [cPrefix, cSuffix, cBody] = children.hook(this, childPath, value[key], mounter)
return `<div class="node-entry"><div class="node ${children.type(childPath)}-node" ${category ? `data-category="${htmlEncode(category)}"` : ''}>
<div class="node-header">
${error(childPath, mounter)}
${help(childPath, mounter)}
<button class="remove" data-id="${removeId}">${Octicon.trashcan}</button>
${cPrefix}
<label>${htmlEncode(key)}</label>
${cSuffix}
${error(childPath, mounter)}
${help(childPath, mounter)}
</div>
${cBody ? `<div class="node-body">${cBody}</div>` : ''}
</div></div>`
@@ -173,11 +173,11 @@ export const renderHtml: Hook<[any, Mounter], [string, string, string]> = {
const [cPrefix, cSuffix, cBody] = field.hook(this, childPath, value[k], mounter)
return `<div class="node ${field.type(childPath)}-node" ${category ? `data-category="${htmlEncode(category)}"` : ''}>
<div class="node-header">
${error(childPath, mounter)}
${help(childPath, mounter)}
${cPrefix}
<label>${htmlEncode(pathLocale(childPath))}</label>
${cSuffix}
${error(childPath, mounter)}
${help(childPath, mounter)}
</div>
${cBody ? `<div class="node-body">${cBody}</div>` : ''}
</div>`
src/styles/nodes.css
+7 -8
View File
@@ -102,19 +102,18 @@
/** Rounded corners */
.node-header > *:first-child {
.node-header > .node-icon {
order: 1;
}
.node-header > *:first-child,
.node-header > .node-icon + * {
border-top-left-radius: 3px;
border-bottom-left-radius: 3px;
}
.node-header > *:last-child,
.node-header > input[list]:nth-last-child(2),
.node[data-help] > .node-header > *:nth-last-child(2),
.node[data-help] > .node-header > input[list]:nth-last-child(3),
.node[data-error] > .node-header > *:nth-last-child(2),
.node[data-error] > .node-header > input[list]:nth-last-child(3),
.node[data-help][data-error] > .node-header > *:nth-last-child(3),
.node[data-help][data-error] > .node-header > input[list]:nth-last-child(4) {
.node-header > input[list]:nth-last-child(2) {
border-top-right-radius: 3px;
border-bottom-right-radius: 3px;
}