File: /www/wwwroot/www.cytocare.cn/wp-content/themes/peakshops/assets/sass/blog/_comments.scss
#reviews {
max-width: 800px;
margin: 0 auto;
}
#comments {
margin: 0 0 35px 0;
h4 {
font-size: 22px;
}
.woocommerce-Reviews-title {
display: block;
font-size: 20px;
font-weight: 500;
margin-bottom: 30px;
}
.comment-button {
display: block;
text-align: center;
line-height: 1;
font-size: 14px;
padding: 35px 0 0;
cursor: pointer;
}
.comments-container {
padding: 0;
}
}
.commentlist {
list-style: none;
margin: 0;
display: block;
padding-top: 50px;
&>.comment {
margin-bottom: 35px;
&.depth-1 {
border-bottom: 1px solid $border;
}
}
.pingback {
.comment-body {
display: inline;
.url {
font-weight: 700;
}
}
}
.comment-body,
.comment_container {
position: relative;
padding-left: 80px;
padding-bottom: 0;
margin-bottom: 35px;
.rtl & {
padding-left: 0;
padding-right: 80px;
}
.star-rating {
float: right;
.rtl & {
float: left;
}
}
p.meta {
display: block;
font-size: .8125rem;
font-style: normal;
font-weight: 700;
color: #343434;
}
}
.comment,
.review {
&:before {
display: none !important;
}
.comment_container {
position: relative;
}
.woocommerce-review__dash {
display: none;
}
.comment-metadata,
.woocommerce-review__published-date {
display: flex;
line-height: 1;
font-size: 14px;
color: #4f4f4f;
margin-bottom: 15px;
font-weight: 400;
a {
color: rgba($black,0.4);
&:hover {
color: $black
}
}
.edit-link {
margin-left: 5px;
text-transform: uppercase;
}
}
.woocommerce-review__published-date {
margin: 0;
}
.woocommerce-review__author {
font-style: normal;
font-weight: 500;
color: $black;
font-size: 16px;
}
.vcard {
display: block;
border: 0;
padding: 0;
margin: 0 0 10px;
line-height: 12px;
.fn {
font-style: normal;
font-weight: 500;
color: $black;
font-size: 16px;
.url {
color: $black;
}
&:before {
display: none;
}
}
.says {
display: none;
}
}
.avatar {
width: 56px;
height: 56px;
position: absolute;
top: 0;
left: 0;
border-radius: 50%;
.rtl & {
left: auto;
right: 0;
}
}
.comment-awaiting-moderation {
font-size: 10px;
}
p {
font-size: 14px;
word-break: break-word;
margin-bottom: 10px;
}
.reply {
font-size: 14px;
font-weight: 400;
display: inline-flex;
align-items: center;
color: $accent;
svg {
height: 7px;
path {
fill: $accent;
@extend .quick-transition;
}
}
}
.children {
list-style: none;
margin-left: 18px;
margin-bottom: 20px;
@include min-break($break-small) {
margin-left: 80px;
}
.children {
@include min-break($break-small) {
margin-left: 62px;
}
}
.rtl & {
margin-left: 0;
margin-right: 18px;
@include min-break($break-small) {
margin-left: 0;
margin-right: 80px;
}
.children {
@include min-break($break-small) {
margin-left: 0;
margin-right: 62px;
}
}
}
.avatar {
width: 42px;
height: 42px;
}
.comment-body,
.comment-text {
padding-left: 62px;
.rtl & {
padding-left: 0;
padding-right: 62px;
}
}
}
.comment-respond {
margin: 40px 0;
.comment-reply-title {
margin-bottom: 10px;
}
}
}
}
.comment-respond {
padding: 2vh 0;
.row {
min-width: 100%;
@include min-break($break-medium) {
margin: 0 -15px;
.columns {
padding: 0 15px;
}
}
}
.comment-reply-title {
display: block;
font-size: 20px;
font-weight: 500;
margin-bottom: 10px;
}
}
.comment-form {
display: flex;
flex-flow: row wrap;
p {
font-size: 14px;
margin-bottom: 25px;
width: 100%;
&.logged-in-as,
&.comment-notes {
opacity: 0.8;
}
}
&.comment-form-comment {
margin-bottom: 0;
}
textarea,
input:not(.submit) {
width: 100%;
}
input[type="checkbox"],
input[type="radio"] {
width: auto;
margin-right: 5px;
}
.thb-comment-form-field {
width: 100%;
display: inline-flex;
flex-direction: column;
@include min-break($break-small) {
width: 33%;
padding-right: 30px;
}
&:last-of-type {
@include min-break($break-small) {
width: 34%;
padding-right: 0;
}
}
}
.comment-form-comment,
.comment-form-author,
.comment-form-email {
margin: 0;
}
.comment-form-cookies-consent {
label {
display: inline;
font-size: 12px;
margin: 0;
font-weight: 400;
}
}
}
/* Reviews */
.star-rating {
display: inline-block;
position: relative;
font-size: 14px;
line-height: 1;
letter-spacing: 0.05em;
font-family: "peakshops" !important;
color: #b1b1b1;
&:before {
font-family: "peakshops";
position: static;
opacity: 1;
content: "\e80c \e80c \e80c \e80c \e80c" !important;
}
&>span {
display: block;
top: 0;
left: 0;
position: absolute;
height: 16px;
line-height: 1;
overflow: hidden;
padding: 0 !important;
&:before {
color: $accent;
content: "\e804 \e804 \e804 \e804 \e804" !important;
}
.rtl & {
left: auto;
right: 0;
}
strong {
display: none;
}
}
& + .write_first {
display: inline-block;
font-size: 13px;
font-weight: 300;
color: $black;
margin-left: 20px;
line-height: 18px;
vertical-align: text-top;
}
}
.comment-form-rating {
p {
margin-bottom: 27px;
}
p.stars {
display: block;
height: 16px;
margin-bottom: 5px;
@extend .star-rating;
min-width: 82px;
&:before {
content: none !important;
}
&>span {
&:before {
content: none !important;
}
}
a {
position: relative;
color: #dcdcdc;
display: inline-block;
text-indent: -999em;
width: 12px;
&:before {
position: absolute;
display: block;
width: 12px;
text-indent: 0;
content: "\e804"
}
&:hover {
& ~ a {
color: #dcdcdc;
}
}
&.active ~ a {
color: #dcdcdc;
}
}
&:hover a,
&.selected a {
color: $accent;
}
}
}