scottwillson/racing_on_rails

$font-size-base: 13px;
$font-size-bigger: 14px;
$font-size-smaller: 10px;

$line-height-base: 1.2308;
$line-height-computed: 16px;

$headings-font-weight: 900px;
$font-family-serif: 'Open Sans', sans-serif;
$font-family-sans-serif: 'Open Sans', sans-serif;

$icon-font-path: "/fonts/";
$icon-font-name: "glyphicons-regular";

$black: rgb(0, 0, 0);
$near-black: rgb(30, 30, 30);
$gray-darker: rgb(54, 54, 54);
$gray: rgb(109, 109, 109);
$mid-gray: rgb(128, 128, 128);
$light-gray: rgb(204, 204, 204);
$gray-lighter: rgb(238, 238, 238);
$gray-lightest: rgb(250, 250, 250);
$warm-gray: rgb(228, 228, 224);
$warm-gray-light: rgb(250, 250, 248);
$green-yellow: rgb(208, 250, 48);
$white: rgb(255, 255, 255);

$highlight-color: $green-yellow;
$brand-primary: black;
$font-color-light: $gray;
$font-color: $gray-darker;
$form-color: $font-color;

$link-color: $font-color;
$link-color-hover: $black;

$nav-background-color: $white;
$nav-font-color: $black;

$body-background-color: $warm-gray;
$content-background-color: $warm-gray-light;
$content-border-color: $light-gray;

$table-border: darken($warm-gray, 18);

$container-tablet: 100%;
$container-sm : 100%;
$container-desktop: 100%;
$container-md : 100%;
$container-large-desktop: 100%;
$container-lg : 100%;

$content-margin-bottom: 16px;
$content-padding: 16px;

$pagination-active-bg: $gray-lighter;
$pagination-color: $mid-gray;
$pagination-active-color: $mid-gray;
$pagination-active-border: $light-gray;
$pagination-disabled-color: $light-gray;

$input-border-focus: darken($highlight-color, 15);

<% if File.exist?("local/app/assets/stylesheets/_racing_association_variables.scss") %>
@import "racing_association_variables";
<% end %>

@import "bootstrap-sprockets";
@import "bootstrap";
@import "bootstrap/theme";

body {
  background-color: $body-background-color;
  color: $font-color;
  padding-top: $line-height-computed;
  padding-bottom: $line-height-computed;
}

.container {
  padding-left: 3%;
  padding-right: 3%;
}

.container .container {
  padding-left: 0;
  padding-right: 0;
}

body nav a:hover, body a:hover, a:hover, .btn-link:hover {
  background-color: $highlight-color;
  color: $link-color-hover;
  text-decoration: underline;
  text-shadow: none;
}

.nav-pills > li > a:hover, {
  background-color: $highlight-color;
  color: white;
}

.btn-link, a.obvious {
  text-decoration: underline;
}

body a.icon:hover, a.icon:hover {
  background-color: transparent;
}

body a.icon:active, a.icon:active {
  background-color: transparent;
  color: $highlight-color;
}

.section {
  padding-top: $line-height-computed * 3;
}

h2, h2 a, h2 a:hover {
  color: $link-color-hover;
  text-align: center;
  text-decoration: none;
}

h3, h3 a, h3 a:hover {
  color: $link-color-hover;
  text-align: center;
  text-decoration: none;
}

h2 a:hover, h3 a:hover {
  background-color: $highlight-color;
}

.navbar li {
  text-transform: uppercase;
}

.navbar li .dropdown-menu li {
  text-transform: none;
}

@media (max-width: 767px) {
  .navbar-header {
    align-items: center;
    display: flex;
    padding-left: 15px;
    padding-right: 15px;
  }

  .navbar-brand {
    height: 67px;
    flex: auto;
    padding-bottom: 0px;
    padding-left: 34px;
    padding-right: 0px;
    padding-top: 0px;
  }

  .navbar-brand img {
    display: block;
    margin-left: auto;
    margin-right: auto;
    height: 67px;
    line-height: 67px;
  }

  .navbar-toggle {
    flex: none;
    margin-right: 0px;
    padding-right: 0px;
    text-align: right;
  }
}

.icon-bar {
  background-color: black;
}

.navbar {
  min-height: $line-height-computed;
}

.navbar-toggle {
  margin-bottom: 0;
  margin-top: 0;
}

.navbar-nav > li > a {
  border-right: 1px solid $nav-font-color;
  line-height: $line-height-computed;
  margin-bottom: $line-height-computed / 4;
  margin-top: $line-height-computed / 4;
  padding-left: $line-height-computed / 2;
  padding-right: $line-height-computed / 2;
  padding-bottom: 0;
  padding-top: 0;
}

.navbar .links {
  font-size: 18px;
  text-align: center;
}

@media (max-width: 767px) {
  .navbar-nav > li > a {
    border-right: none;
  }
}

.navbar-nav > li:last-child > a {
  border-right: none;
}

nav li {
  padding-left: 0;
  padding-right: 0;
}

.footer .navbar-nav {
  margin-bottom: $line-height-computed;
  float: none;
  margin: 0 auto;
  display: table;
  table-layout: fixed;
}

.footer .navbar-nav li {
  float: left;
}

.page-nav, .footer {
  margin-bottom: $line-height-computed;
}

.page-nav, .social {
  border-left: 0;
  border-right: 0;
  height: $line-height-computed;
}

.navbar-nav > li > a.social {
  border-right: 0;
  padding-right: $line-height-computed / 4;
}

@media (max-width: 767px) {
  .page-nav {
    margin-bottom: $line-height-computed / 2;
  }

  h2 {
    font-size: 16px;
    line-height: $line-height-computed;
  }

  h3 {
    font-size: 12px;
    line-height: $line-height-computed;
  }
}

