-
Notifications
You must be signed in to change notification settings - Fork 2
/
Copy pathindex.html
149 lines (100 loc) · 6.94 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="style.css" type="text/css">
<script type="text/javascript" src="tBot.js"></script>
<link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet">
<script type="text/javascript" src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script>
<link href="https://fonts.googleapis.com/css?family=Roboto|Signika:300,600" rel="stylesheet">
<title>TickyBot - Your Support Ticket Slack Bot</title>
<title>TickyBot</title>
<!-- Start of Nav Bar -->
<nav class="navBar">
<ul>
<li id="hoverhome"><a href="#home">Home</a></li>
<li id ="hoverabout"><a href="#about">About</a></li>
<li id ="hoverfeatures"><a href="#features">Features</a></li>
<li id ="hoveraddto"><a href="#addtoslack">Add to Slack</a></li>
</ul>
</div>
</nav>
<!-- End of Nav Bar -->
</head>
<body>
<div class="container">
<!–– Start of Header -->
<div id ="home" class="item item1 header flexEnd">
<div>
<div>
<div data-aos="flip-up" class="header1 headers logo"><h1><strong>Ticky</strong>Bot</h1></div>
<div data-aos="flip-up" class="header2 headers headline">Let your team manage their support tickets 100% inside Slack</div>
<!-- Button Start -->
<a class=btnA href="https://slack.com/oauth/authorize?client_id=39189849459.249480535796&scope=commands,bot,users%2Eprofile%3Aread,im%3Aread,chat%3Awrite%3Abot,team%3Aread"><div data-aos="flip-up" class="header3 headers"><img class="header3img" src="https://tickybott.herokuapp.com/5e594ad76535670e7f227f79c6b72799.svg"><span>Add To <strong>Slack</strong></span></div></a>
</div>
<!-- Button End -->
</div>
<div data-aos="fade-down" class="header4 headers robot"><div class="circle"> <img src=https://github.com/chingu-voyage5/Toucans-Team-8/blob/BDev/public/TB%20Robot.png?raw=true"></div></div>
</div>
<!–– End of Header -->
<!–– Start of What Is TickyBot -->
<div id="about" class="item item2 what">
<div data-aos="fade-down" class="what1 whats whattitle">What Is <strong>Ticky</strong>Bot<hr id="blueBreak1"></div>
<div data-aos="fade-right" class="what2 whats para1"><strong>Ticky</strong>Bot is a Slack Bot 🤖 that lets you use support tickets on Slack. This way, you don't need to leave your beloved channel to assist your users, if you don't feel like it.</div>
<div data-aos="fade-left" class="what3 whats para2">With <strong>Ticky</strong>Bot you can easily check if you've received new tickets, change their status, or write a reply, and the ticket will instantly update itself on our site.</div>
<div data-aos="fade-up" class="what4 whats para3"><p>Support requests shouldn't be handled through Slack's direct messages.</p>
Image about someone asking silly questions and the workplace admin asking him/her to open a support ticket so other admins could look into the issue.</div>
</div>
<!–– End of What Is TickyBot -->
<!–– Start of How It Works -->
<div id="features" class="item item3 how">
<div class="how1 hows howtitle">How It Works<hr class="breakit" id="blueBreak2"></div>
<!–– Start of How It Works "Cards" -->
<div data-aos="zoom-in" class="how2 hows howcard1">
<div class="card1image"><img class="cardImages" src=https://tickybott.herokuapp.com/5e294ff6045f826e1b4f452df8897fb8.svg></div>
<div class="card1text">You can add TickyBot to your Slack workplace by scrolling down or clicking here</div>
</div>
<div data-aos="zoom-in" class="how3 hows howcard2">
<div class="card2image"><img class="cardImages" src=data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pg0KPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgNTA4IDUwOCI+DQogIDxjaXJjbGUgc3R5bGU9ImZpbGw6IzU0QzFFQzsiIGN4PSIyNTQiIGN5PSIyNTQiIHI9IjI1NCIvPg0KICA8cGF0aCBzdHlsZT0iZmlsbDojMzI0QTVFOyIgZD0iTTE4NS4yLDE5MS42djEzMy4yYzAsNi40LDUuMiwxMS4yLDExLjIsMTEuMmgxMTEuMmw4MS42LDU2LjhMMzc0LjQsMzM2aDI2LjggYzYuNCwwLDExLjItNS4yLDExLjItMTEuMlYxOTEuNmMwLTYuNC01LjItMTEuMi0xMS4yLTExLjJIMTk2LjRDMTkwLDE4MC40LDE4NS4yLDE4NS4yLDE4NS4yLDE5MS42eiIvPg0KICA8cGF0aCBzdHlsZT0iZmlsbDojRkY3MDU1OyIgZD0iTTM2Ni40LDEyOC44djE1OC40YzAsNy42LTYsMTMuNi0xMy42LDEzLjZIMjIwLjRMMTIzLjIsMzY4bDE3LjYtNjcuNmgtMzJjLTcuNiwwLTEzLjYtNi0xMy42LTEzLjYgdi0xNThjMC03LjYsNi0xMy42LDEzLjYtMTMuNmgyNDRDMzYwLDExNS4yLDM2Ni40LDEyMS4yLDM2Ni40LDEyOC44eiIvPg0KICA8Zz4NCiAgPGNpcmNsZSBzdHlsZT0iZmlsbDojRTZFOUVFOyIgY3g9IjE1My42IiBjeT0iMjA4IiByPSIxOS42Ii8+DQogICAgPGNpcmNsZSBzdHlsZT0iZmlsbDojRTZFOUVFOyIgY3g9IjIzMC44IiBjeT0iMjA4IiByPSIxOS42Ii8+DQogICAgPGNpcmNsZSBzdHlsZT0iZmlsbDojRTZFOUVFOyIgY3g9IjMwNy42IiBjeT0iMjA4IiByPSIxOS42Ii8+DQogIDwvZz4NCjwvc3ZnPg0K></div>
<div class="card2text">Your users can open a ticket by typing /ticket and their message into the chat field</div>
</div>
<div data-aos="zoom-in"class="how4 hows howcard3">
<div class="card3image"><img class="cardImages" src=https://tickybott.herokuapp.com/61dc5059d07b210a9e0a7881695a8e03.svg></div>
<div class="card3text">Once you or another admin solved their problems you can type /ticket close #id to close the ticket</div>
</div>
</div>
<!–– End of How It Works -->
<!–– Start of Start Using TickyBot Today -->
<div id="addtoslack" class="item item4 start">
<div class="start1 starts starttitle">Start Using <strong>Ticky</strong>Bot Today</div>
<div class="start2 starts startblurb"><strong>Ticky</strong>Bot allows Slack teams to manage their support tickets 100% inside Slack, without having to switch between different apps.</div>
<div data-aos="flip-up" class="start3 starts startbutton">
<a id="btnatwo" class="btn" href="https://slack.com/oauth/authorize?client_id=39189849459.249480535796&scope=commands,bot,users%2Eprofile%3Aread,im%3Aread,chat%3Awrite%3Abot,team%3Aread">
<img id="btnTwoImg" src="https://tickybott.herokuapp.com/5e594ad76535670e7f227f79c6b72799.svg">
<span>Add to
<strong>Slack</strong>
</span>
</a>
</div>
<div class="start4 starts starttext">... so you don't need to go back and forth with another app.</div>
</div>
</div>
<!–– End of Start Using TickyBot Today -->
<!–– Footer -->
<div class="item item5 footer">
<div class="foot1 footers footline1">Made by Toucans Team 8</div>
<div class="foot2 footers footline2">Source code is available on our <a href="https://github.com/chingu-voyage5/Toucans-Team-8" target="_blank">GitHub page</a></div>
<div class="foot2 footers footline3">The app is not created by, affiliated with, or supported by Slack Technologies, Inc.</div>
</div>
</div>
<!–– End of Footer -->
</div>
<script src="tBot.js"></script>
<script>
AOS.init(1200);
</script>
</body>
</body>
</html>