summaryrefslogtreecommitdiff
path: root/StoneIsland/platforms/ios/www/css
diff options
context:
space:
mode:
Diffstat (limited to 'StoneIsland/platforms/ios/www/css')
-rwxr-xr-xStoneIsland/platforms/ios/www/css/account.css123
-rwxr-xr-xStoneIsland/platforms/ios/www/css/blogs.css97
-rwxr-xr-xStoneIsland/platforms/ios/www/css/cart.css80
-rwxr-xr-xStoneIsland/platforms/ios/www/css/index.css17
-rwxr-xr-xStoneIsland/platforms/ios/www/css/nav.css93
-rwxr-xr-xStoneIsland/platforms/ios/www/css/products.css51
-rwxr-xr-xStoneIsland/platforms/ios/www/css/vendor/flickity.css2
7 files changed, 286 insertions, 177 deletions
diff --git a/StoneIsland/platforms/ios/www/css/account.css b/StoneIsland/platforms/ios/www/css/account.css
index 32c7df79..12adb2d9 100755
--- a/StoneIsland/platforms/ios/www/css/account.css
+++ b/StoneIsland/platforms/ios/www/css/account.css
@@ -67,7 +67,7 @@
content:'';
width:calc(100% + 100px);
height:1px;
- background:#bbb;
+ background:#666;
position:absolute;
bottom:0;
left:-50px;
@@ -77,7 +77,7 @@
position:relative;
font-weight:bold;
letter-spacing:0.2px;
- font-size:11px;
+ font-size: 0.688rem;
margin-bottom:10px;
width:100%;
box-sizing:border-box;
@@ -122,26 +122,37 @@
text-align: center;
margin: 0;
padding: 20px 10px 8px 10px;
- font-size: 14px;
+ font-size: 1rem;
color: #000;
letter-spacing: 1px;
font-weight: bold;
}
+label {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ text-align: center;
+ font-size: 1rem;
+ color: #000;
+ letter-spacing:1px;
+ text-transform:uppercase;
+ height: 48px;
+}
input[type=text], input[type=password], input[type=number], input[type=date], input[type=email] {
font-family:pfd, sans-serif;
- font-size:14px;
+ font-size: 0.875rem;
outline:none!important;
color:#000;
letter-spacing:1px;
text-transform:uppercase;
- height:35px;
+ height: 48px;
text-align:center;
margin: 0px auto;
display:block;
- margin-top:4px;
+ margin-top: 0px;
width: calc(100vw - 10px);
- border:1px solid #a9a9a9;
+ border:1px solid #696969;
padding: 0;
border-radius: 0;
}
@@ -149,27 +160,35 @@ input[type=text], input[type=password], input[type=number], input[type=date], in
input[type=text], input[type=password], input[type=number], input[type=email] {
-webkit-appearance: none;
}
-
+input[type=text]:focus, input[type=password]:focus, input[type=number]:focus, input[type=email] {
+ border-width: 2px;
+}
.half-input {
margin: 0px auto;
- display: block;
+ display: flex;
+ flex-direction: row;
+ justify-content: flex-start;
+ align-items: center;
margin-top: 4px;
width: calc(100vw - 10px);
overflow: auto;
}
+.half-input label {
+ width: 50%;
+}
.half-input input, .half-input select {
position: relative;
margin: 0;
border:none;
box-sizing: border-box;
float: left;
- border: 1px solid #a9a9a9;
+ border: 1px solid #696969;
width: 50%;
}
.half-input > input:first-child {
- border-right: 1px solid #a9a9a9;
+ border-right: 1px solid #696969;
}
#signup .toggle-container, #profile .toggle-container {
@@ -179,7 +198,7 @@ input[type=text], input[type=password], input[type=number], input[type=email] {
width: calc(100vw - 10px);
box-sizing: border-box;
padding:0px 18px 2px;
- font-size:14px;
+ font-size: 1rem;
}
#settings .toggle-container {
@@ -189,7 +208,7 @@ input[type=text], input[type=password], input[type=number], input[type=email] {
width: calc(100vw - 10px);
box-sizing: border-box;
padding:10px 18px 2px;
- font-size:14px;
+ font-size: 1rem;
}
.toggle-row {
@@ -296,10 +315,12 @@ input.switch:checked + label:after {
.container-fill {
min-height:80px;
+ display: flex;
flex: 1;
align-items: center;
justify-content: center;
position:relative;
+ flex-direction: column;
}
.container-fill-condensed {
@@ -317,26 +338,27 @@ input.switch:checked + label:after {
width:calc(100vw - 10px);
box-sizing:border-box;
margin:10px auto 0;
- position:relative
+ position:relative;
}
.container-row .container-message-condensed {
margin: 2px auto!important
}
.container-fill .container-message {
- font-size:12px;
+ font-size: 0.875rem;
letter-spacing:0.5px;
text-align:center;
- position:absolute;
- top:50%;
- left:50%;
+ display: flex;
+ align-items: center;
+ justify-content: center;
width:100%;
- -webkit-transform: translateX(-50%) translateY(-50%);
- transform: translateX(-50%) translateY(-50%);
+ min-height: 48px;
color:#000;
}
-
+.billing-container a {
+ text-decoration: none;
+}
.premessage {
top:calc(50% - 20px)!important;
@@ -351,7 +373,7 @@ input.switch:checked + label:after {
}
.checkbox-container {
- font-size:11px;
+ font-size: 0.875rem;
width:calc(100vw - 10px);
display:table;
box-sizing:border-box;
@@ -381,6 +403,7 @@ input.switch:checked + label:after {
vertical-align:middle;
display:table-cell;
box-sizing:border-box;
+ text-align: left;
}
.billing-container .checkbox-caption {
@@ -442,10 +465,6 @@ input.switch:checked + label:after {
}
.privacy-msg {
- left: 50%;
- display: inline-block;
- position: relative;
- transform: translateX(-50%);
padding-top: 15px;
padding-bottom: 80px;
}
@@ -458,51 +477,55 @@ input.switch:checked + label:after {
text-align: center;
overflow: hidden;
- font-size: 14px;
+ font-size: 0.875rem;
outline: none !important;
color: #000;
letter-spacing: 1px;
text-transform: uppercase;
- height: 35px;
+ height: 48px;
text-align: center;
margin: 0px auto;
display: block;
margin-top: 4px;
width: calc(100vw - 10px);
- border: 1px solid #a9a9a9;
+ border: 1px solid #696969;
}
.date-wrapper span {
display: block;
}
.half-input .select-wrapper {
+ display: flex;
+ align-items: center;
+ justify-content: center;
width: 50%;
border: 0;
margin-top: 0px;
float: left;
box-sizing: border-box;
- border: 1px solid #a9a9a9;
+ border: 1px solid #696969;
+}
+.half-input .select-wrapper:nth-child(2) {
border-left: 0px;
}
.half-input .select-wrapper span {
- top: 8px;
color: #aaa;
+ top: 0;
}
.select-wrapper [type=date] {
opacity: 0;
width: 100%;
- height: 35px;
- line-height: 35px;
+ height: 48px;
+ line-height: 48px;
position: absolute;
top: -5px;
left: -1px;
- width: 1px; height: 1px;
}
.select-wrapper select {
opacity: 0;
width: 100%;
- height: 35px;
- line-height: 35px;
+ height: 48px;
+ line-height: 48px;
position: absolute;
top: 0; left: 0;
box-sizing: border-box;
@@ -512,8 +535,8 @@ input.switch:checked + label:after {
}
.select-wrapper span {
position: relative;
- top: 8px;
- color: #888;
+ top: 15px;
+ color: #666;
}
.select-wrapper.picked span {
color: #000;
@@ -521,33 +544,29 @@ input.switch:checked + label:after {
.country-wrapper-static {
text-align: center;
- color: #a9a9a9;
+ color: #696969;
border: 1px solid;
- padding-top: 9px;
- font-size: 14px;
- height: 35px;
+ border-left: 0;
+ font-size: 0.875rem;
+ height: 48px;
box-sizing: border-box;
-}
-
-.container-row input:first-child {
-margin-top:10px
+ width: 50%;
+ display: flex;
+ justify-content: center;
+ align-items: center;
}
.container-row .half-input input {
margin-top:0px
}
-#login .container-row input:first-child {
-margin-bottom:9px!important
-}
-
.newuser {
display:inline-block;
- padding:14px;
+ padding:18px;
text-decoration:underline
}
.forgotpassword {
- padding:14px;
+ padding:18px;
text-decoration:underline
} \ No newline at end of file
diff --git a/StoneIsland/platforms/ios/www/css/blogs.css b/StoneIsland/platforms/ios/www/css/blogs.css
index bf5ab68f..2d4a52c3 100755
--- a/StoneIsland/platforms/ios/www/css/blogs.css
+++ b/StoneIsland/platforms/ios/www/css/blogs.css
@@ -6,17 +6,22 @@
margin: 15px 0 0;
text-align: center;
text-transform:uppercase;
+ display:flex;
+ flex-direction: row;
+ justify-content: center;
+ align-items: center;
+ flex-wrap: wrap;
}
#story .links li {
- padding: 10px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ height: 48px;
+ padding: 0 8px;
list-style-type: none;
- display: inline-block;
-}
-#story .links li:before {
- content: ' | ',
-}
-#story .links li:first-child:before {
- content: '',
+ font-size: 1rem;
+ border: 1px solid black;
+ margin: 5px;
}
#story .links li.active {
font-weight: bold;
@@ -57,7 +62,7 @@ animation: mfadein 0.6s;
#hub .content .body, #story .content .body {
letter-spacing:0.35px;
- font-size:12px;
+ font-size: 1rem;
width:calc(100vw - 40px);
box-sizing:border-box;
margin:10px auto 20px;
@@ -65,7 +70,7 @@ animation: mfadein 0.6s;
}
#hub .content .body:last-child {
- margin:10px auto 100px;
+ margin:20px auto 100px;
}
#story .content .body:last-child {
@@ -85,14 +90,14 @@ animation: mfadein 0.6s;
.content-header .title, .content-header .subtitle {
display:block;
font-weight:bold;
- font-size:14px;
+ font-size: 1rem;
text-transform:uppercase
}
.content-header .title {
margin:0;
padding:0;
- line-height:13px;
+ line-height:1.4em;
}
.content-header .subtitle {
@@ -101,12 +106,17 @@ animation: mfadein 0.6s;
.content-share {
border:1px solid black;
- padding:4px 8px 2px;
+ padding: 0 12px;
+ height: 48px;
+ font-size: 1rem;
+ display: flex;
+ justify-content: center;
+ align-items: center;
float:right
}
.content-header span.date, .content-header span.store {
- font-size:10px;
+ font-size: 1rem;
}
/* NOTE: optional arrows */
@@ -118,19 +128,18 @@ animation: mfadein 0.6s;
background-size:5px 10px;
background-repeat:no-repeat;
background-position:center;
- width:15px;
- height:30px;
+ width:24px;
+ height:48px;
top:26vh;
content:'';
transform:translateY(-50%);
transform-origin:top right;
left:20px;
- font-size:18px;
+ font-size: 1.125rem;
padding:3px 3px 3px 1px;
z-index:2;
position:absolute;
display:block;
- animation: gallery-fade 4s forwards;
}
.gallery-right {
border:1px solid black;
@@ -139,19 +148,18 @@ animation: mfadein 0.6s;
background-size:5px 10px;
background-repeat:no-repeat;
background-position:center;
- width:15px;
- height:30px;
+ width:24px;
+ height:48px;
top:26vh;
content:'';
transform:translateY(-50%);
transform-origin:top right;
right:20px;
- font-size:18px;
+ font-size: 1.125rem;
padding:3px 1px 3px 3px;
z-index:2;
position:absolute;
display:block;
- animation: gallery-fade 4s forwards;
}
@-webkit-keyframes gallery-fade {
@@ -183,7 +191,7 @@ animation: mfadein 0.6s;
transform:scale(1,.5) translateY(-50%);
transform-origin:bottom right;
content:'\25BC';
- font-size:17px;
+ font-size: 1.063rem;
padding:9px 11px;
z-index:999;
position:absolute;
@@ -205,11 +213,11 @@ ul.links {
}
.archive h1 {
- font-size:26px;
+ font-size: 1.625rem;
border-bottom:0;
- margin-top:8px;
+ margin-top: 8px;
padding-bottom:0;
- line-height:24px;
+ line-height: 1;
}
.archive .subtitle {
@@ -220,20 +228,20 @@ ul.links {
margin:0 0 12px;
padding:0;
font-weight:bold;
- font-size:14px;
+ font-size: 1rem;
}
.archive h2 {
- font-size: 25px;
+ font-size: 1.563rem;
font-weight: normal;
}
.archive h2 b {
- font-size: 28px;
+ font-size: 1.75rem;
}
.archive .body {
- font-size: 14px;
- line-height: 1.2em;
+ font-size: 0.875rem;
+ line-height: 1.4rem;
font-weight: 100;
}
@@ -252,6 +260,13 @@ ul.links {
transform: translateZ(0) translateX(-50%) translateY(-50%);
}
+.accessible #archive .row .image,
+.accessible #archive .row .text {
+ position: relative;
+ top: auto; left: auto;
+ transform: translateZ(0);
+}
+
#archive .menu .items {
border-top: 1px solid transparent;
}
@@ -278,11 +293,14 @@ ul.links {
}
#archive .menu .item {
width: 100%;
- text-align: center;
+ display: flex;
+ justify-content: center;
+ align-items: center;
border-bottom: 1px solid black;
background: white;
- padding:12px 0;
- font-size:14px;
+ padding:0;
+ height: 48px;
+ font-size: 1rem;
letter-spacing:0.7px
}
@@ -318,6 +336,17 @@ ul.links {
#archive .row .text {
width: 80%;
}
+.accessible #archive .row .image {
+ display: block;
+ height: 50vh;
+ opacity: 1 !important;
+}
+.accessible #archive .row .text {
+ display: block;
+ margin: 0 auto;
+ opacity: 1 !important;
+ width: 90%;
+}
.gallery-video-post {
position:relative;
diff --git a/StoneIsland/platforms/ios/www/css/cart.css b/StoneIsland/platforms/ios/www/css/cart.css
index 7619a82b..36a446a7 100755
--- a/StoneIsland/platforms/ios/www/css/cart.css
+++ b/StoneIsland/platforms/ios/www/css/cart.css
@@ -6,20 +6,24 @@
#cart .steps {
width: 100%;
- border-bottom: 1px solid #bbb;
+ border-bottom: 1px solid #666;
font-size: 0;
+ display: flex;
+ flex-direction: row;
}
#cart .steps span {
- display: inline-block;
- font-size: 13px;
+ display: flex;
+ font-size: 1rem;
text-align: center;
- padding: 11px 0 10px;
- color: #bbb;
+ color: #666;
width: 33%;
position:relative;
+ height: 48px;
+ justify-content: center;
+ align-items: center;
}
.summary_step, .shipping_step {
- border-right: 1px solid #bbb
+ border-right: 1px solid #666;
}
#cart.summary .summary_step,
@@ -95,7 +99,7 @@
min-height:50px;
max-width: 50%;
text-align: center;
- font-size: 18px;
+ font-size: 1.125rem;
}
.summary-container {
@@ -109,7 +113,11 @@
#cart h3 {
padding-left: 5px;
- font-size:12px;
+ height: 48px;
+ display: flex;
+ justify-content: flex-start;
+ align-items: center;
+ font-size: 1rem;
}
.cart_item_row {
@@ -153,9 +161,9 @@ padding-left:5px;
.cart_item_price .remove {
display:block;
-width:20px;
-height:20px;
-border:1px solid #d2d2d2;
+width:48px;
+height:48px;
+border:1px solid #b2b2b2;
float:right;
margin-bottom:10px;
position:relative;
@@ -164,8 +172,8 @@ position:relative;
.cart_item_price .remove:after {
content:'';
width:1px;
-height:22px;
-background:#bbb;
+height:48px;
+background:#333;
position:absolute;
top:50%;
left:50%;
@@ -177,8 +185,8 @@ transform:rotate(45deg) translateX(-50%) translateY(-50%)
.cart_item_price .remove:before {
content:'';
width:1px;
- height:22px;
- background:#bbb;
+ height:48px;
+ background:#333;
position:absolute;
top:50%;
left:50%;
@@ -188,27 +196,27 @@ transform:rotate(45deg) translateX(-50%) translateY(-50%)
}
.cart_item_price .price {
- font-size:11px;
+ font-size: 1rem;
font-weight:bold;
display:block
}
.cart_item_info .sku {
- font-size:10px;
+ font-size: 1rem;
font-weight:bold;
- display:block
+ display:block;
}
.cart_item_info .title {
- font-size:10px;
+ font-size: 1rem;
font-weight:bold;
display:block;
- line-height:12px;
+ line-height:1.4em;
text-transform:uppercase;
}
.cart_item_info .type {
- font-size:10px;
+ font-size: 1rem;
font-weight:bold;
display:block;
text-transform:capitalize;
@@ -216,8 +224,8 @@ transform:rotate(45deg) translateX(-50%) translateY(-50%)
.cart_item_info .meta {
padding-top:5px;
- letter-spacing:.75px;
- font-size:8px;
+ letter-spacing: 0.047rem;
+ font-size:0.875rem;
}
.order_section .rows {
@@ -229,7 +237,7 @@ transform:rotate(45deg) translateX(-50%) translateY(-50%)
width:calc(100vw - 30px);
margin:15px auto;
text-decoration:underline;
- font-size:11px;
+ font-size: 0.688rem;
}
.order_section_container {
@@ -241,8 +249,8 @@ transform:rotate(45deg) translateX(-50%) translateY(-50%)
width:calc(100vw - 30px);
margin:0 auto;
display:table;
- color:#bbb;
- font-size:11px;
+ color:#666;
+ font-size: 1rem;
}
.cart-summary-row {
@@ -274,7 +282,7 @@ transform:rotate(45deg) translateX(-50%) translateY(-50%)
#orders .order_section {
padding-bottom: 16px;
- border-bottom: 1px solid #bbb;
+ border-bottom: 1px solid #666;
}
@@ -294,25 +302,30 @@ color:#000;
position:relative;
text-align:right;
width:calc(100vw - 10px);
- margin:0 auto;
+ margin:0 auto 20px 0;
box-sizing:border-box;
-
+ display: flex;
+ flex-direction: column;
}
.dropdown-wrapper .add_edit {
padding:10px;
letter-spacing:0.5px;
- font-size:12px;
+ font-size: 0.75rem;
color:#a9a9a9;
box-sizing:border-box;
}
.dropdown-wrapper .dropdown {
- font-size:14px;
+ font-size: 1rem;
box-sizing:border-box;
+ display: flex;
+ justify-content: center;
align-items: center;
text-align: center;
- padding:10px 0;
+ height: 48px;
+ margin-left: 3px;
+ padding:0;
border:1px solid #a9a9a9;
position:relative;
}
@@ -355,6 +368,9 @@ color:#000;
margin-left:5px;
margin-bottom:6px;
}
+#cart .cc_confirm h3 {
+ justify-content: center
+}
#cart_shipping input:first-child {
margin-top:10px
diff --git a/StoneIsland/platforms/ios/www/css/index.css b/StoneIsland/platforms/ios/www/css/index.css
index 4d8e5514..88022823 100755
--- a/StoneIsland/platforms/ios/www/css/index.css
+++ b/StoneIsland/platforms/ios/www/css/index.css
@@ -17,9 +17,12 @@ body {
-webkit-user-select: none; /* prevent copy paste, to allow, change 'none' to 'text' */
background: #fff;
font-family: pfd, sans-serif;
- font-size: 12px;
+ font-size: 0.875rem;
padding-top: constant(safe-area-inset-top);
}
+a, a:visited {
+ color: #000;
+}
.loader {
z-index: 2;
@@ -60,3 +63,15 @@ body {
color: red !important;
border-color: red !important;
}
+.error_hilite ~ span.err {
+ display: flex;
+}
+span.err {
+ display: none;
+ text-align: center;
+ justify-content: center;
+ align-items: center;
+ font-size: 0.875rem;
+ height: 48px;
+ color: red !important;
+}
diff --git a/StoneIsland/platforms/ios/www/css/nav.css b/StoneIsland/platforms/ios/www/css/nav.css
index b7002f20..f555ce99 100755
--- a/StoneIsland/platforms/ios/www/css/nav.css
+++ b/StoneIsland/platforms/ios/www/css/nav.css
@@ -35,7 +35,7 @@
}
#nav .menu span {
display: block;
- font-size: 14px;
+ font-size: 1rem;
letter-spacing:1.25px;
text-shadow:0px 0px 1px rgba(0,0,0,.2);
color: #000;
@@ -77,9 +77,9 @@
#nav .submenu span {
display: block;
- font-size: 14px;
+ font-size: 1rem;
letter-spacing:1.25px;
- color: #bbb;
+ color: #666;
padding: 4px 0 12px 20px
}
@@ -94,8 +94,8 @@
float: left;
width: 61px;
border-left: 1px solid #ddd;
- color: #bbb;
- font-size: 18px;
+ color: #666;
+ font-size: 1.125rem;
padding: 5px 0;
text-align: center;
}
@@ -137,11 +137,14 @@ padding-bottom:0px;
}
#intro div {
position: absolute;
- top: 50%; left: 50%;
+ top: 50%;
+ left: 50%;
width: 200px;
- padding: 50px;
- text-align: center;
- font-size: 17px;
+ height: 100px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ font-size: 1.063rem;
}
#intro #compass {
pointer-events: none;
@@ -177,7 +180,7 @@ padding-bottom:0px;
box-sizing: border-box;
width: calc(100vw);
text-align: center;
- font-size: 14pt;
+ font-size: 0.875rem;
font-weight: bold;
line-height: 0;
text-transform: uppercase;
@@ -198,7 +201,7 @@ padding-bottom:0px;
display: block;
position: absolute;
top: 0; left: 0; width: 100%;
- height: 42px;
+ height: 48px;
border-bottom: 1px solid black;
}
#header .logo {
@@ -207,43 +210,43 @@ padding-bottom:0px;
background-position: center center;
position: absolute;
background-size: contain;
- width: 100px; height: 40px;
- left: 50%; top: -4px;
+ width: 100px; height: 48px;
+ left: 50%; top: -3px;
margin-left: -50px;
top:0px;
}
#header .burger {
display: inline-block;
font-size: 24px;
- padding: 9px 10px 5px;
+ padding: 12px 13px 7px;
}
#header .cart_rapper {
- display: inline-block;
+ display: flex;
+ justify-content: center;
+ align-items: flex-end;
position: relative;
float: right;
- width: 40px; height: 40px;
+ width: 44px; height: 48px;
}
#header .cart {
position: relative;
- float: right;
width: 18px;
- top: 15px;
+ margin-bottom: 10px;
height: 18px;
- margin-right: 18px;
background: #fff;
background-image:url(../img/cart-box.png);
background-size:100%;
background-repeat:no-repeat;
}
-.cart .cart_count {
+#header .cart .cart_count {
position: absolute;
top: 50%;
left: 50%;
transform: translateY(-50%) translateX(-50%);
- color: #bbb;
- font-size:12.35px;
+ color: #666;
+ font-size: 12.35px;
}
#header .cart::before {
@@ -273,12 +276,16 @@ padding-bottom:0px;
}
#footer div {
width: 50%;
+ height: 48px;
text-align: center;
- padding: 10px 0;
color: #000;
float: left;
- font-size:14px;
+ font-size: 1rem;
font-weight:bold;
+ padding: 0;
+ display: flex;
+ justify-content: center;
+ align-items: center;
}
#footer .ok {
color: #000;
@@ -287,7 +294,7 @@ padding-bottom:0px;
width: 100%;
}
#footer .ok.disabled {
- color: #bbb;
+ color: #666;
}
@@ -300,8 +307,10 @@ padding-bottom:0px;
width: 100%; height: 100%;
background: rgba(255,255,255,0.8);
opacity: 0;
- -webkit-transition: opacity 0.2s;
- transition: opacity 0.2s;
+ -webkit-transition: opacity 0.2s, -webkit-transform 0.2s;
+ transition: opacity 0.2s, transform 0.2s;
+ -webkit-transform: translateZ(0) translateX(0);
+ transform: translateZ(0) translateX(0);
}
#curtain.visible {
pointer-events: auto;
@@ -346,13 +355,14 @@ padding-bottom:0px;
#consent_modal {
display: none;
z-index: 2;
+ font-size: 1rem;
}
#consent_modal a {
color: black;
}
.modal button {
font-family: pfd, sans-serif;
- font-size: 12px;
+ font-size: 0.875rem;
padding: 10px;
box-sizing: border-box;
margin: 0;
@@ -400,9 +410,9 @@ padding-bottom:0px;
#selector:not(.selector-outer-wrap) .options div {
background: white;
text-align: center;
- padding: 7px 12px;
+ padding: 12px 12px;
box-sizing:border-box;
- font-size: 14px;
+ font-size: 0.875rem;
border-left:1px solid black;
border-right:1px solid black;
border-top:1px solid black;
@@ -437,7 +447,7 @@ padding-bottom:0px;
background: white;
text-align: center;
padding: 7px 12px;
- font-size:14px!important;
+ font-size: 0.875rem!important;
}
.selector-outer-wrap .options div:nth-of-type(odd){
@@ -462,28 +472,31 @@ padding-bottom:0px;
#cart,
#profile, #shipping, #payment, #settings, #orders {
position: absolute;
- top: 43px;
- height: -webkit-calc(100% - 43px - 39px);
- height: calc(100% - 43px - 39px);
+ top: 49px;
+ height: -webkit-calc(100% - 49px - 39px);
+ height: calc(100% - 49px - 39px);
width: 100%;
overflow: hidden;
}
#collection.single {
- height: -webkit-calc(100% - 43px);
- height: calc(100% - 43px);
+ height: -webkit-calc(100% - 49px);
+ height: calc(100% - 49px);
}
#story, #hub, #archive, .page, #closed {
/* these things do not have a footer */
- height: -webkit-calc(100% - 43px);
- height: calc(100% - 43px);
+ height: -webkit-calc(100% - 49px);
+ height: calc(100% - 49px);
}
h1 {
text-align: center;
margin: 0;
- padding: 16px 10px 12px 10px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
border-bottom: 1px solid #000;
- font-size: 14px;
+ height: 48px;
+ font-size: 1rem;
color: #000;
letter-spacing: 1px;
font-weight: bold;
diff --git a/StoneIsland/platforms/ios/www/css/products.css b/StoneIsland/platforms/ios/www/css/products.css
index 59bb403f..63e9b020 100755
--- a/StoneIsland/platforms/ios/www/css/products.css
+++ b/StoneIsland/platforms/ios/www/css/products.css
@@ -103,7 +103,7 @@
}
.product .product-header {
- font-size:14px;
+ font-size: 1rem;
margin:18px 0 0;
max-width:60%;
position:relative;
@@ -118,7 +118,7 @@
margin-bottom: 18px;
font-weight: bold;
text-align: center;
- font-size: 17px;
+ font-size: 1.063rem;
}
.product-group:first-child {
margin-top: 0;
@@ -136,33 +136,49 @@
}
.product .style {
- padding:4px 9px;
+ padding: 0;
border:1px solid black;
float:left
}
.product .share {
float:right;
- padding:4px 9px;
+ padding: 0 12px;
+ height: 48px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
border:1px solid black;
}
.product .type {
display:table-cell;
- font-size:14px;
+ font-size: 1rem;
}
-.product .size {
- padding-right:16px;
+.product .size-color {
+ display: flex;
+ flex-direction: row;
+}
+.product .size-color span {
position:relative;
- box-sizing:border-box
+ box-sizing:border-box;
+ padding: 0 12px;
+ height: 48px;
+ font-size: 1rem;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+}
+.product .size-color span.size {
+ border-right: 1px solid #444;
}
.product .price {
display:table-cell;
- font-size:14px;
+ font-size: 1rem;
text-align:right;
- vertical-align:bottom
+ vertical-align:bottom;
}
.product .price, .product .type {
@@ -179,12 +195,12 @@
.style-share {
letter-spacing:0.5px;
- font-size:12.35px
+ font-size: 1rem;
}
.size-color {
position:relative;
- font-size:12.35px
+ font-size: 1rem;
}
.type-price, .style-share {
@@ -194,7 +210,7 @@
}
-.size::after {
+/*.size::after {
content: '';
display: inline-block;
width: 1px;
@@ -205,12 +221,12 @@
right:5px;
background: #999;
}
-
+*/
.product .fit,
.product .notAvailableInCanada {
clear:both;
- font-size:9px;
+ font-size: 0.563rem;
letter-spacing:0.5px;
text-decoration:underline;
text-transform:uppercase;
@@ -218,7 +234,7 @@
}
.product .fitHeader {
clear:both;
- font-size:9px;
+ font-size: 0.563rem;
letter-spacing:0.5px;
text-decoration: none;
text-transform:uppercase;
@@ -232,7 +248,8 @@
#product .content .body {
letter-spacing:0.35px;
- font-size:12px;
+ font-size: 1rem;
+ line-height: 1.4em;
box-sizing:border-box;
margin:0px auto 20px;
clear:both;
diff --git a/StoneIsland/platforms/ios/www/css/vendor/flickity.css b/StoneIsland/platforms/ios/www/css/vendor/flickity.css
index b8eca4e4..99a09e72 100755
--- a/StoneIsland/platforms/ios/www/css/vendor/flickity.css
+++ b/StoneIsland/platforms/ios/www/css/vendor/flickity.css
@@ -105,7 +105,7 @@ http://flickity.metafizzy.co
/* color & size if no SVG - IE8 and Android 2.3 */
.flickity-prev-next-button.no-svg {
color: #333;
- font-size: 26px;
+ font-size: 1.625rem;
}
/* ---- page dots ---- */