LP new version

This commit is contained in:
NIP 2020-06-04 00:38:47 +02:00
parent 3c1b521761
commit 7d233cd3e5
9 changed files with 649 additions and 345 deletions

View File

@ -42,17 +42,17 @@
</div> </div>
<div class="title text-center"> <div class="title text-center">
<h1>Your workplace<br/>but better</h1> <h1>Your workplace<br/>but better</h1>
<h2>Discover a pixelated new world !</h2> <h3>You are impatient to discover this new world? Click on "Play Online" or share this adventure with your colleagues and friends clicking on "Play Private"</h3>
<h3>Start a casual conversation</h3>
</div> </div>
<div class="row justify-content-md-center pt-5" style="margin-top: 100px;"> <div class="row justify-content-md-center pt-5" style="margin-top: 65px;">
<div class="col col-lg-3"> <div class="col col-lg-3">
<a class="custom-link contribute" target="_BLANK" href="https://github.com/thecodingmachine/workadventure" title="CONTRIBUTE !">CONTRIBUTE <a class="custom-link play" target="_BLANK" href="https://workadventu.re/_/global/npeguin.github.io/office-map/map.json" title="PLAY ONLINE">
PLAY ONLINE
</a> </a>
</div> </div>
<div class="col col-lg-3"> <div class="col col-lg-3">
<a class="custom-link start" href="/choose-map.html" title="START !"> <a class="custom-link start" href="/choose-map.html" title="PLAY PRIVATE">
START ! PLAY PRIVATE
</a> </a>
</div> </div>
</div> </div>
@ -68,22 +68,25 @@
<div class="section bg-white how-to"> <div class="section bg-white how-to">
<div class="container-fluid container-lg"> <div class="container-fluid container-lg">
<div class="row justify-content-md-center"> <div class="row justify-content-md-center">
<div class="col-12 col-md-12 text-center">
<h3>Step by step...</h3>
</div>
<div class="col-12 col-md-4 text-center my-3 my-md-0"> <div class="col-12 col-md-4 text-center my-3 my-md-0">
<div class="image-item"> <div class="image-item">
<h2>Choose your map</h2> <h2>Choose your map</h2>
<div class="step-image"><img src="static/images/step 1.png"></div> <div class="step-image"><img src="static/images/maps/office.png"></div>
</div> </div>
</div> </div>
<div class="col-12 col-md-4 text-center my-3 my-md-0"> <div class="col-12 col-md-4 text-center my-3 my-md-0">
<div class="image-item"> <div class="image-item">
<h2>Select your character</h2> <h2>Select your character</h2>
<div class="step-image"><img src="static/images/step 2.png"></div> <div class="step-image"><img src="static/images/choose_character.png"></div>
</div> </div>
</div> </div>
<div class="col-12 col-md-4 text-center my-3 my-md-0"> <div class="col-12 col-md-4 text-center my-3 my-md-0">
<div class="image-item"> <div class="image-item">
<h2>Let's go explore and talk&nbsp;!</h2> <h2>Let's go explore and talk&nbsp;!</h2>
<div class="step-image"><img src="static/images/step 3.png"></div> <div class="step-image"><img src="static/images/play.png"></div>
</div> </div>
</div> </div>
</div> </div>
@ -92,18 +95,24 @@
<div class="section bg-white"> <div class="section bg-white">
<div class="container-fluid container-lg"> <div class="container-fluid container-lg">
<div class="col-12 credits"> <div class="col-12 credits">
<h2>Credits</h2> <h2>Futur features</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p> <p>Share files with others</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>Lock group conversation</p>
<p> <p>Share screen with others</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>Interact with objects</p>
</p> <div class="row justify-content-md-center pt-5" style="margin-top: 65px;">
<div class="col col-lg-3">
<a class="custom-link contribute" target="_BLANK" href="https://docs.google.com/forms/d/e/1FAIpQLSdxvajEyqsn4X0ai0SoDAcdsa_JQPIfiP2Tp9PDzkfZA54v9Q/viewform" title="FEED BACK">
FEED BACK
</a>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
<div class="bg-gray section used-by"> <div class="bg-gray section used-by">
<div class="container-fluid container-lg"> <div class="container-fluid container-lg">
<h2 class="text-center pb-4">THEY MAY APPROVE</h2> <h2 class="text-center pb-4">THEY MIGHT APPROVE</h2>
<div class="row justify-content-md-center align-items-center"> <div class="row justify-content-md-center align-items-center">
<div class="col col-md-auto"> <div class="col col-md-auto">
<img src="static/images/atari.png"> <img src="static/images/atari.png">
@ -121,24 +130,20 @@
</div> </div>
</div> </div>
<div class="container-fluid container-lg section quotes"> <div class="container-fluid container-lg section quotes">
<h2 class="text-center">Why they loved Work Adventure</h2> <h2 class="text-center">Why we loved Work Adventure</h2>
<div class="row justify-content-center"> <div class="row justify-content-center">
<div class="col-12 col-md-9"> <div class="col-12 col-md-9">
<div class="quote-item"> <div class="quote-item">
<p class="quote">&laquo;&nbsp;Since I see life in 32px, I think I feel happier.&nbsp;&raquo;</p> <p class="quote">&laquo;&nbsp;Right on time! I feel like less alone in my home office.&nbsp;&raquo;</p>
<p class="author">Donald, Whashington DC</p> <p class="author">Julie</p>
</div> </div>
<div class="quote-item"> <div class="quote-item">
<p class="quote">&laquo;&nbsp;For me, who hates hugs, I can't live without it...&nbsp;&raquo;</p> <p class="quote">&laquo;&nbsp;I love running into the hallway and check out where are my teammates!&nbsp;&raquo;</p>
<p class="author">Anna, New York City</p> <p class="author">Sophie</p>
</div> </div>
<div class="quote-item"> <div class="quote-item">
<p class="quote">&laquo;&nbsp;Par webcam les gens ne me font plus de réflexion sur mes cheveux. Trop cool !&nbsp;&raquo;</p> <p class="quote">&laquo;&nbsp;Wow! More intimate than a Meet conference.&nbsp;&raquo;</p>
<p class="author">Kim. Pyongyang</p> <p class="author">Greg</p>
</div>
<div class="quote-item">
<p class="quote">&laquo;&nbsp;Since it's fun, I scare my colleagues a little less.&nbsp;&raquo;</p>
<p class="author">Emmanuel. France</p>
</div> </div>
</div> </div>

