1 files changed, 67 insertions, 38 deletions

diff --git a/public/assets/stylesheets/app.css b/public/assets/stylesheets/app.css
index ff35ca4..c2e7119 100755
--- a/public/assets/stylesheets/app.css
+++ b/public/assets/stylesheets/app.css
@@ -768,13 +768,13 @@ iframe.embed {
   content:"show map";
 }
 .fixed {
-  position:fixed;
-  top:0;
-  left:0;
-  width:100%;
-  height:100%;
-  z-index:3;
-  overflow-y:scroll;
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  z-index: 3;
+  overflow-y: scroll;
 }
 
 .fixed::-webkit-scrollbar {
@@ -794,7 +794,7 @@ iframe.embed {
 }
 
 .fixed::-moz-scrollbar-track {
-  background:white;
+  background: white;
 }
 
 .fixed::-moz-scrollbar-thumb{
@@ -1099,14 +1099,14 @@ iframe.embed {
 
 /* WALLPAPER PICKER */
 
-.wallpaper{
+.wallpaper {
   right: 80px;
   margin-top: 77px;
   width: 162px;
   z-index: 1;
   -webkit-transition: -webkit-transform 0.1s ease-in-out;
   -webkit-transform: translateX(400px);
-  transition: -webkit-transform 0.1s ease-in-out;
+  transition: transform 0.1s ease-in-out;
   transform: translateX(400px);
 }
 .wallpaper.active {
@@ -1114,46 +1114,68 @@ iframe.embed {
   -webkit-transform: translateX(0px);
   transform: translateX(0px);
 }
-.wallpaper.active span {
+.wallpaper.active .swatches .swatch {
   width: 40px;
-  height: 35px;
+  height: 40px;
   display: inline-block;
-  float: left;
-  border:1px solid;
-  background: url(../img/MacPaint.gif);
+  border: 1px solid;
+  background-size: contain;
   -webkit-transition: -webkit-transform 0.1s ease-in-out;
+  line-height: 0;
+  vertical-align: text-bottom;
   -webkit-user-drag: element;
 }
-
-.wallpaper.active span:nth-child(1){
-  background-position:103px 70px;
+.wallpaper.active .swatches .swatch:hover {
+  cursor: pointer;
+  -webkit-transform: translateX(3px) translateY(-3px);
+  transform: translateX(3px) translateY(-3px);
 }
-.wallpaper.active span:nth-child(2){
-  background-position:200px -98px;
+.wallpaper .swatches {
+  width: 100%;
+  border-bottom: 1px solid black;
+  min-height: 30px;
 }
-.wallpaper.active span:nth-child(3){
-  background-position:200px -260px;
+.wallpaperUpload {
+  font-size: 14px;
+  font-weight: 300;
 }
-.wallpaper.active span:nth-child(4){
-  background-position:200px -350px;
+.wallpaperUpload label {
+  position: relative;
+  top: -6px;
+  float: none;
 }
-.wallpaper.active span:nth-child(5){
-  background-position:200px -484px;
+.wallpaperUpload .icon-ios7-upload-outline {
+  font-size: 26px;
 }
-.wallpaper.active span:nth-child(6){
-  background-position:200px -581px;
+.wallpaperUpload .upload-icon.uploading {
 }
-.wallpaper.active span:nth-child(7){
-  background-position:200px -645px;
+.wallpaperUpload .upload-icon.uploading:before {
+	content: ' ' !important;
+	background-image: url("/assets/img/loader.gif");
+	background-repeat: no-repeat;
+	width: 40px;
+	height: 40px;
 }
-.wallpaper.active span:nth-child(8){
-  background-position:200px -772px;
+.wallpaperUpload input[type="text"]{
+  border: 1px solid #ccc;
+  font-size: 15px;
+  padding: 5px;
+  width: 100px;
+  text-align: center;
+  border-radius: 20px;
 }
-
-.wallpaper.active span:hover {
-  cursor: pointer;
-  -webkit-transform: translateX(3px) translateY(-3px);
-  transform: translateX(3px) translateY(-3px);
+.wallpaperUpload input[type="text"]:focus{
+  border: 1px solid #000;
+}
+.wallpaperUpload input[type="file"]{
+  position: absolute;
+  margin-left: -134px;
+  background: blue;
+  height: 28px;
+  width: 100%;
+  margin-top: 0px;
+  opacity: 0;
+  cursor:pointer;
 }
 
 
@@ -1201,6 +1223,7 @@ input[type="range"]::-webkit-slider-thumb {
   height: 20px;
   border: 1px solid black;
   display: inline-block;
+  cursor: pointer;
 }
 .swatch.selected {
   border-width: 2px;
@@ -1213,7 +1236,13 @@ input[type="range"]::-webkit-slider-thumb {
   font-weight: 300;
   position: relative;
   top: -6px;
-  margin-right: 15px;
+  padding-left: 5px;
+  display: inline-block;
+  min-width: 35px;
+  cursor: pointer;
+}
+.color-swatches label.selected {
+  font-weight: 500;
 }