From d452523b07a66e6d71b2beb5150244165d9c30cc Mon Sep 17 00:00:00 2001
From: Asaad Mahmood <Unknowngi@live.com>
Date: Tue, 6 Oct 2015 21:34:16 +0500
Subject: PLT-451 - Adding visual effect for logout active sessions button

---
 web/react/components/activity_log_modal.jsx       |  6 ++++++
 web/react/utils/utils.jsx                         |  2 +-
 web/sass-files/sass/partials/_access-history.scss |  2 +-
 web/sass-files/sass/partials/_activity-log.scss   | 19 ++++++++++++++++++-
 web/sass-files/sass/partials/_post.scss           |  2 +-
 web/sass-files/sass/partials/_post_right.scss     |  2 +-
 6 files changed, 28 insertions(+), 5 deletions(-)

diff --git a/web/react/components/activity_log_modal.jsx b/web/react/components/activity_log_modal.jsx
index aee2541b5..15bcb2b22 100644
--- a/web/react/components/activity_log_modal.jsx
+++ b/web/react/components/activity_log_modal.jsx
@@ -31,6 +31,12 @@ export default class ActivityLogModal extends React.Component {
     }
     submitRevoke(altId, e) {
         e.preventDefault();
+        var modalContent = $(e.target).closest('.modal-content');
+        modalContent.addClass('animation--highlight');
+        setTimeout(() => {
+            modalContent.removeClass('animation--highlight');
+            console.log(that);
+        }, 1500);
         Client.revokeSession(altId,
             function handleRevokeSuccess() {
                 AsyncClient.getSessions();
diff --git a/web/react/utils/utils.jsx b/web/react/utils/utils.jsx
index 3a04f3623..64becbfc7 100644
--- a/web/react/utils/utils.jsx
+++ b/web/react/utils/utils.jsx
@@ -503,7 +503,7 @@ export function applyTheme(theme) {
         changeCss('.modal .custom-textarea:focus', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.3), 1);
         changeCss('.channel-intro, .settings-modal .settings-table .settings-content .divider-dark, hr, .settings-modal .settings-table .settings-links', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.2), 1);
         changeCss('.post.current--user .post-body, .post.post--comment.other--root.current--user .post-comment', 'background:' + changeOpacity(theme.centerChannelColor, 0.07), 1);
-        changeCss('.post.current--user .post-body, .post.post--comment.other--root.current--user .post-comment, .post.post--comment.other--root .post-comment, .post.same--root .post-body, .modal .more-channel-table tbody>tr td, .member-div:first-child, .member-div', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.1), 2);
+        changeCss('.post.current--user .post-body, .post.post--comment.other--root.current--user .post-comment, .post.post--comment.other--root .post-comment, .post.same--root .post-body, .modal .more-channel-table tbody>tr td, .member-div:first-child, .member-div, .access-history__table .access__report, .activity-log__table', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.1), 2);
         changeCss('@media(max-width: 1440px){.post.same--root', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.07), 2);
         changeCss('@media(max-width: 1440px){.post.same--root', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.07), 2);
         changeCss('@media(max-width: 1800px){.inner__wrap.move--left .post.post--comment.same--root', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.07), 2);
diff --git a/web/sass-files/sass/partials/_access-history.scss b/web/sass-files/sass/partials/_access-history.scss
index 412a2a1d0..a3289ecc0 100644
--- a/web/sass-files/sass/partials/_access-history.scss
+++ b/web/sass-files/sass/partials/_access-history.scss
@@ -24,6 +24,6 @@
         font-size: 15px;
     }
     .report__info {
-        color: #999;
+        @include opacity(0.8);
     }
 }
\ No newline at end of file
diff --git a/web/sass-files/sass/partials/_activity-log.scss b/web/sass-files/sass/partials/_activity-log.scss
index 3f0c3090d..2fb37a3bb 100644
--- a/web/sass-files/sass/partials/_activity-log.scss
+++ b/web/sass-files/sass/partials/_activity-log.scss
@@ -1,3 +1,20 @@
+@keyframes highlight {
+  from { background: rgba(yellow, 0.5);}
+  to { background: none;}
+}
+
+.animation--highlight {
+    &:before {
+        content: '';
+        animation: highlight 1.5s ease;
+        position: absolute;
+        top: 0;
+        left: 0;
+        width: 100%;
+        height: 100%;
+    }
+}
+
 .activity-log__table {
     display: table;
     width: 100%;
@@ -26,7 +43,7 @@
         }
     }
     .report__info {
-        color: #999;
+        @include opacity(0.8);
     }
 }
 .session-help-text {
diff --git a/web/sass-files/sass/partials/_post.scss b/web/sass-files/sass/partials/_post.scss
index 8bf4b0534..19cfdc050 100644
--- a/web/sass-files/sass/partials/_post.scss
+++ b/web/sass-files/sass/partials/_post.scss
@@ -257,7 +257,7 @@ body.ios {
 			line-height: 18px;
 			display: inline-block;
 			font-size: 13px;
-			@include opacity(0.6);
+			@include opacity(0.7);
 		}
 	}
 }
diff --git a/web/sass-files/sass/partials/_post_right.scss b/web/sass-files/sass/partials/_post_right.scss
index da5bcbad2..e4860b286 100644
--- a/web/sass-files/sass/partials/_post_right.scss
+++ b/web/sass-files/sass/partials/_post_right.scss
@@ -29,7 +29,7 @@
 			min-height: 100px;
 		}
 		.msg-typing {
-			color: #555;
+			@include opacity(0.7);
 			float: left;
 			padding-top: 17px;
 		}
-- 
cgit v1.2.3-1-g7c22