<commit_before>@import "variables";
@import "mixins";

$nav-inter-link-spacing: 2rem;

// this really depends how many links we have. if we have the logo and then
// more than 3 links, we'll need to increase this.
$nav-breakpoint: 900px;

.always-fixed-nav {
  margin-top: $nav-line-height;
}

.nav-padding {
  padding-top: $nav-line-height;
}

nav {
  position: relative;
  @include position-sticky;
  left: 0;
  right: 0;
  top: 0;
  text-align: center;
  background-color: $nav-background-color;
  z-index: 100; // so that it stays above <sup> elements
  margin-top: -$nav-line-height;
  height: $nav-line-height;
}

nav a {
  text-decoration: none;
  color: white;
  line-height: $nav-line-height;
  font-size: $nav-font-size;
  font-family: $title-font-family;
  text-transform: uppercase;
  margin-left: $nav-inter-link-spacing;
  vertical-align: middle;
}

nav a:visited {
  color: white;
}

.fixed {
  position: fixed;
  top: 0;
  margin-top: 0;
}

nav .logo.amc {
  margin-left: 0;
  margin-bottom: -4px; // fml
}

.nav-wrapper {
  display: inline-block;
  pointer-events: none;
}

.nav-menu {
  pointer-events: auto;
  background-color: $nav-background-color;
  @include transition(all $nav-transition-duration ease-in-out);
}

nav.open  .nav-menu {
  @include translate(0, 0);
}

.hamburger {
  display: none;
  @include appearance(none);
  border-width: 0;
  background-color: transparent;
  width: $nav-line-height;
  padding: 0;
}

.hamburger .line, .hamburger .ex {
  position: absolute;
  width: 60%;
  height: 6.25%;
  background-color: white;
  @include translate(0, -50%);
  @include transition(all $nav-transition-duration ease-in-out);
}

.hamburger .line {
  top: 50%;
  left: 20%;
}

.hamburger .ex:first-child {
  @include transform(rotate(45deg) translate(5px, -11px));
}

.hamburger .ex:last-child {
  @include transform(rotate(-45deg) translate(11px, 5px));
}

.ex {
  opacity: 0;
}

nav.open .ex {
  opacity: 100;
}

.hamburger .line:first-child {
  top: 30%;
}

.hamburger .line:last-child {
  top: 70%;
}

nav.open .hamburger .line {
  opacity: 0;
}

@media screen and (max-width: $nav-breakpoint) {
  .nav-wrapper {
    display: block;
    overflow: hidden;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;<commit_msg>fix nav close button positioning<commit_after>@import "variables";
@import "mixins";

$nav-inter-link-spacing: 2rem;

// this really depends how many links we have. if we have the logo and then
// more than 3 links, we'll need to increase this.
$nav-breakpoint: 900px;

.always-fixed-nav {
  margin-top: $nav-line-height;
}

.nav-padding {
  padding-top: $nav-line-height;
}

nav {
  position: relative;
  @include position-sticky;
  left: 0;
  right: 0;
  top: 0;
  text-align: center;
  background-color: $nav-background-color;
  z-index: 100; // so that it stays above <sup> elements
  margin-top: -$nav-line-height;
  height: $nav-line-height;
}

nav a {
  text-decoration: none;
  color: white;
  line-height: $nav-line-height;
  font-size: $nav-font-size;
  font-family: $title-font-family;
  text-transform: uppercase;
  margin-left: $nav-inter-link-spacing;
  vertical-align: middle;
}

nav a:visited {
  color: white;
}

.fixed {
  position: fixed;
  top: 0;
  margin-top: 0;
}

nav .logo.amc {
  margin-left: 0;
  margin-bottom: -4px; // fml
}

.nav-wrapper {
  display: inline-block;
  pointer-events: none;
}

.nav-menu {
  pointer-events: auto;
  background-color: $nav-background-color;
  @include transition(all $nav-transition-duration ease-in-out);
}

nav.open  .nav-menu {
  @include translate(0, 0);
}

.hamburger {
  display: none;
  @include appearance(none);
  border-width: 0;
  background-color: transparent;
  width: $nav-line-height;
  padding: 0;
}

.hamburger .line, .hamburger .ex {
  position: absolute;
  width: 60%;
  height: 6.25%;
  background-color: white;
  @include translate(0, -50%);
  @include transition(all $nav-transition-duration ease-in-out);
}

.hamburger .line {
  top: 50%;
  left: 20%;
}

.hamburger .ex:first-child {
  @include transform(rotate(45deg) translate(6px, -9px));
}

.hamburger .ex:last-child {
  @include transform(rotate(-45deg) translate(9px, 6px));
}

.ex {
  opacity: 0;
}

nav.open .ex {
  opacity: 100;
}

.hamburger .line:first-child {
  top: 30%;
}

.hamburger .line:last-child {
  top: 70%;
}

nav.open .hamburger .line {
  opacity: 0;
}

@media screen and (max-width: $nav-breakpoint) {
  .nav-wrapper {
    display: block;
    overflow: hidden;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
{'fraction_non_alphanumeric': 0.15716486902927582, 'fraction_numerical': 0.02289236187541272, 'mean_word_length': 3.274694261523989, 'pattern_counts': {'":': 0, '<': 5, '<?xml version=': 0, '>': 5, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '6908464', 'n_tokens_mistral': 1848, 'n_tokens_neox': 1735, 'n_words': 421}