-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
125 lines (124 loc) · 5.57 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
---
layout: default
---
<!-- Hero unit -->
<div class="hero">
<div class="hero__overlay hero__overlay--gradient"></div>
<div class="hero__mask"></div>
<div class="hero__inner">
<div class="container">
<div class="hero__content">
<div class="hero__content__inner" id='navConverter'>
<h1 class="hero__title">Warn your users against Self-XSS attacks</h1>
<p class="hero__text">SXW.js is an open-source javascript library that is used to display
warnings in user console. Warn your users against Self XSS attacks and it's dangers.</p>
<a href="/docs/installation.html" class="button button__accent">Get Started</a>
<a href="https://github.com/sxwjs/sxwjs" target="_blank" rel="noopener" class="button hero__button">View on
GitHub</a>
</div>
</div>
</div>
</div>
</div>
<div class="hero__sub">
<span id="scrollToNext" class="scroll">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
class='hero__sub__down' fill="currentColor" width="512px" height="512px" viewBox="0 0 512 512"
style="enable-background:new 0 0 512 512;" xml:space="preserve">
<path
d="M256,298.3L256,298.3L256,298.3l174.2-167.2c4.3-4.2,11.4-4.1,15.8,0.2l30.6,29.9c4.4,4.3,4.5,11.3,0.2,15.5L264.1,380.9c-2.2,2.2-5.2,3.2-8.1,3c-3,0.1-5.9-0.9-8.1-3L35.2,176.7c-4.3-4.2-4.2-11.2,0.2-15.5L66,131.3c4.4-4.3,11.5-4.4,15.8-0.2L256,298.3z" />
</svg>
</span>
</div>
<!-- Steps -->
<div class="steps landing__section">
<div class="container">
<h2>Why use SXW.js?</h2>
<p>Here's why using SXW.js is a good choice for your website.</p>
</div>
<div class="container">
<div class="steps__inner">
<div class="step">
<div class="step__media">
<img src="/assets/images/undraw_code_review.svg" class="step__image">
</div>
<h4>Open Source</h4>
<p class="step__text">Sxw.js is fully open source and you can inspect the source code in GitHub.</p>
</div>
<div class="step">
<div class="step__media">
<img src="/assets/images/undraw_web_devices.svg" class="step__image">
</div>
<h4>UMD specification</h4>
<p class="step__text">SXW.js follows "Universal Module Definition" to ensure that it works
everywhere.</p>
</div>
<div class="step">
<div class="step__media">
<img src="/assets/images/undraw_creation.svg" class="step__image">
</div>
<h4>Customizable</h4>
<p class="step__text">All of the data used in SXW.js are stored in config variables making it easier
to
customize.</p>
</div>
</div>
</div>
</div>
<!-- Expanded sections -->
<div class="expanded landing__section">
<div class="container">
<div class="expanded__inner">
<div class="expanded__media">
<img src="/assets/images/undraw_Security_on.svg" class="expanded__image">
</div>
<div class="expanded__content">
<h2 class="expanded__title">Prevention is better than cure</h2>
<p class="expanded__text">Warn your users about the potential dangers behind running unknown code in
the browser console. Stop Self-XSS attacks before they happen. Prevent malicious persons from
accessing user data.</p>
</div>
</div>
</div>
</div>
<div class="expanded landing__section">
<div class="container">
<div class="expanded__inner">
<div class="expanded__media">
<img src="/assets/images/undraw_hacker_mind.svg" class="expanded__image">
</div>
<div class="expanded__content">
<h2 class="expanded__title">Know your attackers</h2>
<p class="expanded__text">Use SXW.js to educate users about reporting Self-XSS attacks. Make use of
the custom messages config to display your support email or reporting website and obtain info on
attackers.</p>
</div>
</div>
</div>
</div>
<div class="expanded landing__section">
<div class="container">
<div class="expanded__inner">
<div class="expanded__media">
<img src="/assets/images/undraw_frameworks.svg" class="expanded__image">
</div>
<div class="expanded__content">
<h2 class="expanded__title">Framework agnostic. Your front-end setup, your choice.</h2>
<p class="expanded__text">SXW.js has zero dependencies and uses vanilla JavaScript for a few
functions with a minimal footprint. You can use React, Angular, Vue, jQuery or whatever you
prefer.</p>
</div>
</div>
</div>
</div>
<!-- Call To Action -->
<div class="cta cta--reverse">
<div class="container">
<div class="cta__inner">
<h2 class="cta__title">Learn more</h2>
<p class="cta__sub cta__sub--center">See the documentation to know more about the library and how to use it.
</p>
<a href="./docs/installation.html" class="button button__accent">View documentaion</a>
</div>
</div>
</div>