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

9.5 On Demand

After the completion of a video the Sessions are broken down to the individual presentations and stored in the On Demand Area for viewing.

Sub.Credits.Dots - Credit Dots Sub.FacultyList.SessionAndPresentation - Session & Presentation Faculty List Sub.PlayingDateTime - Playing Date Time Sub.ActionButtons.OnDemand - Action Buttons Sub.CategoryFlags - Category Flags

Sub Components in Design:

Data.Presentation.Title - Presentation Title Data.Session.Title - Session Title Data.Session.ID - Session ID

Data Elements:

Example

Default styling

Navigating Health Care Economics
Category Tag

3652 Cardiovascular Update for the Clinician III

New York Cardiovascular Symposium 2021 Welcome Video and Introduction of Session and Faculty

Saturday, Nov. 20, 2021 @ 11:15 a.m. – 11:15 a.m. EDT

Session Role Type 1:
Pepper H. Soda III, MD, FACC ( New York, NY, USA)
Session Role Type 2:
Dianna Denesik III ( New York, NY, USA)
Miguel Romaguera ( New York, NY, USA)
Jeanette Franecki ( New York, NY, USA)
Role Type 1:
Pepper H. Soda III, MD, FACC ( New York, NY, USA)
Role Type 2:
Dianna Denesik III ( New York, NY, USA)
Miguel Romaguera ( New York, NY, USA)
Jeanette Franecki ( New York, NY, USA)

CME
CNE
COP
MOCII

<article class="c_black font_0 m-b_4 br-t_3 br_solid br_primary-2 br_radius isolation_isolate shadow_overlap-light bg_white">
    <div class="br_1 br-b_0 br-tr_radius br-tl_radius br_solid br_black-3 flex flex_column font_ui m-t_n2 relative">
        <div class="br-b_1 br_solid br_primary-2">
            <div class="font_n3 p_2 uppercase bg_primary-2 p-x_4 m-x_4 inline-block br-br_radius br-bl_radius c_white font_bold self_start ">
              <ul class="ul_inline-pipe">
                <li>Navigating Health Care Economics</li>
                <li>Category Tag</li>
              </ul>
            </div>            <div class="p_4 p-b_2 flex flex_column flex_row:lg gap-x_4 gap-x_5:lg">
                <header>
                    <h2 class="font_n1 uppercase c_black-7">
                        <strong class="font_bold p-r_2">3652</strong> Cardiovascular Update for the Clinician III
                    </h2>
                    <h3 class="font_display m-b_3 lh_2 c_primary-n2 font_2 p-r_4:lg">
                        <span class="block font-size_up-1 font_display lh_1">
                            New York Cardiovascular Symposium 2021 Welcome Video and Introduction of Session and Faculty                        </span>
                    </h3>
                </header>
                <div class="flex_grow m-x_auto m-l_auto:lg m-r_0:lg w_100 max-w_20:md">
                    <aside class="flex flex_none flex_column gap-y_3 m-x_auto:md  max-w_30:md p-b_4 p-b_4:md w_100">
                          <nav aria-label="session actions" class="flex flex_none flex_row gap-x_2 gap-y_3 justify_between">
                            <a href="#" aria-label="mark as favorite" class="btn btn-secondary flex_none a:bg_alert-n2  h:bg_alert-n4 flex_none  grid items_center text_center [active]" ><i class="fas fa-heart"></i></a>        <a href="#" aria-label="navigate to" class="btn btn-primary flex_auto">Watch</a>
                          </nav>
                          <a href="#" aria-label="download attachments"  class="br_radius btn btn-outline-secondary btn-sm flex_auto font-size_down-1 w_100"><i class="far fa-paperclip"></i> Attachments</a>
                    </aside>                </div>
            </div>
            <div>
            <div class="p-x_4 p-b_4 flex flex_column font_0 font_copy">
                 <div class="font_medium m-b_3"><span class="c_accent-n2">Saturday, Nov. 20, 2021  @ 11:15 a.m. – 11:15 a.m. <abbr title="EASTERN TIME, UTC -4">EDT</abbr></span></div>
                 <div class="font-size_down-1"><ul class="ul_inline-semicolon font_regular font_copy">
  <li class="no-after font_medium c_primary-n1 inline">Session Role Type 1:</li>
  <li>Pepper H. Soda III, MD, FACC <span class="opacity_9 font_light m-l_2">( New York, NY, USA)<span></li>
  <li class="no-after font_medium c_primary-n1  inline">Session Role Type 2:</li>
  <li>Dianna Denesik III <span class="opacity_9 font_light m-l_2">( New York, NY, USA)<span></li>
  <li>Miguel Romaguera <span class="opacity_9 font_light m-l_2">( New York, NY, USA)<span></li>
  <li>Jeanette Franecki <span class="opacity_9 font_light m-l_2">( New York, NY, USA)<span></li>
    <li class="no-after font_medium c_primary-n1 inline">Role Type 1:</li>
  <li>Pepper H. Soda III, MD, FACC <span class="opacity_9 font_light m-l_2">( New York, NY, USA)<span></li>
  <li class="no-after font_medium c_primary-n1  inline">Role Type 2:</li>
  <li>Dianna Denesik III <span class="opacity_9 font_light m-l_2">( New York, NY, USA)<span></li>
  <li>Miguel Romaguera <span class="opacity_9 font_light m-l_2">( New York, NY, USA)<span></li>
  <li>Jeanette Franecki <span class="opacity_9 font_light m-l_2">( New York, NY, USA)<span></li>
