Seems a bit overkill for this to have its own file. We might have a need for many simple components that are style only and do not require props or other react logic.

Also this is not consistently applied.

Container gets its own folder and index.js, but layout.js is just a file in the components directory?

Also other components with a directory have an index.js which defines the component logic and a styles.js which defines styled components, but here we have index.js defining the styled component.

• Move layout.js so that it has its own folder, layout, including index.js (no styled.js as it has no unshared styled-components)
• Create a new folder atoms or some name that makes sense to you and give it an index.js and a styles.js. Define all styled components that do not take props or use react logic in this file. In index.js, just import everything from styles.js and export it.

Then in the future, on a given webpage, you can just import {Container, Spacer, HorizontalLine, ... etc, other simple styled components} from 'components/atoms'

This should be in the new atoms folder