From cc58c66e3d9a4953eb7f4fc144a87dbdb8a52da3 Mon Sep 17 00:00:00 2001
From: Steffen van Bergerem <svbergerem@online.de>
Date: Thu, 4 Jun 2015 14:10:24 +0200
Subject: [PATCH] Use media objects for mobile posts/comments/notifications
---
app/assets/stylesheets/mobile/mobile.scss | 30 ++++++++-----------
.../stylesheets/new_styles/_settings.scss | 2 +-
app/views/comments/_comment.mobile.haml | 28 ++++++++---------
app/views/notifications/index.mobile.haml | 8 ++---
app/views/shared/_post_info.mobile.haml | 8 ++---
5 files changed, 36 insertions(+), 40 deletions(-)
diff --git a/app/assets/stylesheets/mobile/mobile.scss b/app/assets/stylesheets/mobile/mobile.scss
index 9909811cff..e00d11f7f7 100644
--- a/app/assets/stylesheets/mobile/mobile.scss
+++ b/app/assets/stylesheets/mobile/mobile.scss
@@ -9,12 +9,6 @@
@import "header";
@import "mobile/tags";
-.col-xs-1{
- width: 50px;
- padding-right: 0;
-}
-.col-xs-11{ width: calc(100% - 50px); }
-
a {
color: #2489ce;
text-decoration: none;
@@ -44,7 +38,7 @@ h3 { margin-top: 0; }
}
.stream_element,
-.comments{
+.comments {
overflow: auto;
position: relative;
text-align: left;
@@ -162,6 +156,8 @@ h3 { margin-top: 0; }
padding-top: 10px;
}
+.stream_element .media { padding: 0; }
+
.photo_attachments {
position: relative;
left: 0;
@@ -602,14 +598,14 @@ select {
overflow: hidden;
}
-.stream_element{ padding: 0; }
+.stream_element { padding: 0; }
.notifications {
list-style: none;
margin: 0;
clear: right;
- &, & ul{ padding: 0; }
+ &, & ul { padding: 0; }
}
.notifications_for_day {
@@ -755,7 +751,7 @@ form#new_user.new_user input.btn {
}
}
-.media{ padding: 12px 0 }
+.media { padding: 12px 0 }
.conversation_error {
color: #DF0101;
@@ -857,7 +853,7 @@ form p.checkbox_select {
}
}
-#birth-date{
+#birth-date {
text-align: center;
select{
width: 32%;
@@ -917,7 +913,7 @@ form#update_profile_form {
padding: 3px;
}
- .submit_block{ margin-bottom: 20px; }
+ .submit_block { margin-bottom: 20px; }
}
select#user_language, #user_auto_follow_back_aspect_id, #aspect_ids_ {
@@ -1093,7 +1089,7 @@ select#aspect_ids_ {
}
.remove_post { opacity: 0.5; }
-.remove_comment{ opacity: 0.5; }
+.remove_comment { opacity: 0.5; }
.center {
text-align: center;
@@ -1133,14 +1129,14 @@ select#aspect_ids_ {
word-wrap: break-word;
}
-#email_prefs{
+#email_prefs {
.checkbox{
margin: 15px 0;
}
}
-.small-horizontal-spacer{ margin: 15px 0; }
+.small-horizontal-spacer { margin: 15px 0; }
-.form-control, .form-control:active, .form-control:focus{ box-shadow: none; }
-.form-control:active, .form-control:focus{ border-color: #999999; }
+.form-control, .form-control:active, .form-control:focus { box-shadow: none; }
+.form-control:active, .form-control:focus { border-color: #999999; }
.tag_following_action { margin: 5px 0 10px 0; }
diff --git a/app/assets/stylesheets/new_styles/_settings.scss b/app/assets/stylesheets/new_styles/_settings.scss
index 2d8eef75fb..2220ba114c 100644
--- a/app/assets/stylesheets/new_styles/_settings.scss
+++ b/app/assets/stylesheets/new_styles/_settings.scss
@@ -24,7 +24,7 @@
.settings_visibilty { margin-left: 10px; }
-#profile_bio{
+#profile_bio {
width: 100%;
max-width: 100%;
min-width: 100%;
diff --git a/app/views/comments/_comment.mobile.haml b/app/views/comments/_comment.mobile.haml
index 47f6fe7e09..5e98355519 100644
--- a/app/views/comments/_comment.mobile.haml
+++ b/app/views/comments/_comment.mobile.haml
@@ -4,20 +4,20 @@
%li.comment{data:{guid:comment.id}, class: ("hidden" if(defined? hidden))}
.content
- .col-xs-1
- = person_image_link(comment.author, size: :thumb_small)
- .col-xs-11
- .from.pull-left
- = person_link(comment.author)
- .info
- %span
- = timeago(comment.created_at ? comment.created_at : Time.now)
- .remove_comment
- .pull-right
- - if user_signed_in? && comment.author == current_user.person
- = link_to(raw("<i class='entypo trash'></i>"), comment_path(comment), method: :delete,
- data: { confirm: "#{t('are_you_sure')}" }, class: "remove")
- .clearfix
+ .media
+ .media-left
+ = person_image_link(comment.author, size: :thumb_small, class: "media-object")
+ .media-body
+ .from.pull-left
+ = person_link(comment.author)
+ .info
+ %span
+ = timeago(comment.created_at ? comment.created_at : Time.now)
+ .remove_comment
+ .pull-right
+ - if user_signed_in? && comment.author == current_user.person
+ = link_to(raw("<i class='entypo trash'></i>"), comment_path(comment), method: :delete,
+ data: { confirm: "#{t('are_you_sure')}" }, class: "remove")
%div{class: direction_for(comment.text)}
= comment.message.markdownified
diff --git a/app/views/notifications/index.mobile.haml b/app/views/notifications/index.mobile.haml
index 038e11f8f6..d141aec938 100644
--- a/app/views/notifications/index.mobile.haml
+++ b/app/views/notifications/index.mobile.haml
@@ -16,10 +16,10 @@
%ul.notifications_for_day
- notes.each do |note|
.stream_element{:data=>{guid: note.id}, class: "#{note.unread ? 'unread' : 'read'}"}
- .content.from
- .col-xs-1
- = person_image_link(note.actors.last, size: :thumb_small)
- .col-xs-11
+ .content.from.media
+ .media-left
+ = person_image_link(note.actors.last, size: :thumb_small, class: "media-object")
+ .media-body
= notification_message_for(note)
.time_notif
= timeago(note.created_at)
diff --git a/app/views/shared/_post_info.mobile.haml b/app/views/shared/_post_info.mobile.haml
index 8f59a580f0..4b2b3e91e4 100644
--- a/app/views/shared/_post_info.mobile.haml
+++ b/app/views/shared/_post_info.mobile.haml
@@ -2,10 +2,10 @@
-# licensed under the Affero General Public License version 3 or later. See
-# the COPYRIGHT file.
-.from
- .col-xs-1
- = person_image_link(post.author, size: :thumb_small)
- .col-xs-11
+.from.media
+ .media-left
+ = person_image_link(post.author, size: :thumb_small, class: "media-object")
+ .media-body
.pull-left
= person_link(post.author)
--
GitLab