Pomoc:Tryb ciemny

Pomoc
Tryb ciemny

Czym jest tryb ciemny?

W niektórych urządzeniach informatycznych (laptopy, tablety, smartfony) można spotkać się z tzw. „trybem ciemnym”. Polega on na tym, że tło interfejsu przeglądarki jest ciemne lub wręcz czarne, a napisy wyświetlają się na biało lub w jasnych odcieniach.

Po co używa się trybu ciemnego?

Powodów użycia trybu ciemnego może być kilka:

• redukuje zużycie energii elektrycznej, gdyż tylko czcionka wyświetlana jest na jasno, zaś wyświetlanie tła stanowiącego większą część powierzchni ekranu zużywa minimalną ilość energii.
• interfejs w trybie ciemnym mniej męczy wzrok
• niektórzy uważają ten tryb za estetyczniejszy
• tryb ciemny jest bardziej dyskretny, gdyż ekran „nie świeci” w ciemnym pomieszczeniu.

Jak dostosować stronę do trybu ciemnego?

Dostosowanie możliwe jest poprzez utworzenie drugiego wariantu strony (wariant „dark”). Na stronie domyślnej (dostosowanej do trybu jasnego należy wstawić szablon {{Tryb ciemny}}). Utworzy on w prawym górnym rogu przełącznik, w którym do wyboru jest „Tryb jasny” i „Tryb ciemny”. Przykład zastosowania widoczny jest na stronie Zbiór zadań maturalnych/Matematyka/Zadania/P1. W wariancie dostosowanym (dostępnym pod tym adresem) widać, że wzory wyświetlają się na biało (co ma sens w przypadku ciemnego ekranu). W pierwszym parametrze należy wpisać adres strony na której chcemy umieścić przełącznik, np:

Stosowanie szablonu przełącznika

{{Tryb ciemny|Zbiór zadań maturalnych/Matematyka/Zadania/P1}}

lub w ogólnej formie będzie to:

{{Tryb ciemny|{{PAGENAME}}}}

Jeśli z jakichś względów wersja dostosowana do trybu ciemnego nie może mieć konstrukcji nazwa_strony/dark, to wówczas należy wypełnić drugi parametr na zasadzie:

{{Tryb ciemny|nazwa_głównej_strony|nazwa_strony_z_wariantem_dostosowanym}}

Przywoływanie stylu CSS

W treści strony będącej wariantem dostosowanym do trybu ciemnego należy na samym początku kodu źródłowego zamieścić znacznik przywołujący plik CSS inwertujący barwy wybranych grafik. Przykładem takiego znacznika jest:

<templatestyles src="Szablon:Tryb ciemny/styles.css" />

Inwersja barw wybranych grafik

W tej technice sami wybieramy, które grafiki lub wzory matematyczne, mają ulec inwersji barw. Jeśli któreś z nich naszym zdaniem powinno ulec inwersji barw, okalamy ich kod źródłowy w następujący sposób:

<span class="ciemny"><math>0<\frac{(ab+bc)-(ab-ac)}{b(b-c)}</math></span>

Wzór ten wyświetli się jako biały, ponieważ w przywołanym stylu z pliku Szablon:Tryb ciemny/styles.css zawarty jest kod o następującej treści:

.ciemny {
  filter: invert(100%);
}

/*{{Kategoria|Szablony - arkusze stylów}}*/

Powoduje to przywołanie elementu ciemny, w którym zdefiniowany jest filtr dokonujący inwersji barw.

Po co osobny wariant dostosowany do trybu ciemnego?

Wariant strony niedostosowany do trybu ciemnego.

Wariant strony dostosowany do trybu ciemnego.

Wariant strony dostosowany do tryby ciemnego opracowany został po to, aby prawidłowo mogły się wyświetlać czarne grafiki z przezroczystym tłem w urządzeniach, gdzie ustawiono tryb ciemny. Jak widać na załączonych ilustracjach strona w wariancie niedostosowanym nie wyświetla wszystkich elementów wzoru matematycznego (w tym przypadku niewidoczne są kreski ułamkowe). Zastosowanie wariantu dostosowanego rozwiązuje ten problem.

Zgłaszanie błędów

Błędy techniczne – wszelkie błędy wymagające interwencji opiekuna tego projektu należy zgłaszać do Superjurka.

Uwagi

---

Powrót do Pomocy Wikibooks

Koniec