forked from workadventure/map-starter-kit
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge branch 'workadventure:master' into master
- Loading branch information
Showing
11 changed files
with
162 additions
and
146 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -2,15 +2,13 @@ | |
<html lang="en"> | ||
|
||
<head> | ||
<meta charset="utf-8"> | ||
<meta name="viewport" content="width=device-width,initial-scale=1.0"> | ||
<meta charset="UTF-8"> | ||
<meta http-equiv="X-UA-Compatible" content="IE=edge"> | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
<meta name="robots" content="noindex"> | ||
<meta name="title" content="WorkAdventure Starter Kit"> | ||
|
||
<link rel="icon" href="https://workadventu.re/favicon-96x96.png"> | ||
<link href="https://fonts.googleapis.com/css?family=Press+Start+2P" rel="stylesheet"> | ||
<link href="https://unpkg.com/[email protected]/css/nes.min.css" rel="stylesheet" /> | ||
<title>WorkAdventure Starter Kit</title> | ||
<title>WorkAdventure test map</title> | ||
<link rel="icon" href="/images/favicon.svg" type="image/svg+xml"> | ||
<script> | ||
window.onload = function () { | ||
const host = window.location.host; | ||
|
@@ -33,19 +31,27 @@ | |
}; | ||
</script> | ||
<style> | ||
html, body { | ||
height: 100%; | ||
} | ||
body { | ||
font-size: 16px; | ||
font-family: 'Open Sans', sans-serif; | ||
max-width: 800px; | ||
margin: auto !important; | ||
text-align: center; | ||
display: flex; | ||
flex-direction: column; | ||
} | ||
|
||
h1, | ||
h2 { | ||
font-weight: bold; | ||
.content { | ||
flex: 1 0 auto; | ||
} | ||
footer { | ||
flex-shrink: 0; | ||
} | ||
|
||
body { | ||
font-family: Roboto Condensed,Arial; | ||
max-width: 800px; | ||
margin: 0 auto; | ||
text-align: center; | ||
} | ||
|
||
header { | ||
margin: 30px; | ||
} | ||
|
@@ -62,59 +68,49 @@ | |
text-align: center; | ||
} | ||
|
||
main { | ||
margin-bottom: 30px; | ||
h1, | ||
h2 { | ||
font-weight: bold; | ||
font-size: 1.3rem; | ||
} | ||
|
||
section { | ||
margin-top: 3rem; | ||
} | ||
|
||
.tips { | ||
font-size: 0.8rem; | ||
font-style: italic; | ||
} | ||
|
||
.socials img { | ||
width: 30px; | ||
height: 30px; | ||
} | ||
|
||
.socials>a { | ||
.socials > a { | ||
display: inline-block; | ||
margin: 20px 5px; | ||
} | ||
|
||
.content { | ||
width: 100%; | ||
position: relative; | ||
z-index: 99999; | ||
} | ||
|
||
.content>h2 { | ||
padding: 1rem 5vw; | ||
max-width: 1200px; | ||
} | ||
|
||
a.button { | ||
display: inline-block; | ||
padding: 13px 20px 12px; | ||
background: rgba(20, 48, 76, 0.9); | ||
background-color: rgba(65, 86, 246, 0.9); | ||
color: white; | ||
border-radius: 8px; | ||
font-weight: bold; | ||
text-transform: uppercase; | ||
text-decoration: none; | ||
text-align: center; | ||
width: auto; | ||
position: relative; | ||
font-size: 1.8em; | ||
margin-top: 2rem; | ||
font-size: 1.3em; | ||
} | ||
|
||
a.button:hover { | ||
top: -3px; | ||
background: rgba(20, 48, 76); | ||
background-color: rgb(65, 86, 246); | ||
cursor: pointer; | ||
color: white; | ||
} | ||
|
||
|
||
.maps { | ||
display: flex; | ||
justify-content: center; | ||
gap: 1rem; | ||
flex-wrap: wrap; | ||
} | ||
|
||
.map { | ||
|
@@ -123,116 +119,85 @@ | |
min-width: 200px; | ||
} | ||
|
||
.map a, | ||
.map img { | ||
width: 100%; | ||
display: block; | ||
} | ||
|
||
.map a.button { | ||
display: inline-block; | ||
width: auto; | ||
margin: 1rem auto; | ||
.url-box { | ||
border: 1px solid rgb(65, 86, 246); | ||
border-radius: 3px; | ||
padding: 3px; | ||
background-color: rgba(65, 86, 246, 0.1); | ||
} | ||
|
||
.url { | ||
font-family: 'Courier New', Courier, monospace; | ||
font-size: 14px; | ||
} | ||
|
||
footer { | ||
display: block; | ||
font-size: 1.2em; | ||
padding: 2rem 5vw; | ||
} | ||
|
||
|
||
/*/ MEDIA QUERIES START HERE /*/ | ||
@media (max-width: 768px) { | ||
/* Hand Held Device */ | ||
|
||
body { | ||
font-size: 13px; | ||
} | ||
|
||
.logo img { | ||
width: 60vw; | ||
} | ||
|
||
.content { | ||
padding: 1rem; | ||
} | ||
|
||
.maps { | ||
gap: 1rem; | ||
} | ||
|
||
.map { | ||
width: 47%; | ||
margin-bottom: 3%; | ||
min-width: 200px; | ||
} | ||
|
||
} | ||
</style> | ||
</head> | ||
|
||
<body> | ||
<header> | ||
<div class="logo"> | ||
<a href="https://workadventu.re/" target="_blank" title="Workadventure"><img | ||
src="https://workadventu.re/images/general/logo.svg" alt="WorkAdventure logo" /></a> | ||
</div> | ||
</header> | ||
<main> | ||
<div class="nes-container with-title is-centered" style="margin-top: 3rem"> | ||
<p class="title">Useful links</p> | ||
<div class="content"> | ||
<div class="socials"> | ||
<a href="https://discord.gg/G6Xh9ZM9aR" target="_blank" title="discord"> | ||
<img src="https://workadventu.re/images/social/discord.png" alt="discord"> | ||
</a> | ||
<a href="https://github.com/thecodingmachine/workadventure" target="_blank" title="github"> | ||
<img src="https://workadventu.re/images/social/github.png" alt="github"> | ||
</a> | ||
<a href="https://www.youtube.com/channel/UCXJ9igV-kb9gw1ftR33y5tA" target="_blank" title="youtube"> | ||
<img src="https://workadventu.re/images/social/youtube.png" alt="youtube"> | ||
</a> | ||
<a href="https://twitter.com/Workadventure_" target="_blank" title="twitter"> | ||
<img src="https://workadventu.re/images/social/twitter.png" alt="twitter"> | ||
</a> | ||
<a href="https://www.instagram.com/workadventure_" target="_blank" title="instagram"> | ||
<img src="https://workadventu.re/images/social/instagram.png" alt="instagram"> | ||
</a> | ||
<a href="https://www.linkedin.com/company/workadventu-re" target="_blank" title="linkedin"> | ||
<img src="https://workadventu.re/images/social/linkedin.png" alt="linkedin"> | ||
</a> | ||
</div> | ||
|
||
<div class="help"> | ||
<a href="https://www.youtube.com/watch?v=lu1IZgBJJD4&list=PL7jmrMKZfjCnz36FvezxJ-Tshuh3Zz-nc&ab_channel=WorkAdventure" | ||
class="nes-btn is-primary" target="_blank">Watch tutorials</a> | ||
<a href="https://discord.gg/G6Xh9ZM9aR" class="nes-btn is-primary" target="_blank">Talk to the | ||
community</a> | ||
</div> | ||
<div class="content"> | ||
<header> | ||
<div class="logo"> | ||
<a href="https://workadventu.re/" target="_blank" title="Workadventure"> | ||
<img src="/images/logo.svg" alt="WorkAdventure logo" /> | ||
</a> | ||
</div> | ||
</div> | ||
|
||
<div class="nes-container with-title is-centered" style="margin-top: 1rem"> | ||
<p class="title">Test this map</p> | ||
<p>You can test this map at <a id="testMapURL" href="" class="url"></a></p> | ||
<p><a id="testMapBtnURL" href="" class="nes-btn is-primary">Test this map</a></p> | ||
</div> | ||
|
||
<div class="nes-container with-title is-centered" style="margin-top: 1rem"> | ||
<p class="title">Happy with the result?</p> | ||
<p>Register your room on Workadventu.re</p> | ||
<p><a id="gettingStartedLink" href="" class="nes-btn is-primary">Publish this map</a></p> | ||
<p>or copy and paste the map URL in WorkAdventu.re's administration panel:</p> | ||
<p><span id="tmjURL" class="url"></span></p> | ||
</div> | ||
</main> | ||
<footer><a href="https://workadventu.re/" target="_blank" title="workadventu.re">© WorkAdventure</a></footer> | ||
</header> | ||
<main> | ||
<section> | ||
<h2>Test my map</h2> | ||
<p><a id="testMapURL" href="#" class="url"></a></p> | ||
<p class="tips">(In order to test another map, locate "map.tmj" at the end of the URL and replace it by another file name)</p> | ||
<img src="/map.png" alt="Map thumbnail" class="map"> | ||
<p><a id="testMapBtnURL" href="#" class="button">Test my map</a></p> | ||
</section> | ||
|
||
<section> | ||
<h2>Publish my map</h2> | ||
<p>Register your room on WorkAdventure!</p> | ||
<p>Copy and paste the map URL in WorkAdventure's administration panel:</p> | ||
<p><span id="tmjURL" class="url-box url"></span></p> | ||
</section> | ||
|
||
<section> | ||
<h2>Connect and get help</h2> | ||
<div> | ||
<div class="socials"> | ||
<a href="https://discord.gg/G6Xh9ZM9aR" target="_blank" title="discord"> | ||
<img src="/images/discord.png" alt="discord"> | ||
</a> | ||
<a href="https://github.com/thecodingmachine/workadventure" target="_blank" title="github"> | ||
<img src="/images/github.png" alt="github"> | ||
</a> | ||
<a href="https://www.youtube.com/channel/UCXJ9igV-kb9gw1ftR33y5tA" target="_blank" title="youtube"> | ||
<img src="/images/youtube.png" alt="youtube"> | ||
</a> | ||
<a href="https://twitter.com/Workadventure_" target="_blank" title="twitter"> | ||
<img src="/images/twitter.png" alt="twitter"> | ||
</a> | ||
<a href="https://www.instagram.com/workadventure_" target="_blank" title="instagram"> | ||
<img src="/images/instagram.png" alt="instagram"> | ||
</a> | ||
<a href="https://www.linkedin.com/company/workadventu-re" target="_blank" title="linkedin"> | ||
<img src="/images/linkedin.png" alt="linkedin"> | ||
</a> | ||
</div> | ||
|
||
<div> | ||
<a href="https://www.youtube.com/watch?v=lu1IZgBJJD4&list=PL7jmrMKZfjCnz36FvezxJ-Tshuh3Zz-nc&ab_channel=WorkAdventure" | ||
target="_blank">Watch tutorials</a> | ||
<a href="https://discord.gg/G6Xh9ZM9aR" target="_blank">Talk to the community</a> | ||
</div> | ||
</div> | ||
</section> | ||
</main> | ||
</div> | ||
<footer> | ||
<a href="https://workadventu.re/" target="_blank" title="workadventu.re">© WorkAdventure</a> | ||
</footer> | ||
</body> | ||
|
||
</html> |
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Oops, something went wrong.