본문 바로가기
Tistory

[티스토리] hELLO 스킨 - 다크모드, 야간모드 해제, 라이트 모드를 기본으로 변경!

by SheenaKaze 2024. 7. 12.

다크모드에서는 제가 올린 몇 개의 포스팅한 글이 가독성이 떨어지는 문제가 몇 가지 보였습니다..

사실..주인장이 화이트 모드를 좋아하긴 해요.. 이건 사바사, 취바취라서.. 어떤 분들은 화이트 화면 딱 뜨면 아 눈 부셔하며,꺼버리시는 분들도 많은데요.. 그래도 아직 세상엔 흑보다 백이 많고, 악보단 선이 많다고 생각하는 주인장이라서...

디폴트 모드로 라이트 모드를 기본으로 적용하면서, 테마 전환 버튼도 수정해줍시다.

 


0. 블로그 관리자 페이지 -> 스킨 편집 -> HTML 편집 -> 팝업창 (예)


1. [hELLO 티스토리 스킨] 다크모드 , 라이트 모드 전환 버튼 삭제

[삭제한 내용]
<buttonx-data="theme"@click="toggle"><spanclass="text-hidden">테마</span><iclass="fa-solid fa-moon text-base"></i></button>

[기존]

<div class="wrap flex gap-x-2.5"><button x-data="theme" @click="toggle"><span class="text-hidden">테마</span><i class="fa-solid fa-moon text-base"></i></button><a class="top btn" href="#hELLO"><span class="txt">상단으로</span><i class="ico fa-solid fa-chevron-up"></i></a></div>

 
[수정 후]
<div class="wrap flex gap-x-2.5"><a class="top btn" href="#hELLO"><span class="txt">상단으로</span><i class="ico fa-solid fa-chevron-up"></i></a></div>

버튼 삭제

2. [hELLO 티스토리 스킨]  라이트 모드를 Default로 고정

[삭제한 내용]
dark ? skinOptions.hljsDark :

[기존]
<link rel="stylesheet" :href="`//cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.7.0/build/styles/${dark ? skinOptions.hljsDark : skinOptions.hljs}.min.css`">
 
[수정 후]
    <link rel="stylesheet" :href="`//cdn.jsdelivr.net/gh/highlightjs/cdnrelease@11.7.0/build/styles/${skinOptions.hljs}.min.css`">

 

'Tistory' 카테고리의 다른 글

그 유명한 스킨 hELLO 티스토리 스킨 적용하기  (4) 2024.07.10