From 65bbccb566a2aa9517d66532237805f0e52956de Mon Sep 17 00:00:00 2001 From: naveenkumar <114670411+naveenmac7@users.noreply.github.com> Date: Sat, 18 Mar 2023 12:16:40 +0530 Subject: [PATCH 1/2] Create index.html --- .../Buttons/Naveenkumar.s_21ECB07/index.html | 18 ++++++++++++++++++ 1 file changed, 18 insertions(+) create mode 100644 public/Buttons/Naveenkumar.s_21ECB07/index.html diff --git a/public/Buttons/Naveenkumar.s_21ECB07/index.html b/public/Buttons/Naveenkumar.s_21ECB07/index.html new file mode 100644 index 000000000..2d553688d --- /dev/null +++ b/public/Buttons/Naveenkumar.s_21ECB07/index.html @@ -0,0 +1,18 @@ + + + + + + + Animation Button + + + +

Animation Button

+
+
+ Click here +
+
+ + From 6aa2f0ec01682839af8709d0a6a92af1f0ca897d Mon Sep 17 00:00:00 2001 From: naveenkumar <114670411+naveenmac7@users.noreply.github.com> Date: Sat, 18 Mar 2023 12:17:23 +0530 Subject: [PATCH 2/2] Create style.css --- .../Buttons/Naveenkumar.s_21ECB07/style.css | 54 +++++++++++++++++++ 1 file changed, 54 insertions(+) create mode 100644 public/Buttons/Naveenkumar.s_21ECB07/style.css diff --git a/public/Buttons/Naveenkumar.s_21ECB07/style.css b/public/Buttons/Naveenkumar.s_21ECB07/style.css new file mode 100644 index 000000000..761171bd9 --- /dev/null +++ b/public/Buttons/Naveenkumar.s_21ECB07/style.css @@ -0,0 +1,54 @@ +.button{ + position:relative; + display:inline-block; + margin:20px; + } + + .button a{ + color:white; + font-family:Helvetica, sans-serif; + font-weight:bold; + font-size:36px; + text-align: center; + text-decoration:none; + background-color:#FFA12B; + display:block; + position:relative; + padding:20px 40px; + + -webkit-tap-highlight-color: rgba(0, 0, 0, 0); + text-shadow: 0px 1px 0px #000; + filter: dropshadow(color=#000, offx=0px, offy=1px); + + -webkit-box-shadow:inset 0 1px 0 #FFE5C4, 0 10px 0 #915100; + -moz-box-shadow:inset 0 1px 0 #FFE5C4, 0 10px 0 #915100; + box-shadow:inset 0 1px 0 #FFE5C4, 0 10px 0 #915100; + + -webkit-border-radius: 5px; + -moz-border-radius: 5px; + border-radius: 5px; + } + + .button a:active{ + top:10px; + background-color:#F78900; + + -webkit-box-shadow:inset 0 1px 0 #FFE5C4, inset 0 -3px 0 #915100; + -moz-box-shadow:inset 0 1px 0 #FFE5C4, inset 0 -3pxpx 0 #915100; + box-shadow:inset 0 1px 0 #FFE5C4, inset 0 -3px 0 #915100; + } + + .button:after{ + content:""; + height:100%; + width:100%; + padding:4px; + position: absolute; + bottom:-15px; + left:-4px; + z-index:-1; + background-color:#2B1800; + -webkit-border-radius: 5px; + -moz-border-radius: 5px; + border-radius: 5px; + }