website/static/css/custom.css

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

@import url('https://fonts.googleapis.com/css?family=Montserrat');
@import url('https://fonts.googleapis.com/css?family=IBM+Plex+Mono');

html body {
  font-family: 'Montserrat', sans-serif;
  overflow-x: hidden;
}

.fixedHeaderContainer {
  background-color: #222222;
}

.fixedHeaderContainer header .headerTitleWithLogo {
  display: none;
}

.fixedHeaderContainer header a:nth-child(2) {
  position: absolute;
  right: 0px;
}

.fixedHeaderContainer header a:nth-child(2) h3 {
  font-size: 14px;
}

.fixedHeaderContainer header a:nth-child(2) h3::before {
  content: 'v: ';
}

.navigationSlider {
  margin-right: 80px;
}

.navigationSlider .slidingNav ul {
  background: #222222;
}

.navigationSlider .slidingNav ul li a {
  color: #efefef;
  background-color: #222222;
}

.navigationSlider .slidingNav ul li a:hover,
.navigationSlider .slidingNav ul li a:focus {
  color: #f15a24;
  background-color: inherit;
}

.navigationSlider .slidingNav ul li.siteNavItemActive > a,
.navigationSlider .slidingNav ul li.siteNavGroupActive > a {
  background-color: inherit;
}

.homeContainer {
  background: rgb(2, 0, 36);
  background: linear-gradient(
    180deg,
    rgba(2, 0, 36, 1),
    rgba(34, 34, 34, 1) 0%,
    rgba(28, 96, 247, 1) 100%
  );
  padding: 30px 0px;
}

.splashLogo {
  display: block;
  margin: 0 auto;
  height: 230px;
  width: 275px;
}

.projectTitle {
  color: #ffffff;
  font-variant: small-caps;
  font-weight: 300;
}

.promoSection .button {
  border: 1px solid #fff;
  color: #ffffff;
}

.promoSection .button:hover {
  background-color: inherit;
  border: 1px solid #f15a24;
  color: #f15a24;
}

.landingPage {
  padding: 0px;
}

div.productShowcaseSection {
  padding-top: 40px;
  color: #6c6c6c;
}

.productShowcaseSection > h2 {
  font-variant: small-caps;
  font-weight: 360;
  margin: 0px;
  padding: 0px;
  color: #1c60f7;
}

.productShowcaseSection p {
  font-weight: 360;
}

.productShowcaseSection div.container {
  padding: 40px 0px;
}

.productShowcaseSection div.blockImage {
  height: 80px;
}

.productShowcaseSection li {
  padding: 10px 0;
}

.productShowcaseSection pre {
  margin: 10px 0;
}

.productShowcaseSection code {
  background: #fff;
}

.container .wrapper .alignCenter h2 {
  color: #222222;
}

div#quickstart {
  background: #efefef;
}

div#quickstart ol {
  margin-bottom: 0px;
}

.nav-footer {
  background-color: #222222;
}

.nav-footer .sitemap a {
  color: #efefef;
}

.nav-footer .sitemap a:hover {
  color: #f15a24;
}

a,
p a {
  color: #1c60f7;
}

a:hover,
p a:hover {
  color: #1c60f7;
}

/* Style docs */
.toc .toggleNav .navGroup .navGroupCategoryTitle {
  color: #222222;
}

.toc .toggleNav ul li a {
  color: #6c6c6c;
}

.toc .toggleNav ul li a:hover {
  color: #f15a24;
}

.toc .toggleNav .navGroup .navListItemActive a {
  color: #1c60f7;
}

.mainContainer .wrapper .post .postHeaderTitle {
  color: #222222;
}

.mainContainer .wrapper .post h1,
.mainContainer .wrapper .post h2,
.mainContainer .wrapper .post h3 {
  color: #222222;
}

.mainContainer .wrapper .post {
  color: #6c6c6c;
}

.mainContainer .wrapper .post strong {
  color: #222222;
}

a.edit-page-link {
  color: #1c60f7;
  border: 1px solid #1c60f7;
}

a.edit-page-link:hover {
  color: #f15a24;
  border: 1px solid #f15a24;
  background-color: inherit;
}

a.docs-next,
a.docs-prev {
  color: #1c60f7;
  border: 1px solid #1c60f7;
}

a.docs-next:hover,
a.docs-prev:hover {
  color: #f15a24;
  border: 1px solid #f15a24;
  background-color: inherit;
}

/* Style tutorials */
.tutorialBody {
  margin-top: -20px;
  color: #6c6c6c;
}

.tutorialBody h1 {
  margin: 0px;
}

.tutorialBody h1,
.tutorialBody h2,
.tutorialBody h3 {
  color: #222222;
}

.tutorialBody pre {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 14px;
  margin: 0px;
}

.tutorialBody .input_prompt,
.tutorialBody .output_prompt {
  color: darkred;
  font-size: 12px;
}

.tutorialBody .highlight {
  background: #f3f4f7;
  padding: 10px 20px;
  border: lightgray 1px solid;
  border-radius: 3px;
}

.tutorialBody .cell {
  margin: 20px;
}

.tutorialBody .output_stderr {
  background-color: #fdede9;
}

.tutorialBody .anchor-link {
  color: lightgray;
}

.tutorialButtonWrapper {
  margin: 20px;
}

.tutorialButton {
  color: #1c60f7;
  border: 1px solid #1c60f7;
}

.tutorialButton svg {
  height: 15px;
  margin-right: 5px;
}

.tutorialButton:hover {
  color: #f15a24;
  border: 1px solid #f15a24;
  background-color: inherit;
}

.wrapper {
  max-width: 1400px;
}

@media only screen and (min-width: 1024px) {
}

@media only screen and (max-width: 1023px) {
  .fixedHeaderContainer header a:nth-child(2) {
    position: absolute;
    right: 200px;
  }
}

@media only screen and (min-device-width: 360px) and (max-device-width: 736px) {
  .fixedHeaderContainer header a:nth-child(2) {
    position: absolute;
    right: 150px;
  }
}

@media only screen and (min-width: 1400px) {
}

@media only screen and (min-width: 1500px) {
}