TweetDeck 보기 편한 커스텀 스타일시트 – Stylebot 확장기능용

이전 글 : TweetDeck 보기 편한 커스텀 스타일시트 – 버전 3.0 용

9월 1일, 구글 크롬 브라우저가 버전45로 업데이트 되었다. 직접 관련이 있는지는 모르겠으나 그동안 트윗덱에서 잘 쓰고 있던 Stylish 확장기능이 좀 이상했다. 분명 처음 트윗덱을 열었을 땐 잘 적용되었던 커스텀CSS가 어느 순간 풀려버리는 것. 혹시나 싶어 검색도 해보고 Stylish 홈페이지와 포럼도 뒤져봤으나 뾰족한 방법을 찾지 못했다.

크롬 웹 스토어에서 스타일리시를 다시 설치할까 하다가, 같은 기능을 제공하는 Stylebot을 깔아봤다. 실시간 편집 기능도 제공하고 요소 선택 기능도 제공하고. 어라, 써보니 괜찮네? 싶어 갈아탔다.

어차피 같은 사이트에 대한 커스텀CSS이기 때문에 코드는 크게 차이나지 않았다. 다만 적용 시점에 약간 차이가 있는지, 일부 CSS는 너무 넓게 적용되어 나왔다. 약간의 수정을 거쳐 최종적으로 적용한 CSS는 다음과 같다.(2015-09-04 업데이트)

 

html {
    color: #aaa ;
}
.account-inline .fullname {
    display: none ;
}
.account-link {
    color: #999;
}
.app-content {
    background: #333;
}
.btn-positive, .s-following .follow-btn {
    background-color: #00A6E2;
}
.column {
    background: #111;
}
.needs-scroll-bottom-offset.scroll-styled-h {
    bottom: 0px;
}
.scroll-styled-h::-webkit-scrollbar {
    background-color: #000;
    height: 15px;
}
.scroll-styled-h::-webkit-scrollbar-thumb {
    border-radius: 15px;
}
.scroll-styled-v::-webkit-scrollbar-thumb, .scroll-styled-h::-webkit-scrollbar-thumb {
    background-color: #222;
}
.scroll-styled-v::-webkit-scrollbar-thumb:hover, .scroll-styled-h::-webkit-scrollbar-thumb:hover {
    background-color: #555;
}
.scroll-styled-v::-webkit-scrollbar-track, .scroll-styled-h::-webkit-scrollbar-track {
    border-left: 0;
}
.stream-item {
    border-bottom: solid 1px #222;
}
.tweet-body p a {
    color: #5983A0;
}
.txt-mute a:not(:hover):not(:focus) {
    color: #666;
}