티스토리 square(스퀘어) 스킨은 심플해서 좋긴 한데 댓글 부분에 대한 디자인이 영 좋지 않은 것 같다. 이걸 당장 통째로 뜯어고치고 싶어도 능력이 없다. 그래서 일단 간단하게 글자(폰트) 크기를 작게 하고 색깔을 바꿔주는 등의 작업을 해 보았다.
1. #communicate 부분에서 .communicateList .name, date, p 부분이 각각 글 쓴 사람 이름, 날짜, 내용에 해당하는 부분이다. 여기에 원하는 글자 크기나 색깔 등에 대한 내용을 넣어주면 된다. 아래의 주황색 부분이 개인적으로 새로 추가 또는 수정한 부분이다.
#communicate .communicateList .name { font-size: 15px; font-weight: 400; float: left; }
#communicate .communicateList .date { font-size: 13px; float: right; font-style: italic; color: #777; }
#communicate .communicateList p { font-size: 15px; color: #555; margin: 10px 0; padding: 0; line-height: 180%; }
2. 그리고 square 스킨을 처음 해 보니 링크가 본문 글씨와 같은 색인 데다가 밑줄까지 가지 않은 게 기본 설정인건지 본문에서 어떤 게 링크가 걸렸는지 알 수가 없었다. 그래서 본문에는 링크에 밑줄이 가게 수정해 놨더니 댓글의 이름에도 밑줄이 가게 되어 왠지 모르게 예쁘지 않다. 그래서 (링크가 걸린 댓글의) 이름에는 밑줄이 가지 않게 하기 위해 아래의 항목을 추가해 보았다(더불어 색깔과 굵기도 설정).
#communicate .communicateList .name a { color: #222; font-weight: 700; text-decoration: none; }
3. 아, 그리고 위의 CSS 231행의 padding에 값을 줘서 방문객 댓글에 대한 주인장의 코멘트는 들여쓰기 느낌이 나도록 했다.
#communicate .communicateList ul { margin: 0; padding: 30px; }