summaryrefslogtreecommitdiff
path: root/public/index.php
blob: e3afcf7e85e2b8f42301f4fe5cbd4a9a6e79e32e (plain)
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
<?php
include_once $_SERVER['DOCUMENT_ROOT'] . '/../lib/partials.php';

$url = parse_url($_SERVER['REQUEST_URI']);

if (strlen($url['path']) > 2 && str_starts_with($url['path'], '/!')) {
    $page_id = substr($url['path'], 2);
    header("Location: /wiki.php?p=$page_id");
    exit();
}

?>
<html>

<head>
    <title>The Tinybot Project</title>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <link rel="stylesheet" href="/static/style.css">
    <link rel="shortcut icon" href="/static/favicon.ico" type="image/x-icon">
</head>

<body>
    <main>
        <?php html_navigation_bar() ?>

        <content class="gap-64">
            <!-- PROMO -->
            <section class="row justify-between align-center background-colorful border" style="border-radius:4px">
                <div class="row justify-center align-center img-gradient">
                    <img src="/static/img/brand/profile_picture.png" alt=""
                        style="border-top-left-radius:4px;border-bottom-left-radius:4px;">
                </div>
                <div class="column justify-end gap-8 p-16">
                    <h1 class="self-end text-right">Enhance your chat with the bot</h1>
                    <p class="self-end text-right">
                        A multi-utility Twitch chat bot that brings<br>
                        a lot of functionality into your chat.
                    </p>
                    <a href="/!join" class="self-end">
                        <button>Get the bot</button>
                    </a>
                </div>
            </section>

            <!-- BIG FEATURES -->
            <section class="features-box column gap-8">
                <div class="tab row justify-center align-center">
                    <h1>Features</h1>
                </div>
                <div class="content column gap-8">
                    <!-- STREAM NOTIFICATIONS -->
                    <section>
                        <div class="description">
                            <h1>Stream notifications</h1>
                            <p>A convenient way to keep track of streams on Twitch. Simply use the !event command to
                                create a notification in chat about an upcoming stream. To always be in the know, sign
                                up for notifications using the !notify command. Never miss a moment and enjoy your
                                streams on time! </p>
                        </div>
                        <div class="icon">
                            <img src="/static/img/features/live.gif" alt="">
                        </div>
                    </section>
                    <!-- EMOTE UPDATES -->
                    <section>
                        <div class="description">
                            <h1>Emote Updates</h1>
                            <p>
                                Instant updates on new changes to the emote set. The bot automatically notifies the chat
                                about new emotes, deletion of existing emotes, and changes in their names.<br>
                                For now only for 7TV.
                            </p>
                        </div>
                        <div class="icon">
                            <img src="/static/img/features/7tv.gif" alt="">
                        </div>
                    </section>
                    <!-- LUA CODING -->
                    <section>
                        <div class="description">
                            <h1>Lua coding</h1>
                            <p>
                                With !lua and !luaimport you can create your own logic for custom commands! It can be
                                another utility, a mini-game, or even a bot within a bot - only your imagination* limits
                                you. The coding awaits you today!
                            </p>
                        </div>
                        <div class="icon">
                            <img src="/static/img/features/lua.gif" alt="">
                        </div>
                    </section>
                </div>
            </section>

            <!-- SMALL FEATURES -->
            <section class="small-features grid-2 gap-32">
                <section>
                    <div class="icon">
                        <img src="/static/img/icons/bell.png" alt="">
                    </div>
                    <h2>&commat;everyone in your chat</h2>
                    <p>With the "!massping" command, moderators can quickly notify all participants by mentioning them
                        with an important message. </p>
                </section>
                <section>
                    <div class="icon">
                        <img src="/static/img/icons/keyboard.png" alt="">
                    </div>
                    <h2>No Ctrl&plus;Enter anymore</h2>
                    <p>In addition, the "!spam" command provides the ability to repeat a message the desired number of
                        times, which is useful for repetitive reminders or clarifications.</p>
                </section>
                <section>
                    <div class="icon">
                        <img src="/static/img/icons/clock.png" alt="">
                    </div>
                    <h2>Timers</h2>
                    <p>With the !timer command, you can set messages to be sent each interval. moderators can quickly
                        notify all participants by mentioning them with an important message. </p>
                </section>
                <section>
                    <div class="icon">
                        <img src="/static/img/icons/terminal.png" alt="">
                    </div>
                    <h2>Create your own commands</h2>
                    <p>The !cmd command allow the creation of personalized commands, which adds interactivity and
                        flexibility to communication by allowing channel owners to create their own commands. </p>
                </section>
            </section>
        </content>
    </main>

    <?php html_big_footer() ?>
</body>

</html>