<aside>
🔖
Summary
Root
[·] Instructions
→ Licences
→ Changelog
</aside>
Design+Code by Specimen©
specimen.studio
Fluid Design and Responsiveness
This template uses a fluid design based on the body font size, ensuring a perfect and consistent experience across all devices.
<aside>
💡 What this means: The site is fully responsive, automatically adjusting to any screen size for a seamless user experience.
</aside>
Key Guidelines:
- Do not change the body font size.
- To modify the size of text elements, use the tags specified in the Styleguide, such as Paragraph, Paragraph Accent, or Big Headline.
- For adjusting padding, margins, or typography size, prefer using the "em" unit to maintain consistent proportions across the website.
- Use "px" for small elements or those that should not scale across different viewports (e.g., fixed-size paragraphs).
- "em" units help ensure your design is automatically responsive. However, for complex layouts, especially on vertical screens, double-check the responsiveness.
- For consistent horizontal padding, use the "Is Padding" tag.
- The website uses a 12-column grid. Feel free to use column classes for your layouts as needed. More details are available in the Styleguide utility tab.
Preloader
Edit
To edit the preloader, follow this steps:
- Double-click the Preloader component (green symbol).
- Select the Preloader Wrapper element and set its display to
block
.
- Make your edits.