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 .= '
  • '; + $output .= '
    '; + $output .= '
    '; + $output .= sprintf('
    %s
    ', $avatar); + $output .= '
    '; + $output .= sprintf('
    %s
    ', $content); + $output .= '
    '; + } + + function end_el(&$output) { + $output .= '
  • '; + } +} + +?> diff --git a/theme/classes/walker.navigation.php b/theme/classes/walker.navigation.php index bf8ac92..9ca5e29 100644 --- a/theme/classes/walker.navigation.php +++ b/theme/classes/walker.navigation.php @@ -1,3 +1,5 @@ +'; @@ -23,3 +25,4 @@ class Windycoys_Walker_Navigation extends Walker_Nav_Menu { } } +?> diff --git a/theme/comments.php b/theme/comments.php index 122825d..ae3a40b 100644 --- a/theme/comments.php +++ b/theme/comments.php @@ -1,4 +1,6 @@ 'comment-respond__form', class_submit => 'comment-respond__submit', @@ -35,12 +37,9 @@ $form_settings = array(
      new Windycoys_Walker_Comment(), - 'style' => 'ol', - ) - ); + wp_list_comments(array( + walker => new Windycoys_Walker_Comments(), + )); ?>
    diff --git a/theme/functions.php b/theme/functions.php index 5a95a4a..027930a 100644 --- a/theme/functions.php +++ b/theme/functions.php @@ -1,33 +1,4 @@ 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; - $comment_depth = $depth > 0 ? ' comments__item--depth-'.$depth : ''; - $output .= '
  • '; - $output .= '
    '; - $output .= '
    '; - $output .= '
    '.$avatar.'
    '; - $output .= '
    '; - $output .= '
    '.$content.'
    '; - $output .= '
    '; - $output .= ''; - $output .= ''; - $output .= ''; - $output .= 'Reply'; - $output .= '
    '; - $output .= '
  • '; - } -} function windycoys_the_tags() { $tags = get_the_tags(); diff --git a/theme/partials/navigation.php b/theme/partials/navigation.php index 8ac33d1..f361169 100644 --- a/theme/partials/navigation.php +++ b/theme/partials/navigation.php @@ -1,4 +1,4 @@ - +