diff --git a/Web/Presenters/templates/components/post/microblogpost.xml b/Web/Presenters/templates/components/post/microblogpost.xml
index 1c893512..8d8e1e00 100644
--- a/Web/Presenters/templates/components/post/microblogpost.xml
+++ b/Web/Presenters/templates/components/post/microblogpost.xml
@@ -87,10 +87,9 @@
{/if}
diff --git a/Web/Presenters/templates/components/post/oldpost.xml b/Web/Presenters/templates/components/post/oldpost.xml
index 36f01936..9bd9c484 100644
--- a/Web/Presenters/templates/components/post/oldpost.xml
+++ b/Web/Presenters/templates/components/post/oldpost.xml
@@ -112,8 +112,8 @@
class="post-like-button"
data-liked="{(int) $liked}"
data-likes="{$post->getLikesCount()}">
-
- {$post->getLikesCount()}
+
+ {if $post->getLikesCount() > 0}{$post->getLikesCount()}{/if}
diff --git a/Web/static/css/microblog.css b/Web/static/css/microblog.css
index b96c558b..7a091c10 100644
--- a/Web/static/css/microblog.css
+++ b/Web/static/css/microblog.css
@@ -36,18 +36,45 @@
color: grey;
}
+.like_wrap {
+ display: flex;
+}
+
.repost-icon {
background: url('/assets/packages/static/openvk/img/published.gif') no-repeat 0px 0px;
height: 12px;
margin: 2px 3px 0px;
width: 11px;
- float: left;
}
-.repost-icon:hover {
+.heart {
+ background: url('/assets/packages/static/openvk/img/like.gif') no-repeat 1px 0px;
+ height: 10px;
+ margin: 2px 3px 0px;
+ width: 11px;
+ float: none;
+ opacity: 0.4;
+}
+
+#liked {
opacity: 1 !important;
}
+.heart:hover {
+ opacity: 0.4 !important;
+}
+
+.post-share-button, .post-like-button {
+ display: flex;
+ padding: 2px;
+ border-radius: 2px;
+ transition-duration: 0.2s;
+}
+
+.post-share-button:hover, .post-like-button:hover {
+ background-color: rgb(240, 240, 240);
+}
+
.post-author .delete {
float: right;
display: inline-block;
diff --git a/Web/static/css/style.css b/Web/static/css/style.css
index b5b36472..68c6d2e8 100644
--- a/Web/static/css/style.css
+++ b/Web/static/css/style.css
@@ -1230,6 +1230,7 @@ body.scrolled .toTop:hover {
margin: 2px 3px 0px;
width: 11px;
float: left;
+ opacity: 0.4;
}
.likeCnt {
@@ -1242,6 +1243,10 @@ body.scrolled .toTop:hover {
opacity: 1 !important;
}
+#liked {
+ opacity: 1 !important;
+}
+
.content_title_expanded {
margin-top: 5px;
}
diff --git a/Web/static/js/al_wall.js b/Web/static/js/al_wall.js
index 552d9c92..aa66974c 100644
--- a/Web/static/js/al_wall.js
+++ b/Web/static/js/al_wall.js
@@ -89,12 +89,15 @@ u(".post-like-button").on("click", function(e) {
var link = u(this).attr("href");
var heart = u(".heart", thisBtn);
var counter = u(".likeCnt", thisBtn);
- var likes = counter.text();
- var isLiked = heart.attr("style") === 'opacity: 1;';
+ var likes = counter.text() === "" ? 0 : counter.text();
+ var isLiked = heart.attr("id") === 'liked';
ky(link);
- heart.attr("style", isLiked ? 'opacity: 0.4;' : 'opacity: 1;');
+ heart.attr("id", isLiked ? '' : 'liked');
counter.text(parseInt(likes) + (isLiked ? -1 : 1));
+ if (counter.text() === "0") {
+ counter.text("");
+ }
return false;
});