From 6b6b01b93dec4eefdc93e3f37b92602554b27e83 Mon Sep 17 00:00:00 2001
From: Jarrad Hope <jarrad@status.im>
Date: Fri, 10 Jun 2016 13:51:32 +0200
Subject: [PATCH 1/3] switch sides needs more work

---
 src/index.html | 97 ++++++++++++++++++++++++++------------------------
 1 file changed, 51 insertions(+), 46 deletions(-)

diff --git a/src/index.html b/src/index.html
index f171863..83d3cb3 100755
--- a/src/index.html
+++ b/src/index.html
@@ -122,6 +122,16 @@
     <section class="section-table section-white">
       <div class="table-center">
         <div class="table-wrapper">
+          
+          <div class="table-right table-bottom">
+            <div class="phone-even">
+                <div class="phone-image phone-big">
+                    <div class="phone-inner-image phone-big-image-2">
+                    </div>
+                </div>
+            </div>
+          </div>
+
           <div class="table-left">
             <div class="section-heading-even">
                 <h2>Status is a Browser</h2>
@@ -156,14 +166,7 @@
             </div>
             </div>
           </div>
-          <div class="table-right table-bottom">
-            <div class="phone-even">
-                <div class="phone-image phone-big">
-                    <div class="phone-inner-image phone-big-image-2">
-                    </div>
-                </div>
-            </div>
-          </div>
+
         </div>
 
       </div>
@@ -179,6 +182,7 @@
     <section class="section-table">
       <div class="table-center">
         <div class="table-wrapper">
+
           <div class="table-one-third table-bottom">
             <div class="phone-odd">
                 <div class="phone-image phone-big">
@@ -190,51 +194,52 @@
 
           <div class="table-two-third">
             <div class="section-heading-odd">
-                <h2>Status is a Messenger</h2>
-                <p>Have more meaningful conversations, with the ability to send payments, smart contracts, and more, directly from within chats.<br><br></p>
-                    <div class="tags">
-                        <div class="tag tag-status">
-                            <div class="setstatus-pink">
-                                <span>!setStatus</span>
-                            </div>
-                            <p>Away</p>
-                        </div>
+              <h2>Status is a Messenger</h2>
+              <p>Have more meaningful conversations, with the ability to send payments, smart contracts, and more, directly from within chats.<br><br></p>
+                  <div class="tags">
+                      <div class="tag tag-status">
+                          <div class="setstatus-pink">
+                              <span>!setStatus</span>
+                          </div>
+                          <p>Away</p>
+                      </div>
 
-                        <div class="tag tag-transaction">
-                            <div class="transaction-green">
-                                <span>!transaction</span>
-                            </div>
-                            <p>346 <span>ETH</span> </p>
-                        </div>
+                      <div class="tag tag-transaction">
+                          <div class="transaction-green">
+                              <span>!transaction</span>
+                          </div>
+                          <p>346 <span>ETH</span> </p>
+                      </div>
 
-                        <div class="tag tag-name">
-                            <div class="name-brown">
-                                <span>!name</span>
-                            </div>
-                            <p>Alex Petrov</p>
-                        </div>
+                      <div class="tag tag-name">
+                          <div class="name-brown">
+                              <span>!name</span>
+                          </div>
+                          <p>Alex Petrov</p>
+                      </div>
 
-                        <div class="tag tag-password">
-                            <div class="password-blue">
-                                <span>!keypairPassword</span>
-                            </div>
-                            <div class="icon-lock"></div>
-                            <p>********</p>
-                        </div>
+                      <div class="tag tag-password">
+                          <div class="password-blue">
+                              <span>!keypairPassword</span>
+                          </div>
+                          <div class="icon-lock"></div>
+                          <p>********</p>
+                      </div>
 
-                        <div class="tag tag-location">
-                            <div class="location-purple">
-                                <span>!location</span>
-                            </div>
-                            <p>Two Bar Mountain,
-                                <br>Maricopa County,
-                                <br>AZ, US</p>
-                            <div class="location-map"></div>
-                        </div>
+                      <div class="tag tag-location">
+                          <div class="location-purple">
+                              <span>!location</span>
+                          </div>
+                          <p>Two Bar Mountain,
+                              <br>Maricopa County,
+                              <br>AZ, US</p>
+                          <div class="location-map"></div>
+                      </div>
 
-                    </div>
+                  </div>
             </div>
           </div>
+
         </div>
 
       </div>

From a35db1ccd29e26e1022393c3d6a1d6b6a2576994 Mon Sep 17 00:00:00 2001
From: G14 <G14@G14s-iMac.local>
Date: Mon, 20 Jun 2016 22:41:42 +0500
Subject: [PATCH 2/3] switch sides

---
 src/css/main.css    | 30 ++----------------------------
 src/index.html      | 43 +++++++++++++++++++++++--------------------
 src/sass/index.scss |  4 ++--
 3 files changed, 27 insertions(+), 50 deletions(-)