</ul></div>
            </div>
            </div>
        </div>
    </div>
    <div class="c_black flex flex_wrap font_n3 justify_start p_3 br-br_radius br-bl_radius bg_black-2 br_solid br_1 br-t_0 br_black-3">
        <div class="flex_grow uppercase m-l_auto">
            <ul class=" gap-x_3 gap-y_3 justify_end:md justify_start self_center ul_inline-pipe uppercase">
              <li class="inline-flex items_center lh_0">
                  <span class="bg_CME br_1 br_black-3 br_circle br_solid  m-r_2" style=" height: 1em; width: 1em;"></span> CME
              </li>  <li class="inline-flex items_center lh_0">
                  <span class="bg_CNE br_1 br_black-3 br_circle br_solid  m-r_2" style=" height: 1em; width: 1em;"></span> CNE
              </li>  <li class="inline-flex items_center lh_0">
                  <span class="bg_COP br_1 br_black-3 br_circle br_solid  m-r_2" style=" height: 1em; width: 1em;"></span> COP
              </li>  <li class="inline-flex items_center lh_0">
                  <span class="bg_MOCII br_1 br_black-3 br_circle br_solid  m-r_2" style=" height: 1em; width: 1em;"></span> MOCII
              </li></ul>        </div>
    </div>
</article>

