본문 바로가기
미디어위키

Extension TemplateStylesExtender

by 다움위키 2024. 9. 10.
최근 미디어위키의 일부 스킨, 예를 들어 Vector-2022에서 Automatic/Light/Dark 색상을 선택할 수 있습니다. 이를 위해 CSS 파일을 적절히 수정해야 하는 임무가 생겼습니다. 그러나, 실제 CSS를 색상을 선택하도록 수정해 보면, 저장을 할 수 없는 문제가 발생합니다. 위키미디어 재단 위키에서는 이 확장이 없어도 저장이 되는지 이 확장이 설치되어 있지 않습니다. 그러나, 그 외 위키에서는 이 확장을 설치해야 수정된 CSS를 저장할 수 있습니다.

TemplateStylesExtender 확장은 새로운 선택기와 일치기와 함께 Extension:TemplateStyles를 확장합니다. 이는 이 확장을 이용하기 위해 먼저 Extension:TemplateStyles 확장을 설치해야 함을 의미합니다.

Features

다음을 추가적으로 지원합니다:

  • CSS variables: Example color: var( --color-base )
  • image-rendering
  • ruby-position
  • ruby-align
  • scroll-margin-* and scroll-padding-*
  • @media (prefers-color-scheme: dark/light) media queries
  • mask-image
  • clamp
  • revert / revert-layer
  • aspect-ratio

Installation

미디어위키 확장 내려받기 지면에서 해당 판을 내려받아서 정해진 위치로 이동시킵니다.

미디어위키 설정 LocalSettings.php 파일에 다음을 추가합니다:

wfLoadExtension( 'TemplateStylesExtender' );

필요하다면 구성하십시오.

Special:Version에 접근해서 확장이 정상적으로 설치가 되었는지 확인하십시오.

Configuration

$wgTemplateStylesExtenderEnablePrefersColorScheme Flag to enable @media (prefers-color-scheme: dark/light) media queries false true
$wgTemplateStylesExtenderEnableCssVars Flag to enable CSS vars false true
$wgTemplateStylesExtenderEnableUnscopingSupport Flag to enable unscoping of CSS by users with editinterface permissions true false

Key Description Example Default

Note CSS Vars

현재 :root 선택기를 사용하는 것은 템플릿 스타일이 .mw-parser-output 앞에 붙음으로 인해 작동하지 않을 것입니다.

가능한 해결책 중 하나는 전체 컨텐츠를 'div' 원소로 래핑하고 여기에 선언을 추가하는 것입니다. 예를 들어:

div#content-wrap {
   --padding: 10px
}

.content {
   padding: var( --padding )
}

위키텍스트:

<div id="content-wrap">
   <div class="content">
      The WikiText...
   </div>
</div>

Unscoping of CSS

예제: <templatestyles src="Foo/style.css" wrapclass="mediawiki" />는 CSS의 범위가 .mw-parser-output 대신 .mediawiki로 지정되는 결과를 낳습니다.

페이지에서 그러한 호출을 포함하는 것은 본질적으로 편집을 editinterface 권한을 갖는 사용자에게만 제한됩니다. 대안적으로 스타일을 포함하는 템플릿에 대한 호출을 포함할 수 있습니다.

See also