diff --git a/taccsite_cms/static/site_cms/css/src/_imports/trumps/for-docs.header.css b/taccsite_cms/static/site_cms/css/src/_imports/trumps/for-docs.header.css index 7dc93fde4..1c670cb08 100644 --- a/taccsite_cms/static/site_cms/css/src/_imports/trumps/for-docs.header.css +++ b/taccsite_cms/static/site_cms/css/src/_imports/trumps/for-docs.header.css @@ -46,3 +46,14 @@ Styleguide Trumps.ForOtherSites.Docs :--for-docs .c-branding img { max-width: unset; } + + + +/* Overwrite TACC (for Icons in Body) */ + +/* To compensate for Docs using an `.icon` class different from CMS & Portal */ +:--for-docs .icon { + width: unset; + height: unset; + vertical-align: unset; +} diff --git a/taccsite_cms/static/site_cms/css/src/_imports/trumps/s-header.css b/taccsite_cms/static/site_cms/css/src/_imports/trumps/s-header.css index 8e6df1922..288c4aecc 100644 --- a/taccsite_cms/static/site_cms/css/src/_imports/trumps/s-header.css +++ b/taccsite_cms/static/site_cms/css/src/_imports/trumps/s-header.css @@ -215,7 +215,8 @@ Styleguide Trumps.Scopes.Header } /* To overwrite Bootstrap */ .s-header .navbar-toggler-icon { display: none; } -/* To apply icon styles without using a class in the markup */ +/* To swap Bootstrap icon for Cortal icon */ +/* HACK: To apply icon styles without using a class in the markup */ /* FAQ: For dynamic markup change, Portal & Docs markup must be updated */ /* SEE: https://getbootstrap.com/docs/4.0/components/collapse/#events */ .s-header :--navbar-button { @extend [class*=" icon-"]; } @@ -422,11 +423,3 @@ Styleguide Trumps.Scopes.Header .s-header .dropdown-item .nav-icon { margin-right: 0.5em; } - -/* To overwrite Font Awesome & style via Font Awesome */ -/* FP-636: Remove all `.fa` (Font Awesome) icons */ -.s-portal-nav .nav-link .nav-icon[class*="fa"] { - font-size: 26px; - line-height: unset; - vertical-align: unset; -} diff --git a/taccsite_cms/static/site_cms/css/src/_imports/trumps/s-portal-nav.css b/taccsite_cms/static/site_cms/css/src/_imports/trumps/s-portal-nav.css index 32f60eaef..2dc55e776 100644 --- a/taccsite_cms/static/site_cms/css/src/_imports/trumps/s-portal-nav.css +++ b/taccsite_cms/static/site_cms/css/src/_imports/trumps/s-portal-nav.css @@ -10,17 +10,15 @@ Markup: s-portal-nav.html Styleguide Trumps.Scopes.PortalNav */ -/* To distinguish/highlight Portal nav from CMS nav */ +/* To distinguish Portal nav from CMS nav */ +/* To overwrite `.s-header` */ .s-portal-nav { background-color: env(--header-portal-nav-bkgd-color); } - .s-portal-nav .nav-link { /* To overwrite `.s-header .nav-link:…` etcetera */ border-bottom-color: transparent !important; } - -/* To overwrite `.s-header .navbar-nav .nav-link, […]` */ .s-portal-nav .nav-item .nav-link, :--for-portal .s-portal-nav .nav-item .nav-link { padding-left: 30px; @@ -28,3 +26,19 @@ Styleguide Trumps.Scopes.PortalNav env(--portal-sidebar-padding) + env(--portal-navlink-padding) ); } + +.s-portal-nav .dropdown-toggle .nav-icon { + font-size: 26px; +} + +/* To swap Font Awesome icons for Cortal icons */ +/* HACK: To apply icon styles without using a class in the markup */ +/* NOTE: So I can deploy new header and not require edit to Portal nor Docs */ +/* FP-526: Use Cortal Icons for header (then remove these styles) */ +.s-portal-nav [class*="fa"] { @extend [class*=" icon-"]; } +.s-portal-nav [class*="fa"] { @extend .icon; } +.s-portal-nav .dropdown-toggle .fa-user-circle { @extend .icon-user; } +.s-portal-nav .fa-desktop { @extend .icon-dashboard; } +.s-portal-nav .fa-tasks { @extend .icon-approved-boxed; } +.s-portal-nav .fa-user-circle { @extend .icon-gear; } +.s-portal-nav .fa-sign-out-alt { @extend .icon-user; } diff --git a/taccsite_cms/static/site_cms/css/src/_imports/trumps/s-portal-nav.html b/taccsite_cms/static/site_cms/css/src/_imports/trumps/s-portal-nav.html index 2f964c13a..11072314c 100644 --- a/taccsite_cms/static/site_cms/css/src/_imports/trumps/s-portal-nav.html +++ b/taccsite_cms/static/site_cms/css/src/_imports/trumps/s-portal-nav.html @@ -1,42 +1,36 @@