OSS의 pressenter를 어두운 테마로 사용자 정의합니다!


어둠의 주제가 멋지네~
요즘 스마트폰은 말할 것도 없고 유튜브에도 다크 테마 기능이 등장해 유행하고 있다.
주로 눈에 대한 자극이 적기 때문에 좋아하는 사람이 많지만 플리처가 어두운 주제를 실현할 수 있기를 바라는 요구는 Github의 어떤 Issues에서 나온다.
그나저나 프레산트가 어둠의 주제를 만들 수 있을까!?내 생각에도 이런 느낌이 들 것 같지만, 확장 기능(스타일)을 사용하면
[Prisenter User 매뉴얼] 스타일 기능
실제로 공식 블로그에도 맞춤형 외관 기사가 있으니 관심 있는 분들은 보셔도 됩니다!
CSS를 사용하여 Prester의 모양을 자유롭게 사용자 정의합니다!
그래서 이번에는 일람 화면에만 어두운 주제를 만들어 봤기 때문에 공유하고 싶어요.
(전 화면에 정말 적용하고 싶지만 화면이 너무 많은 줄 몰랐어요. 그래서 화면만 한 번 보면 돼요! w)

다크 테마 설정 방법


먼저 요약 화면의 오른쪽 상단에서 관리 → 테이블 관리 를 클릭합니다.

스타일 탭을 선택하고 새로 만들기 를 클릭합니다.

제목에 어두운 제목과 같은 제목을 넣고 스타일에 다음 CSS를 붙여넣습니다.
DarkTheme.css
body{ 
    background-color: #333333;
}
.item a{
    color:white;
}
.separator{
    color:white;
}
#ViewFilters{
    color:white;
}
#ViewSelector{
    background-color: #3333;
}
.grid-row{ 
    background-color: #333333; 
    color:white;
}
.title a{
    color:white;
}
#ReduceAggregations{
    color:white;
}
.data{
    color:white;
}
.status-new{
    color:black;
}
.grid-title-body > p > pre >span > a{
    color: white;
}
.grid-row:hover{ 
    background-color: #333333;
}
table.grid tr:hover{
     background-color: #333333;
    }
table#Grid tr:hover{ 
    background-color: #333333;
}
.grid-row:hover .grid-title-body{ 
    background-color: #333333 !important;
}
.svg-progress-rate text{
    fill: white;
}
.svg-work-value {
    fill: white;
}
.field-label{
    color:white;
}
.crosstab-row td{
    color: white;
}
.container-normal{
    color:white;
}
.comment{
    background-color: gray !important;
}
.comment:hover{
    background-color: gray !important;
}
출력 주소에서 [모두]를 제거하고 [일람]을 선택합니다.
완료되면 추가를 클릭합니다.

화면 아래의'업데이트'단추를 누르는 것도 잊지 마세요.

일람 화면으로 돌아가면... 느낌이 좋은 어두운 주제라는 걸 알 수 있어요!(^^)!

끝내다


그렇습니다!어쨌든 유행이니까 이번에는 Prester의 일람 화면에서만 어두운 주제를 만들었는데 어때요?
앞으로 나는 시간을 내서 화면 하나하나에 어두운 주제를 적용하고 싶다!
멋진 디자인이 있으면 꼭 알려주세요.
그럼 안녕!또 왔어!

좋은 웹페이지 즐겨찾기