Fix FlexWrapper Component

Description

Our current implementation for the FlexWrapper component needs to be fixed. We've set it up now as (condensed):

const StyledFlexWrapper = styled.div`
...
`

const FlexWrapper = () => (
  <StyledFlexWrapper>
    {children}
  </StyledFlexWrapper>
)

So the rules we're trying to add only get applied to the FlexWrapper itself, which is a kind of transient component that doesn't actually get rendered; instead we just get the underlying StyledFlexWrapper styles without any of these changes.

We should modify this component to just directly export the styled.div instead of adding the additional transient component.

Additional Information

We should make sure to update our mark-one package in makerspace after making this fix.

Previously discussed here