라공 에디션에서 기본적으로 사용하는 라공 에디터에 예쁜 서식이 정말 많은데요.

제가 가운데 정렬로 글을 쓰는 일이 많아 제목/부제 서식의 가운데 정렬을 지정해 줄 수 있는 코드를 추가해보았습니다.

저처럼 가운데 정렬로 글 쓰시는 분들이 계실 수도 있어 코드만 따로 배포합니다.

적용 후 제 갠홈에만 테스트만 해봐서 기타 에러가 발생할 수도 있습니다. 테스트 해주실 갠홈 친구 구합니다.

이후 발생하는 문제는 댓글 주시면 시간 나는대로 수정하겠습니다. 꾸벅꾸벅. 

(+홈페이지의 개인 수정 코드와 충돌나는 경우 제가 수정해드리기가 어렵습니다….)

코드 수정 부분

css/ra0-content.css 파일 최하단

.ra0-content .ra0-table-scroll { max-width: 100%; overflow-x: auto; margin: 1em 0; }

이 코드 아래에

/* 제목·부제 서식 가운데/오른쪽 정렬 지원 */
.ra0-content :is([class^="ra0-door-"],[class^="ra0-deco-"]):is([style*="text-align: center"],[style*="text-align:center"],:has([style*="text-align: center"],[style*="text-align:center"])),
.ra0-content :is([style*="text-align: center"],[style*="text-align:center"]) > :is([class^="ra0-door-"],[class^="ra0-deco-"]) {
  margin-left: auto !important;
  margin-right: auto !important;
}
.ra0-content :is([class^="ra0-door-"],[class^="ra0-deco-"]):is([style*="text-align: right"],[style*="text-align:right"],:has([style*="text-align: right"],[style*="text-align:right"])),
.ra0-content :is([style*="text-align: right"],[style*="text-align:right"]) > :is([class^="ra0-door-"],[class^="ra0-deco-"]) {
  margin-left: auto !important;
  margin-right: 0 !important;
}
.ra0-content :is([class^="ra0-door-"],[class^="ra0-deco-"]) [style*="text-align"] {
  text-align: inherit !important;
}

그리고 추가로 이건 블록 요소 설정 코드인데

원래는 왼쪽 정렬에 한 줄을 크게 차지하던 서식들은

양쪽 정렬을 누르면 다시 왼쪽에 붙어 한 줄을 길게 차지하고 가운데 정렬과 오른쪽 정렬만 기능합니다.

이건 크기가 글에 맞춰 줄어드는 코드라 취향껏 필요하신 분들만 가져가시라고 따로 올립니다.

코드 수정 부분

css/ra0-content.css 파일 최하단

위에서 수정한 코드 바로 아래에

/* 블록 서식 가운데/오른쪽 정렬 지원 */
.ra0-content :is(blockquote,.ra0-device-memo,.ra0-device-log,.ra0-device-system,.ra0-device-alert):is([style*="text-align: center"],[style*="text-align:center"],:has([style*="text-align: center"],[style*="text-align:center"])),
.ra0-content :is([style*="text-align: center"],[style*="text-align:center"]) > :is(blockquote,.ra0-device-memo,.ra0-device-log,.ra0-device-system,.ra0-device-alert) {
  width: fit-content !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.ra0-content :is(blockquote,.ra0-device-memo,.ra0-device-log,.ra0-device-system,.ra0-device-alert):is([style*="text-align: right"],[style*="text-align:right"],:has([style*="text-align: right"],[style*="text-align:right"])),
.ra0-content :is([style*="text-align: right"],[style*="text-align:right"]) > :is(blockquote,.ra0-device-memo,.ra0-device-log,.ra0-device-system,.ra0-device-alert) {
  width: fit-content !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: 0 !important;
}
.ra0-content :is(blockquote,.ra0-device-memo,.ra0-device-log,.ra0-device-system,.ra0-device-alert)[style*="text-align"],
.ra0-content :is(blockquote,.ra0-device-memo,.ra0-device-log,.ra0-device-system,.ra0-device-alert) [style*="text-align"] {
  text-align: revert-layer !important;
}

모두 즐거운 갠홈 생활되세요!