diff --git a/src/css/main.css b/src/css/main.css
index 618f237..6060576 100644
--- a/src/css/main.css
+++ b/src/css/main.css
@@ -445,7 +445,7 @@ input[type=email] {
   float: none; }
 
 .section-heading-odd {
-  float: right;
+  float: none;
   margin: 0 auto;
   width: 360px;
   vertical-align: middle;
@@ -943,7 +943,7 @@ footer {
 .phone-odd {
   position: relative;
   top: 73px;
-  float: left; }
+  float: right; }
 
 .header-wrapper {
   position: relative;
@@ -1162,13 +1162,7 @@ body input:required:valid, body textarea:required:valid {
 /* ALWAYS END */
 /*==========  Desktop First Method  ========== */
 /* Large Devices, Wide Screens */
-@media only screen and (max-width: 1200px) {
-  /* */ }
-
 /* Medium Devices, Desktops */
-@media only screen and (max-width: 992px) {
-  /* */ }
-
 /* Small Devices, Tablets */
 @media only screen and (max-width: 768px) {
   /*Disable Animation on Mobile Devices */
@@ -1185,30 +1179,10 @@ body input:required:valid, body textarea:required:valid {
     animation: none !important; } }
 
 /* Extra Small Devices, Phones */
-@media only screen and (max-width: 480px) {
-  /* */ }
-
 /* Custom, iPhone Retina */
-@media only screen and (max-width: 320px) {
-  /* */ }
-
 /*==========  Mobile First Method  ========== */
 /* Custom, iPhone Retina */
-@media only screen and (min-width: 320px) {
-  /* */ }
-
 /* Extra Small Devices, Phones */
-@media only screen and (min-width: 480px) {
-  /* */ }
-
 /* Small Devices, Tablets */
-@media only screen and (min-width: 768px) {
-  /* */ }
-
 /* Medium Devices, Desktops */
-@media only screen and (min-width: 992px) {
-  /* */ }
-
 /* Large Devices, Wide Screens */
-@media only screen and (min-width: 1200px) {
-  /* */ }
diff --git a/src/index.html b/src/index.html
index 83d3cb3..86ecf8a 100755
--- a/src/index.html
+++ b/src/index.html
@@ -88,7 +88,7 @@
             </div>
           </div>
         </div>
-<!-- 
+<!--
         <div class="table-row">
           <div class="block block-white">
               <div class="block1-icon">
@@ -122,10 +122,10 @@
     <section class="section-table section-white">
       <div class="table-center">
         <div class="table-wrapper">
-          
+
           <div class="table-right table-bottom">
             <div class="phone-even">
-                <div class="phone-image phone-big">
+                <div class="phone-image phone-big no-float">
                     <div class="phone-inner-image phone-big-image-2">
                     </div>
                 </div>
@@ -183,15 +183,6 @@
       <div class="table-center">
         <div class="table-wrapper">
 
-          <div class="table-one-third table-bottom">
-            <div class="phone-odd">
-                <div class="phone-image phone-big">
-                    <div class="phone-inner-image phone-big-image">
-                    </div>
-                </div>
-            </div>
-          </div>
-
           <div class="table-two-third">
             <div class="section-heading-odd">
               <h2>Status is a Messenger</h2>
@@ -240,6 +231,15 @@
             </div>
           </div>
 
+          <div class="table-one-third table-bottom">
+            <div class="phone-odd">
+                <div class="phone-image phone-big">
+                    <div class="phone-inner-image phone-big-image">
+                    </div>
+                </div>
+            </div>
+          </div>
+
         </div>
 
       </div>
@@ -255,6 +255,16 @@
     <section class="section-table section-white">
       <div class="table-center">
         <div class="table-wrapper">
+
+          <div class="table-right table-bottom">
+            <div class="phone-even">
+                <div class="phone-image phone-big no-float">
+                    <div class="phone-inner-image phone-big-image-2">
+                    </div>
+                </div>
+            </div>
+          </div>
+
           <div class="table-left">
             <div class="section-heading-even">
                 <h2>Status is a Community</h2>
@@ -290,14 +300,7 @@
             </div>
             </div>
           </div>
-          <div class="table-right table-bottom">
-            <div class="phone-even">
-                <div class="phone-image phone-big">
-                    <div class="phone-inner-image phone-big-image-2">
-                    </div>
-                </div>
-            </div>
-          </div>
+
         </div>
 
       </div>
diff --git a/src/sass/index.scss b/src/sass/index.scss
index c8e9b02..963ecfb 100644
--- a/src/sass/index.scss
+++ b/src/sass/index.scss
@@ -443,7 +443,7 @@ input[type=email] {
 }
 
 .section-heading-odd {
-  float: right;
+  float: none;
   margin: 0 auto;
   width: 360px;
   vertical-align: middle;
@@ -979,7 +979,7 @@ footer {
 .phone-odd {
   position: relative;
   top: 73px;
-  float: left;
+  float: right;
 }
 
 .header-wrapper {

From fe3f10bb7dae39d4e8070da59f151b474e18cac3 Mon Sep 17 00:00:00 2001
From: G14 <G14@G14s-iMac.local>
Date: Mon, 20 Jun 2016 23:10:51 +0500
Subject: [PATCH 3/3] pull messages to the left

---
 src/css/main.css    | 1 +
 src/sass/index.scss | 1 +
 2 files changed, 2 insertions(+)

diff --git a/src/css/main.css b/src/css/main.css
index 6060576..d60d7d2 100644
--- a/src/css/main.css
+++ b/src/css/main.css
@@ -447,6 +447,7 @@ input[type=email] {
 .section-heading-odd {
   float: none;
   margin: 0 auto;
+  margin-left: 50px;
   width: 360px;
   vertical-align: middle;
   text-align: center; }
diff --git a/src/sass/index.scss b/src/sass/index.scss
index 963ecfb..d8acd7f 100644
--- a/src/sass/index.scss
+++ b/src/sass/index.scss
@@ -445,6 +445,7 @@ input[type=email] {
 .section-heading-odd {
   float: none;
   margin: 0 auto;
+  margin-left: 50px;
   width: 360px;
   vertical-align: middle;
   text-align: center;