summaryrefslogtreecommitdiffstats
path: root/admin/survey/modules/mod_WPN/frontend/index.html
blob: 1b5c4a9a64137a831fc0dd99f4a04e995f97b339 (plain) (blame)
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
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
<!doctype html>
<html lang="en-us">

    <head>

        <!-- Meta -->
        <meta charset="utf-8">
        <meta http-equiv="x-ua-compatible" content="ie=edge">
        <meta name="viewport" content="width=device-width,initial-scale=1">

        <title>1KA WPN</title>
        <meta name="description" content="">

        <!-- The compiled CSS file -->
        <link rel="stylesheet" href="admin/survey/modules/mod_WPN/frontend/css/production.css">

        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
        
        <!-- Web fonts -->
        <link href="https://fonts.googleapis.com/css?family=Montserrat:400,400i,700|Source+Serif+Pro:700" rel="stylesheet"> 

        <!-- favicon.ico. Place these in the root directory. -->
        <link rel="shortcut icon" href="favicon.ico">
        
        <link rel="apple-touch-icon" sizes="180x180" href="apple-touch-icon.png">
        <link rel="icon" type="image/png" sizes="32x32" href="favicon-32x32.png">
        <link rel="icon" type="image/png" sizes="16x16" href="favicon-16x16.png">
        <link rel="manifest" href="manifest.json">
        <link rel="mask-icon" href="safari-pinned-tab.svg" color="#ffffff">
        <meta name="msapplication-TileColor" content="#da532c">
        <meta name="theme-color" content="#ffffff">
        <meta name="apple-moblile-web-app-capable" content="yes">
        <meta name="apple-moblile-web-app-status-bar-style" content="default">
        <link rel="apple-touch-startup-image" href="apple-touch-icon.png">
        <!-- iOS Splash Screen Images -->
        <link rel="apple-touch-startup-image" href="apple-splash-640.png" media="(device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)">
        <link rel="apple-touch-startup-image" href="apple-splash-750.png" media="(device-width: 375px) and (device-height: 667px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)">
        <link rel="apple-touch-startup-image" href="apple-splash-1242.png" media="(device-width: 414px) and (device-height: 736px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)">
        <link rel="apple-touch-startup-image" href="apple-splash-1125.png" media="(device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)">
        <link rel="apple-touch-startup-image" href="apple-splash-1536.png" media="(min-device-width: 768px) and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait)">
        <link rel="apple-touch-startup-image" href="apple-splash-1668.png" media="(min-device-width: 834px) and (max-device-width: 834px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait)">
        <link rel="apple-touch-startup-image" href="apple-splash-2048.png" media="(min-device-width: 1024px) and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait)">
     
    </head>

    <body>


    <!-- Header -->
    <header class="align--center pt3">
        <div class="container--lg border--bottom pb3">
            <img class="logo mb3" src="admin/survey/modules/mod_WPN/frontend/img/1ka_logo_en.png" alt="1KA">
            <div id="notif_join_div" style="display: none;">
                <button class="mb2 btn btn--secondary" id="notif_join_button" onclick="clickButtonSubscribe();" style="font-size: 1.5em;">Join us!</button>
                <br><br>
                <div id="notification_permission_warning" style="display: none;">
                    <h3 class="mb2" style="color:red">In order to use our services, you have to enable notifications</h3>
                    <br><br>
                </div>
                <h1 class="mb2">Be first to know when new surveys are up!</h1>
            </div>
            <div id="notif_joined_div" style="display: none;">
                <h1 class="mb2">You are in!</h1>
                <p class="mb2">You will be among first who will get notifications when new surveys are up!</p>
            </div>
            <div id="notif_not_supported_div" style="display: none;">
                <h1 class="mb2">This browser does not support our services!</h1>
                <p class="mb2">Please update your browser or use another (latest versions of Chrome and Firefox are recommended)</p>
            </div>
            <!--<span>
                <a href="https://www.apple.com/ios/app-store/" class="link"><img class="download" src="/pwa/img/ios.png" alt="Download on the App Store"></a>
            </span>
            <span>
                <a href="https://play.google.com/store" class="link"><img class="download" src="/pwa/img/googleplay.png" alt="Download on Google Play"></a>
            </span>-->
        </div>
    </header>

    <main>
        <!-- Feature list -->
        <div class="container pt3 mt2 text--gray align--center">
            <p class="mb3">Efficient data gathering.</p>
            <div class="grid-row">
                <div class="grid-column span-one-third mb3">
                    <img class="illustration--small mb1" src="admin/survey/modules/mod_WPN/frontend/img/messaging.svg" alt="Fast messaging">
                    <p>Fast messaging</p>
                </div>
                <div class="grid-column span-one-third mb3">
                    <img class="illustration--small mb1" src="admin/survey/modules/mod_WPN/frontend/img/assign.svg" alt="Assign to others">
                    <p>Assign to others</p>
                </div>
                <div class="grid-column span-one-third mb3">
                    <img class="illustration--small mb1" src="admin/survey/modules/mod_WPN/frontend/img/connected.svg" alt="Stay connected">
                    <p>Stay connected</p>
                </div>
                <!-- <div class="grid-column span-one-third mb3">
                    <img class="illustration--small mb1" src="img/search.svg" alt="Powerful search">
                    <p>Powerful search</p>
                </div>
                <div class="grid-column span-one-third mb3">
                    <img class="illustration--small mb1" src="img/vault.svg" alt="Put in a vault">
                    <p>Put in a vault</p>
                </div>-->
                <!-- <div class="grid-column span-one-third mb3">
                    <img class="illustration--small mb1" src="img/mail.svg" alt="Share with others">
                    <p>Share with others</p>
                </div>-->
            </div>
        </div>

        <!-- Focus -->
        <div class="container--lg pt1 pb1">

            <div class="grid-row grid-row--center">
                <div class="grid-column mt3 mb2 order-2">
                    <div class="border--bottom pb2 mb2">
                        <h2>Usage data</h2>
                        <p>Quis istud possit, inquit, negare? Videamus animi partes, quarum est conspectus illustrior; Illa sunt similia: hebes acies est cuipiam oculorum, corpore alius senescit; Non enim, si omnia non&nbsp;sequebatur.</p>
                    </div>
                    <p class="italic text--gray mb1">Quae quo sunt excelsiores, eo dant clariora indicia naturae. Causa autem fuit huc veniendi ut quosdam&nbsp;hinc.</p>
                    <p class="bold">Carry Andersen, COO at&nbsp;Stripe</p>
                </div>
                <div class="grid-column span-1"></div>
                <div class="grid-column mt3 mb2 order-1">
                    <img src="admin/survey/modules/mod_WPN/frontend/img/data.svg" alt="Usage data">
                </div>
            </div>

            <div class="grid-row grid-row--center">
                <div class="grid-column mt3 mb2">
                    <img src="admin/survey/modules/mod_WPN/frontend/img/security.svg" alt="Absolute security">
                </div>
                <div class="grid-column span-1"></div>
                <div class="grid-column mt3 mb2">
                    <div class="border--bottom pb2 mb2">
                        <h2>Absolute security</h2>
                        <p>Itaque his sapiens semper vacabit. Qualis ista philosophia est, quae non interitum afferat pravitatis, sed sit contenta mediocritate vitiorum? Quid de Platone aut de Democrito loquar? Quis istud possit, inquit&nbsp;negare?</p>
                    </div>
                    <p class="italic text--gray mb1">Estne, quaeso, inquam, sitienti in bibendo voluptas? Duo Reges: constructio&nbsp;interrete.</p>
                    <p class="bold">Josh Blenton, Product Manager at&nbsp;Blinkist</p>
                </div>
            </div>

        </div>

        <!-- Mentioned -->
        <!--<div class="container--lg pt3 pb3 mb2 align--center">
            <p class="mb2">Mentioned in</p>
            <span><img class="mentioned" src="img/mentioned.svg" alt="New York Times, TC, Product Hunt, Recode"></span>
        </div>-->

        <!-- CTA -->
        <!--<div class="bg--dark-gray align--center pt3 pb3">
            <div class="container pt2 pb2">
                <img class="cta-image mb2" src="img/text.svg" alt="Text the app">
                <p class="h3 text--white mb1 bold">We'll text you the&nbsp;app</p>
                <p class="text--white mb3">Just insert your number below. Messaging rates&nbsp;apply.</p>
                <div class="inline-block mr1 no-mr-on-mobile" style="width:280px;max-width:100%">
                    <input class="form-control" type="tel" placeholder="Phone number">
                </div>
                <button class="btn btn--secondary">Send</button>
            </div>
        </div>-->

    </main>

    <!-- Footer -->
    <footer class="pt1 pb3 align--center-on-mobile">
        <!--<div class="container">
            <div class="grid-row">
                <div class="grid-column mt2 span-half">
                    <div class="mb1">
                        <span>
                            <a href="https://www.apple.com/ios/app-store/" class="link"><img class="download" src="img/ios.png" alt="Download on the App Store"></a>
                        </span>
                        <span>
                            <a href="https://play.google.com/store" class="link"><img class="download" src="img/googleplay.png" alt="Download on Google Play"></a>
                        </span>
                    </div>
                    <p class="small">Design by <a href="https://www.eatapapaya.com" class="link link--text">Papaya</a>. Illustrations from&nbsp;<a href="https://undraw.co/" class="link link--text">Undraw</a>.</p>
                </div>
                <div class="grid-column mt2 span-half align--right align--center-on-mobile">
                    <ul class="no-bullets list--inline">
                        <li class="mr1"><a href="" class="link"><img class="icon" src="img/youtube.svg" alt="YouTube"></a></li>
                        <li class="mr1"><a href="" class="link"><img class="icon" src="img/twitter.svg" alt="Twitter"></a></li>
                        <li><a href="" class="link"><img class="icon" src="img/facebook.svg" alt="Facebook"></a></li>
                    </ul>
                </div>
            </div>
        </div>-->
    </footer>

    <script src="admin/survey/modules/mod_WPN/frontend/js/main.js"></script>
    </body>
</html>