From fe523aae4c68ae48b3129fb6d5ad6b3c5e17a891 Mon Sep 17 00:00:00 2001 From: Shreyans2004 <128773151+Shreyans2004@users.noreply.github.com> Date: Wed, 9 Aug 2023 16:37:04 +0000 Subject: [PATCH] Thumbs up animation added --- .../Thumps-up animation/index.html | 15 ++++++++ .../Thumps-up animation/styles.css | 38 +++++++++++++++++++ 2 files changed, 53 insertions(+) create mode 100644 Frontend-Projects/Thumps-up animation/index.html create mode 100644 Frontend-Projects/Thumps-up animation/styles.css diff --git a/Frontend-Projects/Thumps-up animation/index.html b/Frontend-Projects/Thumps-up animation/index.html new file mode 100644 index 0000000000..34b659e624 --- /dev/null +++ b/Frontend-Projects/Thumps-up animation/index.html @@ -0,0 +1,15 @@ + + + + + + + + Document + + + + +
+ + \ No newline at end of file diff --git a/Frontend-Projects/Thumps-up animation/styles.css b/Frontend-Projects/Thumps-up animation/styles.css new file mode 100644 index 0000000000..55cbb11315 --- /dev/null +++ b/Frontend-Projects/Thumps-up animation/styles.css @@ -0,0 +1,38 @@ +div{ + height:200px; + margin-left:50px; + margin-top:20px; + } + body{ + overflow: hidden; + background: linear-gradient( + 45deg, + #f09433 0%, + #e6683c 25%, + #dc2743 50%, + #cc2366 75%, + #bc1888 100% + );; + } + button{ + border:2px solid red; + background: linear-gradient( + 45deg, + #f09433 0%, + #e6683c 25%, + #dc2743 50%, + #cc2366 75%, + #bc1888 100% + ); + font-size: 90px; + width:200px; + height:200px; + border-radius: 250px; + color: white; + } + button:hover{ + transform:scale(1.3); + transform: rotateZ(360deg); + transition:1s; + color: blue; + } \ No newline at end of file