using native selects instead of the html selector for sizes

1 files changed, 17 insertions, 5 deletions

diff --git a/StoneIsland/www/css/products.css b/StoneIsland/www/css/products.css
index 63e9b020..5efef660 100755
--- a/StoneIsland/www/css/products.css
+++ b/StoneIsland/www/css/products.css
@@ -160,19 +160,31 @@
   display: flex;
   flex-direction: row;
 }
-.product .size-color span {
-  position:relative;
-  box-sizing:border-box;
-  padding: 0 12px;
+.product .size-color > div {
+  position: relative;
+  box-sizing: border-box;
   height: 48px;
   font-size: 1rem;
   display: flex;
   justify-content: center;
   align-items: center;
 }
-.product .size-color span.size {
+.product .size-color > div > div.label {
+  padding: 0 12px;
+  max-width: 6rem;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+.product .size-color div.size {
   border-right: 1px solid #444;
 }
+.product .size-color > div > select {
+  position: absolute;
+  top: 0; left: 0;
+  width: 100%; height: 100%;
+  opacity: 0;
+}
 
 .product .price {
   display:table-cell;