Source: dist/css/journal_boot.css, line 15920
6.1.3 Nav Dropdown with Alternate Content in Links
It is easy to add images in replace of text links in the navs.
This is currently being depreciated. Please visited the new location for the styleguide at https://assets.acc.org/Arches/Latest/docs/
Source: dist/css/journal_boot.css, line 15920
It is easy to add images in replace of text links in the navs.
<nav class="navbar navbar-primary navbar-expand-lg navbar-dark bg_acc font_1">
<button
class="br_white-2 is-active_toggle-function m-l_n2 m-y_3 navbar-toggler p-l_2 p-r_3 p-y_2 collapsed"
type="button"
data-toggle="collapse"
data-target="#navbarSupportedContent"
aria-controls="navbarSupportedContent"
aria-expanded="false"
aria-label="Toggle navigation"
>
<i class="icon-toggle_bars-times fas a:c_acc-2 c_white"></i><span class="a:c_acc-2 c_white"> Menu</span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav">
<li class="nav-item dropdown">
<a
class="nav-link dropdown-toggle is-active_toggle-function"
href="#"
id="toolDropdown"
role="button"
data-toggle="dropdown"
aria-haspopup="true"
aria-expanded="false"
><i class="far faw icon-toggle_plus-minus display_none:lg m-l_n2 m-r_2"></i>Tools & Practice Support
</a>
<div class="dropdown-menu m-x_0:lg m-x_n4 m-t_0 m-t_2:lg" aria-labelledby="toolDropdown">
<div class="flex flex_column flex_row:md p-x_2:lg m-x_n1 m-x_0:lg">
<div class="flex_auto p-x_2 p-y_0 p-y_3:md order_2 order_1:md">
<ul class="ul_none">
<li class="relative m-x_2:md m-x_4">
<a
href="http://cvquality.acc.org/?_ga=2.33577825.159963902.1562853382-843642371.1562007133"
target="_blank"
class="expanded-click-area transition_1 h:opacity opacity_8"
><img
src="https://www.acc.org/~/media/Non-Clinical/Images/External%20Site%20Logos/ACC_QII_logo.png"
alt="QII"
/></a>
</li>
<li class="relative m-x_2:md m-x_4">
<a href="http://cvquality.acc.org/NCDR-Home.aspx?_ga=2.91395290.159963902.1562853382-843642371.1562007133" target="_blank" class="expanded-click-area transition_1 h:opacity opacity_8"><img src="https://www.acc.org/~/media/Non-Clinical/Images/External Site Logos/ACC_NCDR_logo.png" alt="NCDR"></a>
</li>
</ul>
</div>
<div
class="flex_auto p-x_2 p-y_0 p-y_3:md br-l_1 br_none br_shade-4 br_solid:lg br_solid:md order_1 order_2:md"
>
<ul class="ul_none">
<li>
<a class="dropdown-item transition_4 wrap nowrap:lg" href="/tools-and-practice-support/advocacy-at-the-acc">Advocacy at the ACC</a>
<ul class="ul_none font_n1 lh_3">
<li class="text-indent_1">
<a class="dropdown-item transition_4 wrap nowrap:lg" href="/tools-and-practice-support/advocacy-at-the-acc/advocacy-action"
>Advocacy Action</a
>
</li>
<li class="text-indent_1">
<a class="dropdown-item transition_4 wrap nowrap:lg"
href="/tools-and-practice-support/advocacy-at-the-acc/health-policy-issue-center/alternative-payment-model-framework"
>Alternative Payment Model Framework</a
>
</li>
<li class="text-indent_1">
<a class="dropdown-item transition_4 wrap nowrap:lg"
href="/tools-and-practice-support/advocacy-at-the-acc/acc-legislative-conference"
>Legislative Conference</a
>
</li>
<li class="text-indent_1">
<a class="dropdown-item transition_4 wrap nowrap:lg" href="http://www.acc.org/macra/index.html" target="_blank"
>MACRA/QPP Hub</a
>
</li>
<li class="text-indent_1">
<a class="dropdown-item transition_4 wrap nowrap:lg"
href="/tools-and-practice-support/advocacy-at-the-acc/acc-political-action-committee"
>ACC Political Action Committee</a
>
</li>
</ul>
</li>
<li>
<a class="dropdown-item transition_4 wrap nowrap:lg" href="http://www.healthecareers.com/acc" class="new-window-icon" target="_blank"
>Cardiology Careers</a
>
</li>
<li>
<a class="dropdown-item transition_4 wrap nowrap:lg" href="/tools-and-practice-support/clinical-toolkits">Clinical Toolkits</a>
</li>
<li>
<a class="dropdown-item transition_4 wrap nowrap:lg" href="/tools-and-practice-support/expert-consensus-decision-pathways"
>Expert Consensus Decision Pathways</a
>
</li>
<li>
<a class="dropdown-item transition_4 wrap nowrap:lg" href="/tools-and-practice-support/infographics">Infographics</a>
</li>
<li>
<a class="dropdown-item transition_4 wrap nowrap:lg" href="/tools-and-practice-support/mobile-resources">Mobile Apps</a>
</li>
<li>
<a class="dropdown-item transition_4 wrap nowrap:lg" href="/tools-and-practice-support/quality-programs">Quality Programs</a>
</li>
</ul>
</div>
</div>
</div>
</li>
</ul>
</div>
</nav>