<commit_before>/* Fonts */
@import url(http://fonts.googleapis.com/css?family=Open+Sans:300italic,400,600,700|Pacifico);

/* Media sizes */
$desktop: "(min-width: 769px)";
$phone: "(max-width: 480px)";
$tablet: "(max-width: 768px)";

/* Here are our lovely colors: */
$wbGreen: #bbefce;
$wbGreenDark: #a1d0b1;
$wbBlue: #93d2d0;
$wbBlueDark: #679a98;
$wbRed: #dc6a4c;
$wbRedDark: #a7442a;

/* Change Bootstrap variables before importing */
$sansFontFamily: "Open Sans", sans-serif;
$navbarBackground: $wbGreenDark;
$navbarBackgroundHighlight: $wbGreen;

$linkColor: $wbBlueDark;
$linkColorHover: darken($wbBlue, 5%);

@import "./bootstrap";

@import "mixins";



$navbar_height: 40px;
$nav_height_base: $navbar_height;
$title_height: 30px;
$sidebar_width: 400px;
$sidebar_margin: 12px;
$map_height_phone: 150px;
$map_height_tablet: 260px;
$borderRadius: 7px;
$settings_menu_width: 230px;

body {
  background: image-url("background/background-stripes.png") repeat #dcdcd7;
}

a:not(.btn):not(.close):hover {
  text-decoration: none;
  border-bottom: 1px dotted;
}

input.location {
  @include size(43px, 98%);
  margin: 0px;
  padding: 0px 1%;
  font-size: 18px;
  font-weight: 300;
  line-height: 1.3em;
  text-align: center;
  @include box-shadow(0px 2px 8px 0px rgba(0, 0, 0, 0.15) inset);
  @include placeholder(#94978C);
}

body > .container-fluid, #container {
  @include stretch($navbar_height, 0, 0, 0);
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}
.container-fluid {
  max-width: 900px;
  margin: auto;
}



/* HEADER STYLES */
header {
  // height: 100%;
  position: relative;
  padding: 0 $sidebar_margin;
  text-transform: uppercase;
  box-sizing: border-box;
  @include shadow-black(0.25);
  h1, h2, h3, h4, h5, h6 {
    font-weight: 600;
    line-height: auto;
    margin: 0;
  }
  h2 { font-size: 24px; }
  h3 { font-size: 18px; line-height: 30px; }
  h4 { font-size: 14px; small { font-size: 12px;} }
  [class^="icon-"], [class*=" icon-"] {
    font-size: 18px;
  }
  .affordance {
    float: left;
    font-size: 20px;
    position: absolute;
    top: 50%;
    left: -1px;
    margin-top: -10px;
  }
}

header, .gradient, header:hover, .gradient:hover { 
  color: white; 
  @include shadow-black(0.25);
}
header.red, .gradient.red {
  border-top: 1px solid #f48668;
  border-bottom: 1px solid #762a16;
  @include gradient-vertical(#dc6a4c, #a7442a);
  background-color: #a7442a;
}
header.light-gray, .gradient.light-gray {
  border-top: 1px solid;
  border-bottom: 1px solid;
  border-color: #d2d2d2;
  @include gradient-vertical(#e1e0e0, #d2d2d2);
  background-color: darken(#d2d2d2, 1%);
}
header.gray, .gradient.gray {
  border-bottom: 1px solid;
  border-color: #57564d;
  @include gradient-vertical(#939285, #7a796e);
  background-color: darken(#7a796e, 1%);
}
header.blue, .gradient.blue {
  border-bottom: 1px solid;
  border-color: #5e9b99;
  @include gradient-vertical(#93d2d0, #679a98);
  background-color: darken(#679a98, 1%);
}
header.teal, .gradient.teal {
  $light: #93d2d0;
  $dark: #679a98;
  border-top: 1px solid lighten($light, 10%);
  border-bottom: 1px solid darken($dark, 10%);
  @include gradient-vertical($light, $dark);
  background-color: darken($dark, 1%);
}
header.green, .gradient.green {
  border-top: 1px solid $wbGreenDark;
  border-bottom: 1px solid $wbGreenDark;
  @include gradient-vertical($wbGreen, $wbGreenDark);
  background-color: darken($wbGreenDark, 1%);
}



.cozy { padding: 10px 20px; }
.compact { padding: 5px 10px; }

.close {
  width: 20px;
  text-align: center;
  line-height: inherit;
  z-index: 2000;
}

.unselectable {
  user-select: none;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
}

// style icons in navbar
a.icon {
  display: inline-block;
  @include size(100%, 34px);
  // line-height: 34px;
  cursor: pointer;
  text-align: center;
  text-decoration: none;
  vertical-align: baseline;
  @include shadow-black(0.25);
  opacity: 0.99;
  color: white;
  border: none !important;
}
a.icon:hover { color: #F5F5F2; }
a.icon:hover, a.icon.active {
  // invert border on hover or active
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);
}

////////
/* MAIN LAYOUT COMPONENTS: #TITLE, #MAP, #NAVIGATION */
////////

#title {
  min-width: 320px;
  @include box-shadow(0 0 4px rgba(0,0,0,0.25));
  z-index: 1;

  h3 {
    text-transform: none;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }

  @media #{$desktop} {
    position: absolute;
    width: $sidebar_width;
  }
}

@import "map";

@import "navigation";<commit_msg>make sure the first letter is always capital in the title<commit_after>/* Fonts */
@import url(http://fonts.googleapis.com/css?family=Open+Sans:300italic,400,600,700|Pacifico);

/* Media sizes */
$desktop: "(min-width: 769px)";
$phone: "(max-width: 480px)";
$tablet: "(max-width: 768px)";

/* Here are our lovely colors: */
$wbGreen: #bbefce;
$wbGreenDark: #a1d0b1;
$wbBlue: #93d2d0;
$wbBlueDark: #679a98;
$wbRed: #dc6a4c;
$wbRedDark: #a7442a;

/* Change Bootstrap variables before importing */
$sansFontFamily: "Open Sans", sans-serif;
$navbarBackground: $wbGreenDark;
$navbarBackgroundHighlight: $wbGreen;

$linkColor: $wbBlueDark;
$linkColorHover: darken($wbBlue, 5%);

@import "./bootstrap";

@import "mixins";



$navbar_height: 40px;
$nav_height_base: $navbar_height;
$title_height: 30px;
$sidebar_width: 400px;
$sidebar_margin: 12px;
$map_height_phone: 150px;
$map_height_tablet: 260px;
$borderRadius: 7px;
$settings_menu_width: 230px;

body {
  background: image-url("background/background-stripes.png") repeat #dcdcd7;
}

a:not(.btn):not(.close):hover {
  text-decoration: none;
  border-bottom: 1px dotted;
}

input.location {
  @include size(43px, 98%);
  margin: 0px;
  padding: 0px 1%;
  font-size: 18px;
  font-weight: 300;
  line-height: 1.3em;
  text-align: center;
  @include box-shadow(0px 2px 8px 0px rgba(0, 0, 0, 0.15) inset);
  @include placeholder(#94978C);
}

body > .container-fluid, #container {
  @include stretch($navbar_height, 0, 0, 0);
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}
.container-fluid {
  max-width: 900px;
  margin: auto;
}



/* HEADER STYLES */
header {
  // height: 100%;
  position: relative;
  padding: 0 $sidebar_margin;
  text-transform: uppercase;
  box-sizing: border-box;
  @include shadow-black(0.25);
  h1, h2, h3, h4, h5, h6 {
    font-weight: 600;
    line-height: auto;
    margin: 0;
  }
  h2 { font-size: 24px; }
  h3 { font-size: 18px; line-height: 30px; }
  h4 { font-size: 14px; small { font-size: 12px;} }
  [class^="icon-"], [class*=" icon-"] {
    font-size: 18px;
  }
  .affordance {
    float: left;
    font-size: 20px;
    position: absolute;
    top: 50%;
    left: -1px;
    margin-top: -10px;
  }
}

header, .gradient, header:hover, .gradient:hover { 
  color: white; 
  @include shadow-black(0.25);
}
header.red, .gradient.red {
  border-top: 1px solid #f48668;
  border-bottom: 1px solid #762a16;
  @include gradient-vertical(#dc6a4c, #a7442a);
  background-color: #a7442a;
}
header.light-gray, .gradient.light-gray {
  border-top: 1px solid;
  border-bottom: 1px solid;
  border-color: #d2d2d2;
  @include gradient-vertical(#e1e0e0, #d2d2d2);
  background-color: darken(#d2d2d2, 1%);
}
header.gray, .gradient.gray {
  border-bottom: 1px solid;
  border-color: #57564d;
  @include gradient-vertical(#939285, #7a796e);
  background-color: darken(#7a796e, 1%);
}
header.blue, .gradient.blue {
  border-bottom: 1px solid;
  border-color: #5e9b99;
  @include gradient-vertical(#93d2d0, #679a98);
  background-color: darken(#679a98, 1%);
}
header.teal, .gradient.teal {
  $light: #93d2d0;
  $dark: #679a98;
  border-top: 1px solid lighten($light, 10%);
  border-bottom: 1px solid darken($dark, 10%);
  @include gradient-vertical($light, $dark);
  background-color: darken($dark, 1%);
}
header.green, .gradient.green {
  border-top: 1px solid $wbGreenDark;
  border-bottom: 1px solid $wbGreenDark;
  @include gradient-vertical($wbGreen, $wbGreenDark);
  background-color: darken($wbGreenDark, 1%);
}



.cozy { padding: 10px 20px; }
.compact { padding: 5px 10px; }

.close {
  width: 20px;
  text-align: center;
  line-height: inherit;
  z-index: 2000;
}

.unselectable {
  user-select: none;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
}

// style icons in navbar
a.icon {
  display: inline-block;
  @include size(100%, 34px);
  // line-height: 34px;
  cursor: pointer;
  text-align: center;
  text-decoration: none;
  vertical-align: baseline;
  @include shadow-black(0.25);
  opacity: 0.99;
  color: white;
  border: none !important;
}
a.icon:hover { color: #F5F5F2; }
a.icon:hover, a.icon.active {
  // invert border on hover or active
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);
}

////////
/* MAIN LAYOUT COMPONENTS: #TITLE, #MAP, #NAVIGATION */
////////

#title {
  min-width: 320px;
  @include box-shadow(0 0 4px rgba(0,0,0,0.25));
  z-index: 1;

  h3 {
    text-transform: none;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }
  h3:first-letter {
    text-transform: uppercase;
  }

  @media #{$desktop} {
    position: absolute;
    width: $sidebar_width;
  }
}

@import "map";

@import "navigation";
{'fraction_non_alphanumeric': 0.16751599262712782, 'fraction_numerical': 0.06234413965087282, 'mean_word_length': 3.8959660297239913, 'pattern_counts': {'":': 0, '<': 3, '<?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': 2, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '402296', 'n_tokens_mistral': 4136, 'n_tokens_neox': 3623, 'n_words': 814}