Vulcan/client/sass/modules/_comments.scss

130 lines
No EOL
2.1 KiB
SCSS

.comment{
margin-left:30px;
position:relative;
&.opened{
}
&.queued{
.comment-notification{
@extend .grid-block;
display:block;
position:absolute;
top:0;
right:-120px;
width:70px;
}
.comment-content{
height:1px;
padding:0;
overflow:hidden;
}
}
}
.comment-content{
position:relative;
@extend .grid-block;
@include border-radius(0 3px 3px 3px);
font-size:14px;
}
.comment-notification{
display:none;
}
.comment-meta{
margin-bottom:5px;
.comment-username, .comment-time, .comment-permalink{
display:inline-block;
margin-right:4px;
}
color:$light-text;
.comment-permalink{
position:relative;
@include hide-text;
width:20px;
color:$light-text;
margin:0;
&:before{
position:absolute;
display:block;
top:1px;
left:0;
text-indent:0;
}
&:hover:before{
color:$red;
}
}
}
.comment-actions{
position:absolute;
left:-30px;
top:0px;
a{
@include border-radius(0 0 0 3px);
position:relative;
display:block;
height:30px;
width:30px;
// background:$light-blue;
background:white;
@include box-shadow(0 1px 1px black(0.15));
overflow:hidden;
@include hide-text;
// border-right:1px solid $lightest-grey;
&.upvote{
@include border-radius(3px 0 0 0);
margin-bottom:1px;
}
i{
font-size:12px;
display:block;
position:absolute;
height:30px;
width:30px;
line-height:30px;
text-align:center;
text-indent:0;
// color:$light-blue2;
color:$red;
}
&:hover{
background:$highlight-color;
i{
color:white;
}
}
}
}
.comment-new{
@extend .grid-block;
@extend .cf;
.comment-field{
margin-bottom:$grid-margin;
}
.comment-submit{
@extend .cf;
}
.comment-page &{
margin-left:30px;
position: relative;
background: #ffffff;
&:after {
bottom: 100%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
border-color: rgba(255, 255, 255, 0);
border-bottom-color: #ffffff;
border-width: 8px;
left: 20px;
margin-left: -8px;
}
}
}
.comments{
.comment:nth-child(3){
}
}