comments.css in AT Tools 8.3
/**
* Comments
* - comment field (holds comment title, form, comments etc)
* - styles for comments
============================================================================ */
.comment {
padding: 1rem 0;
border-top: 1px solid;
}
.comment__title--visually-hidden {
margin: 0;
padding: 0;
font-size: 1rem;
}
.comment__title--visually-hidden .permalink {
position: absolute !important;
clip: rect(1px, 1px, 1px, 1px);
overflow: hidden;
height: 1px;
width: 1px;
padding: 0;
word-wrap: normal;
font: 0/0 a;
}
.comment__title--visually-hidden .marker {
float: right;
margin-left: 0.25rem;
}
.comment p:last-of-type {
margin-bottom: 0;
}
.comment__meta {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
margin: 1rem 0;
}
.comment.has-title .comment__meta {
margin: 1rem 0;
}
.comment__meta .comment__author:after {
content: "-";
display: inline-block;
}
.comment__meta--has-user-picture .comment__author:after {
display: none;
}
.comment__meta--has-user-picture .comment__author,
.comment__meta--has-user-picture .comment__pubdate {
margin: 0;
display: block;
}
@media screen and (max-width: 60em) {
.comment__meta .comment__author:after {
display: none;
}
.comment__meta .comment__author,
.comment__meta .comment__pubdate {
margin: 0;
display: block;
}
}
.comment__meta .field-type-image {
float: left;
margin: 0 0.75rem 0 0;
}
.comment__meta .field-type-image img {
width: auto;
height: 3rem;
}
.comment__meta .field-type-image__figure {
margin: 0;
padding: 0;
}
.comment__meta article:empty {
display: none;
}
.comment.preview {
padding: 1rem;
margin-bottom: 1rem;
}
.comment__links {
clear: both;
}
.field-type-comment {
margin: 1.25rem 0 0;
clear: both;
}
.field-type-comment:before, .field-type-comment:after {
content: " ";
display: table;
}
.field-type-comment:after {
clear: both;
}
.field-type-comment .indented {
margin-left: 2.625rem;
}
/*# sourceMappingURL=comments.css.map */
File
at_theme_generator/starterkits/starterkit/styles/css/components/comments.css
View source
- /**
- * Comments
- * - comment field (holds comment title, form, comments etc)
- * - styles for comments
- ============================================================================ */
- .comment {
- padding: 1rem 0;
- border-top: 1px solid;
- }
-
- .comment__title--visually-hidden {
- margin: 0;
- padding: 0;
- font-size: 1rem;
- }
-
- .comment__title--visually-hidden .permalink {
- position: absolute !important;
- clip: rect(1px, 1px, 1px, 1px);
- overflow: hidden;
- height: 1px;
- width: 1px;
- padding: 0;
- word-wrap: normal;
- font: 0/0 a;
- }
-
- .comment__title--visually-hidden .marker {
- float: right;
- margin-left: 0.25rem;
- }
-
- .comment p:last-of-type {
- margin-bottom: 0;
- }
-
- .comment__meta {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -webkit-box-align: center;
- -ms-flex-align: center;
- align-items: center;
- margin: 1rem 0;
- }
-
- .comment.has-title .comment__meta {
- margin: 1rem 0;
- }
-
- .comment__meta .comment__author:after {
- content: "-";
- display: inline-block;
- }
-
- .comment__meta--has-user-picture .comment__author:after {
- display: none;
- }
-
- .comment__meta--has-user-picture .comment__author,
- .comment__meta--has-user-picture .comment__pubdate {
- margin: 0;
- display: block;
- }
-
- @media screen and (max-width: 60em) {
- .comment__meta .comment__author:after {
- display: none;
- }
- .comment__meta .comment__author,
- .comment__meta .comment__pubdate {
- margin: 0;
- display: block;
- }
- }
-
- .comment__meta .field-type-image {
- float: left;
- margin: 0 0.75rem 0 0;
- }
-
- .comment__meta .field-type-image img {
- width: auto;
- height: 3rem;
- }
-
- .comment__meta .field-type-image__figure {
- margin: 0;
- padding: 0;
- }
-
- .comment__meta article:empty {
- display: none;
- }
-
- .comment.preview {
- padding: 1rem;
- margin-bottom: 1rem;
- }
-
- .comment__links {
- clear: both;
- }
-
- .field-type-comment {
- margin: 1.25rem 0 0;
- clear: both;
- }
-
- .field-type-comment:before, .field-type-comment:after {
- content: " ";
- display: table;
- }
-
- .field-type-comment:after {
- clear: both;
- }
-
- .field-type-comment .indented {
- margin-left: 2.625rem;
- }
- /*# sourceMappingURL=comments.css.map */