Page Template

As the names imply, the Global Header and Global Footer are used by default on every page.

The Global Header is based on the Bootstrap Navbar contains the logo, links to the major pages and content sections, and a button-style link for the contact page.

<header>
  <nav class="navbar navbar-expand-lg navbar-light bg-white">
    <div class="container">
      <a title="Nine Labs - Strategy &amp; Design Consulting for Digital Product Teams" class="navbar-brand" href="/"><svg width="54px" height="54px" viewBox="0 0 54 54" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><title>Nine Labs - Strategy and Design Consulting for Digital Product Teams</title><g id="Website-Header" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><rect fill="#EB3B86" x="0" y="0" width="54" height="54"></rect>
        <g id="Nine-Labs-Wordmark" transform="translate(7.074000, 11.232000)" fill="#FFFFFF">
            <polygon id="Path" fill-rule="nonzero" points="4.0598247 11.448 4.0598247 4.44862599 9.56337849 11.448 12.528 11.448 12.528 0 9.56337849 0 9.56337849 6.99937401 4.0598247 0 1.08 0 1.08 11.448"></polygon>
            <polygon id="Path" fill-rule="nonzero" points="17.118 11.448 17.118 0 14.148 0 14.148 11.448"></polygon>
            <polygon id="Path" fill-rule="nonzero" points="21.7037689 11.448 21.7037689 4.44862599 27.1813625 11.448 30.132 11.448 30.132 0 27.1813625 0 27.1813625 6.99937401 21.7037689 0 18.738 0 18.738 11.448"></polygon>
            <polygon id="Path" fill-rule="nonzero" points="38.988 11.448 38.0345595 8.93157864 34.7387675 8.93157864 34.7387675 6.96088721 37.962 6.96088721 37.962 4.44446585 34.7387675 4.44446585 34.7387675 2.53441108 37.962 2.53441108 38.988 0 31.752 0.0179897143 31.752 11.448"></polygon>
            <polygon id="Path" fill-rule="nonzero" points="9.22564398 31.158 10.152 28.674 4.05 28.674 4.05137819 19.71 1.08 19.71 1.08 31.158"></polygon>
            <path d="M17.3614797,19.71 L21.708,31.158 L18.542764,31.158 L17.8612538,29.1690239 L13.6207462,29.1690239 L12.939236,31.158 L9.774,31.158 L14.1205203,19.71 L17.3614797,19.71 Z M15.741,23.112 L14.418,26.892 L17.064,26.892 L15.741,23.112 Z" id="Combined-Shape" fill-rule="nonzero"></path>
            <path d="M26.6364626,19.71 C27.6912939,19.71 28.49256,19.9630504 29.0402609,20.4691512 C29.5879617,20.975252 29.8618122,21.7040371 29.8618122,22.6555066 C29.8618122,23.2324615 29.7578504,23.7107268 29.549927,24.0903024 C29.3420035,24.469878 29.025047,24.791252 28.5990574,25.0544244 C28.9015732,25.2593952 29.0723931,25.3751435 29.1468522,25.4264085 C29.2213113,25.4776735 29.6894817,25.7983926 29.87712,26.041321 C30.0647583,26.2842493 30.1991478,26.5575438 30.2802887,26.8612042 C30.3614296,27.1648647 30.402,27.4887692 30.402,27.8329178 C30.402,28.3693846 30.3081809,28.8451194 30.1205426,29.260122 C29.9329043,29.6751247 29.6691965,30.0243342 29.3294191,30.3077507 C28.9896417,30.5911671 28.5763304,30.8037294 28.0894852,30.9454377 C27.60264,31.0871459 27.5421851,31.1379605 26.9863826,31.158 L26.9381836,31.1594822 C26.7951332,31.1632767 26.5359241,31.1658063 26.1605563,31.1670711 L25.6892632,31.1679605 C25.5736415,31.1680395 25.4507599,31.1680395 25.3206183,31.1679605 L24.6859771,31.1670711 C24.0023313,31.1656482 23.1716723,31.1626245 22.194,31.158 L22.194,31.158 L22.194,19.71 Z M25.7866875,26.406 L25.164,26.406 L25.164,28.836 L25.7866875,28.836 C26.8475625,28.836 27.378,28.431 27.378,27.621 C27.378,26.811 26.8475625,26.406 25.7866875,26.406 L25.7866875,26.406 Z M25.71075,21.978 L25.164,21.978 L25.164,24.192 L25.71075,24.192 C26.64225,24.192 27.108,23.823 27.108,23.085 C27.108,22.347 26.64225,21.978 25.71075,21.978 L25.71075,21.978 Z" id="Combined-Shape" fill-rule="nonzero"></path>
            <path d="M34.3815189,31.482 C35.0816768,31.482 35.7082675,31.3882915 36.2612908,31.2008744 C36.8143142,31.0134573 37.2810862,30.7500603 37.6616068,30.4106834 C38.0421275,30.0713065 38.3313232,29.6635477 38.5291939,29.187407 C38.7270646,28.7112663 38.826,28.179407 38.826,27.5918291 C38.826,26.720593 38.6002244,26.0139799 38.1486732,25.4719899 C37.6971221,24.93 36.9842801,24.4969146 36.0101472,24.1727337 C35.766614,24.0916884 35.520544,24.0157085 35.2719372,23.944794 C35.0233303,23.8738794 34.8000916,23.7903015 34.6022208,23.6940603 C34.4043501,23.5978191 34.2445314,23.4838492 34.1227648,23.3521508 C34.0009982,23.2204523 33.9401149,23.0532965 33.9401149,22.8506834 C33.9401149,22.5568945 34.0618815,22.3188241 34.3054147,22.1364724 C34.5489479,21.9541206 34.8635117,21.8629447 35.2491059,21.8629447 C35.5535224,21.8629447 35.8680862,21.9262613 36.1927971,22.0528945 C36.4092711,22.1373166 36.8215124,22.3690813 37.4295209,22.7481888 L38.3541544,20.3129548 C37.5795835,19.9566935 36.9859713,19.7262211 36.5733178,19.6215377 C35.9543375,19.4645126 35.3607253,19.386 34.7924811,19.386 C34.1836481,19.386 33.6331616,19.4771759 33.1410215,19.6595276 C32.6488815,19.8418794 32.2328456,20.0976784 31.8929138,20.4269246 C31.552982,20.7561709 31.2891544,21.1512663 31.1014309,21.6122111 C30.9137074,22.0731558 30.8198456,22.5872864 30.8198456,23.154603 C30.8198456,23.7219196 30.9086338,24.1904623 31.0862101,24.5602312 C31.2637864,24.93 31.4971724,25.2364523 31.786368,25.4795879 C32.0755637,25.7227236 32.4053483,25.9177387 32.7757217,26.0646332 C33.1460952,26.2115276 33.524079,26.3457588 33.9096732,26.4673266 C34.2343842,26.5787638 34.5108959,26.6800704 34.7392083,26.7712462 C34.9675206,26.8624221 35.1527074,26.961196 35.2947684,27.0675678 C35.4368294,27.1739397 35.5383016,27.2904422 35.5991849,27.4170754 C35.6600682,27.5437085 35.6905099,27.6931357 35.6905099,27.8653568 C35.6905099,28.1490151 35.5712801,28.4022814 35.3328205,28.6251558 C35.0943609,28.8480302 34.7315978,28.9594673 34.2445314,28.9594673 C33.8183483,28.9594673 33.3307422,28.8652427 32.8388782,28.6251558 C32.5109689,28.4650978 31.9792858,28.1718758 31.2438288,27.7454897 L30.348,30.1903417 C31.1108631,30.6507623 31.6567189,30.9427149 31.9855674,31.0661996 C32.8917101,31.4064618 33.7734253,31.482 34.3815189,31.482 Z" id="Path" fill-rule="nonzero"></path>
            <polygon id="Rectangle" points="1.08169714 14.148 39.852 14.148 38.779712 16.686 8.987186e-16 16.686"></polygon></g></g></svg>
            <div class="brand-tagline">Executive Product Design Coaching for the Travel Industry</div></a>
    </div>
  </nav>
