Closed

HTML, CSS, SVG

Zlecę przygotowanie wizytówki, szablonów HTML i narysowanie SVG. Oczekiwany efekt pracy to tylko technologie HTML, CSS i SVG. Rozliczenie jedynie fakturą albo rachunkiem imiennym.

Wynik pracy ma być statycznym plikiem HTML/HTML5/FLEX z wbudowanym CSS. Ma wyświetlać się z wszystkimi efektami w popularnych przeglądarkach stacjonarnych i mobilnych (w IE, zwłaszcza starszych, wystarczy że będzie się wyświetlać bez wodotrysków ;-) ). Style koniecznie bez referencji po ID, a zmienne parametry styli w atrybucie "style" elementów (wynik pracy będę dynamizować w JS). W pliku musi znaleźć się przykładowe użycie wszystkich zrobionych rzeczy.

Do wykonania:

1. [template] Okno symulujące okno aplikacji (jak w komputerze stacjonarnym). W pasku okna: przyciski - minimalizacji, maksymalizacji, osadzania/uwalniania(jako element stały w stronie) i zamykania okna; tekst tytułu aplikacji; ikona SVG. Prawy dolny róg wyróżniony jako możliwy do zmiany rozmiaru okna przez użytkownika. Parametry to współrzędne, wymiary okna, kolor/y obramowania, kolor tła okna. Współrzędne i wymiary definiowane na poziomie głównego elementu okna. Jeśli wymiary nie będą zdefiniowane to wielkość okna dostosowuje się do zawartości, jeśli będą, a zawartość będzie większa niż obszar widoczny to automatycznie pojawią się scrolle. Powinien też znaleźć się tu element umożliwiający tworzenie okien modalnych (półprzeźroczysty div z domyślnym stylem parametrem "display none" przesłaniający całą stronę uniemożliwiający użytkownikowi kliknięcie jakichkolwiek elementów strony innych niż w bieżącym symulowanym oknie)

2. Stylizacja wszystkich typów elementów "input" w HTML5 oraz elementów "select", "label", "a", "button"; style dla wartości poprawnych, brakujących i błędnych, style dla nieaktywnych.

3. Stylizacja tabeli (w tym nagłówka i stopki)

4. [template] Listbox symulujący działanie "select size=", ale zamiast OPTIONów DIVy do których można wrzucać dowolną zawartość HTML; stylizacja dla wybranych, niewybranych i nieaktywnych elementów listy, ewentualnego nagłówka i stopki (domyśnie display none); scroll vertykalny automatycznie tylko dla odpowiedników OPTIONów, niezależnie od zawartości listy (lista w odrębnym elemencie) na jej początku i końcu elementy (domyślnie display none) symbolizujące możliwość zaczytania kolejnych elementów do listy. Parametry to wymiary głównego elementu zawierającego symulację listy. Jeśli brak to lista dostosowuje się do wymiarów największych swoich opcji.

5. [template] Symulacja ikony wraz z nazwą, style dla rozmiarów mały, średni, duży, oraz zaznaczony i nie zaznaczony

6. Narysowanie ikon SVG: nawigacja, współrzędna GPS, plan trasy, miejsce, ustawienia, wiadomości, rozliczenia, szukaj, zapisz, otwórz, utwórz nowy, importuj, eksportuj, dodaj, usuń, poprzedni, następny, do góry, do dołu, zatwierdź, anuluj, formularz, katalog, serwer, komputer, ostrzeżenie, błąd, odśwież, koszyk zakupowy, użytkownik, elektronika, baza danych, książka, rozliczenia, maszyny, dom, klucz, odtwórz, nagraj, stop, pauza, aparat

7. Odświeżenie istniejącego prostego logo (tekst + znaczek z dosłownie kilku krzywych) zmiana kolorystyki i dostosowanie do pozostałych przygotowanych elementów.

8. [template] Karta produktu składająca się z: nazwa produktu, obraz, parametry produktu (np. kolor, rozmiar, ilość), opis produktu, cena netto, cena brutto, przycisk dodania do koszyka, przycisk zamknięcia. Automatyczny scroll horyzontalny nie obejmujący nazwy produktu i cen. *

9. [template] Artykuł składający się z tytułu, zajawki, zdjęcia, treści, autora, daty modyfikacji, przycisku zamykającego, przycisku kontynuacji czytania (naciśnięcie przycisku spowoduje "doczytanie" kolejnej porcji tekstu). Automatyczny scroll horyzontalny nie obejmujący tytułu artykułu. *

Stylizacja wszystkich wspomnianych ikon i templateów musi być spójna/lekka i mieć nowoczesny wygląd, przyjemną kolorystykę. Potrzebuję praw do pełnego dysponowania pracą - móc ją dowolnie wykorzystywać i zmieniać później.

Skills: Graphic Design, HTML, Website Design

See more: zw design, tworzenie logo, tre pe, template ikon, technologie website, svg 2, np logo design, ni logo design, nag logo, mie logo design, logo tekst design, logo ikon, logo design ka, logo design ce, input html 5, ikon logo, html 5 e css, html5 dom, flex graphic design, dos website

About the Employer:
( 0 reviews ) Żyrardów, Poland

Project ID: #6974575