boconnect_theme 0.1.0

data/.gitignore

@@ -0,0 +1 @@
+.DS_Store

data/README.md

@@ -0,0 +1,22 @@
+SUMMARY
+-------
+
+BoCONNECT Theme is a standalone theme for Spree Commerce version used in http://boconnect.com.br, based on the original Spree Blue Theme.
+
+INSTALLATION
+------------
+
+1. Add the following line to your Gemfile:
+
+    gem 'boconnect_theme', :git => 'git://github.com/heavenstudio/boconnect_theme.git'
+
+**NOTE:** It's important that you add this line at the bottom of the Gemfile, or at least AFTER any other extension/engine/gem that you'd like to theme (i.e. Spree)
+
+2. And install:
+
+    $ bundle install
+
+3. Optional: Clear out precompiled assets (required for install in sandbox):
+
+    $ rake assets:clean
+    

data/app/assets/stylesheets/store/basic.css.scss

@@ -0,0 +1,23 @@
+@import 'colors';
+
+body {
+  line-height: 1em;
+  color: black;
+  background: #ffffff;
+}
+
+
+/* Line style */
+hr {
+  border-color: $c_border;
+}
+
+/* Custom text-selection colors (remove any text shadows: twitter.com/miketaylr/status/12228805301) */
+::-moz-selection{background: $c_colored; color: white; text-shadow: none;}
+::selection {background: $c_colored; color: white; text-shadow: none;} 
+
+/*  j.mp/webkit-tap-highlight-color */
+a:link {-webkit-tap-highlight-color: $c_colored;} 
+
+ins {background-color: $c_colored; color: white; text-decoration: none;}
+mark {background-color: $c_colored; color: white; font-style: italic; font-weight: bold;}

data/app/assets/stylesheets/store/checkout.css.scss

@@ -0,0 +1,166 @@
+@import 'colors';
+
+.progress-steps {
+  list-style: decimal inside;
+  overflow: auto;
+
+  li {
+    float: left;
+    margin-right: 20px;
+    font-weight: bold;
+    text-transform: uppercase;
+    padding: 5px 20px;
+    color: $c_gray;
+
+    &.current-first, &.current {
+      background-color: $c_colored;
+      color: white;
+    }
+
+    &.completed-first, &.completed {
+      background-color: $c_border;
+      color: white;
+
+      a {
+        color: white;
+      }
+
+      &:hover {
+        background-color: $c_colored;
+        color: white;
+
+        a {
+          color: white;
+
+          &:hover {
+            color: white !important;              
+          }
+        }
+      }
+    }
+  }
+}
+
+#checkout-summary {
+  text-align: center;
+  border: 1px solid $c_border;
+  margin-top: 23px;
+  margin-left: 0;
+
+  h3 {
+    text-transform: uppercase;
+    font-size: 14px;
+    color: $c_colored;
+    border-bottom: 1px solid $c_border;
+  }
+
+  table {
+    width: 100%;
+
+    tr[data-hook="item_total"] {
+      td:last-child {
+        strong {
+          @extend span.price;
+        }
+      }
+    }
+
+    tr[data-hook="order_total"] {
+      border-bottom: none;
+    };
+
+    #summary-order-total {
+      @extend span.price;
+      font-size: 14px;
+    }      
+  }
+}
+
+#billing, #shipping, #shipping_method, 
+#payment, #order_details, #order_summary {
+  margin-top: 10px;
+  border: 1px solid $c_border;
+  padding: 10px;
+
+  legend {
+    text-transform: uppercase;
+    font-weight: bold;
+    font-size: 14px;
+    color: $c_colored;
+    padding: 5px;
+    margin-left: 15px;
+  }
+}
+
+#order_details, #order_summary {
+  padding: 0;
+
+  div:last-child {
+    margin-left: -1px;
+  }
+
+  .payment-info {
+    .cc-type {
+      img {
+        vertical-align: middle;
+      }
+    }
+  }
+
+  td.price, td.total {
+    span {
+      @extend span.price;
+    }
+  }
+
+  table tfoot {
+    text-align: right;
+    color: $c_gray;
+
+    tr {
+      border: none;
+    }
+
+    &#order-total {
+      text-transform: uppercase;
+      font-size: 16px;
+      color: $c_base;
+
+      tr { 
+        border-top: 1px solid $c_border;
+          
+        td {
+          padding: 10px; 
+        }
+      }
+    }
+  }
+
+  .steps-data {
+    padding: 10px;
+
+    h6 {
+      border-bottom: 1px solid $c_border;
+      margin-bottom: 5px;
+    }
+  }
+}
+
+#shipping_method {
+  p {
+    label {
+      float: left; 
+      font-weight: bold;
+      font-size: 14px;
+      margin-right: 40px;
+      padding: 5px;
+    }
+  }
+}
+
+p[data-hook="use_billing"] {
+  float: right;
+  margin-top: -38px;
+  background-color: white;
+  padding: 5px;
+}