</header>

The Global Footer is a four column spread containing links to all the major pages and content sections of the website. It also includes office addresses and contact information.

Nine Labs - Strategy and Design Consulting for Digital Product Teams

Strategic Advisory Services for Executive Product Teams

Atlanta // New York // Amsterdam

© Novelaboratori, LLC unless otherwise noted.

<footer>
  <div class="subfooter">
    <div class="brand-statement">
      <svg width="54px" height="54px" viewBox="0 0 54 54" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><title>Nine Labs - Strategy and Design Consulting for Digital Product Teams</title><g id="Website-Header" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><rect fill="#EB3B86" x="0" y="0" width="54" height="54"></rect>
        <g id="Nine-Labs-Wordmark" transform="translate(7.074000, 11.232000)" fill="#FFFFFF">
            <polygon id="Path" fill-rule="nonzero" points="4.0598247 11.448 4.0598247 4.44862599 9.56337849 11.448 12.528 11.448 12.528 0 9.56337849 0 9.56337849 6.99937401 4.0598247 0 1.08 0 1.08 11.448"></polygon>
            <polygon id="Path" fill-rule="nonzero" points="17.118 11.448 17.118 0 14.148 0 14.148 11.448"></polygon>
            <polygon id="Path" fill-rule="nonzero" points="21.7037689 11.448 21.7037689 4.44862599 27.1813625 11.448 30.132 11.448 30.132 0 27.1813625 0 27.1813625 6.99937401 21.7037689 0 18.738 0 18.738 11.448"></polygon>
            <polygon id="Path" fill-rule="nonzero" points="38.988 11.448 38.0345595 8.93157864 34.7387675 8.93157864 34.7387675 6.96088721 37.962 6.96088721 37.962 4.44446585 34.7387675 4.44446585 34.7387675 2.53441108 37.962 2.53441108 38.988 0 31.752 0.0179897143 31.752 11.448"></polygon>
            <polygon id="Path" fill-rule="nonzero" points="9.22564398 31.158 10.152 28.674 4.05 28.674 4.05137819 19.71 1.08 19.71 1.08 31.158"></polygon>
            <path d="M17.3614797,19.71 L21.708,31.158 L18.542764,31.158 L17.8612538,29.1690239 L13.6207462,29.1690239 L12.939236,31.158 L9.774,31.158 L14.1205203,19.71 L17.3614797,19.71 Z M15.741,23.112 L14.418,26.892 L17.064,26.892 L15.741,23.112 Z" id="Combined-Shape" fill-rule="nonzero"></path>
            <path d="M26.6364626,19.71 C27.6912939,19.71 28.49256,19.9630504 29.0402609,20.4691512 C29.5879617,20.975252 29.8618122,21.7040371 29.8618122,22.6555066 C29.8618122,23.2324615 29.7578504,23.7107268 29.549927,24.0903024 C29.3420035,24.469878 29.025047,24.791252 28.5990574,25.0544244 C28.9015732,25.2593952 29.0723931,25.3751435 29.1468522,25.4264085 C29.2213113,25.4776735 29.6894817,25.7983926 29.87712,26.041321 C30.0647583,26.2842493 30.1991478,26.5575438 30.2802887,26.8612042 C30.3614296,27.1648647 30.402,27.4887692 30.402,27.8329178 C30.402,28.3693846 30.3081809,28.8451194 30.1205426,29.260122 C29.9329043,29.6751247 29.6691965,30.0243342 29.3294191,30.3077507 C28.9896417,30.5911671 28.5763304,30.8037294 28.0894852,30.9454377 C27.60264,31.0871459 27.5421851,31.1379605 26.9863826,31.158 L26.9381836,31.1594822 C26.7951332,31.1632767 26.5359241,31.1658063 26.1605563,31.1670711 L25.6892632,31.1679605 C25.5736415,31.1680395 25.4507599,31.1680395 25.3206183,31.1679605 L24.6859771,31.1670711 C24.0023313,31.1656482 23.1716723,31.1626245 22.194,31.158 L22.194,31.158 L22.194,19.71 Z M25.7866875,26.406 L25.164,26.406 L25.164,28.836 L25.7866875,28.836 C26.8475625,28.836 27.378,28.431 27.378,27.621 C27.378,26.811 26.8475625,26.406 25.7866875,26.406 L25.7866875,26.406 Z M25.71075,21.978 L25.164,21.978 L25.164,24.192 L25.71075,24.192 C26.64225,24.192 27.108,23.823 27.108,23.085 C27.108,22.347 26.64225,21.978 25.71075,21.978 L25.71075,21.978 Z" id="Combined-Shape" fill-rule="nonzero"></path>
            <path d="M34.3815189,31.482 C35.0816768,31.482 35.7082675,31.3882915 36.2612908,31.2008744 C36.8143142,31.0134573 37.2810862,30.7500603 37.6616068,30.4106834 C38.0421275,30.0713065 38.3313232,29.6635477 38.5291939,29.187407 C38.7270646,28.7112663 38.826,28.179407 38.826,27.5918291 C38.826,26.720593 38.6002244,26.0139799 38.1486732,25.4719899 C37.6971221,24.93 36.9842801,24.4969146 36.0101472,24.1727337 C35.766614,24.0916884 35.520544,24.0157085 35.2719372,23.944794 C35.0233303,23.8738794 34.8000916,23.7903015 34.6022208,23.6940603 C34.4043501,23.5978191 34.2445314,23.4838492 34.1227648,23.3521508 C34.0009982,23.2204523 33.9401149,23.0532965 33.9401149,22.8506834 C33.9401149,22.5568945 34.0618815,22.3188241 34.3054147,22.1364724 C34.5489479,21.9541206 34.8635117,21.8629447 35.2491059,21.8629447 C35.5535224,21.8629447 35.8680862,21.9262613 36.1927971,22.0528945 C36.4092711,22.1373166 36.8215124,22.3690813 37.4295209,22.7481888 L38.3541544,20.3129548 C37.5795835,19.9566935 36.9859713,19.7262211 36.5733178,19.6215377 C35.9543375,19.4645126 35.3607253,19.386 34.7924811,19.386 C34.1836481,19.386 33.6331616,19.4771759 33.1410215,19.6595276 C32.6488815,19.8418794 32.2328456,20.0976784 31.8929138,20.4269246 C31.552982,20.7561709 31.2891544,21.1512663 31.1014309,21.6122111 C30.9137074,22.0731558 30.8198456,22.5872864 30.8198456,23.154603 C30.8198456,23.7219196 30.9086338,24.1904623 31.0862101,24.5602312 C31.2637864,24.93 31.4971724,25.2364523 31.786368,25.4795879 C32.0755637,25.7227236 32.4053483,25.9177387 32.7757217,26.0646332 C33.1460952,26.2115276 33.524079,26.3457588 33.9096732,26.4673266 C34.2343842,26.5787638 34.5108959,26.6800704 34.7392083,26.7712462 C34.9675206,26.8624221 35.1527074,26.961196 35.2947684,27.0675678 C35.4368294,27.1739397 35.5383016,27.2904422 35.5991849,27.4170754 C35.6600682,27.5437085 35.6905099,27.6931357 35.6905099,27.8653568 C35.6905099,28.1490151 35.5712801,28.4022814 35.3328205,28.6251558 C35.0943609,28.8480302 34.7315978,28.9594673 34.2445314,28.9594673 C33.8183483,28.9594673 33.3307422,28.8652427 32.8388782,28.6251558 C32.5109689,28.4650978 31.9792858,28.1718758 31.2438288,27.7454897 L30.348,30.1903417 C31.1108631,30.6507623 31.6567189,30.9427149 31.9855674,31.0661996 C32.8917101,31.4064618 33.7734253,31.482 34.3815189,31.482 Z" id="Path" fill-rule="nonzero"></path>
            <polygon id="Rectangle" points="1.08169714 14.148 39.852 14.148 38.779712 16.686 8.987186e-16 16.686"></polygon></g></g></svg>
            <br /><br />
      <p>Strategic Advisory Services for Executive Product Teams</p>
      <p>Atlanta // New York // Amsterdam</p>
    </div>
    <p>&copy; Novelaboratori, LLC unless otherwise noted.</p>
  </div>
</footer>

Pagination

This component extends the default Bootstrap Pagination Component and adds the Nine Labs style.

<div class="pagination-container">
  <nav aria-label="Page navigation example">
    <ul class="pagination">
      <li class="page-item"><a class="page-link" href="#">Previous</a></li>
      <li class="page-item"><a class="page-link" href="#">1</a></li>
      <li class="page-item"><a class="page-link" href="#">2</a></li>
      <li class="page-item"><a class="page-link" href="#">3</a></li>
      <li class="page-item"><a class="page-link" href="#">Next</a></li>
    </ul>
  </nav>
</div>
On this page: