akanealw/misode.github.io
1
0
Fork 0
mirror of https://github.com/misode/misode.github.io.git synced 2026-04-26 00:16:51 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Add hardcoded colored categories

Browse Source
This commit is contained in:
Misode
2024-10-24 06:50:04 +02:00
parent c9f216c550
commit 3f7c8f6904
2 changed files with 33 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
src/app/components/generator/McdocRenderer.tsx
View File

@@ -475,7 +475,7 @@ function StructBody({ type: outerType, node, makeEdit, ctx }: StructBodyProps) {
}
}
}
return <div class="node">
return <div class="node" data-category={getCategory(field.type)}>
<div class="node-header">
<Errors node={childValue} ctx={ctx} />
<Docs desc={field.desc} />
@@ -512,7 +512,8 @@ function ListBody({ type: outerType, node, makeEdit, ctx }: ListBodyProps) {
return <>
{node.children.map((item, index) => {
const child = item.value
const itemType = simplifyType(getItemType(type), ctx)
const itemType = getItemType(type)
const simplifiedItemType = simplifyType(itemType, ctx)
const makeItemEdit: MakeEdit = (edit) => {
makeEdit(() => {
const newChild = edit(child?.range ?? item.range)
@@ -524,7 +525,7 @@ function ListBody({ type: outerType, node, makeEdit, ctx }: ListBodyProps) {
return node
})
}
return <div class="node">
return <div class="node" data-category={getCategory(itemType)}>
<div class="node-header">
<Errors node={child} ctx={ctx} />
<button class="remove tooltipped tip-se" aria-label={locale('remove')} onClick={() => onRemoveItem(index)}>
@@ -539,9 +540,9 @@ function ListBody({ type: outerType, node, makeEdit, ctx }: ListBodyProps) {
</button>
</div>}
<Key label="entry" />
<Head type={itemType} node={child} makeEdit={makeItemEdit} ctx={ctx} />
<Head type={simplifiedItemType} node={child} makeEdit={makeItemEdit} ctx={ctx} />
</div>
<Body type={itemType} node={child} makeEdit={makeItemEdit} ctx={ctx} />
<Body type={simplifiedItemType} node={child} makeEdit={makeItemEdit} ctx={ctx} />
</div>
})}
</>
@@ -740,6 +741,26 @@ function getDefault(type: McdocType, range: core.Range, ctx: McdocContext): Json
return { type: 'json:null', range }
}
function getCategory(type: McdocType) {
if (type.kind === 'reference' && type.path) {
switch (type.path) {
case '::java::data::loot::LootPool':
case '::java::data::worldgen::surface_rule::SurfaceRule':
case '::java::data::worldgen::template_pool::WeightedElement':
return 'pool'
case '::java::data::loot::LootCondition':
case '::java::data::worldgen::dimension::biome_source::BiomeSource':
case '::java::data::worldgen::processor_list::ProcessorRule':
return 'predicate'
case '::java::data::loot::LootFunction':
case '::java::data::worldgen::density_function::CubicSpline':
case '::java::data::worldgen::processor_list::Processor':
return 'function'
}
}
return undefined
}
function simplifyType(type: McdocType, ctx: McdocContext): SimplifiedMcdocType {
const node: SimplifyValueNode<any> = {
entryNode: {

30
src/styles/nodes.css
View File

@@ -388,9 +388,7 @@ button.move:disabled {
border-left: none;
}
.node-body > .object-node[data-category],
.node-body > .list-node[data-category],
.node-body > .map-node[data-category] {
.node-body > .node[data-category] {
width: 100%;
min-width: max-content;
padding: 5px;
@@ -399,16 +397,14 @@ button.move:disabled {
border-radius: 3px;
}
.node-body > .object-node[data-category] > .node-header > .node-icon:first-child + *,
.node-body > .object-node[data-category] > .node-header > *:first-child {
.node-body > .node[data-category] > .node-header > .node-icon:first-child + *,
.node-body > .node[data-category] > .node-header > *:first-child {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
border-left: none;
}
.node-body > .object-node[data-category] > .node-body,
.node-body > .list-node[data-category] > .node-body,
.node-body > .map-node[data-category] > .node-body {
.node-body > .node[data-category] > .node-body {
border: none;
}
@@ -429,64 +425,52 @@ button.move:disabled {
/* Color categories */
[data-category=predicate] > .node-header > label,
[data-category=predicate].node-header > label,
[data-category=predicate] > .node-body > .node > .node-header > label {
background-color: var(--category-predicate);
}
[data-category=predicate] > .node-body,
[data-category=predicate] > .node-header > label,
[data-category=predicate].node-header > label,
[data-category=predicate] > .node-header > *:not(.selected),
[data-category=predicate] > .node-body > .node > .node-header > *:not(.selected) {
border-color: var(--category-predicate-border);
}
.node-body > .node.object-node[data-category=predicate],
.node-body > .node.list-node[data-category=predicate],
.node-body > .node.map-node[data-category=predicate] {
.node-body > .node[data-category=predicate] {
background-color: var(--category-predicate-background);
border-color: var(--category-predicate-border);
}
[data-category=function] > .node-header > label,
[data-category=function].node-header > label,
[data-category=function] > .node-body > .node > .node-header > label {
background-color: var(--category-function);
}
[data-category=function] > .node-body,
[data-category=function] > .node-header > label,
[data-category=function].node-header > label,
[data-category=function] > .node-header > *:not(.selected),
[data-category=function] > .node-body > .node > .node-header > *:not(.selected) {
border-color: var(--category-function-border);
}
.node-body > .node.object-node[data-category=function],
.node-body > .node.list-node[data-category=function],
.node-body > .node.map-node[data-category=function] {
.node-body > .node[data-category=function] {
background-color: var(--category-function-background);
border-color: var(--category-function-border);
}
[data-category=pool] > .node-header > label,
[data-category=pool].node-header > label,
[data-category=pool] > .node-body > .node > .node-header > label {
background-color: var(--category-pool);
}
[data-category=pool] > .node-body,
[data-category=pool] > .node-header > label,
[data-category=pool].node-header > label,
[data-category=pool] > .node-header > *:not(.selected),
[data-category=pool] > .node-body > .node > .node-header > *:not(.selected) {
border-color: var(--category-pool-border);
}
.node-body > .node.object-node[data-category=pool],
.node-body > .node.list-node[data-category=pool],
.node-body > .node.map-node[data-category=pool] {
.node-body > .node[data-category=pool] {
background-color: var(--category-pool-background);
border-color: var(--category-pool-border);
}