Fixes:

O número de comentários ao lado de cada parágrafo deveria ser exibido dentro de um ícone de balão (ver medium); O número de comentários ao lado deve ser um link, ou seja, ao passar o mouse o cursor deve mudar; Quando tem 0 comentários é possível exibir um + ao invés do número 0?;

Fixes:
O número de comentários ao lado de cada parágrafo deveria ser exibido dentro de um ícone de balão (ver medium); O número de comentários ao lado deve ser um link, ou seja, ao passar o mouse o cursor deve mudar; Quando tem 0 comentários é possível exibir um + ao invés do número 0?;
Evandro Jr
1 parent 1ba6ed0a
Showing 2 changed files with 39 additions and 8 deletions Show diff stats
plugins/comment_paragraph/public/comment_paragraph_macro.js
plugins/comment_paragraph/public/style.css
@@ -2,7 +2,16 @@ var comment_paragraph_anchor;
 var lastParagraph = [];
 var lastSelectedArea = [];
  
+function setPlusIfZeroComments($){
+  $('.comment-count').each(function(){
+    var commentCount = $(this).text().trim();
+    if(commentCount=='0')
+      $(this).text("+");
+  });
+}
+
 jQuery(document).ready(function($) {
+  setPlusIfZeroComments($);
   $('.display-comment-form').unbind();
   $('.display-comment-form').click(function(){
     var $button = $(this);
@@ -126,11 +126,37 @@ div[class^=&#39;comment-paragraph-loading-&#39;] {
 }
  
 .side-comments-counter {
-  border: 1px solid #57ad68;
-  padding: 3px;
-  border-radius: 3px;
-  color: #666;
+  position: relative;
+  width: 20px;
+  height: 19px;
+  padding: 0px;
+  background: #b3b2d4;
+  -webkit-border-radius: 5px;
+  -moz-border-radius: 5px;
+  border-radius: 5px;
   cursor: pointer;
+  z-index: 1;
+}
+
+.side-comments-counter:hover{
+  color: white; 
+}
+
+.side-comments-counter:after {
+  content: "";
+  position: absolute;
+  bottom: -9px;
+  left: 8px;
+  border-style: solid;
+  border-width: 12px 5px 0;
+  border-color: #b3b2d4 transparent;
+  display: block;
+  width: 0;
+}
+
+.comment-count{
+  position: relative;
+  top: 3px;
 }
  
 #comments_list{
@@ -139,10 +165,6 @@ div[class^=&#39;comment-paragraph-loading-&#39;] {
  
 .article-comment-inner {border-bottom: 1px solid #ddd;}
  
-/*label[for="comment_title"]{
-   display: none;
-}*/
-
 #article .comment-replies .article-comment{background: white; border: 0px; border-top: 1px solid #ddd;}
  
 .comment-replies .comment-from-owner.comment-content {background: none;}
...	...	@@ -2,7 +2,16 @@ var comment_paragraph_anchor;
2	2	var lastParagraph = [];
3	3	var lastSelectedArea = [];
4	4
	5	+function setPlusIfZeroComments($){
	6	+ $('.comment-count').each(function(){
	7	+ var commentCount = $(this).text().trim();
	8	+ if(commentCount=='0')
	9	+ $(this).text("+");
	10	+ });
	11	+}
	12	+
5	13	jQuery(document).ready(function($) {
	14	+ setPlusIfZeroComments($);
6	15	$('.display-comment-form').unbind();
7	16	$('.display-comment-form').click(function(){
8	17	var $button = $(this);
...	...
...	...	@@ -126,11 +126,37 @@ div[class^='comment-paragraph-loading-'] {
126	126	}
127	127
128	128	.side-comments-counter {
129		- border: 1px solid #57ad68;
130		- padding: 3px;
131		- border-radius: 3px;
132		- color: #666;
	129	+ position: relative;
	130	+ width: 20px;
	131	+ height: 19px;
	132	+ padding: 0px;
	133	+ background: #b3b2d4;
	134	+ -webkit-border-radius: 5px;
	135	+ -moz-border-radius: 5px;
	136	+ border-radius: 5px;
133	137	cursor: pointer;
	138	+ z-index: 1;
	139	+}
	140	+
	141	+.side-comments-counter:hover{
	142	+ color: white;
	143	+}
	144	+
	145	+.side-comments-counter:after {
	146	+ content: "";
	147	+ position: absolute;
	148	+ bottom: -9px;
	149	+ left: 8px;
	150	+ border-style: solid;
	151	+ border-width: 12px 5px 0;
	152	+ border-color: #b3b2d4 transparent;
	153	+ display: block;
	154	+ width: 0;
	155	+}
	156	+
	157	+.comment-count{
	158	+ position: relative;
	159	+ top: 3px;
134	160	}
135	161
136	162	#comments_list{
...	...	@@ -139,10 +165,6 @@ div[class^='comment-paragraph-loading-'] {
139	165
140	166	.article-comment-inner {border-bottom: 1px solid #ddd;}
141	167
142		-/*label[for="comment_title"]{
143		- display: none;
144		-}*/
145		-
146	168	#article .comment-replies .article-comment{background: white; border: 0px; border-top: 1px solid #ddd;}
147	169
148	170	.comment-replies .comment-from-owner.comment-content {background: none;}
...	...