From 65318de9ae18b4e01d110effaa1576843ccf3b78 Mon Sep 17 00:00:00 2001 From: Reed Garmsen Date: Thu, 18 Jun 2015 15:34:23 -0700 Subject: Changed the new messages separator location in the markup to be at the same level as the date seperator --- web/react/components/post_list.jsx | 12 +++++------- web/react/utils/utils.jsx | 2 +- 2 files changed, 6 insertions(+), 8 deletions(-) diff --git a/web/react/components/post_list.jsx b/web/react/components/post_list.jsx index 65247b705..47ecc1680 100644 --- a/web/react/components/post_list.jsx +++ b/web/react/components/post_list.jsx @@ -444,13 +444,11 @@ module.exports = React.createClass({ if (post.create_at > last_viewed && !rendered_last_viewed) { rendered_last_viewed = true; postCtls.push( -
-
-
-
New Messages
-
- {postCtl} -
+
+
+
New Messages
+ {postCtl} +
); } else { postCtls.push(postCtl); diff --git a/web/react/utils/utils.jsx b/web/react/utils/utils.jsx index 72ed48faf..8fc25cc61 100644 --- a/web/react/utils/utils.jsx +++ b/web/react/utils/utils.jsx @@ -716,7 +716,7 @@ Image.prototype.load = function(url, progressCallback) { m = h.match( /^Content-Type\:\s*(.*?)$/mi ), mimeType = m[ 1 ] || 'image/png'; - var blob = new Blob([this.response], { type: mimeType }); + var blob = new Blob([this.response.buffer], { type: mimeType }); thisImg.src = window.URL.createObjectURL(blob); }; xmlHTTP.onprogress = function(e) { -- cgit v1.2.3-1-g7c22 From 8ae7afa5cc0119c7308aa87ce65c3c6c875da985 Mon Sep 17 00:00:00 2001 From: Reed Garmsen Date: Thu, 18 Jun 2015 15:38:03 -0700 Subject: Removed extraneous code --- web/react/utils/utils.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/web/react/utils/utils.jsx b/web/react/utils/utils.jsx index 8fc25cc61..72ed48faf 100644 --- a/web/react/utils/utils.jsx +++ b/web/react/utils/utils.jsx @@ -716,7 +716,7 @@ Image.prototype.load = function(url, progressCallback) { m = h.match( /^Content-Type\:\s*(.*?)$/mi ), mimeType = m[ 1 ] || 'image/png'; - var blob = new Blob([this.response.buffer], { type: mimeType }); + var blob = new Blob([this.response], { type: mimeType }); thisImg.src = window.URL.createObjectURL(blob); }; xmlHTTP.onprogress = function(e) { -- cgit v1.2.3-1-g7c22 From 32025e43799324523988af040085d95ec6b6e80e Mon Sep 17 00:00:00 2001 From: Reed Garmsen Date: Thu, 18 Jun 2015 11:46:40 -0700 Subject: Removed extraneous post control from within new message separator --- web/react/components/post_list.jsx | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/web/react/components/post_list.jsx b/web/react/components/post_list.jsx index 47ecc1680..97f9fa943 100644 --- a/web/react/components/post_list.jsx +++ b/web/react/components/post_list.jsx @@ -447,12 +447,10 @@ module.exports = React.createClass({
New Messages
- {postCtl}
); - } else { - postCtls.push(postCtl); } + postCtls.push(postCtl); previousPostDay = utils.getDateForUnixTicks(post.create_at); } -- cgit v1.2.3-1-g7c22 From e454cf54fa500594ff77a7869754b38345393435 Mon Sep 17 00:00:00 2001 From: Asaad Mahmood Date: Sun, 28 Jun 2015 20:53:26 +0500 Subject: MM-1253 - Fixing new message and date separator corner case --- web/react/components/post_list.jsx | 22 +++++------ web/sass-files/sass/partials/_post.scss | 68 ++++++++++++++++++++------------- 2 files changed, 52 insertions(+), 38 deletions(-) diff --git a/web/react/components/post_list.jsx b/web/react/components/post_list.jsx index 97f9fa943..37e3faef2 100644 --- a/web/react/components/post_list.jsx +++ b/web/react/components/post_list.jsx @@ -125,12 +125,12 @@ module.exports = React.createClass({ $('body').on('mouseenter mouseleave', '.post', function(ev){ if(ev.type === 'mouseenter'){ - $(this).parent('div').prev('.date-seperator').addClass('hovered--after'); - $(this).parent('div').next('.date-seperator').addClass('hovered--before'); + $(this).parent('div').prev('.date-separator, .new-separator').addClass('hovered--after'); + $(this).parent('div').next('.date-separator, .new-separator').addClass('hovered--before'); } else { - $(this).parent('div').prev('.date-seperator').removeClass('hovered--after'); - $(this).parent('div').next('.date-seperator').removeClass('hovered--before'); + $(this).parent('div').prev('.date-separator, .new-separator').removeClass('hovered--after'); + $(this).parent('div').next('.date-separator, .new-separator').removeClass('hovered--before'); } }); @@ -389,7 +389,7 @@ module.exports = React.createClass({

Welcome

- { creator_name != "" ? "This is the start of the " + ui_name + " " + ui_type + ", created by " + creator_name + " on " + utils.displayDate(channel.create_at) + "." + { creator_name != "" ? "This is the start of the " + ui_name + " " + ui_type + ", created by " + creator_name + " on " + utils.displayDate(channel.create_at) + "." : "This is the start of the " + ui_name + " " + ui_type + ", created on "+ utils.displayDate(channel.create_at) + "." } { channel.type === 'P' ? " Only invited members can see this private group." : " Any member can join and read this channel." }
@@ -434,9 +434,9 @@ module.exports = React.createClass({ currentPostDay = utils.getDateForUnixTicks(post.create_at); if(currentPostDay.getDate() !== previousPostDay.getDate() || currentPostDay.getMonth() !== previousPostDay.getMonth() || currentPostDay.getFullYear() !== previousPostDay.getFullYear()) { postCtls.push( -

-
-
{currentPostDay.toDateString()}
+
+
+
{currentPostDay.toDateString()}
); } @@ -444,9 +444,9 @@ module.exports = React.createClass({ if (post.create_at > last_viewed && !rendered_last_viewed) { rendered_last_viewed = true; postCtls.push( -
-
-
New Messages
+
+
+
New Messages
); } diff --git a/web/sass-files/sass/partials/_post.scss b/web/sass-files/sass/partials/_post.scss index 6da516cf9..745d50173 100644 --- a/web/sass-files/sass/partials/_post.scss +++ b/web/sass-files/sass/partials/_post.scss @@ -42,49 +42,63 @@ body.ios { } #post-list { - .new-seperator { + .date-separator, .new-separator { text-align: center; - padding: 1em 0; - .new-seperator__hr { - border-color: #FFAF53; - margin: 0; + height: 2em; + margin: 0; + position: relative; + &:before, &:after { + content: ""; + height: 1em; + position: absolute; + left: 0; + width: 100%; + display: none; } - .new-seperator__text { - margin-top: -11px; - color: #FF8800; - background: #FFF; - display: inline-block; - padding: 0 1em; - font-weight: normal; + &:before { + bottom: 0; + } + &:after { + top: 0; } - } - .date-seperator { - text-align: center; - margin: 1em 0; - height: 0; &.hovered--after { - margin-bottom: 0; - padding-bottom: 1em; - background: #f6f6f6; + &:before { + background: #f6f6f6; + display: block; + } } &.hovered--before { - margin-top: 0; - padding-top: 1em; - background: #f6f6f6; + &:after { + background: #f6f6f6; + display: block; + } } - .date-seperator__hr { + .separator__hr { border-color: #ccc; margin: 0; + position: relative; + z-index: 5; + top: 1em; } - .date-seperator__text { - margin-top: -13px; - line-height: 24px; + .separator__text { + line-height: 2em; color: #555; background: #FFF; display: inline-block; padding: 0 1em; font-weight: 900; @include border-radius(50px); + position: relative; + z-index: 5; + } + } + .new-separator { + .separator__hr { + border-color: #FFAF53; + } + .separator__text { + color: #F80; + font-weight: normal; } } .post-list-holder-by-time { -- cgit v1.2.3-1-g7c22