HiVolda Styleguide

Important Message 

<div class="campus-wrapper">
    <header tabindex="-1" class="campus-header">
        <h1 class="campus-header__logo-heading">
            <a href="" class="campus-header__logo-link">
                <img src="/images/hivolda-logo-white.svg" alt="Hivolda logo" class="campus-header__logo">
            </a>
        </h1>

        <div class="campus-header__clock">12:39</div>
    </header>

    <main class="campus-wrapper__main">

        <!--
    To change color add modificator to the ".campus-important-message" block:
    .campus-important-message--green,
    .campus-important-message--orange,
    .campus-important-message--purple
    -->
        <div class="campus-important-message campus-important-message--purple">
            <p class="campus-important-message__text">This is the screen for displaying an important message to the campus students</p>
        </div>

    </main>
</div>
 
{% extends "@wrapper" %}
{% block main %}
    <!--
    To change color add modificator to the ".campus-important-message" block:
    .campus-important-message--green,
    .campus-important-message--orange,
    .campus-important-message--purple
    -->
    <div class="campus-important-message campus-important-message--purple">
        <p class="campus-important-message__text">This is the screen for displaying an important message to the campus students</p>
    </div>
{% endblock %}
 
/* No context defined. */

No notes defined.