From 8498d7ad1fae47598c02709735c2ff6f40e7e7b3 Mon Sep 17 00:00:00 2001 From: lilia Date: Wed, 21 Jan 2015 23:39:07 -1000 Subject: [PATCH] Fixup conversation page styles and functionality Render the entire conversation from a template, because some parts of it must be rendered conditionally if it is a group vs private conversation. Also apply some style fixes and restore lost functionality: * Make conversation title bar fixed. * Widens message bubbles. * Unhide message list. * Restore attachment rendering. * Restore message sending and attachment file selection. * Style attachments file input as a paperclip. * Style send button like on Android and make it a submit input. --- conversation.html | 54 +++++++++++-------- images/paperclip.png | Bin 0 -> 2066 bytes images/send.png | Bin 0 -> 4850 bytes js/conversation_panel.js | 2 +- js/views/conversation_view.js | 4 +- js/views/file_input_view.js | 2 +- stylesheets/manifest.css | 66 +++++++++++++++-------- stylesheets/view/_conversation.scss | 79 +++++++++++++++++++--------- 8 files changed, 134 insertions(+), 73 deletions(-) create mode 100644 images/paperclip.png create mode 100644 images/send.png diff --git a/conversation.html b/conversation.html index c8f3cfb3..5f5d8008 100644 --- a/conversation.html +++ b/conversation.html @@ -11,38 +11,46 @@ - + + + -
- -
- - -
- -
- -
- Welcome to the settings page!! - Go Back? -
- diff --git a/images/paperclip.png b/images/paperclip.png new file mode 100644 index 0000000000000000000000000000000000000000..dc280a815667c44e83de0a7aac726e4872e4b945 GIT binary patch literal 2066 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