티스토리 블로그 꾸미기 (2)

오늘은 어제에 이어서 계속해서 티스토리 스킨을 만들었다.

 

만들면서 느낀건데 세상에서 디자인이 제일 어려운 것 같다. 디자인만 어떻게 완성되어 있으면 금방 하겠는데 다 만들고 나면 맘에 안들어서 엎고 다시하는 경우가 많았다. 

 

그래도 나름 지금까지는 맘에 드니 다행이지만 제작 기간이 길어지면 또 바뀔 수 있을 것 같아서 최대한 빨리 끝내보려고 한다.

 

미리보기

 

---

오늘은 어제 못했던 글 내부에 자리를 차지하고 있던 area-common 을 없앴다. 메인에 집중하다보니 글 내부의 코드가 어떻게 되어 있는지 몰랐는데 글 내부에는 tt-body-page 라는 클래스가 있다는 것을 놓쳤다. 그래서 클래스를 추가하며 쉽게 고칠 수 있었다. 

 

다음은 깃허브 바로가기를 만들었다. 먼저 전체 컨테이너를 a 태그로 감싸고 svg를 이용해 다크모드를 했을 때 색상을 반전 시켰다. 그리고 커서를 포인터로 해서 클릭할 수 있도록 유도했다. 

 

지금 생각해도 저거 너무 밋밋한것 같아서 마우스를 올리면 카드가 돌아가는 효과를 줄까 생각중이다.  

 

마지막으로 글에 들어갔을 때 패딩이 들어가 있으면 정작 글이 들어가야 할 컨테이너가 너무 작아졌다. 그래서 반응형으로 가로 길이가 1061px 이상일 때에는 패딩을 주고, 그렇지 않으면 패딩을 빼서 글을 보기 편하도록 만들었다.

 

창 사이즈가 작을 때

창 사이즈가 클 때

 

이제 마지막 컨테이너에 방문자를 넣을 예정인데 디자인을 어떻게 해야할 지 고민이다. 원래 냅다 관리 창에 있는 그래프 가져오려고 했는데 그래도 티스토리에서 제공해 주는 값으로 막대 그래프를 만들까 생각중이다. 

관리창에 있는거

 

티스토리에서는 어제 방문자, 오늘 방문자, 총 방문자 이렇게 3가지 값을 주는데 차차 생각해보고 내일 하든가 해야겠다!