힙합엘이 다크모드를 위한 디자인 소스를 만들었습니다

+의견반영으로 수정!20210830 AM 11:04

 

돈다로 가득한 게시판이지만 만들어서 올려요

 

관리자? 개발자? 분께서 적용을 해주실진 모르겠지만 

어느 글에 힙합플레이야는 있는데 왜 무려 힙합엘이가 다크모드가 없나요!!! 라는 글을 보고 만들었습니다

만든 시간: 약 두 시간

힘들게 배웠던 코딩 여기서 써먹네요..ㅋㅋ

 

어 여기가 파랑색인데요 하얀색인데요 여기 좀 고쳐야 할 거 같은데요 라고 생각하시는 부분은 뭔지 다 알아요

근데 제가 코드를 뜯어 고칠 수 없는 입장이라 

좀 한계가 있을 수밖에 없어요

커뮤니티 게시판 디자인에 최적화 되어있어요

 

https://hiphople.com/kboard/20141642

제목:힙x) 힙합엘이는 다크모드가 없나요?

2021.04.17 11:12

 

https://hiphople.com/kboard/21048934

제목:건의) 힙합엘이 다크모드 좀 만들어주세여

2021.08.15 02:18

 

https://hiphople.com/kboard/20832756

제목:옆동네 힙플은 다크모드가 있네요

2021.07.22 16:49

 

바로 아래를 다 복사하여 'https://hiphople.com/layouts/sketchbook5_sub_dev/css/layout.css' 파일의 제일 밑에다 붙여넣어주시면 바로 적용이 됩니다. 힙합엘이의 CMS가 XE인 거 같은데 그러면 귀찮게 ftp 안 건드리고 설정에서 css를 수정할 수도 있을 거에요. 두 방법 중 하나를 택해서 하심되고 전자 게 안되면 로그인 후 XE에서 고치는 걸로.

 

@media (prefers-color-scheme: dark) {

    #container {background:dimgray !important;}

    #xe {background:dimgray !important;}

    #aplosboard {background:dimgray !important;}

    ​

    .board-wrapper {color:white !important;}

    ​

    .active:hover {

    background:darkslategray!important;

    }

    .active {

    background:darkslategray!important;

    }

    ​

    .board-wrapper *:not(.fas, .far, .fab, .fa, .xi-icon, .xi-check-circle) {

    color: white !important;

    }

    ​

    #flagArticle > div.show_author_document > ul {

    background: black !important;

    }

    ​.widgetContainer #widgetPageBox_2018cms .normal_list li.nb a {

        background: linear-gradient(

45deg

, black, transparent) !important;

    }

    .widgetContainer #widgetPageBox_2018cms .normal_list li a span.title {

        color: white !important;

    }

    .show_author_document ul {

    border: 1px solid black !important;

    }

    .widgetContainer #widgetPageBox_2018cms .normal_list li a span.title, .widgetContainer #widgetPageBox_2018cms .normal_list li a span.browsertitle, .widgetContainer #widgetPageBox_2018cms .normal_list li a span.regdate {

        color: lightyellow !important;

    }

    ​#menu li ul {

        background-color: black !important;

    }

    ​

    .widgetContainer .normal_list li a span.title {

    color: wheat !important;

    }

    #side_swag .widgetContainer .normal_list li a span.ranking {

    color:whitesmoke!important;

    }

    #side_swag .swagbig .tt h10 {

    color:whitesmoke!important;

    }

    #side_swag .swagbig {

    background: silver;

    border: 1px solid darkslategray !important;

    border-radius: 7px;

    }

    ​

    #CommentBox > div.comment-write-body.clear > div > a {

    background: darkslategray !important;

    }

    ​

    .notice {

    background: dimgray !important;

    }

    ​

    .absc.list .ab-table tbody tr:hover {

    background-color: darkslategray !important;

    color: gainsboro !important;

    }

    ​

    #flagList > table > tbody > tr:nth-child(1) > td.title > a:nth-child(1) > strong > span {

    color: chartreuse !important;

    }

    ​

    #flagList > table > tbody > tr:nth-child(1) > td.category > span {

    color: mediumspringgreen !important;

    }

    ​

    #hd .hgroup {

    background: dimgray !important;

    }

    /* dfdfdf​ */

    #menu a {

        color: wheat !important;

    }

    #menu a:hover{

        color: mediumspringgreen !important;

    }

    ​#menu > li:nth-child(9) > a {

        color: chartreuse !important;

    }

    ​body {

        background:dimgray !important;

    }

    #hd .hgroup{

        background-color: dimgray !important;

    }

    ​.absc.list .ab-webzine .wz-item .wz-item-header .title {

        color:white !important;

    }

    .absc.list .ab-webzine .wz-item:hover {

        background-color: darkcyan !important;

    }

    ​.cosmin_fixed a {

        background: dimgray !important;

    }

    .widgetContainer .comsin_fixed li img {

        background: black !important;

    }

    ​

    #gap > div.ba_c > div {

        background: radial-gradient(black, transparent) !important;

        border-radius: 20px !important;

        padding: 30px 10px 30px 10px !important;

    }

    ​

    /* #menu li:hover ul {

        background: black !important;

    }

    #menu li ul li a {

        color: black !important;

    } */

    .hp-container #container{

        background: dimgray !important;

    }

    ​

    #gap > div.board-wrapper {

        background:dimgray !important;

    }

    .absc.list .notice {

        background-color: dimgray !important;

    }

    .title strong span {

        color: chartreuse !important;

    }

    #aplosboard {

        color: white !important;

    }

    #flagList > table > tbody > tr > td.title > a.commentNum.ab-point-color {

        color: turquoise !important;

    }

    .absc.pgnt .pagination-num {

        color: white !important;

    }

    .swiper-container, .page-header {

        color: dimgray !important;

    }

    #mainswiper-wrap {

        background-color: dimgray !important;

    }

    body > header > div.menu{

        background-color: dimgray !important;

    }

    body > header > div.logo_2015 {

        background-color: dimgray !important;

    }

    .absc.article .article-header .ah-meta > span {

        color: white !important;

    }

    #cd-menu-trigger {

        background: black !important;

        border-radius: 5px;

    }

    #widgetTabBox_2018cms.top_tab li a {

        color: white !important;

    }

}