data/app/assets/stylesheets/store/colors.css.scss

@@ -0,0 +1,7 @@
+$c_base:        #404042;
+$c_gray:        #bbbbbb;
+$c_colored:     #00ADEE;
+$c_colored_alt: #f0f8ff;
+$c_border:      #dedede;
+$c_green:       #8dba53;
+$c_red:         #e45353;

data/app/assets/stylesheets/store/flash_notices.css.scss

@@ -0,0 +1,36 @@
+@import 'colors';
+
+.flash {
+  padding: 10px;
+  color: white;
+  font-weight: bold;
+  margin-bottom: 10px;
+
+  &.notice {
+    background-color: $c_colored;
+  }
+  &.success {
+    background-color: $c_green;
+  }
+  &.error {
+    background-color: $c_red;
+  }
+}
+
+.errorExplanation {
+  @extend .flash.error;
+  @extend .flash;
+
+  p {
+    font-weight: normal;
+  }
+
+  ul {
+    list-style: disc outside;
+    margin-left: 30px;
+
+    li {
+      font-weight: normal;
+    }
+  }
+}

data/app/assets/stylesheets/store/forms.css.scss

@@ -0,0 +1,100 @@
+@import 'colors';
+
+textarea, input[type="date"], 
+input[type="datetime"], input[type="datetime-local"],
+input[type="email"], input[type="month"], input[type="number"],
+input[type="password"], input[type="search"], input[type="tel"],
+input[type="text"], input[type="time"], input[type="url"], 
+input[type="week"] {
+  border: 1px solid $c_border;
+  padding: 2px 5px;    
+  font-family: "Ubuntu", sans-serif;
+
+  &:active, &:focus {
+    border-color: $c_colored;
+    outline: none;
+    -webkit-box-shadow: none;
+    -moz-box-shadow: none;
+    -o-box-shadow: none;
+    box-shadow: none;
+  }
+
+  &.error {
+    border-color: $c_red;
+  }
+}
+
+select {
+  border: 1px solid $c_border;
+  font-family: "Ubuntu", sans-serif;
+  background-image: url('select_arrow.gif');
+  background-repeat: no-repeat;
+  background-position: right center;
+
+  &:active, &:focus {
+    @extend input[type="text"]:focus  
+  }
+}
+
+label.error {
+  display: block;
+  font-size: 11px;
+  color: $c_red;
+  margin-top: 3px;
+}
+
+input[type="submit"], input[type="button"],
+input[type= "reset"], button, a.button {
+  background-color: $c_colored;
+  background-image: none;
+  text-shadow: none;
+  color: white;
+  font-weight: bold;
+  font-family: "Ubuntu", sans-serif;
+  border: 1px solid rgba(0, 138, 189, .75);
+  -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,0.4);
+   -khtml-box-shadow: inset 0 1px 0 rgba(255,255,255,0.4);
+     -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,0.4);
+       -o-box-shadow: inset 0 1px 0 rgba(255,255,255,0.4);
+          box-shadow: inset 0 1px 0 rgba(255,255,255,0.4);
+  -webkit-border-radius: 0px;
+   -khtml-border-radius: 0px;
+     -moz-border-radius: 0px;
+      -ms-border-radius: 0px;
+       -o-border-radius: 0px;
+          border-radius: 0px;
+    
+  // font-size: 13px;
+  vertical-align:  text-top;
+
+  &.large {
+    padding: 7px 10px;
+    font-size: 14px;
+  }
+
+  &:hover {
+    background-image: none;
+    background-color: $c_base;
+    border-color: $c_base;
+    color: white !important;
+  }
+}
+
+.ie8 {
+  a.button {
+    line-height: 16px;
+  }
+} 
+
+input[type="checkbox"], input[type="button"],
+input[type="submit"], input[type="reset"], 
+button, label {
+  vertical-align: middle;
+}
+
+a.button {
+  display: inline-block;
+  line-height: 15px;
+  margin-top: -2px;
+  vertical-align: bottom;
+}