Skip to content

Commit

Permalink
Merge branch 'workadventure:master' into master
Browse files Browse the repository at this point in the history
  • Loading branch information
gericfo authored Sep 22, 2023
2 parents a1f49be + 321e7fd commit 2101376
Show file tree
Hide file tree
Showing 11 changed files with 162 additions and 146 deletions.
243 changes: 104 additions & 139 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -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;
Expand All @@ -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;
}
Expand All @@ -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 {
Expand All @@ -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">&copy; 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">&copy; WorkAdventure</a>
</footer>
</body>

</html>
12 changes: 6 additions & 6 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "workadventure-map-starter-kit",
"version": "3.3.3",
"version": "3.3.4",
"license": "MIT",
"scripts": {
"dev": "vite",
Expand Down
Binary file added public/images/discord.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading

0 comments on commit 2101376

Please sign in to comment.