diff --git a/css/comment.css b/css/comment.css index c823f90..259b4cb 100644 --- a/css/comment.css +++ b/css/comment.css @@ -1,3 +1,13 @@ +.comment { + margin-bottom: var(--space-sm); +} + +@media (--viewport-lg) { + .comment { + margin-bottom: var(--space-md); + } +} + .comment__head { display: flex; margin-bottom: var(--space-sm); diff --git a/css/comments.css b/css/comments.css index a27f64a..a1ce944 100644 --- a/css/comments.css +++ b/css/comments.css @@ -11,18 +11,12 @@ margin-bottom: var(--space-sm); } -.comments__item { - margin-bottom: var(--space-md); +.comments__list--sub-list { + margin-left: var(--space-sm); } -.comments__item--depth-1 { - margin-left: var(--space-md); -} - -.comments__item--depth-2 { - margin-left: calc(var(--space-md) * 2); -} - -.comments__item--depth-3 { - margin-left: calc(var(--space-md) * 3); +@media (--viewport-lg) { + .comments__list--sub-list { + margin-left: var(--space-md); + } } diff --git a/theme/classes/walker.comments.php b/theme/classes/walker.comments.php new file mode 100644 index 0000000..f5b1bdc --- /dev/null +++ b/theme/classes/walker.comments.php @@ -0,0 +1,49 @@ +'; + } + + function end_lvl(&$output) { + $output .= ''; + } + + function start_el(&$output, $comment) { + $id = $comment->comment_ID; + $post_id = $comment->comment_post_ID; + $reply_link = get_permalink($post_id) . '?replytocom='.$id.'#respond'; + $author_email = $comment->comment_author_email; + $author = $comment->comment_author; + $avatar = get_avatar($comment, 128); + $date = get_comment_date('jS F, Y', $id).' at '.get_comment_date('H:i', $id); + $content = $comment->comment_content; + $output .= '
new Windycoys_Walker_Comment(), - 'style' => 'ol', - ) - ); + wp_list_comments(array( + walker => new Windycoys_Walker_Comments(), + )); ?>