165 lines
8.0 KiB
HTML
165 lines
8.0 KiB
HTML
<!doctype html>
|
|
<html class="no-js" lang="">
|
|
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>WorkAdventu.re</title>
|
|
|
|
<link rel="stylesheet" href="main.css">
|
|
<script src="bundle.js"></script>
|
|
<script>
|
|
function startGame() {
|
|
let playUrl = window.location.protocol + "//play."+window.location.host;
|
|
window.location.assign(playUrl);
|
|
}
|
|
</script>
|
|
</head>
|
|
|
|
<body>
|
|
<header>
|
|
<div class="container-lg section">
|
|
<div class="over-image">
|
|
<div class="row">
|
|
<div class="col-6 col-md-6 my-3 my-md-0">
|
|
<div class="logo">
|
|
<img src="static/images/logo.png">
|
|
</div>
|
|
</div>
|
|
<div class="col-6 col-md-6 my-3 my-md-0">
|
|
<div class="social-links">
|
|
Share your experience
|
|
<a href="https://www.facebook.com/sharer/sharer.php?u=http://workadventu.re/" target="_BLANK">
|
|
<img class="social-image" src="static/images/facebook.png" />
|
|
</a>
|
|
<a href="https://www.linkedin.com/shareArticle?mini=true&url=http://workadventu.re/&title=&summary=Discover a pixelated new world and start a casual conversation !&source=TheCodingMachine" target="_BLANK">
|
|
<img class="social-image" src="static/images/linkedin.png" />
|
|
</a>
|
|
<a href="https://twitter.com/home?status=http://workadventu.re/ Discover a pixelated new world and start a casual conversation !" target="_BLANK">
|
|
<img class="social-image" src="static/images/twitter.png" />
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="title text-center">
|
|
<h1>Your workplace<br/>but better</h1>
|
|
<h2>Discover a pixelated new world !</h2>
|
|
<h3>Start a casual conversation</h3>
|
|
</div>
|
|
<div class="row justify-content-md-center pt-5" style="margin-top: 100px;">
|
|
<div class="col col-lg-3">
|
|
<a class="custom-link contribute" target="_BLANK" href="https://github.com/thecodingmachine/workadventure" title="CONTRIBUTE !">CONTRIBUTE
|
|
</a>
|
|
</div>
|
|
<div class="col col-lg-3">
|
|
<a class="custom-link start" href="#" title="START !" onclick="startGame()">
|
|
START !
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="clouds">
|
|
<div class="cloud"></div>
|
|
</div>
|
|
</header>
|
|
<div class="section bg-white how-to">
|
|
<div class="container-fluid container-lg">
|
|
<div class="row justify-content-md-center">
|
|
<div class="col-12 col-md-4 text-center my-3 my-md-0">
|
|
<div class="image-item">
|
|
<h2>Choose your map</h2>
|
|
<div class="step-image"><img src="static/images/Bitmap3.png"></div>
|
|
</div>
|
|
</div>
|
|
<div class="col-12 col-md-4 text-center my-3 my-md-0">
|
|
<div class="image-item">
|
|
<h2>Select your character</h2>
|
|
<div class="step-image"><img src="static/images/Bitmap2.png"></div>
|
|
</div>
|
|
</div>
|
|
<div class="col-12 col-md-4 text-center my-3 my-md-0">
|
|
<div class="image-item">
|
|
<h2>Let's go explore and talk !</h2>
|
|
<div class="step-image"><img src="static/images/bitmap.png"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="section bg-white">
|
|
<div class="container-fluid container-lg">
|
|
<div class="col-12 credits">
|
|
<h2>Credits</h2>
|
|
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
|
|
<p>Sed ultrices finibus lacus a scelerisque. Mauris non tellus blandit, pulvinar ipsum ac, bibendum ligula. Ut enim est, posuere sit amet nunc nec, vestibulum iaculis est. Cras nec nunc tempor, ultricies felis eget, elementum augue. Nam id gravida erat. Cras vel ligula hendrerit, euismod nulla vestibulum, vulputate tortor. Mauris convallis cursus leo, vitae consectetur magna mollis at.</p>
|
|
<p>
|
|
Donec cursus mauris mi, non porttitor neque auctor eget. Pellentesque mi orci, imperdiet vitae malesuada at, sollicitudin vitae justo. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Mauris et cursus enim. Cras viverra lorem in sem hendrerit tempus. Praesent dignissim volutpat lorem, id dapibus turpis placerat eget.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="bg-gray section used-by">
|
|
<div class="container-fluid container-lg">
|
|
<h2 class="text-center pb-4">THEY MAY APPROVE</h2>
|
|
<div class="row justify-content-md-center align-items-center">
|
|
<div class="col col-md-auto">
|
|
<img src="static/images/atari.png">
|
|
</div>
|
|
<div class="col col-md-auto">
|
|
<img src="static/images/super-nintendo.png">
|
|
</div>
|
|
<div class="col col-md-auto">
|
|
<img src="static/images/amstrad.png">
|
|
</div>
|
|
<div class="col col-md-auto">
|
|
<img src="static/images/sinclair-2.png">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="container-fluid container-lg section quotes">
|
|
<h2 class="text-center">Why they loved Work Adventure</h2>
|
|
<div class="row justify-content-center">
|
|
<div class="col-12 col-md-9">
|
|
<div class="quote-item">
|
|
<p class="quote">« Since I see life in 32px, I think I feel happier. »</p>
|
|
<p class="author">Donald, Whashington DC</p>
|
|
</div>
|
|
<div class="quote-item">
|
|
<p class="quote">« For me, who hates hugs, I can't live without it... »</p>
|
|
<p class="author">Anna, New York City</p>
|
|
</div>
|
|
<div class="quote-item">
|
|
<p class="quote">« Par webcam les gens ne me font plus de réflexion sur mes cheveux. Trop cool ! »</p>
|
|
<p class="author">Kim. Pyongyang</p>
|
|
</div>
|
|
<div class="quote-item">
|
|
<p class="quote">« Since it's fun, I scare my colleagues a little less. »</p>
|
|
<p class="author">Emmanuel. France</p>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
<div class="bg-white footer">
|
|
<div class="container-fluid container-lg">
|
|
<div class="row">
|
|
<div class="col-6 col-md-6 my-3 my-md-0">
|
|
<a href="https://www.thecodingmachine.com/" target="_blank"><img src="static/images/Logo TCM.png"></a>
|
|
</div>
|
|
<div class="col-6 col-md-6 my-3 my-md-0 floppy">
|
|
<img src="static/images/floppy.png" />
|
|
<div>Soon available on floppy !<br/><span>otherwise it's open source and on <a href="https://github.com/thecodingmachine/workadventure" target="_BLANK">GitHub</a></span></div>
|
|
</div>
|
|
</div>
|
|
<div class="container-fluid container-lg">
|
|
<div class="row text-center">
|
|
<div style="width: 100%;color:#afafaf;margin-top: 25px;">TheCodingMachine - All Rights Reserved</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
|
|
</html>
|