sebse/node-factorio-recipes
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Linting

Browse Source
This commit is contained in:
Sebastian Seedorf
2022-08-18 09:20:00 +02:00
parent 92b762bbd2
commit de95f57b18
60 changed files with 3450 additions and 994 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
components/visualize/NodeOverview/NodeOverview.module.css
View File

@@ -4,9 +4,9 @@
}
.tiny {
font-size: 0.5em;
margin-top: -1.6em;
}
font-size: 0.5em;
margin-top: -1.6em;
}
.small {
font-size: 0.8em;
@@ -15,4 +15,3 @@
.linkOut {
margin-inline-end: 0.5em;
}

64
components/visualize/NodeOverview/NodeOverview.tsx
View File

@@ -1,14 +1,13 @@
import {FC, HTMLProps} from "react";
import {GraphNode} from "../../shared/ProducingGraph/ProducingGraph";
import {EnrichedEntity, Recipe} from "../../../src/types";
import cx from "classnames";
import styles from "./NodeOverview.module.css";
import {RecipeSpan} from "../../home/Recipe/Recipe";
import Link from "next/link";
import {EntityIcon} from "../../home/EntityIcon/EntityIcon";
import { FC, HTMLProps } from 'react'
import { EnrichedEntity } from '../../../src/types'
import cx from 'classnames'
import styles from './NodeOverview.module.css'
import Link from 'next/link'
import { EntityIcon } from '../../home/EntityIcon/EntityIcon'
import { GraphNode } from '../../../src/graph-untangle/types'
export type OverviewGraphNode = GraphNode<{
icons: (EnrichedEntity|string)[]
icons: (EnrichedEntity | string)[]
linkOut: string
}>
@@ -16,21 +15,38 @@ interface Props extends HTMLProps<HTMLDivElement> {
node: OverviewGraphNode
}
export const NodeOverview: FC<Props> = ({node, className, ...props}) => {
return <div {...props} className={cx(className, styles.root)}>
<h3><span className={styles.linkOut}><Link href={node.linkOut}>🔗</Link></span>{node.name}</h3>
{ node.icons?.length ? <div className={styles.tiny}>
{node.icons.map((input) => <EntityIcon key={typeof input === "string" ? input : input.href} value={input} />)}
</div> : null }
<h4>Inputs</h4>
<div className={styles.small}>
{node.inputs.map((input) => <EntityIcon key={input} value={input} />)}
</div>
{node.outputs.length ? <>
<h4>Outputs</h4>
export const NodeOverview: FC<Props> = ({ node, className, ...props }) => {
return (
<div {...props} className={cx(className, styles.root)}>
<h3>
<span className={styles.linkOut}>
<Link href={node.linkOut}>🔗</Link>
</span>
{node.name}
</h3>
{node.icons?.length ? (
<div className={styles.tiny}>
{node.icons.map(input => (
<EntityIcon key={typeof input === 'string' ? input : input.href} value={input} />
))}
</div>
) : null}
<h4>Inputs</h4>
<div className={styles.small}>
{node.outputs.map((input) => <EntityIcon key={input} value={input} />)}
{node.inputs.map(input => (
<EntityIcon key={input} value={input} />
))}
</div>
</>: null}
</div>
{node.outputs.length ? (
<>
<h4>Outputs</h4>
<div className={styles.small}>
{node.outputs.map(input => (
<EntityIcon key={input} value={input} />
))}
</div>
</>
) : null}
</div>
)
}