From 58886a6b305643120c1aa7f4771de9a28192e5d1 Mon Sep 17 00:00:00 2001
From: flaburgan <flaburgan@geexxx.fr>
Date: Sat, 16 Nov 2013 02:56:46 -0800
Subject: [PATCH 1/3] Improve notifications and conversations views design

---
 Changelog.md                              |  1 +
 app/assets/stylesheets/mobile.css.scss    | 23 +++++++++++++----------
 app/views/layouts/application.mobile.haml |  9 ++++-----
 app/views/notifications/index.mobile.haml |  2 +-
 4 files changed, 19 insertions(+), 16 deletions(-)

diff --git a/Changelog.md b/Changelog.md
index ab27d20c2..6c9d1fdfd 100644
--- a/Changelog.md
+++ b/Changelog.md
@@ -13,6 +13,7 @@
 * Refactor ConversationsController#create, move more stuff to User model [#4551](https://github.com/diaspora/diaspora/pull/4551)
 * Refactor MessagesController#create, move stuff to User model [#4556](https://github.com/diaspora/diaspora/pull/4556)
 * Reorder the left bar side menu to put the stream first [#4569](https://github.com/diaspora/diaspora/pull/4569)
+* Improve notifications and conversations views design on mobile [#4593](https://github.com/diaspora/diaspora/pull/4593)
 
 ## Bug fixes
 * Highlight down arrow at the user menu on hover [#4441](https://github.com/diaspora/diaspora/pull/4441)
diff --git a/app/assets/stylesheets/mobile.css.scss b/app/assets/stylesheets/mobile.css.scss
index bb45effd4..3743ec8c0 100644
--- a/app/assets/stylesheets/mobile.css.scss
+++ b/app/assets/stylesheets/mobile.css.scss
@@ -7,8 +7,7 @@
 
 a {
   color: #2489ce;
-  text: {
-    decoration: none; };
+  text-decoration: none;
 }
 
 body {
@@ -21,9 +20,12 @@ body {
   padding-top: 55px;
 }
 
+h3 {
+  margin-top: 0px;
+}
+
 .message {
-  padding: {
-    left: 2px; };
+  padding-left: 2px;
 }
 
 .stream_element,
@@ -306,7 +308,8 @@ body {
     color: $text-grey; } }
 
 .right {
-  float: right; }
+  float: right;
+}
 
 header {
   position: fixed;
@@ -670,6 +673,11 @@ select {
 
 .notifications {
   list-style: none;
+  margin: 0px;
+}
+
+.notifications_for_day {
+  margin-left: 12px;
 }
 
 .notification_day_header {
@@ -698,10 +706,6 @@ display: inline-block;
     width: 28px;
 }
 
-#conversation_inbox {
-  margin: 10px 0 0 10px;
-}
-
 .message_count {
   border-radius: 2px 2px 2px 2px;
   float: right;
@@ -786,7 +790,6 @@ form#new_conversation.new_conversation {
   border-bottom: 1px solid $border-dark-grey;
   box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
   border-radius: 5px;
-  margin: 5px 0 5px 15px;
   padding: 5px 10px;
   h4 {
     font-size: 14px;
diff --git a/app/views/layouts/application.mobile.haml b/app/views/layouts/application.mobile.haml
index 705419866..b66b1e500 100644
--- a/app/views/layouts/application.mobile.haml
+++ b/app/views/layouts/application.mobile.haml
@@ -68,11 +68,10 @@
             = link_to(image_tag('icons/compose_mobile2.png', class: 'compose_icon'), new_status_message_path)
 
     #main.container{:role => "main"}
-      .row
-        - if current_page?(:activity_stream)
-          %h3
-            = t('streams.activity.title')
-        = yield
+      - if current_page?(:activity_stream)
+        %h3
+          = t('streams.activity.title')
+      = yield
 
     - if user_signed_in?
       = render :partial =>'shared/footer'
diff --git a/app/views/notifications/index.mobile.haml b/app/views/notifications/index.mobile.haml
index f0b93d72a..fe7916705 100644
--- a/app/views/notifications/index.mobile.haml
+++ b/app/views/notifications/index.mobile.haml
@@ -4,7 +4,7 @@
 %h3
   = t('.notifications')
 
-%ul.stream.notifications
+%ul.notifications
   - @group_days.each do |day, notes|
     %li
       .notification_day_header

From 861b3d30f41656d03c41941d0336caa7895eaa5a Mon Sep 17 00:00:00 2001
From: flaburgan <flaburgan@geexxx.fr>
Date: Sat, 16 Nov 2013 13:48:33 -0800
Subject: [PATCH 2/3] Fix tests

---
 features/mobile/multiphoto.feature | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/features/mobile/multiphoto.feature b/features/mobile/multiphoto.feature
index b3c996aff..a5a6f9229 100644
--- a/features/mobile/multiphoto.feature
+++ b/features/mobile/multiphoto.feature
@@ -17,7 +17,7 @@ Feature: viewing photos on the mobile main page
     When I press "Share"
     And I click on selector "img.stream-photo"
     Then I should see a "img" within "#show_content"
-    And I should not see a "#right" within ".row"
+    And I should not see a "#right" within "#main"
 
   Scenario: view multiphoto post
     Given I attach the file "spec/fixtures/button.png" to hidden "file" within "#file-upload-publisher"

From e1fb8200ddca314278bdcbec9417242d88d06d8e Mon Sep 17 00:00:00 2001
From: flaburgan <flaburgan@geexxx.fr>
Date: Mon, 18 Nov 2013 18:02:22 -0800
Subject: [PATCH 3/3] Move 'mark all as read' button under the title

---
 app/assets/stylesheets/mobile.css.scss    | 1 +
 app/views/notifications/index.mobile.haml | 6 +++---
 2 files changed, 4 insertions(+), 3 deletions(-)

diff --git a/app/assets/stylesheets/mobile.css.scss b/app/assets/stylesheets/mobile.css.scss
index 3743ec8c0..a1a1f2296 100644
--- a/app/assets/stylesheets/mobile.css.scss
+++ b/app/assets/stylesheets/mobile.css.scss
@@ -674,6 +674,7 @@ select {
 .notifications {
   list-style: none;
   margin: 0px;
+  clear: right;
 }
 
 .notifications_for_day {
diff --git a/app/views/notifications/index.mobile.haml b/app/views/notifications/index.mobile.haml
index fe7916705..ac046a65e 100644
--- a/app/views/notifications/index.mobile.haml
+++ b/app/views/notifications/index.mobile.haml
@@ -1,9 +1,9 @@
-.right
-  = link_to t('.mark_all_as_read'), notifications_read_all_path, :class => 'btn'
-
 %h3
   = t('.notifications')
 
+.right
+  = link_to t('.mark_all_as_read'), notifications_read_all_path, :class => 'btn'
+
 %ul.notifications
   - @group_days.each do |day, notes|
     %li