- index.html contains the HTML structure of the page
- style.css contains CSS styling of the page
- Box-model
- Cascading CSS
- CSS selectors
- Popular HTML tags
- HTML - CSS connection
- Color description
- Text styling
- Outside colors/fonts (google fonts)
- Flexbox and CSS Grid
- Position (absolute, relative, fixed)
- Keyframes animations
- Form setup
- Responsive Web Design (media queries)
- Page consists of 4 sections - introduction, about-me section, photo container (meant to be used for some project photos that open the larger preview once clicked) and contact form (opens the default email app once "send" is clicked)
- There is a simple redirection bar to social medias on the right side, looking different on different devices (not really for some reason, more to show that it's possible to style it differently for different views :) )
- Project is responsive and looks good on devices from Chrome emulator (both vertical and horizontal views)
- I used random text replacements and some photos found in the internet
- I decided to drop the standard top navigation bar as it was obsolete in my opinion
- I am not entirely happy with the design, but I'm not a designer type of guy to be honest :) It would probably be better to stick to the standard layout suggested by the organisers.
- moving background image for introduction container
- static background image for the 'photos' section (does not scroll with page)
- clickable images opening the full-screen picture desctiption (pure css 'trick' with using the 'checked' checkbox pseudoclass)