Use media objects for mobile posts/comments/notifications
This commit is contained in:
parent
676c0ab611
commit
cc58c66e3d
5 changed files with 36 additions and 40 deletions
|
|
@ -9,12 +9,6 @@
|
||||||
@import "header";
|
@import "header";
|
||||||
@import "mobile/tags";
|
@import "mobile/tags";
|
||||||
|
|
||||||
.col-xs-1{
|
|
||||||
width: 50px;
|
|
||||||
padding-right: 0;
|
|
||||||
}
|
|
||||||
.col-xs-11{ width: calc(100% - 50px); }
|
|
||||||
|
|
||||||
a {
|
a {
|
||||||
color: #2489ce;
|
color: #2489ce;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
|
|
@ -44,7 +38,7 @@ h3 { margin-top: 0; }
|
||||||
}
|
}
|
||||||
|
|
||||||
.stream_element,
|
.stream_element,
|
||||||
.comments{
|
.comments {
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
position: relative;
|
position: relative;
|
||||||
text-align: left;
|
text-align: left;
|
||||||
|
|
@ -162,6 +156,8 @@ h3 { margin-top: 0; }
|
||||||
padding-top: 10px;
|
padding-top: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.stream_element .media { padding: 0; }
|
||||||
|
|
||||||
.photo_attachments {
|
.photo_attachments {
|
||||||
position: relative;
|
position: relative;
|
||||||
left: 0;
|
left: 0;
|
||||||
|
|
@ -602,14 +598,14 @@ select {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
.stream_element{ padding: 0; }
|
.stream_element { padding: 0; }
|
||||||
|
|
||||||
.notifications {
|
.notifications {
|
||||||
list-style: none;
|
list-style: none;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
clear: right;
|
clear: right;
|
||||||
|
|
||||||
&, & ul{ padding: 0; }
|
&, & ul { padding: 0; }
|
||||||
}
|
}
|
||||||
|
|
||||||
.notifications_for_day {
|
.notifications_for_day {
|
||||||
|
|
@ -755,7 +751,7 @@ form#new_user.new_user input.btn {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.media{ padding: 12px 0 }
|
.media { padding: 12px 0 }
|
||||||
|
|
||||||
.conversation_error {
|
.conversation_error {
|
||||||
color: #DF0101;
|
color: #DF0101;
|
||||||
|
|
@ -857,7 +853,7 @@ form p.checkbox_select {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
#birth-date{
|
#birth-date {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
select{
|
select{
|
||||||
width: 32%;
|
width: 32%;
|
||||||
|
|
@ -917,7 +913,7 @@ form#update_profile_form {
|
||||||
padding: 3px;
|
padding: 3px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.submit_block{ margin-bottom: 20px; }
|
.submit_block { margin-bottom: 20px; }
|
||||||
}
|
}
|
||||||
|
|
||||||
select#user_language, #user_auto_follow_back_aspect_id, #aspect_ids_ {
|
select#user_language, #user_auto_follow_back_aspect_id, #aspect_ids_ {
|
||||||
|
|
@ -1093,7 +1089,7 @@ select#aspect_ids_ {
|
||||||
}
|
}
|
||||||
|
|
||||||
.remove_post { opacity: 0.5; }
|
.remove_post { opacity: 0.5; }
|
||||||
.remove_comment{ opacity: 0.5; }
|
.remove_comment { opacity: 0.5; }
|
||||||
|
|
||||||
.center {
|
.center {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
|
@ -1133,14 +1129,14 @@ select#aspect_ids_ {
|
||||||
word-wrap: break-word;
|
word-wrap: break-word;
|
||||||
}
|
}
|
||||||
|
|
||||||
#email_prefs{
|
#email_prefs {
|
||||||
.checkbox{
|
.checkbox{
|
||||||
margin: 15px 0;
|
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, .form-control:active, .form-control:focus { box-shadow: none; }
|
||||||
.form-control:active, .form-control:focus{ border-color: #999999; }
|
.form-control:active, .form-control:focus { border-color: #999999; }
|
||||||
|
|
||||||
.tag_following_action { margin: 5px 0 10px 0; }
|
.tag_following_action { margin: 5px 0 10px 0; }
|
||||||
|
|
|
||||||
|
|
@ -24,7 +24,7 @@
|
||||||
|
|
||||||
.settings_visibilty { margin-left: 10px; }
|
.settings_visibilty { margin-left: 10px; }
|
||||||
|
|
||||||
#profile_bio{
|
#profile_bio {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
min-width: 100%;
|
min-width: 100%;
|
||||||
|
|
|
||||||
|
|
@ -4,20 +4,20 @@
|
||||||
|
|
||||||
%li.comment{data:{guid:comment.id}, class: ("hidden" if(defined? hidden))}
|
%li.comment{data:{guid:comment.id}, class: ("hidden" if(defined? hidden))}
|
||||||
.content
|
.content
|
||||||
.col-xs-1
|
.media
|
||||||
= person_image_link(comment.author, size: :thumb_small)
|
.media-left
|
||||||
.col-xs-11
|
= person_image_link(comment.author, size: :thumb_small, class: "media-object")
|
||||||
.from.pull-left
|
.media-body
|
||||||
= person_link(comment.author)
|
.from.pull-left
|
||||||
.info
|
= person_link(comment.author)
|
||||||
%span
|
.info
|
||||||
= timeago(comment.created_at ? comment.created_at : Time.now)
|
%span
|
||||||
.remove_comment
|
= timeago(comment.created_at ? comment.created_at : Time.now)
|
||||||
.pull-right
|
.remove_comment
|
||||||
- if user_signed_in? && comment.author == current_user.person
|
.pull-right
|
||||||
= link_to(raw("<i class='entypo trash'></i>"), comment_path(comment), method: :delete,
|
- if user_signed_in? && comment.author == current_user.person
|
||||||
data: { confirm: "#{t('are_you_sure')}" }, class: "remove")
|
= link_to(raw("<i class='entypo trash'></i>"), comment_path(comment), method: :delete,
|
||||||
.clearfix
|
data: { confirm: "#{t('are_you_sure')}" }, class: "remove")
|
||||||
|
|
||||||
%div{class: direction_for(comment.text)}
|
%div{class: direction_for(comment.text)}
|
||||||
= comment.message.markdownified
|
= comment.message.markdownified
|
||||||
|
|
|
||||||
|
|
@ -16,10 +16,10 @@
|
||||||
%ul.notifications_for_day
|
%ul.notifications_for_day
|
||||||
- notes.each do |note|
|
- notes.each do |note|
|
||||||
.stream_element{:data=>{guid: note.id}, class: "#{note.unread ? 'unread' : 'read'}"}
|
.stream_element{:data=>{guid: note.id}, class: "#{note.unread ? 'unread' : 'read'}"}
|
||||||
.content.from
|
.content.from.media
|
||||||
.col-xs-1
|
.media-left
|
||||||
= person_image_link(note.actors.last, size: :thumb_small)
|
= person_image_link(note.actors.last, size: :thumb_small, class: "media-object")
|
||||||
.col-xs-11
|
.media-body
|
||||||
= notification_message_for(note)
|
= notification_message_for(note)
|
||||||
.time_notif
|
.time_notif
|
||||||
= timeago(note.created_at)
|
= timeago(note.created_at)
|
||||||
|
|
|
||||||
|
|
@ -2,10 +2,10 @@
|
||||||
-# licensed under the Affero General Public License version 3 or later. See
|
-# licensed under the Affero General Public License version 3 or later. See
|
||||||
-# the COPYRIGHT file.
|
-# the COPYRIGHT file.
|
||||||
|
|
||||||
.from
|
.from.media
|
||||||
.col-xs-1
|
.media-left
|
||||||
= person_image_link(post.author, size: :thumb_small)
|
= person_image_link(post.author, size: :thumb_small, class: "media-object")
|
||||||
.col-xs-11
|
.media-body
|
||||||
.pull-left
|
.pull-left
|
||||||
= person_link(post.author)
|
= person_link(post.author)
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue