0d8a2d5ca0
* update to eslint 6.8.0 and related packages * Fixes for no-prototype-builtins * Updates for explicit-function-return-type * Add ignores for no-explicit-any * update to eslint 6.8.0 and related packages * Fixes for no-prototype-builtins * Updates for explicit-function-return-type * Add ignores for no-explicit-any * package: activate eslint-config-standard * apply updated eslint configuration * lint: apply eslint feedback after rebase * Update lockfile * Update lockfile * Restore missing deps * Update lockfile * Re-add eslint-plugin-node * Add eslint-plugin-standard and eslint-plugin-react-hooks * Clean lint Co-authored-by: Paul Melnikow <github@paulmelnikow.com>
47 lines
855 B
TypeScript
47 lines
855 B
TypeScript
import React from 'react'
|
|
import styled from 'styled-components'
|
|
|
|
const BuilderOuterContainer = styled.div`
|
|
margin-top: 10px;
|
|
margin-bottom: 10px;
|
|
`
|
|
|
|
// The inner container is inline-block so that its width matches its columns.
|
|
const BuilderInnerContainer = styled.div`
|
|
display: inline-block;
|
|
|
|
padding: 1px 14px 10px;
|
|
|
|
border-radius: 4px;
|
|
background: #eef;
|
|
`
|
|
|
|
export function BuilderContainer({
|
|
children,
|
|
}: {
|
|
children: JSX.Element[] | JSX.Element
|
|
}): JSX.Element {
|
|
return (
|
|
<BuilderOuterContainer>
|
|
<BuilderInnerContainer>{children}</BuilderInnerContainer>
|
|
</BuilderOuterContainer>
|
|
)
|
|
}
|
|
|
|
const labelFont = `
|
|
font-family: system-ui;
|
|
font-size: 11px;
|
|
`
|
|
|
|
export const BuilderLabel = styled.label`
|
|
${labelFont}
|
|
|
|
text-transform: lowercase;
|
|
`
|
|
|
|
export const BuilderCaption = styled.span`
|
|
${labelFont}
|
|
|
|
color: #999;
|
|
`
|