Ts drawer button (#1512)

* Added spiderman animation for hacktober

* added readme

* Update readme.md

* Update readme.md

* Made card-overlay relative and renamed audio file

* Renamed audio file

* Changed image + updated readme and html template

* Create html_template.html

* Create html_template.html

* Create style.css

* Create readme.md

* Delete Service Portal Widgets/html_template.html

---------

Co-authored-by: Sharma <[email protected]>

Author: stwinkle

Service Portal Widgets/Drawer Buttons/html_template.html

@@ -0,0 +1,6 @@
+<!--drawer buttons-->
+<div id="escButtons" >
+  <a href="#" id="policies">Policies</a>
+  <a href="#" id="divisions">Divisions</a>
+  <a href="#" id="contact">Contact</a>
+</div>

Service Portal Widgets/Drawer Buttons/readme.md

@@ -0,0 +1,11 @@
+To use this widget, follow the below steps:
+
+1. Create a new widget and copy the html, style in the widget.
+2. Add the widget on the homepage .
+4. Change the width and placement according to your need.
+
+
+Here is Page Content structure
+
+<img width="326" alt="image" src="https://github.com/user-attachments/assets/5fe8fcb7-858c-431a-91f9-5e31537c656d">
+

Service Portal Widgets/Drawer Buttons/style.css

@@ -0,0 +1,35 @@
+
+//css for styling of all the buttons
+#escButtons a {
+  position: absolute;
+  right: -90px;
+  transition: 0.3s;
+  border:2px solid white;
+  border-radius: 20px;
+  padding: 12px;
+  width: 140px;
+  font-size: 20px;
+  color: white;
+  
+}
+//css for hover on the buttons
+#escButtons a:hover {
+  right: 0;
+  border:3px solid #fc0366;
+  color:#fc0366;
+}
+//css for button policies
+#policies {
+  top: 20px;
+  background-color: #9bf542;
+}
+//css for button divisions
+#divisions {
+  top: 80px;
+  background-color: #2577db;
+}
+//css for button contact
+#contact {
+  top: 140px;
+  background-color:#fcdb03;
+}