Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/sergeiown/beetrooteducationlesson14
Positioning and Transformation
https://github.com/sergeiown/beetrooteducationlesson14
css3 figma html5 layout positioning transformation
Last synced: about 1 month ago
JSON representation
Positioning and Transformation
- Host: GitHub
- URL: https://github.com/sergeiown/beetrooteducationlesson14
- Owner: sergeiown
- Created: 2022-11-08T13:18:52.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2023-05-10T09:12:54.000Z (almost 2 years ago)
- Last Synced: 2024-11-11T03:36:18.256Z (3 months ago)
- Topics: css3, figma, html5, layout, positioning, transformation
- Language: HTML
- Homepage: https://sergeiown.github.io/BeetRootEducationLesson14/
- Size: 225 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: readme.md
Awesome Lists containing this project
README
# BeetRootEducation
_LMS Beetroot Academy progress_
### TASKS
**Required:**
- Make a page [Documentation.](https://www.figma.com/file/FP2fHfIElPk4J42DYQGuMw/position-transform)
The page header should be fixed to the top
The sidebar should stick to the top when scrolling (position sticky)
The pattern (background image) should also stay in place (sticky) when scrolling this section**Extra:**
- Make a page [Who's using?](https://www.figma.com/file/FP2fHfIElPk4J42DYQGuMw/position-transform)
When hovering the card, the effect of turning it over and changing the gray side to black with the logo color changing should occur - [as in the post](https://www.w3schools.com/howto/howto_css_flip_card.asp)
![image](https://user-images.githubusercontent.com/112722061/222780959-63fac559-ab33-497b-8721-3f7a14b20b93.png)
![image](https://user-images.githubusercontent.com/112722061/222781080-7aab5b9f-02e5-4aad-80e3-a622875cfc2f.png)
![image](https://user-images.githubusercontent.com/112722061/222781275-f1c7d158-84b1-4eab-ad78-b079354d93dd.png)