Mirage: BGA styles

4.18 components.wireframe Wireframe

Toggle example guides Toggle HTML markup

Add wireframes around main layout elements. Wireframes are useful when prototyping a website.

This design is not applied to the site unless you set the following Sass variable: $with-wireframes: true;

Example
An item inside a wireframe.
Markup: components/wireframe/wireframe.twig
<span class="xml"><span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">"wireframe"</span>&gt;</span>
  </span><span class="hljs-template-variable">{{content}}</span><span class="xml">
<span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>
</span>
Source: components/wireframe/_wireframe.scss, line 3