 |
요약 | Discourse FontAwesome Pro는 NPM 패키지 토큰을 사용하여 FontAwesome 라이선스에 따라 Discourse에서 Font Awesome Pro 아이콘을 사용할 수 있게 해줍니다. |
 |
저장소 링크 | https://github.com/discourse/discourse-fontawesome-pro |
 |
설치 가이드 | Discourse에서 플러그인 설치 방법 |
설정
일반적인 플러그인에서 활성화하려면 몇 가지 추가 단계가 필요합니다:
먼저, Font Awesome Pro 패키지 토큰을 포함하는 추가 환경 변수를 설정해야 합니다(이것은 API 토큰과 다름을 유의하세요): DISCOURSE_FONTAWESOME_AUTH_TOKEN
설치 스크립트는 초기화 중에 “after_code” 후크로 호출되어야 합니다. 이는 인증 토큰을 사용하여 빌드 시 FontAwesome Pro SVG를 다운로드하고 추가합니다. 이는 플러그인 클론 블록과 별개의 추가 블록입니다.
app.yml 설치 예시는 다음과 같습니다:
env:
DISCOURSE_FONTAWESOME_AUTH_TOKEN: 123456
hooks:
after_code:
- exec:
cd: $home/plugins
cmd:
- git clone https://github.com/discourse/discourse-fontawesome-pro.git
- exec:
cd: $home/plugins/discourse-fontawesome-pro
raise_on_fail: false
cmd:
- $home/plugins/discourse-fontawesome-pro/scripts/install.sh
오버라이드 패밀리 선택:
관리자 설정에서 기본 Discourse 아이콘 패밀리를 오버라이드할 수 있습니다:
오버라이드 스타일 선택:
기본 아이콘 스타일을 오버라이드할 수도 있습니다:
듀오톤(Duotone)
듀오톤 지원에 대한 완전한 제어를 하려면 다음 CSS(테마 또는 기타 위치에서)를 오버라이드하고 자신의 색상 체계로 교체해야 합니다:
svg {
--fa-secondary-color: red;
--fa-secondary-opacity: 0.6;
}
개별 아이콘에 색상을 적용하려면 SVG의 ID를 참조하세요:
#fad-search .fa-secondary {
--fa-secondary-color: red;
--fa-secondary-opacity: 0.6;
}
듀오톤 스타일링 업데이트
클래스 기반 선택자를 사용하는 경우:.fa-secondary { color: red; }스타일링을 CSS 커스텀 프로퍼티를 사용하도록 업데이트해야 합니다. 클래스 기반 색상 오버라이드는 Font Awesome v7에서 제거되었기 때문에 더 이상 작동하지 않습니다.
내부적으로 이 플러그인은 FontAwesome 저장소를 사용하여 플러그인의 SVG 폴더에 폰트를 설치하고, Discourse가 해당 위치에서 스프라이트를 가져오도록 합니다.
