The logo for the site component provides an easy way to add logos to your page and website.
The breakpoint is a feature that gives multiple logo options available depending on the platform the website is being viewed in. Tablet, desktop, and phone.
Setup procedure:
- Search and add "Logo for the site" from the components in the Design panel
- Click on the component and Toggle additional options > Modify the logo

- On the Logo tab, Scroll down and you'll see the multiple logo choices depending on the platform, this is the breakpoint mentioned above
- Click "Select an image"
- Add in the top left corner

- Once the file is added, find it in the list and click on it
- Scroll back up, Save & generate
- Lastly to toggle the different display option, back out and click on the component's Toggle additional options > Logo configuration
- In the Logo type field, check the box next to the platforms you'd like enabled
- Save & generate!