glottologist
Version:
An easy to use translator library
141 lines (130 loc) • 6.08 kB
HTML
<html class="no-js" lang="">
<head>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<title>Glottologist</title>
<meta charset="UTF-8">
<link rel="alternate" hreflang="en-US" href="">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="apple-touch-icon" href="apple-touch-icon.png">
<meta name="description" content="A JavaScript translation framework">
<meta name="keywords" content="JavaScript, framework, displayjs, display.js, arguiot, frontend, translation, translate, language">
<meta name="author" content="Arthur Guiot">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="twitter:card" content="summary_large_image">
<!-- twitter -->
<meta name="twitter:site" content="@arthur_guiot">
<meta name="twitter:creator" content="@arthur_guiot">
<meta name="twitter:title" content="Glottologist">
<meta name="twitter:description" content="A JavaScript translation framework">
<meta name="twitter:image" content="img/Banner.jpg">
<!-- Open graph met atags -->
<meta property="og:title" content="Glottologist" />
<meta property="og:description" content="A JavaScript translation framework" />
<meta property="og:type" content="website" />
<meta property="og:url" content="https://glottologist.js.org" />
<meta property="og:image" content="img/Banner.jpg" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="manifest" href="site.webmanifest">
<link rel="apple-touch-icon" href="icon.png">
<!-- Place favicon.ico in the root directory -->
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/main.css">
</head>
<body>
<!--[if lte IE 9]>
<p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="https://browsehappy.com/">upgrade your browser</a> to improve your experience and security.</p>
<![endif]-->
<!-- Add your site or application content here -->
<div class="menu-icon">
<span class="menu-icon__line menu-icon__line-left"></span>
<span class="menu-icon__line"></span>
<span class="menu-icon__line menu-icon__line-right"></span>
</div>
<div class="nav">
<div class="nav__content">
<ul class="nav__list">
<li class="nav__list-item"><a href="https://github.com/arguiot/Glottologist" class="black">Github</a></li>
<li class="nav__list-item"><a href="https://github.com/arguiot/Glottologist/wiki" class="black" glot-model="docs">Docs</a></li>
<li class="nav__list-item"><a href="#install" class="black" glot-model="install">Install</a></li>
<li class="nav__list-item"><a href="mailto:arguiot@gmail.com" class="black" glot-model="contact">Contact</a></li>
</ul>
</div>
</div>
<div class="main">
<h1 class="head1" glot-model="head1">
<span class="white h-0">Glottologist is</span>
<span class="h-1">a JavaScript translation</span>
<span class="white h-3">
framework
</span>
</h1>
</div>
<article>
<section class="what">
<div class="text">
<h2 glot-model="what">What is it?</h2>
<p glot-model="what-content">
Glottologist is JavaScript framework that works in the browser (or on NodeJS). It will help you to provide a different version of your website, depending on the user language.
</p>
</div>
<div class="img">
<img src="img/hello/optimized.gif" alt="Hello in multiple languages" class="rounded">
</div>
</section>
<section class="productive">
<div class="img">
<img src="img/graph/optimized.gif" alt="Graph image" class="rounded">
</div>
<div class="text">
<h2 glot-model="productive">Stay productive</h2>
<p glot-model="productive-content">
With his well engineered functions, Glottologist will not destroy your already existing app/website. The philosophy behind Glottologist (and my other <a href="https://github.com/arguiot" class="blackline">projects</a>), is that you should only add,
not remove or refactorize the code. So, you'll be able to integrate Glottologist with each of your projects 😊.
</p>
</div>
</section>
<section class="install" id="install">
<div class="text">
<h2 glot-model="install">Installation</h2>
<p glot-model="install-content">
Glottologist is simple to install and setup. Here is how you install the browser and node version.
</p>
</div>
<div class="img" style="width: 30vw;">
<script src="https://gist.github.com/arguiot/86931a7e9255e5915338fd1f19a12a08.js"></script>
</div>
</section>
</article>
<footer>
<div class="love">Made with ❤️ by Arthur Guiot</div>
<div class="links">
<ul>
<li><a href="https://github.com/arguiot"><i class="fa fa-github" aria-hidden="true"></i></a></li>
<li><a href="https://twitter.com/arthur_guiot"><i class="fa fa-twitter" aria-hidden="true"></i></a></li>
<li><a href="https://codepen.io/arguiot"><i class="fa fa-codepen" aria-hidden="true"></i></a></li>
</ul>
</div>
<div class="copyright">Copyright © 2017 Arthur Guiot <br> All Rights Reserved.</div>
</footer>
<script src="js/vendor/modernizr-3.5.0.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/DisplayJS/2.1.1/display.min.js" integrity="sha256-Tzv6ekQ48/jsmly9eR9t/6VQheVZUXUFjNcZQW33hFE=" crossorigin="anonymous"></script>
<script src="https://unpkg.com/glottologist"></script>
<script src="js/plugins.js"></script>
<script src="js/main.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" />
<!-- Google Analytics: change UA-XXXXX-Y to be your site's ID. -->
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-109503398-1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag() {
dataLayer.push(arguments);
}
gtag('js', new Date());
gtag('config', 'UA-109503398-1');
</script>
</body>
</html>