yegor256/thindeck

View on GitHub
website/pony-site.css

Summary

Maintainability
Test Coverage
@import url(http://fonts.googleapis.com/css?family=Roboto+Slab:400,300,100,700);
@import url(http://fonts.googleapis.com/css?family=Ubuntu+Condensed);
@import url(http://fonts.googleapis.com/css?family=Inconsolata:400,700);
@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,300,600);
@import url(http://fonts.googleapis.com/css?family=Economica:400,700);
.text-field, .signup-email-field {
  position: relative;
  border-radius: 0px;
  cursor: pointer;
  border: 0;
  width: 100%;
  outline: none;
  white-space: nowrap; }

.text-field, .signup-email-field {
  transition: all 0.3s ease !important;
  -moz-transition: all 0.3s ease !important;
  -o-transition: all 0.3s ease !important;
  -webkit-transition: all 0.3s ease !important;
  font-family: "Open Sans";
  font-weight: 300;
  color: #1d1d26;
  background-color: #9393ae;
  cursor: text;
  font-size: 20px;
  padding: 11.11111px;
  box-shadow: inset 0 1px 2px #8585a3; }
  .text-field:hover, .signup-email-field:hover {
    transition: all .3s ease;
    background-color: #9696b0; }
  .text-field:focus, .signup-email-field:focus {
    transition: all .3s ease;
    background-color: #a2a2b9; }

::-webkit-input-placeholder {
  color: #69698c; }

::-moz-placeholder {
  color: #69698c; }

:-ms-input-placeholder {
  color: #69698c; }

.brand {
  font-weight: 700;
  font-size: 90px;
  font-family: 'Economica', serif;
  text-shadow: 10px 7px 0px #3a3b4c; }

.bolder {
  font-weight: 400; }

.number-slab {
  font-weight: 700;
  font-family: 'Economica', serif;
  font-size: 140px; }

.number-1 {
  background-color: #eae3d7; }

.number-2 {
  background-color: #e6ded0; }

.number-3 {
  background-color: #dfd5c3; }

.grad {
  background: #111117;
  /* Old browsers */
  background: -moz-linear-gradient(45deg, #111117 0%, #2a2a38 100%);
  /* FF3.6+ */
  background: -webkit-gradient(linear, left bottom, right top, color-stop(0%, #111117), color-stop(100%, #2a2a38));
  /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(45deg, #111117 0%, #2a2a38 100%);
  /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(45deg, #111117 0%, #2a2a38 100%);
  /* Opera 11.10+ */
  background: -ms-linear-gradient(45deg, #111117 0%, #2a2a38 100%);
  /* IE10+ */
  background: linear-gradient(45deg, #111117 0%, #2a2a38 100%);
  /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#111117', endColorstr='#2a2a38',GradientType=1 );
  /* IE6-9 fallback on horizontal gradient */ }

.grad-light {
  background: #d5d5e8;
  /* Old browsers */
  background: -moz-linear-gradient(-45deg, #d5d5e8 0%, white 100%);
  /* FF3.6+ */
  background: -webkit-gradient(linear, left top, right bottom, color-stop(0%, #d5d5e8), color-stop(100%, white));
  /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(-45deg, #d5d5e8 0%, white 100%);
  /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(-45deg, #d5d5e8 0%, white 100%);
  /* Opera 11.10+ */
  background: -ms-linear-gradient(-45deg, #d5d5e8 0%, white 100%);
  /* IE10+ */
  background: linear-gradient(135deg, #d5d5e8 0%, white 100%);
  /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#d5d5e8', endColorstr='#ffffff',GradientType=1 );
  /* IE6-9 fallback on horizontal gradient */ }

.grad-light-brown {
  background: #fcf3ea;
  /* Old browsers */
  background: -moz-linear-gradient(-45deg, #fcf3ea 0%, white 100%);
  /* FF3.6+ */
  background: -webkit-gradient(linear, left top, right bottom, color-stop(0%, #fcf3ea), color-stop(100%, white));
  /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(-45deg, #fcf3ea 0%, white 100%);
  /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(-45deg, #fcf3ea 0%, white 100%);
  /* Opera 11.10+ */
  background: -ms-linear-gradient(-45deg, #fcf3ea 0%, white 100%);
  /* IE10+ */
  background: linear-gradient(135deg, #fcf3ea 0%, white 100%);
  /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fcf3ea', endColorstr='#ffffff',GradientType=1 );
  /* IE6-9 fallback on horizontal gradient */ }

.border-bottom {
  border-bottom: 1px solid white; }

.border-top {
  border-top: 1px solid white; }

.sub-grad {
  background-color: rgba(255, 255, 255, 0.1); }

.beta {
  background-color: white; }

.signup-element {
  width: 100%;
  font-size: 0; }
  .signup-element div {
    display: inline-block; }
  .signup-element div > input {
    border-bottom-right-radius: 0;
    border-top-right-radius: 0;
    padding: 20px; }
  .signup-element div > button {
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
    padding: 20px; }

.signup-email-field {
  background-color: #5f627d;
  color: #2e3042;
  box-shadow: inset 0px 0px 0px #8585a3; }
  .signup-email-field:hover {
    background-color: #5f627d; }
  .signup-email-field:focus {
    background-color: #595b75; }
  .signup-email-field::-webkit-input-placeholder {
      color: #2e3042;}

.face-icon {
  font-size: 200px !important; }

.teamed-button {
  width: 300px; }

.box-image {
  width: 120px; }

.thindeck-logo {
  width: 150px; }

#signed-up-container {
  display: none; }

.black {
  color: #000; }

.new-slogan-background {
  background-color: #504f6b; }

.slab {
  font-family: "Roboto Slab"; }

.footer-font, .footer-link {
  color: #80839f;
  font-weight: 400;
  text-shadow: 0px 1px 0px #3a3b4c; }

.footer-link {
  color: #c9cad6 !important;
  border-bottom: 1px dotted #c9cad6; }
  .footer-link:hover {
    color: white !important; }

#signed-up-container-success, #signed-up-container-failure {
    display: none;
}

#wait-icon {
    font-size: 100px !important;
    display: none;
}