styleguide.html

---
layout: default
---

<div class="w-2/3 m-auto content">
    <h1 class="heading-xlarge">Heading: Extra Large. Almost before we knew it, we had left the ground. </h1>

    <h2 class="heading-large">Heading: Large. Almost before we knew it, we had left the ground.</h2>

    <h3 class="heading-base">Heading Medium. Almost A shining crescent far beneath the flying vessel.</h3>

    <h4 class="heading-small">Heading Regular. Almost Waves flung themselves at the blue evening.</h4>

    <h5>H5. Almost Waves flung themselves at the blue evening.</h5>

    <h6>H6. Almost Waves flung themselves at the blue evening.</h6>

    <p>
        VIS 2019 will be the year’s premier forum for advances in <a href="#">theory</a>, <a href="#">methods</a>, and applications of visualization and visual analytics. The conference will convene an <a href="#">international community of researchers and practitioners</a> from universities, government, and industry to exchange recent findings on the design and use of <a href="#">visualization tools</a>.
    </p>

    <p>
        Additionally, IEEE VIS 2019 will feature a <em>separate, short papers track</em> with a submission deadline of <strong>June 13, 2019</strong> after notifications for full papers have been sent out. You can find out more in the call for participation for <a href="#">IEEE VIS Short Papers</a>.
        Additionally, IEEE VIS 2019 will feature a <em>separate, short papers track</em> with a submission deadline of <strong>June 13, 2019</strong> after notifications for full papers have been sent out. You can find out more in the call for participation
        for <a href="#">IEEE VIS Short Papers</a>.
    </p>

    <p>
        When preparing your submission, please make sure that you carefully read and adhere to the <a href="# " class="link ">paper submission guidelines</a>.
    </p>

    <p>
        <strong>Authors of accepted papers should also follow the <a href="# " class="link ">instructions for preparing a camera-ready submission</a>.</strong>
    </p>


    <a href="# " class="button ">Register</a>

    <a href="# " class="button button-secondary ">Learn More</a>

    <a href="# " class="button button-inverse ">Learn More</a>

    <ul>
        <li>IEEE Conference on Visual Analytics Science & Technology (VAST)</li>
        <li>IEEE Conference on Information Visualization (InfoVis)</li>
        <li>IEEE Conference on Scientific Visualization (SciVis)</li>
    </ul>
    <ul>
        <li>A normal list item</li>
        <li>Another nested list
            <ul>
                <li>A nested list item
                    <ul>
                        <li>A super nested item</li>
                        <li>A super nested item</li>
                    </ul>
                </li>
            </ul>
        </li>
    </ul>

    <ol>
        <li>First item</li>
        <li>Second item
            <ol>
                <li>A nested item</li>
                <li>Another nested item</li>
            </ol>
        </li>
        <li>Third item</li>
    </ol>

    <blockquote>
        Visualization research is better communicated and acted on if it is freely accessible to the research community, practitioners, and the general public. Therefore, all paper authors are encouraged to share their accepted paper in an open access repository before the print deadline in accordance with IEEE copyright regulations.
    </blockquote>

    <blockquote>
        Visualization research is better communicated and acted on if it is freely accessible to the research community, practitioners, and the general public.
        <blockquote>Therefore, all paper authors are encouraged to share their accepted paper in an open access repository before the print deadline in accordance with IEEE copyright regulations.</blockquote>
    </blockquote>

    <table>
        <thead>
            <tr>
                <th>Activity</th>
                <th>Deadline</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>Abstract submission (MANDATORY)</td>
                <td>Thursday, March 21, 2019</td>
            </tr>
            <tr>
                <td>Paper submission</td>
                <td>Sunday, March 31, 2019</td>
            </tr>
            <tr>
                <td>Notification of results of first review cycle</td>
                <td>Thursday, June 6, 2019</td>
            </tr>
            <tr>
                <td>Paper submission for second review cycle</td>
                <td>Monday, June 24, 2019</td>
            </tr>
            <tr>
                <td>Final notification</td>
                <td>Monday, July 8, 2019</td>
            </tr>
            <tr>
                <td>Camera-ready copy</td>
                <td>Thursday, August 1, 2019</td>
            </tr>
        </tbody>
    </table>

    <hr>
    <hr>

    {% include card.html
        title="Card Heading"
        description="This is a little card that shares a little bit of information about what's going on."
        button_text="Button"
        button_url="as" %}

    <div class="md:flex items-center mb-4 px-6 py-4 border border-primary border-l-8 rounded-sm bg-primary-100 ">
        <div class="mb-4 md:mb-0 md:mr-4 ">
            <p class="heading-base mb-0 ">Final Instructions for Authors of Accepted Papers</p>
            <p class="text-primary mb-0 ">Important information for the remainder of the process until the conference.</p>
        </div>
        <div>
            <a href="# " class="button ">
            Instructions
        </a>
        </div>
    </div>

</div>

<script type="text/javascript ">
    function showNav(e) {
        const current = e.target;
        const currentNavItem = current.dataset.nav;
        const allNavItems = document.querySelectorAll('[data-nav]');
        console.log(current);
        console.log(currentNavItem)
        console.log(allNavItems)

        for (let elem of allNavItems) {
            if (elem.dataset.nav == currentNavItem) {
                if (elem.classList.contains('submenu')) {
                    if (elem.classList.contains('hidden')) {
                        elem.classList.remove('hidden');
                        elem.classList.add('active');
                        elem.setAttribute('aria-hidden', 'false');
                    }
                    else {
                        elem.classList.add('hidden');
                        elem.classList.remove('active');
                        elem.setAttribute('aria-hidden', 'true');
                    }
                }
            }
        }
    }

</script>