skill-assessment-app/app/assets/stylesheets/molecules/_admin_review.scss
2017-03-02 10:36:35 -06:00

115 lines
1.8 KiB
SCSS

.admin-review {
counter-reset: question;
float: left;
width: 66%;
form {
margin-left: 2.3em;
position: relative;
&::before {
content: counter(question) ') ';
counter-increment: question;
font-size: 1.25em;
left: -1.8em;
position: absolute;
top: 0.4em;
}
}
}
.review-comments {
float: right;
padding-left: 30px;
width: 33%;
> div {
margin-bottom: 30px;
}
.comment-message {
margin-right: 5px;
}
.comment-author {
font-size: 0.85em;
font-weight: 700;
margin-bottom: 30px;
text-align: right;
&::before {
content: '- ';
}
}
.comment-edit-stamp {
color: rgba($gray-dark, 0.65);
font-size: 0.75em;
text-align: right;
}
.comment-edit-btn {
cursor: pointer;
display: inline-block;
font-size: 0.85em;
font-weight: bold;
padding: 2px 5px;
&:hover {
background-color: $gray-base;
color: $gray-lighter;
}
}
.comment-edit-form {
display: none;
margin: 30px 0;
padding: 10px 0;
}
[type="checkbox"] {
&:checked + .comment-edit-form {
display: block;
}
}
}
.review_meta {
@media screen and (min-width: 768px) {
display: flex;
& > div { flex: 1 1 auto; }
}
.review_meta__votes {
margin-bottom: 15px;
a { padding: 5px; }
}
.review_meta__vetos {
label {
display: inline-block;
margin-left: 15px;
}
.review-status-comments {
opacity: 0;
padding: 15px 0;
height: 0;
max-height: 0;
overflow: hidden;
transition: all 0.500s;
}
input:checked ~ .review-status-comments {
opacity: 1;
height: auto;
max-height: 9999px;
overflow: auto;
transition: all 0.7500s;
}
}
}