packages/core/styles/components/hero.pcss

/**
 * Copyright (c) Facebook, Inc. and its affiliates.
 *
 * This source code is licensed under the MIT license found in the
 * LICENSE file in the root directory of this source tree.
 */

:root {
  --ifm-hero-background-color: var(--ifm-background-surface-color);
  --ifm-hero-text-color: var(--ifm-color-emphasis-800);
}

.hero {
  align-items: center;
  background-color: var(--ifm-hero-background-color);
  color: var(--ifm-hero-text-color);
  display: flex;
  padding: 4rem 2rem;

  &--primary {
    --ifm-hero-background-color: var(--ifm-color-primary);
    --ifm-hero-text-color: var(--ifm-font-color-base-inverse);
  }

  &--dark {
    --ifm-hero-background-color: #303846;
    --ifm-hero-text-color: var(--ifm-color-white);
  }

  &__title {
    font-size: 3rem;
  }

  &__subtitle {
    font-size: 1.5rem;
  }

  @media (--ifm-narrow-window) {
    padding-left: 0;
    padding-right: 0;
  }
}