application.css.scss

/*
*= require_self
*= require_tree .
*/


/*
*= require jquery.ui.core
*= require jquery.ui.theme
*= require _font-awesome
*= require token-input-facebook
*= require dataTables/src/demo_table_jui
*= require bootstrap-multiselect
*= require bootstrap-datetimepicker
*= require fullcalendar
*= require fullcalendar.print
*= require dataTables/extras/TableTools
*= require dataTables/extras/TableTools_JUI
*/
@import "bootstrap";



body {
  background-color: #d0dde3 !important;
}

// Start Form Sign
.form-signin {
  max-width: 330px;
  padding: 15px;
  margin: 0 auto;
}
.form-signin .form-signin-heading,
.form-signin .checkbox {
  color: #726E6E;
  margin-bottom: 10px;
}
.form-signin .checkbox {
  font-weight: normal;
  float: left;
}
.form-signin .form-control {
  position: relative;
  font-size: 16px;
  height: auto;
  padding: 10px;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}
.form-signin .form-control:focus {
  z-index: 2;
}
.form-signin input[type="text"] {
  margin-bottom: -1px;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}
.form-signin input[type="password"] {
  margin-bottom: 10px;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
.form-signin-button {
  @extend .btn, .btn-lg, .btn-primary, .btn-block;
  background-color: #40637F;
}
// End Form Sign in

// For Errors
// ----------
.formErrors {
  padding: 5px;
  h5 { font-weight: bold; }
  font-weight: bold;
  ul li { color: red }
  border: 1px solid gray;
  margin: 10px;
}

.field_with_errors {
  display: inline !important;
  textarea, input, select { border: 1px solid red}
}

.pretty-input {
  height: 31px;
  @extend .form-control
}

.note{
  @extend .col-lg-4;
  font-weight: bold;
  background-color: white;
  border: 1px solid #cccccc;
  border-radius: 4px;
  padding: 6px 12px;
}

.form-data .data .information { @extend .col-md-1;
                                padding-top:1% !important;}

schedules.css.scss

@import "bootstrap";

$blue-color: #40637F;
$light-blue-color: #d0dde3;
$color-blue: #40637F;
$color-dark-blue: #213E55;

#sub-header-schedules {

  .new-schedule {
    @extend .btn, .btn-primary, .btn-xs, .pull-left;
    background-color: $blue-color;
  }

  h3 {
    color: $blue-color;
    display: block;
    text-align: center;
  }

  .pretty-input {
    width: 95%;
    margin-left: 10px;
  }

  .new-button {
    @extend .btn, .col-md-offset-4, .col-sm-4;
    background-color: $blue-color;
    margin-bottom: 20px;
    margin-top: 20px;
    color: white;
  }

  .edit-button {
    @extend .btn, .col-md-offset-3;
    background-color: $blue-color;
    margin-bottom: 20px;
    margin-top: 20px;
    color: white;
  }

  .danger {
    background-color: #d43f3a !important;
  }

  .modal {
    @extend .fade, .bs-modal-lg !optional;
    .dialog {
      @extend .modal-dialog, .modal-lg;
      .label-modal {
        @extend .label;
        display: block;
        font-size: 100%;
        padding: 7px;
        color: $blue-color;
      }
    }
  }

  .icon-calendar {
    @extend .glyphicon, .glyphicon-calendar;
  }

  #datetimepicker-start, #datetimepicker-end,
  #edit-datetimepicker-start, #edit-datetimepicker-end {
    @extend .input-group, .date;
    margin-right: 16px;
    margin-left: 0px;
  }
}

#body-schedule {
  @extend .container;
  width: 98%;
  background-color: #fcf8e3;

  #calendar {
    width: 0 auto;
    margin: 10px auto;
    background-color: $light-blue-color;

    .fc-content {
      clear: both;
      background-color: #fcf8e3;
    }

    .fc-today {
      background-color: #fcf8e3;
    }

  }
}