130 lines
2.3 KiB
CSS
130 lines
2.3 KiB
CSS
/* ------------- Comments ------------- */
|
|
#comments{
|
|
padding-bottom: 1em;
|
|
}
|
|
#commentWriter{
|
|
width: 90%;
|
|
margin: 0 auto;
|
|
min-height: 6em;
|
|
border: 1px solid #ddd;
|
|
border-radius: 0.3em;
|
|
background-color: #f8f8f8;
|
|
resize: none;
|
|
color: black;
|
|
position: relative;
|
|
}
|
|
/* Actual part to write the comment */
|
|
#commentEditor{
|
|
padding: 0.5em;
|
|
min-height: 3em;
|
|
margin-bottom: 2em;
|
|
}
|
|
#commentEditor:empty:before{
|
|
content: attr(placeholder);
|
|
color: #555;
|
|
}
|
|
#commentEditor:focus{
|
|
outline-width: 0;
|
|
}
|
|
/* Submit buttons etc. */
|
|
#commentWriterButtons{
|
|
position: absolute;
|
|
background-color: #f2f2f2;
|
|
width: 100%;
|
|
height: 2em;
|
|
bottom: 0;
|
|
}
|
|
#rulesReminder{
|
|
margin: calc((2em - (1em - 0.8em)) / 2) 0.3em;
|
|
font-size: 0.8em;
|
|
color: gray;
|
|
}
|
|
#rulesReminder>a{
|
|
color: gray;
|
|
}
|
|
#commentSubmitWrapper{
|
|
position: absolute;
|
|
right: 0;
|
|
height: 100%;
|
|
}
|
|
#commentSubmitWrapper>p{
|
|
display: inline;
|
|
}
|
|
#commentSubmitWrapper>button{
|
|
height: 100%;
|
|
border: none;
|
|
padding: 0 1em;
|
|
background-color: #e5e5e5;
|
|
}
|
|
#commentSubmitWrapper>button:hover{
|
|
cursor: pointer;
|
|
/* Shouldn't this be default? */
|
|
}
|
|
|
|
/* ------------- Submitted comments -------------*/
|
|
.comment{
|
|
width: 90%;
|
|
margin: 3em auto 0 auto;
|
|
}
|
|
.commentTop{
|
|
margin: 0.5em 0;
|
|
}
|
|
.commentTop>p{
|
|
display: inline;
|
|
width: 100%;
|
|
}
|
|
.commentTop>p>i{
|
|
color: #444;
|
|
margin: 0 0.2em;
|
|
}
|
|
.commentName{
|
|
color: black;
|
|
font-weight: bold;
|
|
text-decoration: none;
|
|
}
|
|
.commentName:hover{
|
|
text-decoration: underline;
|
|
}
|
|
.commentTime{
|
|
color: gray;
|
|
font-size: 0.8em;
|
|
}
|
|
|
|
.commentMiddle{
|
|
font-size: 0.99em;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.commentBottom{
|
|
display: block;
|
|
height: 1em;
|
|
}
|
|
.commentReply{
|
|
color: #00d09f;
|
|
text-decoration: none;
|
|
float: right;
|
|
margin-right: 1em;
|
|
}
|
|
.commentReport{
|
|
font-size: 0.8em;
|
|
}
|
|
.commentReport, .commentReport>a{
|
|
float: left;
|
|
margin: 0.5em 0 0 0;
|
|
text-decoration: none;
|
|
color: #999;
|
|
}
|
|
.commentReport:hover, .commentReport>a:hover{
|
|
text-decoration: underline;
|
|
}
|
|
/*Highlighting if user go there by @mentions*/
|
|
.current{
|
|
background-color: white;
|
|
animation: mention;
|
|
animation-duration: 900ms;
|
|
}
|
|
@keyframes mention {
|
|
10% {background-color: white;}
|
|
50% {background-color: #fcff79;}
|
|
100% {background-color: white;}
|
|
} |