h4 {
  color: $gray;
  font-size: $font-size-base;
  line-height: $line-height-computed;
  margin-bottom: 0;
  margin-top: 0;
  padding-top: 4px;
}

.content {
  background-color: $content-background-color;
  border-radius: 6px;
  border: 1px solid $content-border-color;
  margin-bottom: $content-margin-bottom;
  padding: $content-padding;
}

@media (max-width: 979px) {
  .content {
    margin-bottom: $content-margin-bottom / 2;
    padding: $content-padding / 2;
  }
}

.table > thead > tr > th {
  border-bottom: none;
}

.table > thead > tr > th,
.table > thead > tr > td,
.table > tbody > tr > th,
.table > tbody > tr > td,
.table > tfoot > tr > th,
.table > tfoot > tr > td {
  border-top: none;
}

.table th, .table-striped tbody tr:nth-child(odd) th {
  background-color: $table-border;
  border-top: none;
  color: $near-black;
}

.table>thead>tr>th, .table>thead>tr>td, .table>tbody>tr>th, .table>tbody>tr>td, .table>tfoot>tr>th, .table>tfoot>tr>td {
  padding: 12px 8px;
}

.table-striped td {
  border-bottom: none;
}

.table-striped tbody tr:last-child td {
  border-bottom: none;
}

.table-striped tbody tr:nth-child(even) td, .table-striped tbody tr:nth-child(even) td:hover {
  background-color: lighten($warm-gray, 4);
}

.table-striped tbody tr:nth-child(odd) td, .table-striped tbody tr:nth-child(odd) td:hover {
  background-color: $warm-gray;
}

.table-striped.table th {
  padding: 12px 8px;
  font-size: 16px;
}

.table-striped td.icon {
  max-width: 22px;
  padding-right: 0;
  width: 22px;
}

.table-striped .check_box {
  text-align: center;
}

.odd {
  background-color: $warm-gray;
}

.even {
  background-color: lighten($warm-gray, 4);
}

.table-striped td.actions {
  padding-right: 16px;
  text-align: right;
  white-space: nowrap;

  a + a {
    margin-left: 8px;
  }
}

@media (max-width: 767px) {
  body {
    padding-left: 0;
    padding-right: 0;
    padding-top: $line-height-computed / 2;
  }

  .table td, .table th {
    padding-left: 4px;
    padding-right: 4px;
  }
}

.created_updated {
  color: $font-color-light;
  font-style: italic;
  .btn-link {
    text-decoration: none;
  }
  .btn-link:hover {
    text-decoration: underline;
  }
}

p.created_updated {
  text-align: center;
  padding-bottom: $line-height-computed;
}

.post div.date {
  margin-top: 8px;
}

.post div.date, .table .date {
  min-width: 80px;
  text-align: right;
  white-space: nowrap;
}

.table .date {
  max-width: 240px;
}

@media (max-width: 767px) {
  .post div.date, .table .date {
    width: auto;
  }

  .post div.date {
    text-align: left;
  }
}

th.numeric,
td.numeric {
  text-align: right;
}

.post {
  th.badges,
  td.badges {
    text-align: right;
  }

  td.badges {
    padding-top: 7px;
  }
}

.pills + table, .pills + p, .pills + .row, .pills + .event_notes, .pills + .event_info {
  margin-top: $line-height-computed;
}

.pills + .pills {
  margin-top: $line-height-computed / 4;
}

.nav-pills {
  float: none;
  margin: 0 auto;
  display: table;
  table-layout: fixed;
}

.nav-pills li a {
  color: $mid-gray;
}

.nav-pills > li.active > a, .nav-pills > li.active > a:hover, .nav-pills > li.active > a:focus {
    background-color: $gray-lighter;
    color: $mid-gray;
}

ul.page-links {
  margin-bottom: $line-height-computed / 4;
  margin-left: auto;
  margin-right: auto;
  padding-top: 0;
  padding-bottom: 0;
  text-align: center;
  width: auto
}

ul.page-links li {
  display: inline;
  padding-left: 8px;
  padding-right: 8px;
  border-left: 1px solid $light-gray;
}

ul.page-links li:first-child {
  border-left: none;
}
@media (max-width: 767px) {
  .alert {
    margin-top: $line-height-computed / 4;
  }
}

@-ms-keyframes Rotate {
  from {-ms-transform:rotate(0deg);}
  to {-ms-transform:rotate(360deg);}
}

@-moz-keyframes Rotate {
  from {-moz-transform:rotate(0deg);}
  to {-moz-transform:rotate(360deg);}
}

@-webkit-keyframes Rotate {
  from {-webkit-transform:rotate(0deg);}
  to {-webkit-transform:rotate(360deg);}
}

@keyframes Rotate {
  from {transform:rotate(0deg);}
  to {transform:rotate(360deg);}
}

.rotate {
  -ms-animation: Rotate 2s infinite linear;
  -moz-animation: Rotate 2s infinite linear;
  -webkit-animation: Rotate 2s infinite linear;
  animation: Rotate 2s infinite linear;
}

.dropdown {
  text-align: center;
  .dropdown-menu {
    text-align: left;
  }
}

.dropdown-menu > li > a {
  font-size: $font-size-bigger;
}

div.pagination {
  @include center-block();
  text-align: center;
}

ul.pagination {
  margin-bottom: 0;
}

@import "bootstrap-datepicker";
@import "jquery-ui-1.10.3.custom";
@import "forms";
@import "pages";
// Try to override Bootstrap
@import "glyphicons_pro";

<% if File.exist?("local/app/assets/stylesheets/_racing_association.scss") %>
@import "racing_association";
<% end %>

<% if Rails.env.test? %>
@import "disable_animations";
<% end %>