Thunderbird: 작성 창에서 색상 변경

Thunderbird: 작성 창에서 색상 변경

Thunderbird UI가 UserChrome.css.

예를 들어, 창 표시줄의 색상을 쉽게 변경할 수 있습니다.

menubar, toolbar, nav-bar, #TabsToolbar > *{
  background-color: rgb(245,199,18) !important;
}

그런데 변경하려는 요소의 이름은 어디서 찾을 수 있나요?

예를 들어, 작성 창에서 최신 Thunderbird는 전체 제목, 제목 자체 및 입력 필드(모든 것이 밝은 회색)에 색상을 지정합니다.

여기에 이미지 설명을 입력하세요.

이전 버전의 Thunderbird에서는 제목에만 색상을 지정했지만 사용자 입력 필드는 눈에 띄게 달랐습니다.

(색상 테마의 차이, 즉 밝은 대 어두운 것은 무시하세요). 중요한 점은 헤더(예: "보낸 사람", "받는 사람")와 사용자가 입력한 실제 이메일 주소를 명확히 구분하는 것입니다.

요소의 이름을 찾고 이를 사용하여 색상을 변경하는 방법은 무엇입니까 UserChrome.css?

나는 Thunderbird 68.3사용하고있다Debian Buster

여기에 이미지 설명을 입력하세요.

답변1

UserChrome.cssThunderbird 및 Firefox의 경우 이 파일에서 사용할 수 있는 편집 소스는 /install-dir/omni.ja표시 창의 모든 소스(javascript, xul, css 등)가 포함된 압축된 디렉터리(압축되지 않음)입니다.

소스를 직접 편집하거나 보려면 다음을 수행하십시오.

mkdir tmp; cd tmp;
cp ../location-of-install-dir/omni.ja .
unzip omni.ja

원하는 것을 편집하거나 찾고 있는 값을 얻은 다음 다음을 사용하여 파일을 다시 작성할 수 있습니다.

rm omni.ja #(remove the copied one)
zip -qr0XD omni.ja *

찾고 있는 파일에는 ./chrome/messenger/content/messenger/messengercompose/messengercompose.xul파일 시작 부분에 표시된 CSS 및 xul chrome://messenger/content/bindings.css등이 포함되어 있습니다 chrome://messenger/skin/messengercompose/messengercompose.css.

Chrome:// 주소를 사용하면 omni.ja에 있는 파일, 확장 파일 등에 액세스할 수 있습니다. 유사한 확장 프로그램이 있는 경우 Thunderbird를 사용하여 이러한 URL을 직접 찾아볼 수 있습니다.이것또는이것불행히도 아직 v68로 업데이트되지 않았습니다.

일반적으로 편집하려는 요소를 식별하려면 도구 > 개발자 도구 > 개발자 도구 상자 메뉴에서 사용할 수 있는 디버거(Ctrl+Shift+I)를 사용한 다음 DOM 개체 검사기의 왼쪽 상단에 있는 버튼을 사용할 수 있습니다. 하지만 먼저 올바른 창을 선택했는지 확인하세요. 드롭다운 메뉴는 오른쪽 상단에 있습니다. 예를 들어 messengercompose.xul새 메시지 창의 경우 작성 창이 열려 있으면 여기에 나열됩니다.

다음과 같은 확장감찰관여기서 도움이 될 수 있지만 아직 v68과 호환되지 않습니다.

답변2

이는 UserChrome.css다음을 통해 달성 할 수 있습니다.

#msgSubject {
  background-color: -moz-field !important;
}

#msgIdentity {
  background-color: -moz-field !important;
}

.textbox-addressingWidget {
  background-color: -moz-field !important;
}

.dummy-row {
  background-color: -moz-field !important;
}

또는 아래 대안... var(--lwt-toolbarbutton-active-background, rgba(255, 255, 255, .4))필드(cc, bcc 등) 왼쪽에 있는 더미 상자를 원하는 색상(예: 빨간색, 파란색 등)으로 바꿀 수 있습니다.

#msgSubject {
  background-color: -moz-field !important;
}

#msgIdentity {
  background-color: -moz-field !important;
}

.textbox-addressingWidget,
.dummy-row:not(:first-child) {
  background-color: -moz-field !important;
}

.addressingWidgetCell:first-child, 
.dummy-row-cell:first-child {
  background-color: var(--lwt-toolbarbutton-active-background, rgba(255, 255, 255, .4)) !important;
}

썬더버드 v68.3.0 및 v68.3.1:

새로 설치하는 경우 다음을 통해 사용자 정의 CSS 사용을 잠금 해제해야 합니다.

Settings/Options > Advanced > General > Config Editor...
toolkit.legacyUserProfileCustomizations.stylesheets > true

그런 다음 chrome프로필 디렉터리에 이름이 지정된 폴더를 만든 다음 파일을 만듭니다 userChrome.css(대소문자 구분).

이것은 #e06d30... 색상을 사용하는 TB v68.3.x용 업데이트된 CSS입니다.

#msgSubject {
  background-color: -moz-field !important;
}

#msgIdentity {
  background-color: -moz-field !important;
}

.textbox-addressingWidget,
.dummy-row:not(:first-child) {
  background-color: -moz-field !important;
}

.addressingWidgetCell:first-child, 
.dummy-row-cell:first-child {
  background-color: #e06d30 !important;
}

.addressingWidgetCell:nth-child(2), 
.dummy-row-cell:nth-child(2) {
  background-color: #e06d30 !important;
}

관련 정보