No notes defined.

<dl>
    <dt>Wide Vector Logo</dt>
    <dd>
        <nav id="s-header" class="s-header navbar navbar-expand-lg navbar-dark">
            <a class="navbar-brand" href="/">
                <img src="https://cdn.jsdelivr.net/gh/TACC/Core-CMS-Custom@21da26d/digitalrocks_assets/NSF-DigitalRocks-Logo-White.svg" alt="Vector Logo" class="portal-logo" />
            </a>
            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarExpandTarget-wide-vector" aria-controls="navbarExpandTarget-wide-vector" aria-expanded="false" aria-label="Toggle navigation">
                <span class="navbar-toggler-icon"></span>
            </button>

            <div class="collapse navbar-collapse" id="navbarExpandTarget-wide-vector">
                <!-- FAQ:

This is the markup of the #s-header, as of 2020-03-11,
from https://frontera-portal.tacc.utexas.edu/. It has:

- Bootstrap class names
- extra markup (`a > span`)
-->
                <ul class="s-cms-nav navbar-nav mr-auto">
                    <li class="nav-item">
                        <a class="nav-link" href="/user-guide/"><span>User Guide</span></a>
                    </li>

                    <li class="nav-item">
                        <a class="nav-link" href="/news/"><span>News</span></a>
                    </li>

                    <li class="nav-item">
                        <a class="nav-link" href="/about/"><span>About</span></a>
                    </li>

                    <li class="nav-item">
                        <a class="nav-link" href="/help/"><span>Help</span></a>
                    </li>
                </ul>
                <!-- FAQ:

This is the markup of the #s-header, as of 2021-06,
from https://frontera-portal.tacc.utexas.edu/. It has:

- Bootstrap class names
- Bootstrap attributes
-->
                <ul class="s-portal-nav navbar-nav">
                    <!-- When user is not logged in, there are zero dropdown(-*) classes -->
                    <li class="nav-item dropdown">
                        <a class="nav-link dropdown-toggle" href="#" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                            <i class="icon icon-user"></i>
                            <span>username</span>
                            <span class="sr-only">Toggle Dropdown</span>
                        </a>
                        <nav class="dropdown-menu dropdown-menu-right">
                            <a class="dropdown-item" href="/workbench/dashboard">
                                <i class="icon icon-dashboard"></i> My Dashboard
                            </a>
                            <a class="dropdown-item" href="/workbench/onboarding/admin">
                                <i class="icon icon-approved-boxed"></i> Onboarding Admin
                            </a>
                            <a class="dropdown-item" href="/accounts/profile/">
                                <i class="icon icon-gear"></i> My Account
                            </a>
                            <a class="dropdown-item" href="/accounts/logout">
                                <i class="icon icon-user"></i> Log Out
                            </a>
                        </nav>
                    </li>
                </ul>
            </div>
        </nav>
    </dd>

    <dt>Narrow Raster Logo</dt>
    <dd>
        <nav id="s-header" class="s-header navbar navbar-expand-lg navbar-dark">
            <a class="navbar-brand" href="/">
                <img src="http://cep.tacc.utexas.edu/static/site_cms/img/org_logos/portal.png" alt="Raster Logo" class="portal-logo" />
            </a>
            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarExpandTarget-narrow-raster" aria-controls="navbarExpandTarget-narrow-raster" aria-expanded="false" aria-label="Toggle navigation">
                <span class="navbar-toggler-icon"></span>
            </button>

            <div class="collapse navbar-collapse" id="navbarExpandTarget-narrow-raster">
                <!-- FAQ:

This is the markup of the #s-header, as of 2020-03-11,
from https://frontera-portal.tacc.utexas.edu/. It has:

- Bootstrap class names
- extra markup (`a > span`)
-->
                <ul class="s-cms-nav navbar-nav mr-auto">
                    <li class="nav-item">
                        <a class="nav-link" href="/user-guide/"><span>User Guide</span></a>
                    </li>

                    <li class="nav-item">
                        <a class="nav-link" href="/news/"><span>News</span></a>
                    </li>

                    <li class="nav-item">
                        <a class="nav-link" href="/about/"><span>About</span></a>
                    </li>

                    <li class="nav-item">
                        <a class="nav-link" href="/help/"><span>Help</span></a>
                    </li>
                </ul>
                <!-- FAQ:

This is the markup of the #s-header, as of 2021-06,
from https://frontera-portal.tacc.utexas.edu/. It has:

- Bootstrap class names
- Bootstrap attributes
-->
                <ul class="s-portal-nav navbar-nav">
                    <!-- When user is not logged in, there are zero dropdown(-*) classes -->
                    <li class="nav-item dropdown">
                        <a class="nav-link dropdown-toggle" href="#" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                            <i class="icon icon-user"></i>
                            <span>username</span>
                            <span class="sr-only">Toggle Dropdown</span>
                        </a>
                        <nav class="dropdown-menu dropdown-menu-right">
                            <a class="dropdown-item" href="/workbench/dashboard">
                                <i class="icon icon-dashboard"></i> My Dashboard
                            </a>
                            <a class="dropdown-item" href="/workbench/onboarding/admin">
                                <i class="icon icon-approved-boxed"></i> Onboarding Admin
                            </a>
                            <a class="dropdown-item" href="/accounts/profile/">
                                <i class="icon icon-gear"></i> My Account
                            </a>
                            <a class="dropdown-item" href="/accounts/logout">
                                <i class="icon icon-user"></i> Log Out
                            </a>
                        </nav>
                    </li>
                </ul>
            </div>
        </nav>
    </dd>
</dl>
  • Content:
    :root {
        --global-font-family: var(--global-font-family--sans);
        --font-family-sans-serif: var(--global-font-family--sans);
        --font-family-monospace: var(--global-font-family--mono);
    }
    
    main {
        padding-block: unset;
        width: unset;
    }
    
  • URL: /components/raw/s-header/s-header.demo.css
  • Filesystem Path: src/lib/_imports/trumps/s-header/s-header.demo.css
  • Size: 248 Bytes
{
  "shouldSkipPattern": true,
  "globalStyles": [
    {
      "isInternal": true,
      "layer": "base",
      "path": "/assets/core-styles.demo.css"
    },
    {
      "isInternal": true,
      "layer": "base",
      "path": "/assets/core-styles.base.css"
    }
  ],
  "cmsStyles": [
    {
      "isInternal": true,
      "layer": "base",
      "path": "/assets/core-styles.cms.css"
    }
  ],
  "docsStyles": [
    {
      "isInternal": true,
      "layer": "base",
      "path": "/assets/core-styles.docs.css"
    }
  ],
  "portalStyles": [
    {
      "isInternal": true,
      "layer": "base",
      "path": "/assets/core-styles.portal.css"
    }
  ],
  "subdir": "trumps",
  "shouldLoadBootstrap": true,
  "shouldLoadCMS": true,
  "supportStyles": [
    "../../assets/core-styles.header.css",
    "../../assets/core-styles.theme.default.css"
  ]
}