-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
137 lines (131 loc) · 9.02 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
<html>
<head>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-135256973-1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-135256973-1');
</script>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="description" content="Vue Virtual Keyboard - Customizable, reponsive, lightweight. Screen keyboard for Vue projects, Available on Github and NPM.">
<meta name="author" content="Francisco Hodge">
<link rel="apple-touch-icon" sizes="57x57" href="../assets/img/ico/apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="../assets/img/ico/apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="../assets/img/ico/apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="../assets/img/ico/apple-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="../assets/img/ico/apple-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="../assets/img/ico/apple-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="../assets/img/ico/apple-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="../assets/img/ico/apple-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="../assets/img/ico/apple-icon-180x180.png">
<link rel="icon" type="image/png" sizes="192x192" href="../assets/img/ico/android-icon-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="../assets/img/ico/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="../assets/img/ico/favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="../assets/img/ico/favicon-16x16.png">
<link rel="manifest" href="../assets/img/ico/manifest.json">
<meta name="msapplication-TileColor" content="#ffffff">
<meta name="msapplication-TileImage" content="/ms-icon-144x144.png">
<meta name="theme-color" content="#ffffff">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="mobile-web-app-capable" content="yes">
<title>Simple-keyboard - The Modern Virtual Keyboard for Vue</title>
<meta property="og:title" content="Simple-keyboard - Vue Virtual Keyboard">
<meta property="og:description" content="Vue Virtual Keyboard - Customizable, reponsive, lightweight. Screen keyboard for Vue projects, Available on Github and NPM.">
<meta name="twitter:card" content="summary_large_image">
<meta property="og:image" content="https://franciscohodge.com/project-pages/simple-keyboard/images/simple-keyboard-bn.png">
<meta property="og:url" content="https://virtual-keyboard.js.org">
<meta property="og:site_name" content="simple-keyboard">
<meta name="twitter:image:alt" content="Simple-keyboard">
<link rel="stylesheet" href="../assets/css/fonts.css" />
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/simple-keyboard@latest/build/css/index.css">
<link rel="stylesheet" href="../assets/css/main.css" />
<link rel="stylesheet" href="custom.css" />
<link href="https://virtual-keyboard.js.org/assets/css/twemoji-awesome.css" rel="stylesheet">
<noscript>
<link rel="stylesheet" href="../assets/css/noscript.css" />
</noscript>
</head>
<body class="is-preload">
<!-- Wrapper -->
<div id="wrapper">
<div class="left-content">
<div class="intro-content">
<h1>simple-keyboard</h1>
<p>The modern virtual keyboard for Vue.<br />
<span class="tagSndLine">Customizable. Responsive. Lightweight.</p>
<div class="qDemo">
<div class="keyboardContainer">
<div class="simple-keyboard"></div>
</div>
</div>
<div class="btnContainer">
<a href="https://simple-keyboard.com/demo" target="_blank" class="button github">
<span>View Demos</span>
</a>
<a href="https://simple-keyboard.com/getting-started/" class="button github">
<span>Documentation</span>
</a>
</div>
</div>
</div>
<div class="right-content">
<div class="content-detail">
<div class="content-block">
<p>Simple-keyboard is a <strong>fast</strong>, <strong>dependency-free</strong> and <strong>customizable</strong> virtual keyboard for rich and snappy web applications.</p> </div>
<div class="content-block">
<h2><i class="twa twa-heart"></i> Features</h2>
<ul class="ul-features">
<li>Supports Vue without the need for extra plugins.</li>
<li>Many options and methods to enhance customization.</li>
<li>Flex-box layout for easy styling.</li>
<li>Supports Modules such as Autocorrect, Input Mask, among others.</li>
<li>Ability to style a group of buttons independently, for advanced layouts.</li>
<li>Great for all types of apps (Kiosks, gamepad-controlled apps, etc).</li>
<li>Multi-keyboard instance support.</li>
<li>Ready to use implementation demos.</li>
<li>And more.</li>
</ul>
</div>
<div class="content-block">
<h2><i class="twa twa-stars"></i> Supported Languages</h2>
<ul class="ul-lang">
<li><a href="https://franciscohodge.com/projects/simple-keyboard/demo-showcase/languages/arabic/">Arabic</a></li>
<li><a href="https://franciscohodge.com/projects/simple-keyboard/demo-showcase/languages/burmese/">Burmese</a></li>
<li><a href="https://franciscohodge.com/projects/simple-keyboard/demo-showcase/languages/chinese/">Chinese</a></li>
<li><a href="https://franciscohodge.com/projects/simple-keyboard/demo-showcase/languages/czech/">Czech</a></li>
<li><a href="https://franciscohodge.com/projects/simple-keyboard/demo-showcase/languages/">English</a></li>
<li><a href="https://franciscohodge.com/projects/simple-keyboard/demo-showcase/languages/french/">French</a></li>
<li><a href="https://franciscohodge.com/projects/simple-keyboard/demo-showcase/languages/georgian/">Georgian</a></li>
<li><a href="https://franciscohodge.com/projects/simple-keyboard/demo-showcase/languages/german/">German</a></li>
<li><a href="https://franciscohodge.com/projects/simple-keyboard/demo-showcase/languages/hebrew/">Hebrew</a></li>
<li><a href="https://franciscohodge.com/projects/simple-keyboard/demo-showcase/languages/hindi/">Hindi</a></li>
<li><a href="https://franciscohodge.com/projects/simple-keyboard/demo-showcase/languages/italian/">Italian</a></li>
<li><a href="https://franciscohodge.com/projects/simple-keyboard/demo-showcase/languages/japanese/">Japanese</a></li>
<li><a href="https://franciscohodge.com/projects/simple-keyboard/demo-showcase/languages/kannada/">Kannada</a></li>
<li><a href="https://franciscohodge.com/projects/simple-keyboard/demo-showcase/languages/korean/">Korean</a></li>
<li><a href="https://franciscohodge.com/projects/simple-keyboard/demo-showcase/languages/russian/">Russian</a></li>
<li><a href="https://franciscohodge.com/projects/simple-keyboard/demo-showcase/languages/sindhi/">Sindhi</a></li>
<li><a href="https://franciscohodge.com/projects/simple-keyboard/demo-showcase/languages/spanish/">Spanish</a></li>
<li><a href="https://franciscohodge.com/projects/simple-keyboard/demo-showcase/languages/thai/">Thai</a></li>
<li><a href="https://franciscohodge.com/projects/simple-keyboard/demo-showcase/languages/turkish/">Turkish</a></li>
<li><a href="https://franciscohodge.com/projects/simple-keyboard/demo-showcase/languages/ukrainian/">Ukrainian</a></li>
<li><a href="https://franciscohodge.com/projects/simple-keyboard/demo-showcase/languages/urdu/">Urdu</a></li>
</ul>
</div>
</div>
<div class="fundzone">
<iframe class="spo-widget" title="Sponsor Widget" src="../assets/html/sponsor.html" width="335" height="125"></iframe>
</div>
</div>
</div>
<!-- Scripts -->
<script src="https://cdn.jsdelivr.net/npm/simple-keyboard@latest/build/index.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/2/twemoji.min.js" crossorigin="anonymous"></script>
<script src="../assets/js/jquery.min.js"></script>
<script src="../assets/js/main.js"></script>
</body>
</html>