Arches: Virtual ACC

Arches:Virtual ACC

Multi Product Brand Style System by the American College of Cardiology

Source: dist/css/virtual_boot.css, line 11573

9.2.3.2 Whats Happening Next - Grid

At times between breaks of sessions the whats happening next will be a grid will show a whats happening next grid because there are no sessions playing.

Example

Default styling

Coming Soon

3652 Cardiovascular Update for the Clinician III Arrhythmia Cardiovascular Blood Vessel Electrocardiogram Electrocardiogram

Starting @ 11:15 a.m. EDT
Category:
  • Channel 1
  • Navigating Health Care Economics

3652 Cardiovascular Update for the Clinician III Chest Pain Valvular Heart Disease Pharmacologic Cardiovascular Electrocardiographic

Starting @ 11:15 a.m. EDT
Category:
  • Channel 1
  • Navigating Health Care Economics

3652 Cardiovascular Update for the Clinician III Clinical Valvular Heart Disease

Starting @ 11:15 a.m. EDT
Category:
  • Channel 1
  • Navigating Health Care Economics
Industry Session | Nonaccredited
<section class="">
    <h2 class="font_bold font_display c_primary-n1 m-b_4"><div class="flex_row:md flex flex_column">
    <div class="flex_auto grid">
        <span class="br-tl_radius br-t_2 br_solid br_inherit self_center"></span>
    </div>
    <div class="flex_auto flex_shrink p-x_4 lh_1 text_center">
        Coming Soon
    </div>
    <div class="flex_auto grid">
        <span class="br-tl_radius br-t_2 br_solid br_inherit self_center"></span>
    </div>
</div></h2>
    <div class="gap_5 grid columns_3:lg columns_2:md columns_1">
        <article class="relative isolation_isolate flex flex_column">
            <div class="bg_white br-t_3 br_radius br_secondary-2 br_solid c_black flex flex_auto flex_column font_0 gap_3 m-b_4 p-t_4 p_4 shadow_emboss-light t_n5 texture_light z_0">
            <header>
                <h3 class="font_display lh_2 c_secondary-n2 font_0 m_0">
                    <strong class="font_bold font-size_down-2 p-r_3 block uppercase c_black-6 m-t_n3">3652</strong>
                    <span class="font_display lh_2 c_secondary-n2 m_0 font-size_up-2">
                        Cardiovascular Update for the Clinician III Arrhythmia Cardiovascular Blood Vessel Electrocardiogram Electrocardiogram 
                    </span>
                </h3>
            </header>
            <div class="font_n1 font_ui c_accent-n1">Starting  @ 11:15 a.m. <abbr title="EASTERN TIME, UTC -4">EDT</abbr> </div>
            <div class="font_ui font_n3 uppercase c_black-6"><strong class="c_black-5 p-r_2">Category:</strong><ul class="ul_inline-comma">
          <li>Channel 1</li>
          <li>Navigating Health Care Economics</li>
        </ul></div>
            </div>
        </article>        <article class="relative isolation_isolate flex flex_column">
            <div class="bg_white br-t_3 br_radius br_secondary-2 br_solid c_black flex flex_auto flex_column font_0 gap_3 m-b_4 p-t_4 p_4 shadow_emboss-light t_n5 texture_light z_0">
            <header>
                <h3 class="font_display lh_2 c_secondary-n2 font_0 m_0">
                    <strong class="font_bold font-size_down-2 p-r_3 block uppercase c_black-6 m-t_n3">3652</strong>
                    <span class="font_display lh_2 c_secondary-n2 m_0 font-size_up-2">
                        Cardiovascular Update for the Clinician III Chest Pain Valvular Heart Disease Pharmacologic Cardiovascular Electrocardiographic 
                    </span>
                </h3>
            </header>
            <div class="font_n1 font_ui c_accent-n1">Starting  @ 11:15 a.m. <abbr title="EASTERN TIME, UTC -4">EDT</abbr> </div>
            <div class="font_ui font_n3 uppercase c_black-6"><strong class="c_black-5 p-r_2">Category:</strong><ul class="ul_inline-comma">
          <li>Channel 1</li>
          <li>Navigating Health Care Economics</li>
        </ul></div>
            </div>
        </article>        <article class="relative isolation_isolate flex flex_column">
            <div class="bg_white br-t_3 br_radius br_secondary-2 br_solid c_black flex flex_auto flex_column font_0 gap_3 m-b_4 p-t_4 p_4 shadow_emboss-light t_n5 texture_light z_0">
            <header>
                <h3 class="font_display lh_2 c_secondary-n2 font_0 m_0">
                    <strong class="font_bold font-size_down-2 p-r_3 block uppercase c_black-6 m-t_n3">3652</strong>
                    <span class="font_display lh_2 c_secondary-n2 m_0 font-size_up-2">
                        Cardiovascular Update for the Clinician III Clinical Valvular Heart Disease 
                    </span>
                </h3>
            </header>
            <div class="font_n1 font_ui c_accent-n1">Starting  @ 11:15 a.m. <abbr title="EASTERN TIME, UTC -4">EDT</abbr> </div>
            <div class="font_ui font_n3 uppercase c_black-6"><strong class="c_black-5 p-r_2">Category:</strong><ul class="ul_inline-comma">
          <li>Channel 1</li>
          <li>Navigating Health Care Economics</li>
        </ul></div>
            <div class="c_secondary-n1 m-t_auto font-size_down-2"> <strong class="font_xbold uppercase"><i class="fas fa-info-circle p-r_3"></i>Industry Session | Nonaccredited</strong></div>
            </div>
        </article>    </div>
</section>
Copy Code