vinc/pi.ctu.re

/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
 * or any plugin's vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS/SCSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *
 *= require font-awesome
 *= require justifiedGallery/dist/css/justifiedGallery.css
 *= require dropzone
 *= require_tree .
 *= require_self
 */

$primary: #0C9;
$font-family-sans-serif: "Roboto Slab", sans-serif;
$font-family-base: $font-family-sans-serif;
$font-size-base: 1.1rem;

@import "bootstrap";

.turbolinks-progress-bar {
  background-color: $primary;
}

.container {
  position: relative;
}

body {
  text-align: inherit;
}

body,
.wrapper {
  min-height: 100vh;
}

.navbar-footer {
  color: $gray-600;
  a {
    color: $gray-600;
  }

  span {
    white-space: nowrap;
  }
}

body.infinite-scrolling {
  .navbar-footer {
    display: none;
  }
}

.navbar .search {
  @include media-breakpoint-only(md) {
    width: 14rem;
  }
  @include media-breakpoint-up(lg) {
    width: 24rem;
  }
}

.search {
  .input-group {
    .btn {
      border-color: $input-border-color;
      border-left-color: transparent;
    }
    .btn-outline-secondary:hover {
      border-color: $secondary;
    }
  }
}

.custom-file-control {
  overflow: hidden;

  &::after {
    content: attr(data-content) !important;
    width: 100%;
    overflow-x: hidden;
    position: absolute;
    padding-right: 7rem;
    text-overflow: ellipsis;
  }
}

.card-columns {
  @include media-breakpoint-only(xs) {
    column-count: 2;
    .card {
      margin-bottom: 0.75rem;
      .card-body {
        padding: 0.5rem;
      }
    }
  }
  @include media-breakpoint-only(xl) {
    column-count: 4;
  }
}

.navbar.bg-light {
  border-bottom: solid 1px $card-border-color;
}

.overflow-hidden {
  overflow: hidden;
}

.form-group-pictures {
  .custom-control-input:checked ~ .custom-control-label {
    background: lighten($primary, 33%);
  }

  .custom-control-label {
    &::before,
    &::after {
      top: inherit;
      left: inherit;
      bottom: 1rem;
      right: 1rem;
      height: 1.5rem;
      width: 1.5rem;
    }

    &::before {
      background: #eee6;
      border-radius: 50%;
      box-shadow: none !important;
    }
  }
}