Pomocnik CSS z paletą HSL

Część praktyczna egzaminu z kwalifikacji EE.09 „Programowanie, tworzenie i administrowanie stronami internetowymi i bazami danych” (formuła 2017, poprzedniczka INF.03) z sesji czerwiec 2022 (zadanie 02) trwa 150 minut. Baza sklep z kodowaniem polskich znaków powstaje z importu pliku sklep.sql, a import dokumentuje zrzut ekranu w formacie JPEG. Zapytania zapisane w pliku kwerendy.txt wybierają imię, nazwisko i miasto klientów z Legionowa i Warszawy, nazwy produktów o cenie brutto powyżej 500 zł, nazwy kategorii ze średnią ceną brutto ich produktów oraz id, ilość i wartość zamówień klienta o id 2 z nazwą produktu. Dwa ostatnie wymagają relacji. Wyniki trafiają na zrzuty kw1-kw4.

Grafikę kolory.jpg trzeba wykadrować do samej przestrzeni barw i przeskalować bez zachowania proporcji do szerokości 500 px. Witryna składa się ze stron kolory.html, czcionki.html i style.html - dwie ostatnie zawierają tylko tekst „strona w trakcie budowy”. Strona kolory.html w HTML5 z tytułem „Pomocnik CSS” i arkuszem styl2.css ma kontener z dwoma blokami banera obok siebie, blokiem głównym i stopką. Drugi blok banera zawiera listę odnośników do podstron i do pomocy w serwisie w3schools.com. Blok główny zawiera opis zakresów składowej H, obraz, pole numeryczne z maksimum 360, przycisk „Generuj paletę” i tabelę z czterema kolumnami, w której pierwszy wiersz ma scalone komórki. Styl CSS ustala m.in. kontener o szerokości 90% wyśrodkowany automatycznymi marginesami, czarne bloki banera, odnośniki bez podkreślenia zmieniające kolor po najechaniu i elementy listy wyświetlane jako kontener liniowo-blokowy.

Funkcja JavaScript wywoływana przyciskiem pobiera wartość z pola i ustawia tło komórek tabeli w formacie HSL: składowa H pochodzi z pola, L wynosi zawsze 50%, a nasycenie S to 100% w pierwszym wierszu oraz kolejno 80%, 60%, 40% i 20% w drugim.

Ocenie podlegają operacje na bazie danych, zawartość i działanie witryny, styl CSS oraz skrypt JavaScript.