olgatenison / Plants

Plants is a project centered around crafting a landing page for a gardening service. The objective was to design an adaptive and interactive website for plant enthusiasts, with the added assurance that the layout has been faithfully recreated to be pixel-perfect.

Home Page:https://olgatenison.github.io/Plants/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

preview

Plants

study project


Project Description

Plants is the studing task: I made the landing page of a site that offers its services for growing plants in the garden and caring for them, making it adaptive and interactive.


Key skills:

  • valid semantic adaptive layout
  • easy to maintain readable code
  • export styles and graphics from Figma
  • using JavaScript to implement the functionality specified in the task

The project consists of the following blocks

(valid semantic layout. The landing matches the layout):

  • header
  • section welcome
  • section about
  • section service
  • section prices
  • section contacts
  • footer

The project is available for viewing in any browser, it has a web, 768px (tablet) и 380рх (mobile) versions (screen width ≥ 320px there is not horizontal scrollbars is limited whil maintaining the entire contents of the cells.). Also I made burger menu for a smaller scrins.

When you click on the buttons: Gardens, Lawn, Planting, the focus changes to services in the service section. Accordion in the prices section includes 3 dropdown lists about services and prices. In the contacts section, implement a select with a choice of cities. Depending on the user's choice, a block appears with the address and phone number of the office in a particular city.


Technologies

  • HTML5, CSS3
  • JavaScript
  • responsive design
  • BEM

About

Plants is a project centered around crafting a landing page for a gardening service. The objective was to design an adaptive and interactive website for plant enthusiasts, with the added assurance that the layout has been faithfully recreated to be pixel-perfect.

https://olgatenison.github.io/Plants/


Languages

Language:CSS 49.3%Language:HTML 35.7%Language:JavaScript 15.0%