Marshall K 2019. 5. 21. 18:20


뭐 예전처럼 스킨을 변경하며 엄청나게 큰 변화를 준 건 아니라서, 얼핏 보면 바꾸긴 바꾼 건가 싶을 수도 있긴 합니다.

어제 만들기 시작해서 오늘 완성한 스킨이라, 뭘 많이 바꿀 시간도 없었긴 합니다..ㅋㅋㅋ


가장 큰 변화는


- 각종 디자인 변경

- 스크립트 최적화


이 두 가지를 꼽을 수 있겠네요.


디자인 변경점


글 화면도 그렇고, 전반적인 페이지에 배경 그래디언트를 제거했습니다.

큰 의미가 있는 건 아니고, 거의 항상 배경에 사진을 넣건 그래디언트를 넣건 해왔던 것 같아서 이번엔 다른 느낌을 주고자 제거해봤습니다.



배경에 뭔가 특별한 게 없으니 예전처럼 이렇게 배경과 컨텐츠가 들어가는 부분이 분리되지도 않습니다.



배경 그레디언트를 제거하고 배경과 컨텐츠 경계를 없앤 원인 중 하나입니다.

예전엔 배경 이미지가 스크롤 따라 천천히 올라가는 게 보였는데, 이젠 바닥이 컨테이너에 가려 parallax scroll 느낌이 한층 더 강해지도록 했습니다.


카테고리 / 제목 / 작성일 등 정보는 스크롤이 내려감에 따라 천천히 투명해지도록 했습니다.



드로워의 디자인도 변경했습니다.

드로워의 배경을 삭제하고, 드로워 안의 아이템들에 배경을 넣었습니다.


원래 화면과 구분을 위해 드로워 뒤에 그래디언트를 추가했습니다.


그리고 최근 글, 최근 댓글 목록도 좌측 드로워로 옮겼습니다.


드로워를 펼쳤을 때 페이지 아무 곳이나 스크롤 해도 드로워가 스크롤 됩니다.



일정 크기 이상의 사진은 크기를 키웁니다.

굳이 설명하지 않아도 글만 보시면 무슨 느낌인지 아시지 않을까 싶네요.


링크의 디자인을 변경했습니다.


링크가 길어져 다음 줄로 넘어가도 예전관 다르게 배경이 제대로 표시됩니다.


링크링크링크링크링크링크링크링크링크링크링크링크링크링크링크링크링크링크링크링크링크링크링크링크링크링크링크링크링크링크링크링크링크링크링크링크링크링크



이건 티는 안 나는 변환데, 예전처럼 테마를 골라서 변경하는 게 아니라 css variable을 이용해 색상을 변경하도록 수정했습니다.

한참 전에 css variable을 이용해 테마를 변경하다 스킨 배포 때문에 css variable을 사용하지 않고 body에 class를 추가해 테마가 변경되도록 했는데, 그 방법을 계속 사용하자니 테마 하나 추가할 때마다 변경해야 할 것들이 산더미라 그냥 이렇게 변경했습니다.


최적화


예전부터 해야지 해야지 생각만 하다 이번에 꽤 많은 부분을 손봤습니다.

체감될 정도로 차이가 큰 부분은, 우측 드로워를 열어 어두운 모드 / 밝은 모드를 변환했을 때입니다.


어두운 모드를 켜고 페이지를 이동했을 때, 예전엔 짧은 시간이지만 하얀 배경이 보이고 검은 배경으로 바뀌었습니다. 이젠 페이지를 이동해도 흰 배경이 보이지 않습니다.


외에도 스크립트를 전반적으로 거의 다 뜯어고쳤습니다. 성능 향상이 있었으면 좋을 텐데 어떨지 모르겠네요.



여담으로, 스킨 손볼 때마다 트와이스, 태연 가사집도 같이 손보느라 죽을 맛입니다.ㅋㅋㅋ;;