StabbyMcDuck/crapper_keeper

View on GitHub
app/assets/stylesheets/application.scss

Summary

Maintainability
Test Coverage
/*
 * 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.
 *
 */
@import "bootstrap-sprockets";
@import "bootstrap";

body{
  padding-top: 65px;
}

h1, h2 {
  font-family: 'Bungee Shade', cursive;
}

h3, h4, h5, p {
  font-family: 'Raleway', sans-serif;
}

.header-content {
  text-align: center;
}

.header-content h1 {
  font-size: 60px;
}

header {
  padding-top: 30px;
  padding-bottom: 30px;

}

.sign_in_section {
  background-image: url('/tools.jpeg');
  height: 100%;

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;

  color: white;
  padding-top: 80px;
  padding-bottom: 100px;
}


.btn-lg {
  color: white;
  font-weight: bolder;
}

.large-font-sign-in .btn {
  background: white;
  color: black;
  border-radius: 24px;
  font-size: 75%;
}

.large-font-sign-in .btn:hover {
  background: lightgray;
}

.large-font-sign-in .btn.outline {
  background: none;
}

#add_some_crap .btn {
  background: white;
  color: black;
  border-radius: 24px;
  font-size: 75%;
}

#add_some_crap .btn.outline {
  background: none;
}

#add_some_crap .btn:hover {
  background: lightgray;
}

a {
  color: inherit;
}

@media screen and (max-width: 770px){
    .large-font-sign-in .btn {
      font-size: 16px;
    }
}

@media screen and (min-width:771px) and (max-width:1040px){
    .large-font-sign-in .btn {
      font-size: 16px;
    }
}

.checkbox label {
  padding-left: 5px;
  padding-right: 25px;
}

.radio-button label {
  padding-right: 25px;
  padding-left: 10px;
}