개인용 스타일봇 정리 입니다

알림
|
X

페이지 정보

작성자 neue 125.♡.218.197
작성일 2024.04.02 00:16
1,460 조회
6 추천
쓰기

본문

제3인생님의 스타일봇 적용 추가 css 입니다.

https://damoang.net/tutorial/609


3696240565_qM4KPgs5_d2c327d13455991db86990e491912d11c128e01d.png

3696240565_aCzJq8li_a1285fe5c2e1313a1e20003865d619ac73f04d26.png




라이트모드


/* 1500값을 원하는 크기로 바꿔주세요*/            
.container {
    max-width: 1500px !important;
}

/* 메뉴가 왼쪽에 있는걸 선호하시는 분. 오른쪽을 원하시면 0을 2로 하시거나 빼시면 됩니다.*/
/* 본문 */
.order-1 {
    padding-left:20px;
}
.col-lg-9 {
    width:80%;
}
/* snb */
.order-2 {
    order: 0 !important;
    background: rgb(255,255,255);
    background: linear-gradient(90degrgba(255,255,255,0) 0%rgba(246,246,246,1) 100%);
    border-right:1px solid #dedede;
    width:20%;
}

/* 검색메뉴 항상 보임 */
#boardSearch {
  display: block;
}

            
/* 글씨 크기 변경입니다. 0.8em 1.1 등등으로 변경하시면 돼요  */
:root {
--bs-body-font-size: 0.9em;
--bs-body-line-height: 1.2;
}

/* 20240401 추가라인 */
.na-menu .nav-vertical.nav-pills .nav-link {
    margin-bottom: 0rem;
    letter-spacing: -0.05em;
}
.nav-item i {display:none;}

.fs-4 {
    font-size: 1.25rem !important;letter-spacing: -0.05em;font-weight:300;
}
.fs-5 {
    font-size: 1.25rem !important;letter-spacing: -0.05em;font-weight:700;
    padding-bottom: 1.0rem !important;

}
.line-top {
    border-top: none !important;
    border-bottom: 1px solid #eee !important;
}
.row-cols-sm-2>* {
    width: 25%;
}
/* list */
.hd-wrap {
    display:none;
}
.col-1 {
    width: 5%;
}
.list-group-item {
    padding:0.5em 1em;
}
.count-plus {
    background-color:#eee;border-radius:3px;
    padding:1px 3px 2px 2px;
    font-size:10px;
}


/* view, comment */
.page-title {
    padding-top:15px;
    padding-bottom:15px;
}
.p-2 {
    padding: 0rem !important;
    border:none;
    
    background-color: transparent
}
.mb-3 {
    border-radius:5px;
}
.comment-textarea .form-control {
    background-color: #fff8e3;

}
.f-sm {
    padding:10px 0;
}



다크모드


/* 1500값을 원하는 크기로 바꿔주세요*/            
.container {
    max-width: 1500px !important;
}

/* 메뉴가 왼쪽에 있는걸 선호하시는 분. 오른쪽을 원하시면 0을 2로 하시거나 빼시면 됩니다.*/
/* 본문 */
.order-1 {
    padding-left:20px;
}
.col-lg-9 {
    width:80%;
}
/* snb */
.order-2 {
    order: 0 !important;
    background: rgb(255,255,255);
    background: linear-gradient(90degrgba(255,255,255,0) 0%rgba(0,0,0,0.5) 100%);
    border-right:1px solid #333;
    width:20%;
}


/* 검색메뉴 항상 보임 */
#boardSearch {
  display: block;
}

            
/* 글씨 크기 변경입니다. 0.8em 1.1 등등으로 변경하시면 돼요  */
:root {
--bs-body-font-size: 0.9em;
--bs-body-line-height: 1.2;
}

/* 20240401 추가라인 */
.na-menu .nav-vertical.nav-pills .nav-link {
    margin-bottom: 0rem;
    letter-spacing: -0.05em;
}
.nav-item i {display:none;}

.fs-4 {
    font-size: 1.25rem !important;letter-spacing: -0.05em;font-weight:300;
}
.fs-5 {
    font-size: 1.25rem !important;letter-spacing: -0.05em;font-weight:700;
    padding-bottom: 1.0rem !important;

}
.line-top {
    border-top: none !important;
    border-bottom: 1px solid #333 !important;
    
}

.row-cols-sm-2>* {
    width: 25%;
}
/* list */
.hd-wrap {
    display:none;
}
.col-1 {
    width: 5%;
}
.list-group-item {
    padding:0.5em 1em;
}
.count-plus {
    background-color:#608296;border-radius:3px;
    padding:1px 3px 2px 2px;
    font-size:10px !important;
    color:#fff;
}


/* view, comment */
.page-title {
    padding-top:15px;
    padding-bottom:15px;
}
.p-2 {
    padding: 0rem !important;
    border:none;
    
    background-color: transparent
}
.mb-3 {
    border-radius:5px;
}
.comment-textarea .form-control {
    background-color: #3d6073;
    color:#fff;
  
}
.f-sm {
    padding:10px 0;
}



댓글 10 / 1 페이지

신규회원님의 댓글

작성자 신규회원 (162.♡.119.167)
작성일 04.02 00:30
와... 이런건 어떻게 적용하나요...? 훨씬 좋아보이네요...!

neue님의 댓글의 댓글

대댓글 작성자 neue (162.♡.119.36)
작성일 04.02 10:13
@신규회원님에게 답글 본문글 시작부분에 제3인생님 링크 가시면 스타일봇 사용법 자세하게 나와있더라구요. 저도 그거 따라서 해봤어요
https://damoang.net/tutorial/609

밴플러님의 댓글

작성자 밴플러 (172.♡.233.180)
작성일 04.02 10:36
감사합니다. 적용했더니 깔끔해졌네요.

13R56S6MT님의 댓글

작성자 13R56S6MT (172.♡.207.75)
작성일 04.02 11:49
오.. 감사합니다.
하얀건 배경이요 검은 건 글씨인데.. tutorial 따라 해 보니 적용되네요.

hazletee님의 댓글

작성자 hazletee (172.♡.211.97)
작성일 04.02 16:50
많이 편해졌어요~
감사합니다

NO8DO님의 댓글

작성자 no_profile NO8DO (172.♡.123.139)
작성일 04.02 23:42
와 정말 깔끔한 스타일이네요 공유 감사합니다

제3인생님의 댓글

작성자 no_profile 제3인생 (172.♡.34.179)
작성일 04.03 16:59
우와... 대박이네요.

neue님의 댓글의 댓글

대댓글 작성자 neue (172.♡.207.138)
작성일 04.03 18:22
@제3인생님에게 답글 제3인생님이 공유해 주신 글이 더 대박이죠. 덕분에 스타일봇이라는것도 알게 되었습니다. 감사합니다.

sdk님의 댓글의 댓글

대댓글 작성자 no_profile sdk (116.♡.107.11)
작성일 04.15 21:21
@제3인생님에게 답글 (삭제된 이모지)

oliva님의 댓글

작성자 oliva (172.♡.238.155)
작성일 04.05 04:47
너무~~~좋네요 공유 감사합니다
쓰기
홈으로 전체메뉴 마이메뉴 새글/새댓글
전체 검색