Binary file not shown.

After

Width:  |  Height:  |  Size: 135 KiB

BIN
landing_page/dist/static/images/play.png vendored Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 182 KiB

File diff suppressed because it is too large Load Diff

View File

@ -13,10 +13,10 @@
"file-loader": "^3.0.1", "file-loader": "^3.0.1",
"mini-css-extract-plugin": "^0.5.0", "mini-css-extract-plugin": "^0.5.0",
"postcss-loader": "^3.0.0", "postcss-loader": "^3.0.0",
"sass": "^1.17.2", "sass": "^1.26.7",
"sass-loader": "^7.1.0", "sass-loader": "^7.1.0",
"webpack": "^4.29.6", "webpack": "^4.29.6",
"webpack-cli": "^3.2.3" "webpack-cli": "^3.3.11"
}, },
"dependencies": { "dependencies": {
"bootstrap": "^4.5.0", "bootstrap": "^4.5.0",

Binary file not shown.

Before

Width:  |  Height:  |  Size: 9.1 KiB

After

Width:  |  Height:  |  Size: 754 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 502 B

View File

@ -124,16 +124,19 @@ header {
&.contribute { &.contribute {
background-image: url('../images/btn-bg-2.png'); background-image: url('../images/btn-bg-2.png');
} }
&.play {
background-image: url('../images/btn-bg-3.png');
}
&.start { &.start {
padding-left: 55px; /*padding-left: 55px;*/
&:before { &:before {
content: ""; /*content: "";
position: absolute; position: absolute;
background: url('../images/playicon.png') no-repeat; background: url('../images/playicon.png') no-repeat;
height: 20px; height: 20px;
width: 21px; width: 21px;
left: 36px; left: 36px;
top: 23px; top: 23px;*/
} }
} }
&.light{ &.light{
@ -184,13 +187,13 @@ img{
} }
&.how-to{ &.how-to{
padding: 175px 0; padding: 100px 0;
background: url('../images/bg-briques.jpg') repeat-x bottom; background: url('../images/bg-briques.jpg') repeat-x bottom;
.image-item{ .image-item{
height: 100%; height: 100%;
margin: 0 auto; margin: 0 auto;
padding: 20px; padding: 20px;
transition: all .25s cubic-bezier(0.000, -0.600, 1.000, 1.650); /* custom */ /*transition: all .25s cubic-bezier(0.000, -0.600, 1.000, 1.650);
&:hover { &:hover {
transform: scale(1.1); transform: scale(1.1);
.step-image { .step-image {
@ -218,7 +221,7 @@ img{
z-index: 2; z-index: 2;
position: relative; position: relative;
} }
} }*/
h2{ h2{
padding: 1rem 0; padding: 1rem 0;
margin: 0; margin: 0;

View File

@ -0,0 +1,53 @@
Arguments:
/usr/bin/node /usr/share/yarn/bin/yarn.js install
PATH:
/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin:./node_modules/.bin
Yarn version:
1.22.4
Node version:
12.17.0
Platform:
linux x64
Trace:
Error: EEXIST: file already exists, copyfile '/home/docker/.cache/yarn/v6/npm-vendors-1.0.4-e2b800a53e7a29b93506c3cf41100d16c4c4ad8e-integrity/node_modules/vendors/license' -> '/var/www/html/node_modules/vendors/license'
npm manifest:
{
"scripts": {
"build": "webpack --config webpack.config.js",
"watch": "webpack --config webpack.config.js --watch"
},
"devDependencies": {
"@babel/core": "^7.3.4",
"@babel/preset-env": "^7.3.4",
"autoprefixer": "^9.4.10",
"babel-loader": "^8.0.5",
"css-loader": "^2.1.1",
"cssnano": "^4.1.10",
"file-loader": "^3.0.1",
"mini-css-extract-plugin": "^0.5.0",
"postcss-loader": "^3.0.0",
"sass": "^1.26.7",
"sass-loader": "^7.1.0",
"webpack": "^4.29.6",
"webpack-cli": "^3.3.11"
},
"dependencies": {
"bootstrap": "^4.5.0",
"jquery": "^3.5.1",
"node-sass": "^4.14.1",
"popper.js": "^1.16.1",
"style-loader": "^1.2.1"
}
}
yarn manifest:
No manifest
Lockfile:
No lockfile