[jekyll chirpy 활용하기] sidebar 이름 변경, table 자동 줄바꿈

사이드바 이름 변경 방법

자신이 선택한 언어를 바탕으로 _data/locales/en.yml 파일에서 아래 내용을 수정

# The tabs of sidebar
tabs:
  # format: <filename_without_extension>: <value>
  home: Home
  categories: Categories
  tags: Tags
  archives: Archives
  about: About # -> About Me

reference - Changing the dynamic-title

Table 자동 줄바꿈

수평으로 스크롤할 수 있는 대신에 창 크기에 따라 자동 줄바꿈이 되도록 하고 싶었다.
방법을 찾던 도중 _includes/refactor-content.html에서 아래와 같은 부분을 발견했고,
작성한 표는 모두 table-wrapper 세팅으로 덮힌다는 걸 알아냈다.

<!--
  In order to allow a wide table to scroll horizontally,
  we suround the markdown table with `<div class="table-wrapper">` and `</div>`
-->

table-wrapper를 조금 수정하면서 자동 줄바꿈 기능을 추가했다. _sass/addon/commons.scss

/* it will be created by Liquid */
.table-wrapper {
  overflow-x: auto;
  margin-bottom: 1.5rem;
  white-space: normal; // 추가

그리고 표를 작성할 때, |----|---| 이런 식이 아닌

<table style="
    border-collapse: collapse;
    width: 100%;
    table-layout: fixed;
    ">
    <colgroup>
        <col style="width: 70%;">
        <col style="width: 30%;">
    </colgroup>
    <thead>
      <tr>
        <th style="
        word-break: break-word;
        overflow-wrap: break-word;
        white-space: normal;
        text-align: left;
        font-size:130%
        ">

위와 같은 코드로, table-layout: fixed 고정 레이아웃으로 설정하고 word-break: break-word; overflow-wrap: break-word; white-space: normal; 줄 바꿈(공백을 기준으로) 코드를 추가했다.