mindthedark 템플릿 수정 이력

<title>mindthedark 템플릿 수정 이력</title>


{{section>wiki:위키_테마_수정_문서들&noheader&nofooter&noeditbtn&firstseconly}}


======스킨폴더======

  ${WIKI_HOME}/lib/tpl/mindthedark

====== 기본 폰트 변경 ======

  * file: .\css\basic.less

<code css>
body {
   /*font: normal 87.5%/1.4 Arial, sans-serif;*/ /* 왼쪽이 원본임 */
   font: normal 87.5%/1.4 Arial, "Noto Sans CJK KR", "Open Sans", sans-serif; /* 새로 추가한 내용 */
  
   /* 원래 있던 내용 */
   /* default font size: 100% => 16px; 93.75% => 15px; 87.5% => 14px; 81.25% => 13px; 75% => 12px */
   -webkit-text-size-adjust: 100%;
}
</code>

====== 목록의 줄 간격 조정 ======

  * file: ./mindthedark/css/basic.less,176

<code css>
margin: 0 0 0 1.5em -> margin: 0.3em 0 0.3em 1.5em
</code>

====== 표의 이미지 배치 조정 ======

  * file: ./tpl/mindthedark/css/content.less,52

<code css>
/* embedded images (styles are already partly set in lib/styles/all.css) */
.dokuwiki img.media {
    /*margin: .2em 0;*/
    border: 1px solid var(--border, #ccc);
    /*border-radius: 4px;*/
    /*padding: 5px;*/
    background-color: white;
}
</code>

====== 코드의 탭 크기 변경 ======

  mindthedark/css/basic.less

  * **pre {**로 검색
  * 가장 아래 부분에 아래 코드를 추가, 브라우져 별로 대응이 다르므로 여러개 넣어야 하는 것 같다.

<code css>
tab-size: 4;      /* 크롬 확인 */
-moz-tab-size: 4; /* firefox 확인 */
-o-tab-size: 4;
</code>

  * [[https://stackoverflow.com/questions/6686763/setting-pre-tab-width-in-different-web-browsers|setting pre tab width in different web browsers]]

====== 목차에 밑줄 추가 ======

  mindthedark/css/basic.less

  * h1 으로 검색
  * h3 ~ h6 하단 밑줄 추가

<code css>
h3 {
  font-size: 1.125em;
  margin: 1em 0 0.3em;
  border-bottom: 1px solid var(--border, #333);
}
h4 {
  font-size: 1em;
  margin: 1em 0 0.3em;
  border-bottom: 1px solid var(--border, #333);
}
h5 {
  font-size: .875em;
  margin: 1em 0 0.3em;
  border-bottom: 1px solid var(--border, #333);
}
h6 {
  font-size: .75em;
  margin: 1em 0 0.3em;
  border-bottom: 1px solid var(--border, #333);
}
</code>