<article class="c_black font_0 m-b_4 br-t_3 br_solid br_primary-2 br_radius isolation_isolate shadow_overlap-light bg_white">
    <div class="br_1 br-b_0 br-tr_radius br-tl_radius br_solid br_black-3 flex flex_column font_ui m-t_n2 relative">
        <div class="br-b_1 br_solid br_primary-2">
            <div class="font_n3 p_2 uppercase bg_primary-2 p-x_4 m-x_4 inline-block br-br_radius br-bl_radius c_white font_bold self_start ">
              <ul class="ul_inline-pipe">
                <li>Navigating Health Care Economics</li>
                <li>Category Tag</li>
              </ul>
            </div>            <div class="p_4 p-b_2 flex flex_column flex_row:lg gap-x_4 gap-x_5:lg">
                <header>
                    <h2 class="font_n1 uppercase c_black-7">
                        <strong class="font_bold p-r_2">3652</strong> Cardiovascular Update for the Clinician III
                    </h2>
                    <h3 class="font_display m-b_3 lh_2 c_primary-n2 font_2 p-r_4:lg">
                        <span class="block font-size_up-1 font_display lh_1">
                            New York Cardiovascular Symposium 2021 Welcome Video and Introduction of Session and Faculty                        </span>
                    </h3>
                </header>
                <div class="flex_grow m-x_auto m-l_auto:lg m-r_0:lg w_100 max-w_20:md">
                    <aside class="flex flex_none flex_column gap-y_3 m-x_auto:md  max-w_30:md p-b_4 p-b_4:md w_100">
                          <nav aria-label="session actions" class="flex flex_none flex_row gap-x_2 gap-y_3 justify_between">
                            <a href="#" aria-label="mark as favorite" class="btn btn-secondary flex_none a:bg_alert-n2  h:bg_alert-n4 flex_none  grid items_center text_center [active]" ><i class="fas fa-heart"></i></a>        <a href="#" aria-label="navigate to" class="btn btn-primary flex_auto">Watch</a>
                          </nav>
                          <a href="#" aria-label="download attachments"  class="br_radius btn btn-outline-secondary btn-sm flex_auto font-size_down-1 w_100"><i class="far fa-paperclip"></i> Attachments</a>
                    </aside>                </div>
            </div>
            <div>
            <div class="p-x_4 p-b_4 flex flex_column font_0 font_copy">
                 <div class="font_medium m-b_3"><span class="c_accent-n2">Saturday, Nov. 20, 2021  @ 11:15 a.m. – 11:15 a.m. <abbr title="EASTERN TIME, UTC -4">EDT</abbr></span></div>
                 <div class="font-size_down-1"><ul class="ul_inline-semicolon font_regular font_copy">
  <li class="no-after font_medium c_primary-n1 inline">Session Role Type 1:</li>
  <li>Pepper H. Soda III, MD, FACC <span class="opacity_9 font_light m-l_2">( New York, NY, USA)<span></li>
  <li class="no-after font_medium c_primary-n1  inline">Session Role Type 2:</li>
  <li>Dianna Denesik III <span class="opacity_9 font_light m-l_2">( New York, NY, USA)<span></li>
  <li>Miguel Romaguera <span class="opacity_9 font_light m-l_2">( New York, NY, USA)<span></li>
  <li>Jeanette Franecki <span class="opacity_9 font_light m-l_2">( New York, NY, USA)<span></li>
    <li class="no-after font_medium c_primary-n1 inline">Role Type 1:</li>
  <li>Pepper H. Soda III, MD, FACC <span class="opacity_9 font_light m-l_2">( New York, NY, USA)<span></li>
  <li class="no-after font_medium c_primary-n1  inline">Role Type 2:</li>
  <li>Dianna Denesik III <span class="opacity_9 font_light m-l_2">( New York, NY, USA)<span></li>
  <li>Miguel Romaguera <span class="opacity_9 font_light m-l_2">( New York, NY, USA)<span></li>
  <li>Jeanette Franecki <span class="opacity_9 font_light m-l_2">( New York, NY, USA)<span></li>
</ul></div>
            </div>
            </div>
        </div>
    </div>
    <div class="c_black flex flex_wrap font_n3 justify_start p_3 br-br_radius br-bl_radius bg_black-2 br_solid br_1 br-t_0 br_black-3">
        <div class="flex_grow uppercase m-l_auto">
            <ul class=" gap-x_3 gap-y_3 justify_end:md justify_start self_center ul_inline-pipe uppercase">
              <li class="inline-flex items_center lh_0">
                  <span class="bg_CME br_1 br_black-3 br_circle br_solid  m-r_2" style=" height: 1em; width: 1em;"></span> CME
              </li>  <li class="inline-flex items_center lh_0">
                  <span class="bg_CNE br_1 br_black-3 br_circle br_solid  m-r_2" style=" height: 1em; width: 1em;"></span> CNE
              </li>  <li class="inline-flex items_center lh_0">
                  <span class="bg_COP br_1 br_black-3 br_circle br_solid  m-r_2" style=" height: 1em; width: 1em;"></span> COP
              </li>  <li class="inline-flex items_center lh_0">
                  <span class="bg_MOCII br_1 br_black-3 br_circle br_solid  m-r_2" style=" height: 1em; width: 1em;"></span> MOCII
              </li></ul>        </div>
    </div>
</article>

Code Sample

Copy Code

Arches: Virtual ACC

Arches:Virtual ACC