From f37368ef12ac719b18cbc7eacd62fe7f39c0e9dd Mon Sep 17 00:00:00 2001 From: Rene Ae Date: Tue, 17 Nov 2015 19:02:53 -0600 Subject: updated 'profile' css --- StoneIsland/www/css/account.css | 149 +++++++++++++++++++++++++++++++++++++++- StoneIsland/www/css/nav.css | 20 +++--- StoneIsland/www/index.html | 25 +++++++ 3 files changed, 184 insertions(+), 10 deletions(-) diff --git a/StoneIsland/www/css/account.css b/StoneIsland/www/css/account.css index a6bfe4fd..ad7819bb 100644 --- a/StoneIsland/www/css/account.css +++ b/StoneIsland/www/css/account.css @@ -46,4 +46,151 @@ .settings #settings { display: block } #settings { display: none; -} \ No newline at end of file +} + +form { + margin-top:20px; +} + +form h2 { + text-align: center; + margin: 0; + padding: 28px 10px 8px 10px; + font-size: 14px; + color: #000; + letter-spacing: 1px; + font-weight: bold; +} + +input { + font-family:pfd, sans-serif; + font-size:14px; + outline:none!important; + color:#000; + letter-spacing:1px; + text-transform:uppercase; + height:37px; + text-align:center; + margin: 0px auto; + display:block; + margin-top:4px; + width: calc(100vw - 10px); + border:1px solid #a9a9a9; +} + +.half-input { + margin: 0px auto; + display: block; + margin-top: 4px; + width: calc(100vw - 10px); + border: 1px solid #a9a9a9; + overflow: auto; +} + +.half-input input { + position: relative; + margin: 0; + border:none; + box-sizing: border-box; + float: left; + width: 50%; +} + +.half-input > input:first-child { + border-right: 1px solid #a9a9a9; +} + +#newsletter { + margin: 0px auto; + display: table; + margin-top: 28px; + width: calc(100vw - 10px); + box-sizing: border-box; + padding:15px; + font-size:14px; +} + +#newsletter .caption { +display:table-cell; + vertical-align:middle; + width:100%; +} + +#newsletter .toggle { +display:table-cell; + vertical-align:middle; + +text-align:right +} + +#newsletter h3 { +margin:0; +} + +#newsletter-info { + margin: 0px auto; + display: table; + padding-top: 18px; + width: calc(100vw - 10px); + box-sizing: border-box; + font-size:13px; + letter-spacing:0.5px; + text-align:center; +} + +input#switch { + max-height: 0; + max-width: 0; + opacity: 0; +} + +input#switch + label { + display: inline-block; + position: relative; + box-shadow: inset 0 0 0px 1px rgba(0,0,0,.7); + text-indent: -5000px; + height: 30px; + width: 50px; + border-radius: 15px; +} + +input#switch + label:before { + content: ""; + position: absolute; + display: block; + height: 30px; + width: 30px; + top: 0; + left: 0; + border-radius: 15px; + background: rgba(19, 191, 17, 0); + -moz-transition: .25s ease-in-out; + -webkit-transition: .25s ease-in-out; + transition: .25s ease-in-out; +} + +input#switch + label:after { + content: ""; + position: absolute; + display: block; + height: 30px; + width: 30px; + top: 0; + left: 0px; + border-radius: 15px; + background: white; + box-shadow: inset 0 0 0 1px rgba(0,0,0,.7); + -moz-transition: .25s ease-in-out; + -webkit-transition: .25s ease-in-out; + transition: .25s ease-in-out; +} + +input#switch:checked + label:before { + width: 50px; + background: #136f11; +} + +input#switch:checked + label:after { + left: 20px; + box-shadow: inset 0 0 0 1px rgba(0,0,0,.7); +} diff --git a/StoneIsland/www/css/nav.css b/StoneIsland/www/css/nav.css index 3173135e..4c184d42 100644 --- a/StoneIsland/www/css/nav.css +++ b/StoneIsland/www/css/nav.css @@ -19,8 +19,8 @@ } .ios #nav, .ios #content { - top: 20px; - height: -webkit-calc(100% - 20px); + top: 8px; + height: -webkit-calc(100% - 10px); } .nav #nav { -webkit-transform: translateZ(0) translateX(0); @@ -145,9 +145,9 @@ background-position: center center; position: absolute; background-size: contain; - width: 80px; height: 38px; - left: 50%; top: 2px; - margin-left: -40px; + width: 120px; height: 40px; + left: 50%; top: -4px; + margin-left: -60px; } #header .burger { display: inline-block; @@ -175,6 +175,8 @@ padding: 10px 0; color: #bbb; float: left; + font-size:14px; + font-weight:bold; } #footer .ok { color: #000; @@ -243,10 +245,10 @@ h1 { text-align: center; margin: 0; - padding: 15px 10px 10px 10px; + padding: 16px 10px 12px 10px; border-bottom: 1px solid #000; - font-size: 18px; + font-size: 14px; color: #000; - letter-spacing: 2px; - font-weight: 100; + letter-spacing: 1px; + font-weight: bold; } diff --git a/StoneIsland/www/index.html b/StoneIsland/www/index.html index 6fb061b1..2725323a 100644 --- a/StoneIsland/www/index.html +++ b/StoneIsland/www/index.html @@ -232,14 +232,39 @@ + +
+ +
+
+ +
+
+
+

