@ -75,18 +75,20 @@
margin : 15px 0 30px 0 ;
margin : 15px 0 30px 0 ;
padding : 0 ;
padding : 0 ;
display : block ;
display : block ;
font-size : 14 px ;
font-size : 16 px ;
line-height : 1 . 5em ;
line-height : 1 . 5em ;
}
}
. snicker-comments input ,
. snicker-comments input ,
. snicker-comments textarea ,
. snicker-comments textarea ,
. snicker-comments button {
. snicker-comments button {
font-family : "Segoe UI" , "Helvetica Neue" , Helvetica , Arial , sans-serif ;
font-family : 'Lato' , 'Helvetica Neue' , Helvetica , Arial , sans-serif ; /*"Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;*/
}
}
/* Effects Textarea when mouse is away */
. snicker-comments input [ type = "text" ] ,
. snicker-comments input [ type = "text" ] ,
. snicker-comments input [ type = "email" ] ,
. snicker-comments input [ type = "email" ] ,
. snicker-comments textarea {
. snicker-comments textarea {
color : # 404448 ;
color : # 333333 ;
width : 100 % ;
width : 100 % ;
max-width : none ;
max-width : none ;
height : auto ;
height : auto ;
@ -111,28 +113,36 @@
padding : 15px ;
padding : 15px ;
resize : vertical ;
resize : vertical ;
}
}
/* Effects TextArea on Hover */
. snicker-comments input [ type = "text" ] : hover ,
. snicker-comments input [ type = "text" ] : hover ,
. snicker-comments input [ type = "email" ] : hover ,
. snicker-comments input [ type = "email" ] : hover ,
. snicker-comments textarea : hover {
. snicker-comments textarea : hover {
color : # 343A40 ;
color : # 444444 ;
border-color : # 343A40 ;
border-color : # 444444 ;
background-color : # ffffff ;
background-color : # ffffff ;
}
}
/* Effects TextArea on Focus */
. snicker-comments input [ type = "text" ] : focus ,
. snicker-comments input [ type = "text" ] : focus ,
. snicker-comments input [ type = "email" ] : focus ,
. snicker-comments input [ type = "email" ] : focus ,
. snicker-comments textarea : focus {
. snicker-comments textarea : focus {
color : # 343A40 ;
color : # 444444 ;
border-color : # 343A40 ;
border-color : # 444444 ;
background-color : # ffffff ;
background-color : # ffffff ;
/ *
box-shadow : 0 0 0 3px rgba ( 52 , 58 , 64 , 0 . 35 ) ;
box-shadow : 0 0 0 3px rgba ( 52 , 58 , 64 , 0 . 35 ) ;
-moz-box-shadow : 0 0 0 3px rgba ( 52 , 58 , 64 , 0 . 35 ) ;
-moz-box-shadow : 0 0 0 3px rgba ( 52 , 58 , 64 , 0 . 35 ) ;
-webkit-box-shadow : 0 0 0 3px rgba ( 52 , 58 , 64 , 0 . 35 ) ;
-webkit-box-shadow : 0 0 0 3px rgba ( 52 , 58 , 64 , 0 . 35 ) ;
* /
}
}
. snicker-comments input [ type = "checkbox" ] {
. snicker-comments input [ type = "checkbox" ] {
display : none ;
display : none ;
}
}
/* Text for TERMs Checkbox */
. snicker-comments input [ type = "checkbox" ] + label {
. snicker-comments input [ type = "checkbox" ] + label {
color : # 606468 ;
color : # ffcc01 ;
cursor : pointer ;
cursor : pointer ;
height : auto ;
height : auto ;
margin : 10px 5px ;
margin : 10px 5px ;
@ -144,7 +154,8 @@
}
}
. snicker-comments input [ type = "checkbox" ] + label : hover ,
. snicker-comments input [ type = "checkbox" ] + label : hover ,
. snicker-comments input [ type = "checkbox" ] : checked + label {
. snicker-comments input [ type = "checkbox" ] : checked + label {
color : # 404448 ;
background-color : # 444444 ;
color : # fff ;
}
}
. snicker-comments input [ type = "checkbox" ] + label : before {
. snicker-comments input [ type = "checkbox" ] + label : before {
width : 20px ;
width : 20px ;
@ -155,7 +166,7 @@
position : relative ;
position : relative ;
vertical-align : top ;
vertical-align : top ;
background-color : # ffffff ;
background-color : # ffffff ;
border : 1px solid # a0a4a8 ;
border : 1px solid # ffcc01 ;
background-repeat : no-repeat ;
background-repeat : no-repeat ;
background-position : center center ;
background-position : center center ;
border-radius : 3px ;
border-radius : 3px ;
@ -166,17 +177,17 @@
-webkit-transition : all 142ms linear ;
-webkit-transition : all 142ms linear ;
}
}
. snicker-comments input [ type = "checkbox" ] + label : hover : before {
. snicker-comments input [ type = "checkbox" ] + label : hover : before {
border-color : # 343A40 ;
border-color : # 444444 ;
}
}
. snicker-comments input [ type = "checkbox" ] : checked + label : before {
. snicker-comments input [ type = "checkbox" ] : checked + label : before {
background-color : # 343A40 ;
background-color : # 333333 ;
border-color : # 343A40 ;
border-color : # 333333 ;
background-image : url ( " data : image / svg + xml ; base64 , PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC \
background-image : url ( " data : image / svg + xml ; base64 , PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC \
9zdmciIHdpZHRoPSIxMiIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDEyIDE2Ij48cGF0aCBmaWxsPSIjZmZmIiBkPSJNM \
9zdmciIHdpZHRoPSIxMiIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDEyIDE2Ij48cGF0aCBmaWxsPSIjZmZmIiBkPSJNM \
TIgNWwtOCA4LTQtNCAxLjUtMS41TDQgMTBsNi41LTYuNUwxMiA1eiIvPjwvc3ZnPg = = " ) ;
TIgNWwtOCA4LTQtNCAxLjUtMS41TDQgMTBsNi41LTYuNUwxMiA1eiIvPjwvc3ZnPg = = " ) ;
}
}
. snicker-comments button {
. snicker-comments button {
color : rgba ( 255 , 255 , 255 , 0 . 9 ) ;
color : # ffcc01 ;
cursor : pointer ;
cursor : pointer ;
width : auto ;
width : auto ;
margin : 0 ;
margin : 0 ;
@ -187,8 +198,8 @@
text-align : left ;
text-align : left ;
line-height : 1 . 5em ;
line-height : 1 . 5em ;
vertical-align : top ;
vertical-align : top ;
background-color : # 343A40 ;
background-color : # 333333 ;
border : 1px solid # 343A40 ;
border : 1px solid # 333333 ;
border-radius : 3px ;
border-radius : 3px ;
-moz-border-radius : 3px ;
-moz-border-radius : 3px ;
-webkit-border-radius : 3px ;
-webkit-border-radius : 3px ;
@ -197,16 +208,17 @@
-webkit-transition : background 142ms linear ;
-webkit-transition : background 142ms linear ;
}
}
. snicker-comments button : hover {
. snicker-comments button : hover {
background-color : rgb ( 14 , 16 , 19 ) ;
background-color : # 444444 ;
color : # fff ;
}
}
. snicker-comments button : active {
. snicker-comments button : active {
background-color : # 242A30 ;
background-color : # 444444 ;
}
}
. snicker-comments button : disabled ,
. snicker-comments button : disabled ,
. snicker-comments button . disabled {
. snicker-comments button . disabled {
color : rgba ( 255 , 255 , 255 , 0 . 35 ) ;
color : rgba ( 255 , 255 , 255 , 0 . 35 ) ;
cursor : not-allowed ;
cursor : not-allowed ;
background-color : # 040A10 ;
background-color : # 444444 ;
}
}
. snicker-comments button . loading : before {
. snicker-comments button . loading : before {
top : 8px ;
top : 8px ;
@ -262,7 +274,7 @@
margin : 0 ;
margin : 0 ;
padding : 0 ;
padding : 0 ;
display : block ;
display : block ;
border : 1px solid # c0c4c8 ;
border : 1px solid # ffcc01 ;
border-radius : 5px ;
border-radius : 5px ;
-moz-border-radius : 5px ;
-moz-border-radius : 5px ;
-webkit-border-radius : 5px ;
-webkit-border-radius : 5px ;
@ -282,8 +294,8 @@
line-height : 50px ;
line-height : 50px ;
}
}
. snicker-comments . no-comments {
. snicker-comments . no-comments {
background-color : # f4f8fa ;
background-color : # 333333 ;
border : 1px solid # c0c4c8 ;
border : 1px solid # ffcc01 ;
border-radius : 5px ;
border-radius : 5px ;
-moz-border-radius : 5px ;
-moz-border-radius : 5px ;
-webkit-border-radius : 5px ;
-webkit-border-radius : 5px ;
@ -306,7 +318,7 @@
}
}
. snicker-comments . comment-alert . alert-success {
. snicker-comments . comment-alert . alert-success {
color : # ffffff ;
color : # ffffff ;
background-color : # 28A745 ;
background-color : # ffcc01 ;
}
}
/* @end GENERAL */
/* @end GENERAL */
@ -328,8 +340,8 @@ form.comment-form .comment-footer{
}
}
form . comment-form . comment-header {
form . comment-form . comment-header {
font-size : 16px ;
font-size : 16px ;
background-color : # f4f6f8 ;
background-color : # 333333 ;
border-bottom : 1px solid # d0d4d8 ;
border-bottom : 1px solid # ffcc01 ;
border-radius : 5px 5px 0 0 ;
border-radius : 5px 5px 0 0 ;
-moz-border-radius : 5px 5px 0 0 ;
-moz-border-radius : 5px 5px 0 0 ;
-webkit-border-radius : 5px 5px 0 0 ;
-webkit-border-radius : 5px 5px 0 0 ;
@ -341,8 +353,8 @@ form.comment-form .comment-article{
padding : 15px 20px ;
padding : 15px 20px ;
}
}
form . comment-form . comment-footer {
form . comment-form . comment-footer {
background-color : # f4f6f8 ;
background-color : # 333333 ;
border-top : 1px solid # d0d4d8 ;
border-top : 1px solid # ffcc01 ;
border-radius : 0 0 5px 5px ;
border-radius : 0 0 5px 5px ;
-moz-border-radius : 0 0 5px 5px ;
-moz-border-radius : 0 0 5px 5px ;
-webkit-border-radius : 0 0 5px 5px ;
-webkit-border-radius : 0 0 5px 5px ;
@ -351,9 +363,10 @@ form.comment-form .comment-captcha{
display : block ;
display : block ;
text-align : right ;
text-align : right ;
}
}
form . comment-form . comment-captcha input ,
form . comment-form . comment-captcha input ,
form . comment-form . comment-captcha input : hover ,
form . comment-form . comment-captcha input : hover ,
form . comment-form . comment-captcha input : focus {
form . comment-form . comment-captcha input : focus {
width : 100px ;
width : 100px ;
height : 40px ;
height : 40px ;
padding : 5px 10px ;
padding : 5px 10px ;
@ -363,17 +376,23 @@ form.comment-form .comment-captcha input:focus{
line-height : 22px ;
line-height : 22px ;
vertical-align : top ;
vertical-align : top ;
border : 0 ;
border : 0 ;
background-color : # e0e4e8 ;
background-color : # fff ;
box-shadow : none ;
box-shadow : none ;
-moz-box-shadow : none ;
-moz-box-shadow : none ;
-webkit-box-shadow : none ;
-webkit-box-shadow : none ;
}
}
form . comment-form . comment-captcha input : hover {
background-color : # f0f4f8 ;
form . comment-form . comment-captcha input : hover {
background-color : # fff ;
}
}
form . comment-form . comment-captcha input : focus {
form . comment-form . comment-captcha input : focus {
background-color : # e0e4e8 ;
background-color : # fff ;
}
}
input [ placeholder ] {
color : # ff0000 ;
}
form . comment-form . comment-captcha a {
form . comment-form . comment-captcha a {
width : auto ;
width : auto ;
height : 40px ;
height : 40px ;
@ -477,7 +496,7 @@ form.comment-form .comment-reply .reply-cancel{
display : inline-block ;
display : inline-block ;
position : absolute ;
position : absolute ;
background-size : 14px ;
background-size : 14px ;
background-color : # 555 ;
background-color : # 444 ;
background-image : url ( " data : image / svg + xml ; base64 , PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC \
background-image : url ( " data : image / svg + xml ; base64 , PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC \
9zdmciIHdpZHRoPSIxMiIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDEyIDE2Ij48cGF0aCBmaWxsPSIjZmZmZmZmIiBkP \
9zdmciIHdpZHRoPSIxMiIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDEyIDE2Ij48cGF0aCBmaWxsPSIjZmZmZmZmIiBkP \
SJNNy40OCA4bDMuNzUgMy43NS0xLjQ4IDEuNDhMNiA5LjQ4bC0zLjc1IDMuNzUtMS40OC0xLjQ4TDQuNTIgOCAuNzcgNC4y \
SJNNy40OCA4bDMuNzUgMy43NS0xLjQ4IDEuNDhMNiA5LjQ4bC0zLjc1IDMuNzUtMS40OC0xLjQ4TDQuNTIgOCAuNzcgNC4y \
@ -509,13 +528,13 @@ form.comment-form .comment-reply .reply-title{
margin : 15px 0 ;
margin : 15px 0 ;
padding : 0 ;
padding : 0 ;
display : block ;
display : block ;
border : 1px solid # c0c4c8 ;
border : 1px solid # ffcc01 ;
border-radius : 5px ;
border-radius : 5px ;
-moz-border-radius : 5px ;
-moz-border-radius : 5px ;
-webkit-border-radius : 5px ;
-webkit-border-radius : 5px ;
}
}
. snicker-comments-list . comment . new-comment {
. snicker-comments-list . comment . new-comment {
border-color : # 007b ff;
border-color : # ffcc01 ;
}
}
. snicker-comments-list . comment . comment-avatar {
. snicker-comments-list . comment . comment-avatar {
width : 110px ;
width : 110px ;
@ -527,10 +546,12 @@ form.comment-form .comment-reply .reply-title{
-moz-border-radius : 5px ;
-moz-border-radius : 5px ;
-webkit-border-radius : 5px ;
-webkit-border-radius : 5px ;
}
}
/* Banner inside user icon/avatar */
. snicker-comments-list . comment . comment-avatar . avatar-role {
. snicker-comments-list . comment . comment-avatar . avatar-role {
top : 15px ;
top : 15px ;
right : 10px ;
right : 10px ;
color : # ffffff ;
color : # 333333 ;
width : auto ;
width : auto ;
margin : 0 ;
margin : 0 ;
padding : 3px 5px ;
padding : 3px 5px ;
@ -541,7 +562,7 @@ form.comment-form .comment-reply .reply-title{
line-height : 16px ;
line-height : 16px ;
font-weight : bold ;
font-weight : bold ;
text-shadow : 1px 1px 0 rgba ( 0 , 0 , 0 , 0 . 25 ) ;
text-shadow : 1px 1px 0 rgba ( 0 , 0 , 0 , 0 . 25 ) ;
background-color : # 007b ff;
background-color : # ffcc01 ;
border-radius : 0 4px 0 3px ;
border-radius : 0 4px 0 3px ;
-moz-border-radius : 0 4px 0 3px ;
-moz-border-radius : 0 4px 0 3px ;
-webkit-border-radius : 0 4px 0 3px ;
-webkit-border-radius : 0 4px 0 3px ;
@ -550,7 +571,7 @@ form.comment-form .comment-reply .reply-title{
padding : 10px ;
padding : 10px ;
}
}
. snicker-comments-list . comment . comment-content . comment-title {
. snicker-comments-list . comment . comment-content . comment-title {
color : # 707478 ;
color : # fff ;
margin : 0 ;
margin : 0 ;
padding : 5px 5px 2px 5px ;
padding : 5px 5px 2px 5px ;
display : block ;
display : block ;
@ -574,17 +595,21 @@ form.comment-form .comment-reply .reply-title{
-moz-border-radius : 3px ;
-moz-border-radius : 3px ;
-webkit-border-radius : 3px ;
-webkit-border-radius : 3px ;
}
}
/* Text in Comment Header */
. snicker-comments-list . comment . comment-content . comment-meta {
. snicker-comments-list . comment . comment-content . comment-meta {
color : # 707478 ;
color : # fff ;
margin : 0 ;
margin : 0 ;
padding : 1px 6px ;
padding : 1px 6px ;
display : inline-block ;
display : inline-block ;
font-size : 12px ;
font-size : 12px ;
line-height : 1 . 25em ;
line-height : 1 . 25em ;
background-color : # e0e4e8 ;
background-color : # 444444 ;
}
}
/* Text inside Comments */
. snicker-comments-list . comment . comment-content . comment-comment {
. snicker-comments-list . comment . comment-content . comment-comment {
color : # 303438 ;
color : # 7e7d7e ;
margin : 0 ;
margin : 0 ;
padding : 10px ;
padding : 10px ;
display : block ;
display : block ;
@ -593,23 +618,25 @@ form.comment-form .comment-reply .reply-title{
margin : 0 ;
margin : 0 ;
padding : 0 ;
padding : 0 ;
display : block ;
display : block ;
background-color : # f4f6f8 ;
background-color : # 333333 ;
border-top : 1px solid # d0d4d8 ;
border-top : 1px solid # ffcc01 ;
border-radius : 0 0 4px 4px ;
border-radius : 0 0 4px 4px ;
-moz-border-radius : 0 0 4px 4px ;
-moz-border-radius : 0 0 4px 4px ;
-webkit-border-radius : 0 0 4px 4px ;
-webkit-border-radius : 0 0 4px 4px ;
}
}
/* Color of the Like/Dislike with no value (Zero) */
. snicker-comments-list . comment . comment-action a {
. snicker-comments-list . comment . comment-action a {
color : # 606468 ;
color : # 606468 ;
margin : 2px 0 ;
margin : 2px 0 ;
padding : 2px 7px ;
padding : 2px 7px ;
opacity : 0 . 6 5;
opacity : 0 . 9 5;
display : inline-block ;
display : inline-block ;
font-size : 12px ;
font-size : 12px ;
font-family : "Segoe UI" , "Helvetica Neue" , Helvetica , Arial , sans-serif ;
font-family : "Segoe UI" , "Helvetica Neue" , Helvetica , Arial , sans-serif ;
line-height : 18px ;
line-height : 18px ;
background-color : # ffffff ;
background-color : # 333333 ;
border : 1px solid # c0c4c8 ;
border : 1px solid # ffcc01 ;
border-radius : 3px ;
border-radius : 3px ;
-moz-border-radius : 3px ;
-moz-border-radius : 3px ;
-webkit-border-radius : 3px ;
-webkit-border-radius : 3px ;
@ -626,9 +653,11 @@ form.comment-form .comment-reply .reply-title{
border-color : # dc3545 ;
border-color : # dc3545 ;
}
}
. snicker-comments-list . comment . comment-action a . action-reply {
. snicker-comments-list . comment . comment-action a . action-reply {
color : # 007b ff;
color : # ffcc01 ;
border-color : # 007bff ;
border-color : # 333333 ;
}
}
/* Color of the Like/Dislike with a value (Not Zero) */
. snicker-comments-list . comment . comment-action a : hover ,
. snicker-comments-list . comment . comment-action a : hover ,
. snicker-comments-list . comment . comment-action a . active {
. snicker-comments-list . comment . comment-action a . active {
color : # ffffff ;
color : # ffffff ;
@ -645,7 +674,7 @@ form.comment-form .comment-reply .reply-title{
}
}
. snicker-comments-list . comment . comment-action a . action-reply : hover ,
. snicker-comments-list . comment . comment-action a . action-reply : hover ,
. snicker-comments-list . comment . comment-action a . action-reply . active {
. snicker-comments-list . comment . comment-action a . action-reply . active {
background-color : # 007bff ;
background-color : # 444444 ;
}
}
. snicker-comments-list . comment . comment-action a span {
. snicker-comments-list . comment . comment-action a span {
margin : 0 3px 0 2px ;
margin : 0 3px 0 2px ;
@ -662,7 +691,7 @@ form.comment-form .comment-reply .reply-title{
display : block ;
display : block ;
}
}
. snicker-comments-list . pagination . pagination-button {
. snicker-comments-list . pagination . pagination-button {
color : # ffffff ;
color : # 444444 ;
width : auto ;
width : auto ;
min-width : 30px ;
min-width : 30px ;
height : 32px ;
height : 32px ;
@ -674,7 +703,7 @@ form.comment-form .comment-reply .reply-title{
text-align : center ;
text-align : center ;
line-height : 22px ;
line-height : 22px ;
vertical-align : top ;
vertical-align : top ;
background-color : # 007b ff;
background-color : # ffcc01 ;
border-radius : 3px ;
border-radius : 3px ;
-moz-border-radius : 3px ;
-moz-border-radius : 3px ;
-webkit-border-radius : 3px ;
-webkit-border-radius : 3px ;
@ -684,11 +713,11 @@ form.comment-form .comment-reply .reply-title{
}
}
. snicker-comments-list . pagination . pagination-button : hover ,
. snicker-comments-list . pagination . pagination-button : hover ,
. snicker-comments-list . pagination . pagination-button . hover {
. snicker-comments-list . pagination . pagination-button . hover {
background-color : # 0062cc ;
background-color : # ffcc01 ;
}
}
. snicker-comments-list . pagination . pagination-button : active ,
. snicker-comments-list . pagination . pagination-button : active ,
. snicker-comments-list . pagination . pagination-button . active {
. snicker-comments-list . pagination . pagination-button . active {
background-color : # 004999 ;
background-color : # 886b 00;
}
}
. snicker-comments-list . pagination . pagination-button : disabled ,
. snicker-comments-list . pagination . pagination-button : disabled ,
. snicker-comments-list . pagination . pagination-button . disabled {
. snicker-comments-list . pagination . pagination-button . disabled {