From c24d5193e45295451b73dfcc3b74c9d25f0f7ca7 Mon Sep 17 00:00:00 2001 From: flaburgan Date: Mon, 4 Nov 2013 01:43:06 -0800 Subject: [PATCH 1/7] Refactor conversations css + fix inconsistent height of conversations list bug --- app/assets/javascripts/inbox.js | 13 -- app/assets/stylesheets/application.css.sass | 207 +----------------- app/assets/stylesheets/conversations.css.scss | 171 +++++++++++++++ app/views/conversations/index.haml | 9 +- 4 files changed, 176 insertions(+), 224 deletions(-) create mode 100644 app/assets/stylesheets/conversations.css.scss diff --git a/app/assets/javascripts/inbox.js b/app/assets/javascripts/inbox.js index c1f367bdb..965e21a1f 100644 --- a/app/assets/javascripts/inbox.js +++ b/app/assets/javascripts/inbox.js @@ -60,11 +60,6 @@ $(document).ready(function(){ } }); - resize(); - $(window).resize(function(){ - resize(); - }); - $('#conversation_inbox .stream').infinitescroll({ navSelector : ".pagination", // selector for the paged navigation (it will be hidden) @@ -134,11 +129,3 @@ $(document).ready(function(){ }) }); }); - -var resize = function(){ - var inboxSidebar = $('#conversation_inbox'), - inboxSidebarOffset = inboxSidebar.offset().top, - windowHeight = $(window).height(); - - inboxSidebar.css('height', windowHeight - inboxSidebarOffset); -}; diff --git a/app/assets/stylesheets/application.css.sass b/app/assets/stylesheets/application.css.sass index ac25683a3..32b586213 100644 --- a/app/assets/stylesheets/application.css.sass +++ b/app/assets/stylesheets/application.css.sass @@ -15,6 +15,7 @@ @import 'publisher' @import 'facebox' @import 'aspects' +@import 'conversations' /* ====== media ====== */ .media @@ -1086,210 +1087,8 @@ ul#press_logos iframe, .thumb img :width 100% -.conversation_participants - :background - :color $background-white - :margin - :bottom 10px - - :-webkit-box-shadow 0 2px 3px -3px #666 - :-moz-box-shadow 0 2px 3px -3px #666 - :box-shadow 0 2px 3px -3px #666 - - a.close_conversation - :display block - :margin-top 20px - :float right - - .icons-deletelabel - :height 14px - :width 14px - - h3 - :margin 0 - :top 6px - :bottom 0px - :padding - :bottom 10px - - .avatar - :height 30px - :width 30px - - :line - :height 0 - - a img - :margin - :bottom 4px - - .conversation_controls - a - :margin - :right 10px - - :margin - :bottom 10px - - :border - :bottom 1px solid $border-grey - :padding 10px - :top 101px - :bottom 10px - :width 560px - :margin - :top -100px - - .avatars - :text - :align right - :margin - :top 9px - -.conversation_participants - a:hover - :text-decoration none - - -.stream_element.conversation - :padding 8px - - .message_count - @include border-radius(5px) - - :float right - :right 0px - :padding 0 5px - :position relative - :background - :color #999 - :color #eee - :font - :size 12px - :weight normal - - .unread_message_count - @include border-radius(5px) - - :float right - :right 5px - :padding 0 5px - :position relative - :background - :color #b11 - :color #eee - :font - :size 12px - :weight normal - - .participant_count - :font - :weight normal - - .timestamp - :position relative - :float right - :font - :weight normal - :color $blue - - .participants_link - :margin-top 5px - :clear right - :float right - :color #aaa - - .icons-users - :display block - :width 25px - :height 16px - - .conversation_participants_popover_content - :display none - - .conversation_participants_popover - :margin 0 auto - :padding-left 12px - - .avatar - :display inline - :width 35px - :height 35px - :margin - :right 10px - :bottom 10px - - .participants_left - :display block - - &:hover:not(.selected) - :background - :color $highlight-white - - &.selected:hover - :background - :color lighten($blue,5%) - - &:hover - :cursor pointer - -.conversation.unread - :background - :color darken($background-white,5%) - -.conversation.selected - :background - :color $blue - .subject - :color #fff - .last_author - :color #fff - .timestamp - :color #eee - :border - :bottom 1px solid darken($blue, 10%) - :top 1px solid darken($blue, 10%) - -#conversation_inbox - :height 100% - :overflow-y auto - :overflow-x none - - a:hover - :text - :decoration none - -#left_pane - :position fixed - :width 337px - - h3 - :padding - :bottom 0 - :margin - :bottom 15px - - #left_pane_header - :padding 10px - :height 55px - :border - :bottom 1px solid $border-grey - -#no_conversation_text - :font - :size 20px - :weight bold - :color #ccc - :text - :align center - :margin - :top 100px - -#no_conversation_controls - :text - :align center - :font - :size 12px +#contact_visibility_padlock:hover + @include opacity(0.7) .side_stream .stream_element diff --git a/app/assets/stylesheets/conversations.css.scss b/app/assets/stylesheets/conversations.css.scss new file mode 100644 index 000000000..168497612 --- /dev/null +++ b/app/assets/stylesheets/conversations.css.scss @@ -0,0 +1,171 @@ +.conversation_participants { + box-shadow: 0 2px 3px -3px #666; + -webkit-box-shadow: 0 2px 3px -3px #666; + -moz-box-shadow: 0 2px 3px -3px #666; + + background-color: $background-white; + margin-bottom: 10px; + border-bottom: 1px solid $border-grey; + padding: 10px; + padding-top: 0px; + width: 560px; + line-height: 0px; + + a.close_conversation { + display: block; + margin-top: 5px; + float: right; + + .icons-deletelabel { + height: 14px; + width: 14px; + } + } + + h3 { + margin: 0px; + margin-top: 6px; + padding-bottom: 10px; + } + + .avatar { + height: 30px; + width: 30px; + } + + .avatars { + text-align: right; + margin-top: 9px; + } + + a img { margin-bottom: 4px; } + + .conversation_controls { + margin-bottom: 10px; + + a { margin-right: 10px; } + } +} + +.conversation_participants a:hover { text-decoration: none; } + +.stream_element.conversation { + padding: 8px; + + .message_count, .unread_message_count { + @include border-radius(5px); + float: right; + right: 5px; + padding: 0px 5px; + position: relative; + color: $background-grey; + font-size: 12px; + font-weight: normal; + } + + .message_count { background-color: #999; } + .unread_message_count { background-color: #b11; } + .participant_count { font-weight: normal; } + + .timestamp { + position: relative; + float: right; + font-weight: normal; + color: $blue; + } + + .participants_link { + margin-top: 5px; + clear: right; + float: right; + color: #aaa; + } + + .icons-users { + display: block; + width: 25px; + height: 16px; + } + + .conversation_participants_popover_content { + display: none; + } + + .conversation_participants_popover { + margin: 0px auto; + padding-left: 12px; + } + + .avatar { + display: inline; + width: 35px; + height: 35px; + margin-right: 10px; + margin-bottom: 10px; + } + + .participants_left { display: block; } + &:hover:not(.selected) { background-color: $highlight-white; } + &.selected:hover { background-color: lighten($blue,5%); } + &:hover { cursor: pointer; } +} + +.conversation.unread { + background-color: darken($background-white, 5%); +} + +.conversation.selected { + background-color: $blue; + + .subject, + .last_author { + color: $white; + } + .timestamp { color: $background-grey; } +} + +#left_pane { + h3 { + padding-bottom: 0; + margin-bottom: 15px; + } + + #left_pane_header { + position: fixed; + top: 50px; + width: 320px; + height: 40px; + padding: 10px; + border-bottom: 1px solid $border-grey; + } + + #conversation_inbox { + position: fixed; + bottom: 0px; + top: 125px; + width: 350px; + overflow-y: auto; + overflow-x: none; + + a:hover { + text-decoration: none; + } + } +} + +#no_conversations, +#no_conversation_text { + font-weight: bold; + color: #ccc; + text-align: center; + margin-top: 100px; +} + +#no_conversation_text { + font-size: 20px; +} + +#no_conversation_controls { + text-align: center; + font-size: 12px; +} diff --git a/app/views/conversations/index.haml b/app/views/conversations/index.haml index c9fd40a43..115ffe2b0 100644 --- a/app/views/conversations/index.haml +++ b/app/views/conversations/index.haml @@ -24,13 +24,8 @@ - if @conversations.count > 0 = render :partial => 'conversations/conversation', :collection => @conversations, :locals => {:authors => @authors, :unread_counts => @unread_counts} - else - %br - %br - %br - %br - %div{:style => 'text-align:center;'} - %i - = t('.no_messages') + #no_conversations + = t('.no_messages') = will_paginate @conversations From c11b744a7f0418e9bbb0ae66281c35b1ee8d7f21 Mon Sep 17 00:00:00 2001 From: Steffen van Bergerem Date: Sun, 15 Dec 2013 01:24:18 +0100 Subject: [PATCH 2/7] port conversations view to bootstrap --- app/assets/stylesheets/application.css.sass | 27 +--- app/assets/stylesheets/conversations.css.scss | 148 +++++++++++++----- app/assets/stylesheets/new-templates.css.scss | 4 + app/assets/stylesheets/popover.css.scss | 28 ++++ app/controllers/conversations_controller.rb | 1 + app/views/conversations/_conversation.haml | 19 ++- app/views/conversations/_show.haml | 21 ++- app/views/conversations/index.haml | 51 +++--- 8 files changed, 191 insertions(+), 108 deletions(-) create mode 100644 app/assets/stylesheets/popover.css.scss diff --git a/app/assets/stylesheets/application.css.sass b/app/assets/stylesheets/application.css.sass index 32b586213..b97a1e1dc 100644 --- a/app/assets/stylesheets/application.css.sass +++ b/app/assets/stylesheets/application.css.sass @@ -15,7 +15,7 @@ @import 'publisher' @import 'facebox' @import 'aspects' -@import 'conversations' +@import 'popover' /* ====== media ====== */ .media @@ -1854,31 +1854,6 @@ a.toggle_selector &.hidden :display none -.popover - .close - @include opacity(0) - @include transition(opacity, 0.2s) - :position relative - :top 1px - :right -5px - :float right - .icons-deletelabel - :height 14px - :width 14px - - img - margin-top: 10px - - &:hover - .close - @include opacity(0.5) - - &:hover - @include opacity(1) -body - .popover - :z-index 1000 - .nsfw-shield @include border-radius(3px) :background-color $background-grey diff --git a/app/assets/stylesheets/conversations.css.scss b/app/assets/stylesheets/conversations.css.scss index 168497612..597a958dc 100644 --- a/app/assets/stylesheets/conversations.css.scss +++ b/app/assets/stylesheets/conversations.css.scss @@ -1,19 +1,77 @@ +.span-24 { + width: 100%; + margin: 0; + padding: 0; +} + + +.conversations_container { + padding-top: 40px; + + .stream_element { + border-bottom: 1px solid $border-grey; + &:first-child { + border-top: none; + } + .last_author { + font-size: 12px; + color: $text-dark-grey; + } + a.author{ + font-weight: bold; + unicode-bidi: bidi-override; + } + } + .stream .stream_element { + padding: 10px; + p { + margin: 0 0 1em 0; + word-wrap: break-word; + &:last-child { margin-bottom: 0; } + } + + .new_message { border-bottom: none; } + .timeago { font-size: smaller; } + textarea { width: 95%; } + .button.creation { + $button-border-color: #aaa; + @include border-radius(3px); + @include box-shadow(0,1px,1px,#cfcfcf); + @include transition(border); + @include button-gradient($creation-blue); + font-size: 12px; + color: #fff; + padding: 4px 9px; + min-width: 90px; + min-height: 10px; + border: 1px solid darken($button-border-color,20%); + + cursor: pointer; + white-space: nowrap; + + &:hover { + @include button-gradient-hover($creation-blue); + border: 1px solid darken($button-border-color,35%); + text-decoration: none; + } + } + } +} + .conversation_participants { box-shadow: 0 2px 3px -3px #666; -webkit-box-shadow: 0 2px 3px -3px #666; -moz-box-shadow: 0 2px 3px -3px #666; background-color: $background-white; - margin-bottom: 10px; + margin-bottom: 5px; border-bottom: 1px solid $border-grey; - padding: 10px; - padding-top: 0px; - width: 560px; + padding: 5px; line-height: 0px; a.close_conversation { display: block; - margin-top: 5px; + margin-top: 10px; float: right; .icons-deletelabel { @@ -22,12 +80,6 @@ } } - h3 { - margin: 0px; - margin-top: 6px; - padding-bottom: 10px; - } - .avatar { height: 30px; width: 30px; @@ -51,20 +103,42 @@ .stream_element.conversation { padding: 8px; + + .subject { + font-size: 14px; + } .message_count, .unread_message_count { @include border-radius(5px); float: right; - right: 5px; - padding: 0px 5px; + padding: 0px 6px; position: relative; color: $background-grey; font-size: 12px; font-weight: normal; } - .message_count { background-color: #999; } - .unread_message_count { background-color: #b11; } + .message_count { + background-color: #999; + right: 0px; + } + .unread_message_count { + background-color: #b11; + right: 4px; + } + + .participants_link { + clear: right; + float: right; + color: #aaa; + } + + .icons-users { + margin-left: 4px; + display: block; + width: 25px; + height: 16px; + } .participant_count { font-weight: normal; } .timestamp { @@ -74,24 +148,18 @@ color: $blue; } - .participants_link { - margin-top: 5px; - clear: right; - float: right; - color: #aaa; + .last_message { + font-size: 12px; } - - .icons-users { - display: block; - width: 25px; - height: 16px; - } - .conversation_participants_popover_content { display: none; } .conversation_participants_popover { + .avatar { + margin-bottom: 10px; + margin-right: 10px; + } margin: 0px auto; padding-left: 12px; } @@ -100,12 +168,19 @@ display: inline; width: 35px; height: 35px; - margin-right: 10px; - margin-bottom: 10px; + margin-top: 5px; } .participants_left { display: block; } - &:hover:not(.selected) { background-color: $highlight-white; } + &:hover:not(.selected) { + background-color: lighten($blue,5%); + .subject, + .last_author, + .last_message { + color: $white; + } + .timestamp { color: $background-grey; } + } &.selected:hover { background-color: lighten($blue,5%); } &:hover { cursor: pointer; } } @@ -118,32 +193,27 @@ background-color: $blue; .subject, - .last_author { + .last_author, + .last_message { color: $white; } .timestamp { color: $background-grey; } } #left_pane { + border-right: solid 1px $border-grey; h3 { padding-bottom: 0; - margin-bottom: 15px; } #left_pane_header { - position: fixed; - top: 50px; - width: 320px; - height: 40px; padding: 10px; + padding-right: 20px; border-bottom: 1px solid $border-grey; } #conversation_inbox { - position: fixed; bottom: 0px; - top: 125px; - width: 350px; overflow-y: auto; overflow-x: none; diff --git a/app/assets/stylesheets/new-templates.css.scss b/app/assets/stylesheets/new-templates.css.scss index 4c3c4ecbf..523c14bc0 100644 --- a/app/assets/stylesheets/new-templates.css.scss +++ b/app/assets/stylesheets/new-templates.css.scss @@ -26,3 +26,7 @@ @import 'bootstrap-headerfix'; @import 'opengraph'; @import 'single-post-view'; + +/* conversations */ +@import 'conversations'; +@import 'popover'; diff --git a/app/assets/stylesheets/popover.css.scss b/app/assets/stylesheets/popover.css.scss new file mode 100644 index 000000000..1e29e5d5f --- /dev/null +++ b/app/assets/stylesheets/popover.css.scss @@ -0,0 +1,28 @@ +.popover { + .close { + @include opacity(0); + @include transition(opacity, 0.2s); + position: relative; + top: 1px; + right: -5px; + float: right; + .icons-deletelabel { + height: 14px; + width: 14px; + } + + img { margin-top: 10px; } + } + + &:hover { + .close { + @include opacity(0.5); + + &:hover { @include opacity(1); } + } + } +} +body { + .popover { z-index: 1000; } +} + diff --git a/app/controllers/conversations_controller.rb b/app/controllers/conversations_controller.rb index 8b85e43f1..8fae94655 100644 --- a/app/controllers/conversations_controller.rb +++ b/app/controllers/conversations_controller.rb @@ -1,5 +1,6 @@ class ConversationsController < ApplicationController before_filter :authenticate_user! + before_filter -> { @css_framework = :bootstrap } respond_to :html, :mobile, :json, :js diff --git a/app/views/conversations/_conversation.haml b/app/views/conversations/_conversation.haml index 264c3767f..5459acf38 100644 --- a/app/views/conversations/_conversation.haml +++ b/app/views/conversations/_conversation.haml @@ -5,21 +5,24 @@ .conversation-wrapper{ :"data-conversation-path" => conversation_path(conversation) } .stream_element.conversation{:data=>{:guid=>conversation.id}, :class => ('unread' if unread_counts[conversation.id].to_i > 0)} .media + = link_to content_tag(:span, nil, class: 'icons-users', title: t('.participants')), '#', :class => 'participants_link', "data-conversation-id" => conversation.id + = render :partial => 'participants_popover', :locals => { :conversation => conversation } + = render(:partial => 'conversation_subject', + :locals => { :conversation => conversation, + :unread_count => unread_counts[conversation.id].to_i }) + .img - if authors[conversation.id].present? = person_image_tag(authors[conversation.id]) .bg - = render(:partial => 'conversation_subject', - :locals => { :conversation => conversation, - :unread_count => unread_counts[conversation.id].to_i }) - + %time.timeago.timestamp{:datetime => conversation.updated_at.iso8601} + = t('ago', :time => time_ago_in_words(conversation.updated_at)) .last_author - %time.timeago.timestamp{:datetime => conversation.updated_at.iso8601} - = t('ago', :time => time_ago_in_words(conversation.updated_at)) - if authors[conversation.id].present? = authors[conversation.id].name + .last_message + - if conversation.messages.present? + = conversation.messages.last.text[0..40] - = link_to content_tag(:span, nil, class: 'icons-users', title: t('.participants')), '#', :class => 'participants_link', "data-conversation-id" => conversation.id - = render :partial => 'participants_popover', :locals => { :conversation => conversation } diff --git a/app/views/conversations/_show.haml b/app/views/conversations/_show.haml index 61b1af12c..3f5e16f65 100644 --- a/app/views/conversations/_show.haml +++ b/app/views/conversations/_show.haml @@ -16,16 +16,15 @@ - for participant in conversation.participants = person_image_link(participant, :size => :thumb_small) -.span-15.last - .stream - = render :partial => 'messages/message', :collection => conversation.messages +.stream + = render :partial => 'messages/message', :collection => conversation.messages - .stream_element.new_message - .media - .img - = owner_image_tag(:thumb_small) + .stream_element.new_message + .media + .img + = owner_image_tag(:thumb_small) - .bd - = form_for [conversation, Message.new] do |message| - = message.text_area :text, :rows => 5, :tabindex => 1 - = message.submit t('.reply').capitalize, 'data-disable-with' => t('.replying'), :class => 'button creation', :tabindex => 2 + .bd + = form_for [conversation, Message.new] do |message| + = message.text_area :text, :rows => 5, :tabindex => 1 + = message.submit t('.reply').capitalize, 'data-disable-with' => t('.replying'), :class => 'button creation', :tabindex => 2 diff --git a/app/views/conversations/index.haml b/app/views/conversations/index.haml index 115ffe2b0..7151bbcab 100644 --- a/app/views/conversations/index.haml +++ b/app/views/conversations/index.haml @@ -12,30 +12,33 @@ :css footer{ display:none;} -#left_pane - #left_pane_header - %h3 - .right - = link_to t('.new_message'), new_conversation_path, :class => 'button', :rel => 'facebox' - = t('.inbox') +.container-fluid.conversations_container + .row-fluid + .span4 + #left_pane + #left_pane_header + %h3 + .pull-right + = link_to t('.new_message'), new_conversation_path, :class => 'btn btn-default', :rel => 'facebox' + = t('.inbox') - #conversation_inbox - .stream.conversations - - if @conversations.count > 0 - = render :partial => 'conversations/conversation', :collection => @conversations, :locals => {:authors => @authors, :unread_counts => @unread_counts} - - else - #no_conversations - = t('.no_messages') - = will_paginate @conversations + #conversation_inbox + .stream.conversations + - if @conversations.count > 0 + = render :partial => 'conversations/conversation', :collection => @conversations, :locals => {:authors => @authors, :unread_counts => @unread_counts} + - else + #no_conversations + = t('.no_messages') + = will_paginate @conversations -.span-15.prepend-9.last - .stream_container - #conversation_show - - if @conversation - = render 'conversations/show', :conversation => @conversation - - else - #no_conversation_text - = t('.no_conversation_selected') - #no_conversation_controls - = link_to t('.create_a_new_message'), new_conversation_path, :rel => 'facebox' + .span8 + .stream_container + #conversation_show + - if @conversation + = render 'conversations/show', :conversation => @conversation + - else + #no_conversation_text + = t('.no_conversation_selected') + #no_conversation_controls + = link_to t('.create_a_new_message'), new_conversation_path, :rel => 'facebox' From c24cfb432d9a911b5299f857d0400a22120d4c1f Mon Sep 17 00:00:00 2001 From: Steffen van Bergerem Date: Sun, 15 Dec 2013 14:20:47 +0100 Subject: [PATCH 3/7] fix facebox in conversations view --- app/assets/stylesheets/conversations.css.scss | 33 ++++++++++++++ app/assets/stylesheets/new-templates.css.scss | 1 + app/views/conversations/new.haml | 45 +++++++++---------- 3 files changed, 56 insertions(+), 23 deletions(-) diff --git a/app/assets/stylesheets/conversations.css.scss b/app/assets/stylesheets/conversations.css.scss index 597a958dc..e9d641c05 100644 --- a/app/assets/stylesheets/conversations.css.scss +++ b/app/assets/stylesheets/conversations.css.scss @@ -239,3 +239,36 @@ text-align: center; font-size: 12px; } + +#new_message_pane { + ul.as-selections { width: 100% !important; } + input#contact_ids { box-shadow: none; } + textarea { width: 98%; } + + .bottom_submit_section { + text-align: right; + } + + .button.creation { + $button-border-color: #aaa; + @include border-radius(3px); + @include box-shadow(0,1px,1px,#cfcfcf); + @include transition(border); + @include button-gradient($creation-blue); + font-size: 12px; + color: #fff; + padding: 4px 9px; + min-width: 90px; + min-height: 10px; + border: 1px solid darken($button-border-color,20%); + + cursor: pointer; + white-space: nowrap; + + &:hover { + @include button-gradient-hover($creation-blue); + border: 1px solid darken($button-border-color,35%); + text-decoration: none; + } + } +} diff --git a/app/assets/stylesheets/new-templates.css.scss b/app/assets/stylesheets/new-templates.css.scss index 523c14bc0..bd0026331 100644 --- a/app/assets/stylesheets/new-templates.css.scss +++ b/app/assets/stylesheets/new-templates.css.scss @@ -30,3 +30,4 @@ /* conversations */ @import 'conversations'; @import 'popover'; +@import 'facebox'; diff --git a/app/views/conversations/new.haml b/app/views/conversations/new.haml index 36c10b4fd..1458abdbc 100644 --- a/app/views/conversations/new.haml +++ b/app/views/conversations/new.haml @@ -27,28 +27,27 @@ }); #new_message_pane - .span-12.last - #facebox_header - %h3 - = t('conversations.index.new_message') + .span5#facebox_header + %h3 + = t('conversations.index.new_message') - = form_for Conversation.new, html: {class: "new_conversation form_do_not_clear"}, remote: true do |conversation| + = form_for Conversation.new, html: {class: "new_conversation form_do_not_clear"}, remote: true do |conversation| - .span-2 - %h4 - = t('.to') - .span-10.last - = text_field_tag "contact_autocomplete" - .clearfix - %br - .span-2 - %h4 - = t('.subject') - .span-10.last - = conversation.text_field :subject - %br - .span-10.prepend-2.last - = text_area_tag "conversation[text]", '', :rows => 5 - .clearfix - .bottom_submit_section - = conversation.submit t('.send'), 'data-disable-with' => t('.sending'), :class => 'button creation' + .span1 + %h4 + = t('.to') + .span4 + = text_field_tag "contact_autocomplete" + .clearfix + %br + .span1 + %h4 + = t('.subject') + .span4 + = conversation.text_field :subject + %br + .span4.offset1 + = text_area_tag "conversation[text]", '', :rows => 5 + .clearfix + .bottom_submit_section + = conversation.submit t('.send'), 'data-disable-with' => t('.sending'), :class => 'button creation' From 5ab777f8cb3e77b6754671ab5a40915edea2e557 Mon Sep 17 00:00:00 2001 From: Steffen van Bergerem Date: Sun, 15 Dec 2013 18:00:37 +0100 Subject: [PATCH 4/7] remove unused code --- app/assets/stylesheets/conversations.css.scss | 4 ---- 1 file changed, 4 deletions(-) diff --git a/app/assets/stylesheets/conversations.css.scss b/app/assets/stylesheets/conversations.css.scss index e9d641c05..99c6f169e 100644 --- a/app/assets/stylesheets/conversations.css.scss +++ b/app/assets/stylesheets/conversations.css.scss @@ -213,10 +213,6 @@ } #conversation_inbox { - bottom: 0px; - overflow-y: auto; - overflow-x: none; - a:hover { text-decoration: none; } From 24310fe5a9bb5bff4682dab9554bbd3ec6691dd0 Mon Sep 17 00:00:00 2001 From: Steffen van Bergerem Date: Sun, 15 Dec 2013 20:08:44 +0100 Subject: [PATCH 5/7] change layout --- app/assets/stylesheets/conversations.css.scss | 7 ------- app/controllers/conversations_controller.rb | 2 ++ 2 files changed, 2 insertions(+), 7 deletions(-) diff --git a/app/assets/stylesheets/conversations.css.scss b/app/assets/stylesheets/conversations.css.scss index 99c6f169e..ef3822f96 100644 --- a/app/assets/stylesheets/conversations.css.scss +++ b/app/assets/stylesheets/conversations.css.scss @@ -1,10 +1,3 @@ -.span-24 { - width: 100%; - margin: 0; - padding: 0; -} - - .conversations_container { padding-top: 40px; diff --git a/app/controllers/conversations_controller.rb b/app/controllers/conversations_controller.rb index 8fae94655..a4be3ea0c 100644 --- a/app/controllers/conversations_controller.rb +++ b/app/controllers/conversations_controller.rb @@ -1,5 +1,7 @@ class ConversationsController < ApplicationController before_filter :authenticate_user! + + layout ->(c) { request.format == :mobile ? "application" : "with_header" } before_filter -> { @css_framework = :bootstrap } respond_to :html, :mobile, :json, :js From 206e3f94221640abbf30bdcc8fd6388005a0706b Mon Sep 17 00:00:00 2001 From: Steffen van Bergerem Date: Sun, 15 Dec 2013 23:21:14 +0100 Subject: [PATCH 6/7] fix mobile --- app/views/conversations/index.haml | 3 --- app/views/conversations/new.haml | 2 +- 2 files changed, 1 insertion(+), 4 deletions(-) diff --git a/app/views/conversations/index.haml b/app/views/conversations/index.haml index 7151bbcab..dd2127274 100644 --- a/app/views/conversations/index.haml +++ b/app/views/conversations/index.haml @@ -9,9 +9,6 @@ - content_for :page_title do = t('.message_inbox') -:css - footer{ display:none;} - .container-fluid.conversations_container .row-fluid .span4 diff --git a/app/views/conversations/new.haml b/app/views/conversations/new.haml index 1458abdbc..f15cf2818 100644 --- a/app/views/conversations/new.haml +++ b/app/views/conversations/new.haml @@ -26,7 +26,7 @@ autocompleteInput.focus(); }); -#new_message_pane +.span6#new_message_pane .span5#facebox_header %h3 = t('conversations.index.new_message') From a96611c2595dd55aed8c1f2be8681696a4455c0e Mon Sep 17 00:00:00 2001 From: Steffen van Bergerem Date: Mon, 16 Dec 2013 00:46:55 +0100 Subject: [PATCH 7/7] use bootstrap labels --- app/assets/stylesheets/conversations.css.scss | 15 +-------------- .../conversations/_conversation_subject.haml | 4 ++-- 2 files changed, 3 insertions(+), 16 deletions(-) diff --git a/app/assets/stylesheets/conversations.css.scss b/app/assets/stylesheets/conversations.css.scss index ef3822f96..05bbad354 100644 --- a/app/assets/stylesheets/conversations.css.scss +++ b/app/assets/stylesheets/conversations.css.scss @@ -102,24 +102,12 @@ } .message_count, .unread_message_count { - @include border-radius(5px); + margin-right: 3px; float: right; - padding: 0px 6px; - position: relative; - color: $background-grey; font-size: 12px; font-weight: normal; } - .message_count { - background-color: #999; - right: 0px; - } - .unread_message_count { - background-color: #b11; - right: 4px; - } - .participants_link { clear: right; float: right; @@ -127,7 +115,6 @@ } .icons-users { - margin-left: 4px; display: block; width: 25px; height: 16px; diff --git a/app/views/conversations/_conversation_subject.haml b/app/views/conversations/_conversation_subject.haml index dc0b32b15..82c7f4d77 100644 --- a/app/views/conversations/_conversation_subject.haml +++ b/app/views/conversations/_conversation_subject.haml @@ -1,8 +1,8 @@ .subject - .message_count + .label.label-dafault.message_count = conversation.messages.size - if unread_count > 0 - .unread_message_count + .label.label-important.unread_message_count = unread_count %div{ :class => direction_for(conversation.subject) }