Resources List

There are multiple ways to display resources lists.

Links #

<div class="card pad-3">
    <div class="row">
        <div class="col col-12-md-down margin-b-md-down">
            <h3 class="display-4 purple">Study Abroad Resources</h3>
            <p>
                Nam dapibus nisl vitae elit fringilla rutrum.
                Aenean sollicitudi. Nam dapibus nisl vitae elit fringilla rutrum.
                Aenean sollicitudi.
            </p>
        </div>
        <div class="col">
            <ul class="quicklinks purple-anchors purple">
                <li><a>Geoblue Member Guide</a></li>
                <li><a>International Student Identification Card</a></li>
                <li><a>Passports and Visa</a></li>
                <li><a>Fusce vehicula dolor arcu, sit amet blandit dolor mollis nec. Donec viverra eleifend lacus, vitae ullamcorper metus. Sed soll.</a></li>
                <li><a>Passports and Visa</a></li>
            </ul>
        </div>
    </div>
</div>

Checkboxes #

<div class="card pad-3">
    <div class="row">
        <div class="col col-12-md-down margin-b-md-down">
            <h3 class="display-4 purple">Housing Options</h3>
            <p>
                Nam dapibus nisl vitae elit fringilla rutrum.
                Aenean sollicitudi. Nam dapibus nisl vitae elit fringilla rutrum.
                Aenean sollicitudi.
            </p>
        </div>
        <div class="col purple text-line-height-1">
            <div class="display-flex margin-1-b margin-r">
                <input
                    type="checkbox"
                    name="category"
                    value="news"
                    id="cat-1"
                    class="flex-none margin-0 margin-1-r"
                    checked
                >
                <label
                    class="display-inline-block"
                    for="cat-1"
                >Curabitur lobortis id lorem id bibendum. Ut id.</label>
            </div>
            <div class="display-flex margin-1-b margin-r">
                <input
                    type="checkbox"
                    name="category"
                    value="events"
                    id="cat-2"
                    class="flex-none margin-0 margin-1-r"
                >
                <label
                    class="display-inline-block"
                    for="cat-2"
                >In hac habitasse platea dictumst. Vivamus adip.</label>
            </div>
            <div class="display-flex margin-1-b margin-r">
                <input
                    type="checkbox"
                    name="category"
                    value="spotlight"
                    id="cat-3"
                    class="flex-none margin-0 margin-1-r"
                >
                <label
                    class="display-inline-block"
                    for="cat-3"
                >Donec facilisis tortor ut.</label>
            </div>
        </div>
    </div>
</div>