github.com/uchennaokeke444/nomad@v0.11.8/website/pages/style.css (about)

     1  /* Global Component Styles */
     2  @import '~@hashicorp/react-global-styles/style.css';
     3  @import '~@hashicorp/react-global-styles/custom-properties/color.css';
     4  @import '~@hashicorp/react-global-styles/custom-properties/font.css';
     5  @import '~@hashicorp/react-global-styles/_temporary-to-remove/layout.css';
     6  @import '~@hashicorp/react-global-styles/_temporary-to-remove/tables.css';
     7  @import '~@hashicorp/react-alert-banner/dist/style.css';
     8  @import '~@hashicorp/nextjs-scripts/prism/style.css';
     9  
    10  :root {
    11    --highlight-color: var(--nomad);
    12  }
    13  
    14  /* Global Transpiled Components */
    15  @import '~@hashicorp/react-mega-nav/style.css';
    16  @import '~@hashicorp/react-text-input/dist/style.css';
    17  @import '~@hashicorp/react-button/dist/style.css';
    18  @import '~@hashicorp/react-use-cases/dist/style.css';
    19  @import '~@hashicorp/react-consent-manager/dist/style.css';
    20  @import '~@hashicorp/react-hero/dist/style.css';
    21  @import '~@hashicorp/react-section-header/dist/style.css';
    22  @import '~@hashicorp/react-logo-grid/dist/style.css';
    23  @import '~@hashicorp/react-product-downloader/dist/style.css';
    24  @import '~@hashicorp/react-vertical-text-block-list/dist/style.css';
    25  @import '~@hashicorp/react-docs-sidenav/dist/style.css';
    26  @import '~@hashicorp/react-content/dist/style.css';
    27  @import '~@hashicorp/react-subnav/dist/style.css';
    28  @import '~@hashicorp/react-text-and-content/dist/style.css';
    29  @import '~@hashicorp/react-code-block/dist/style.css';
    30  @import '~@hashicorp/react-consent-manager/dist/style.css';
    31  @import '~@hashicorp/react-toggle/dist/style.css';
    32  @import '~@hashicorp/react-alert/dist/style.css';
    33  @import '~@hashicorp/react-call-to-action/dist/style.css';
    34  @import '~@hashicorp/react-text-split/dist/style.css';
    35  @import '~@hashicorp/react-text-split-with-code/dist/style.css';
    36  @import '~@hashicorp/react-docs-page/dist/style.css';
    37  
    38  /* Local Components */
    39  @import '../components/placement-table/style.css';
    40  @import '../components/case-study-carousel/style.css';
    41  @import '../components/features-list/style.css';
    42  @import '../components/enterprise-info/style.css';
    43  @import '../components/mini-cta/style.css';
    44  @import '../components/homepage-hero/style.css';
    45  @import '../components/featured-slider/style.css';
    46  @import '../components/featured-slider-section/style.css';
    47  @import '../components/learn-nomad/style.css';
    48  @import '../components/basic-hero/style.css';
    49  @import '../components/footer/style.css';
    50  
    51  /* Local Pages */
    52  @import './home/style.css';
    53  @import './downloads/style.css';
    54  @import './security/style.css';
    55  @import './resources/style.css';
    56  @import '../layouts/use-cases/style.css';
    57  
    58  /* Print Styles */
    59  @import './print.css';
    60  
    61  /* Sticky Footer */
    62  .__next > .content {
    63    min-height: calc(100vh - 260px);
    64  
    65    &.banner {
    66      min-height: calc(100vh - 315px);
    67    }
    68  }
    69  
    70  /* Layout Styles */
    71  .g-section-block section {
    72    padding-top: 96px;
    73    padding-bottom: 96px;
    74  }
    75  
    76  .g-section-block section > .g-section-header + *,
    77  .g-section-block section > .g-container > .g-section-header + * {
    78    margin-top: 72px;
    79  }
    80  
    81  .g-section-block section > * + *,
    82  .g-section-block section > .g-container > * + * {
    83    margin-top: 96px;
    84  }
    85  
    86  .g-section-block .button-container {
    87    display: -webkit-box;
    88    display: flex;
    89    flex-wrap: wrap;
    90    -webkit-box-pack: center;
    91    justify-content: center;
    92    margin: auto -8px -16px;
    93  }
    94  
    95  .g-section-block section > * + .button-container,
    96  .g-section-block section > .g-container > * + .button-container {
    97    margin-top: 40px;
    98  }
    99  
   100  .g-section-block .button-container > * {
   101    margin: auto 8px 16px;
   102  }
   103  
   104  .g-section-block.theme-black-background-white-text {
   105    background: var(--gray-1);
   106    color: white;
   107  }
   108  
   109  /*
   110   * About this selector:
   111   * `.g-subnav ~ *` finds all elements after the navigation.
   112   * `:target` finds the active permalink on the page.
   113   *
   114   * About this style:
   115   * `scroll-margin-top` adjusts the vertical scroll of a permalink.
   116   * `64px` adjusts the scroll to account for the navigation.
   117   * `0.5em` further adjusts the scroll to give the permalink breathing room.
   118   *
   119   * See: https://developer.mozilla.org/en-US/docs/Web/CSS/:target
   120   * See: https://developer.mozilla.org/en-US/docs/Web/CSS/scroll-margin-top
   121   */
   122  .g-subnav ~ * :target {
   123    scroll-margin-top: calc(64px + 0.5em);
   124  }
   125  
   126  /* Web Fonts */
   127  @font-face {
   128    font-family: 'klavika-web';
   129    src: url('/fonts/klavika/medium.woff2') format('woff2'),
   130      url('/fonts/klavika/medium.woff') format('woff');
   131    font-weight: 700;
   132    font-style: normal;
   133  }
   134  
   135  /* Display Font (Gilmer) */
   136  @font-face {
   137    font-family: 'gilmer-web';
   138    src: url('/fonts/gilmer/light.woff2') format('woff2'),
   139      url('/fonts/gilmer/light.woff') format('woff');
   140    font-weight: 300;
   141    font-style: normal;
   142  }
   143  
   144  @font-face {
   145    font-family: 'gilmer-web';
   146    src: url('/fonts/gilmer/regular.woff2') format('woff2'),
   147      url('/fonts/gilmer/regular.woff') format('woff');
   148    font-weight: 400;
   149    font-style: normal;
   150  }
   151  
   152  @font-face {
   153    font-family: 'gilmer-web';
   154    src: url('/fonts/gilmer/medium.woff2') format('woff2'),
   155      url('/fonts/gilmer/medium.woff') format('woff');
   156    font-weight: 500;
   157    font-style: normal;
   158  }
   159  
   160  @font-face {
   161    font-family: 'gilmer-web';
   162    src: url('/fonts/gilmer/bold.woff2') format('woff2'),
   163      url('/fonts/gilmer/bold.woff') format('woff');
   164    font-weight: 700;
   165    font-style: normal;
   166  }
   167  
   168  /* Body Font (Metro) */
   169  @font-face {
   170    font-family: 'metro-web';
   171    src: url('/fonts/metro-sans/book.woff2') format('woff2'),
   172      url('/fonts/metro-sans/book.woff') format('woff');
   173    font-weight: 300;
   174    font-style: normal;
   175  }
   176  
   177  @font-face {
   178    font-family: 'metro-web';
   179    src: url('/fonts/metro-sans/regular.woff2') format('woff2'),
   180      url('/fonts/metro-sans/regular.woff') format('woff');
   181    font-weight: 400;
   182    font-style: normal;
   183  }
   184  
   185  @font-face {
   186    font-family: 'metro-web';
   187    src: url('/fonts/metro-sans/semi-bold.woff2') format('woff2'),
   188      url('/fonts/metro-sans/semi-bold.woff') format('woff');
   189    font-weight: 600;
   190    font-style: normal;
   191  }
   192  
   193  @font-face {
   194    font-family: 'metro-web';
   195    src: url('/fonts/metro-sans/bold.woff2') format('woff2'),
   196      url('/fonts/metro-sans/bold.woff') format('woff');
   197    font-weight: 700;
   198    font-style: normal;
   199  }
   200  
   201  /* Code Font (Deja Vu) */
   202  @font-face {
   203    font-family: 'dejavu-sans-mono-web';
   204    src: url('/fonts/dejavu/mono.woff2') format('woff2'),
   205      url('/fonts/dejavu/mono.woff') format('woff');
   206    font-style: normal;
   207    font-weight: 400;
   208  }
   209  
   210  /* overrides */
   211  
   212  .g-content pre code {
   213    background: none;
   214  }