Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/sergeiown/beetrooteducationlesson09extra

Weather forecast
https://github.com/sergeiown/beetrooteducationlesson09extra

css3 figma forecast html5

Last synced: about 1 month ago
JSON representation

Weather forecast

Awesome Lists containing this project

README

        

# BeetRootEducation

_LMS Beetroot Academy progress_

### TASK

Using different values of the display property and indents, make a "Weather Forecast" layout. The link to the layout in Figma is [here.](https://www.figma.com/file/jOwCkDn0vbTi5e7AXa4dCk/Weather-Fortcast)

**Requirements:**

- Cities are a list
- DO NOT USE FLOAT FLEX GRID!
- To place cities in the "grid" use display: inline-block;
- The width of each item should be a percentage (for example: width: 50%)
- For the effect of changing transparency, use :hover and opacity
- Icons - [link](https://erikflowers.github.io/weather-icons/)
- For smooth animations, use CSS code: `*{transition: all .1s ease-in;}`

![image](https://user-images.githubusercontent.com/112722061/222791258-200843aa-d697-4dd5-91fa-d08bad0daa0b.png)