Pomoc:Tryb ciemny

Pomoc
Tryb ciemny

Czym jest tryb ciemny?Edytuj

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?Edytuj

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?Edytuj

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łącznikaEdytuj

{{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 CSSEdytuj

W treści strony będącej wariantem dostosowanym do trybu ciemnego[uwaga 1] 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="Zbiór zadań maturalnych/styles.css" />

Inwersja barw wybranych grafikEdytuj

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 Zbiór zadań maturalnych/styles.css zawarty jest kod o następującej treści:

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

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

Po co osobny wariant dostosowany do trybu ciemnego?Edytuj

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ówEdytuj

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

Uwagi do powyższych treściEdytuj

  1. Nie należy mylić jej ze stroną w trybie ciemnym, gdyż strona ta nie wyświetla się jako ciemna tylko gdy takie ustawienia występują w urządzeniu czytelnika. Strona dostosowana zawiera wybielone grafiki, co umożliwa ich oglądanie na czarnym ekranie, jeśli pierwotnie grafiki te są czarne.

Powrót do Pomocy Wikibooks