Vitro Overrides#

Vitro lets you overrides parts of the vitro ui to let you add more customization

You can create a file called vitro-overrides.jsx and export some components to override specific parts of the Vitro UI

These customizations will be applied only to stories children of the vitro-overrides.jsx directory

Wrapper#

You can change the stories wrapper exporting a wrapper component

This will be applied before the wrapper exported from the stories file default export

jsx
1
// vitro-overrides.jsx
2
import React from 'react'
3
4
export function Wrapper({ children, isisDark, isFullScreen, }) {
5
    return <div style={{ textAlign: 'center' }}>{children}</div>
6
}