CHANGE PASSWORD

+
+
+

Newsletter

+ Receive Stone Island Newsletter +
+
+
+ + +
+
+
+
* Your personal and payment
+ information will always remain private
-- cgit v1.2.3-70-g09d2 From 3b739c8a5d8294c5f4c0a6d76cb05391e62d0ebc Mon Sep 17 00:00:00 2001 From: Rene Ae Date: Tue, 17 Nov 2015 19:03:26 -0600 Subject: tidyup --- StoneIsland/www/index.html | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/StoneIsland/www/index.html b/StoneIsland/www/index.html index 2725323a..5e6e6302 100644 --- a/StoneIsland/www/index.html +++ b/StoneIsland/www/index.html @@ -263,8 +263,10 @@ -
* Your personal and payment
- information will always remain private
+
+ * Your personal and payment
+ information will always remain private +
-- cgit v1.2.3-70-g09d2 From db9d9676d7bf23da35fae0f682df252771ba1cf3 Mon Sep 17 00:00:00 2001 From: Rene Ae Date: Wed, 18 Nov 2015 15:51:27 -0600 Subject: updated css for account pages --- StoneIsland/www/css/account.css | 95 ++++++++++----- StoneIsland/www/index.html | 253 ++++++++++++++++++++++++---------------- 2 files changed, 218 insertions(+), 130 deletions(-) diff --git a/StoneIsland/www/css/account.css b/StoneIsland/www/css/account.css index ad7819bb..8d26ce1e 100644 --- a/StoneIsland/www/css/account.css +++ b/StoneIsland/www/css/account.css @@ -55,7 +55,7 @@ form { form h2 { text-align: center; margin: 0; - padding: 28px 10px 8px 10px; + padding: 24px 10px 8px 10px; font-size: 14px; color: #000; letter-spacing: 1px; @@ -69,7 +69,7 @@ input { color:#000; letter-spacing:1px; text-transform:uppercase; - height:37px; + height:35px; text-align:center; margin: 0px auto; display:block; @@ -87,7 +87,7 @@ input { overflow: auto; } -.half-input input { +.half-input input, .half-input select { position: relative; margin: 0; border:none; @@ -100,51 +100,44 @@ input { border-right: 1px solid #a9a9a9; } -#newsletter { +.toggle-container { margin: 0px auto; display: table; - margin-top: 28px; + margin-top: 10px; width: calc(100vw - 10px); box-sizing: border-box; - padding:15px; + padding:10px 18px 2px; font-size:14px; } -#newsletter .caption { -display:table-cell; +.toggle-row { + display:block; + padding-bottom:16px; +} + +.toggle-container .caption { + display:table-cell; vertical-align:middle; width:100%; } -#newsletter .toggle { -display:table-cell; +.toggle-container .toggle { + display:table-cell; vertical-align:middle; - -text-align:right + text-align:right } -#newsletter h3 { -margin:0; +.toggle-container h3 { + margin:0; } -#newsletter-info { - margin: 0px auto; - display: table; - padding-top: 18px; - width: calc(100vw - 10px); - box-sizing: border-box; - font-size:13px; - letter-spacing:0.5px; - text-align:center; -} - -input#switch { +input.switch { max-height: 0; max-width: 0; opacity: 0; } -input#switch + label { +input.switch + label { display: inline-block; position: relative; box-shadow: inset 0 0 0px 1px rgba(0,0,0,.7); @@ -154,7 +147,7 @@ input#switch + label { border-radius: 15px; } -input#switch + label:before { +input.switch + label:before { content: ""; position: absolute; display: block; @@ -169,7 +162,7 @@ input#switch + label:before { transition: .25s ease-in-out; } -input#switch + label:after { +input.switch + label:after { content: ""; position: absolute; display: block; @@ -185,12 +178,52 @@ input#switch + label:after { transition: .25s ease-in-out; } -input#switch:checked + label:before { +input.switch:checked + label:before { width: 50px; background: #136f11; } -input#switch:checked + label:after { +input.switch:checked + label:after { left: 20px; box-shadow: inset 0 0 0 1px rgba(0,0,0,.7); } + +.container { + position:absolute; + height:calc(100% - 88px); + width:100vw; + box-sizing:border-box; + display: flex; + flex-direction: column; + margin:0; + left:0;right:0; + top:48px; +} + +.container-row { + box-sizing:border-box; +} + +.container-fill { +flex: 1; + align-items: center; + justify-content: center; + position:relative; +} + + +.container-message { + font-size:12px; + letter-spacing:0.5px; + text-align:center; + position:absolute; + top:50%; + left:50%; + width:100%; + -webkit-transform: translateX(-50%) translateY(-50%); + transform: translateX(-50%) translateY(-50%); +} + +.alert-notice { + color:red!important +} diff --git a/StoneIsland/www/index.html b/StoneIsland/www/index.html index 5e6e6302..ec40ff95 100644 --- a/StoneIsland/www/index.html +++ b/StoneIsland/www/index.html @@ -225,72 +225,116 @@ - +

PROFILE

- - - - -
- -
-
- +
+
+ + + +
+ +
+
+ +
+
+
+

CHANGE PASSWORD

+ + +
+
+

Newsletter

+ Receive Stone Island Newsletter +
+
+ + +
-
- -

CHANGE PASSWORD

- - - -
-
-

Newsletter

- Receive Stone Island Newsletter -
-
-
- - +
+
+ + + * Your personal and payment
+ information will always remain private +
-
-
-
- * Your personal and payment
- information will always remain private +
- +
+

SHIPPING

-
- +
+
+
+
+
+
+ + * Your personal and payment
+ information will always remain private + +
+
+

PAYMENT

-
-
- +
+
+
+
+
+
+
+ + * Your personal and payment
+ information will always remain private + +
+
+

NOTIFICATIONS

-
TURN ON / OFF NOTIFICATIONS
+
+
+
+

Store

+ Receive notifications for Store +
+
+ + +
+
+
+
+

Hub

+ Receive notifications for Hub +
+
+ + +
+
+
@@ -396,8 +440,10 @@ @@ -406,63 +452,72 @@ - - United States - - +
+ + +
+ +
+ +
+
+ +
+
+
-- cgit v1.2.3-70-g09d2