some styling changes

This commit is contained in:
Cristina Cochior 2020-06-24 23:07:41 +02:00
parent bc5f6c6e8a
commit 8a3011587d
6 changed files with 7400 additions and 44 deletions

BIN
.DS_Store vendored Normal file

Binary file not shown.

View File

@ -2,7 +2,7 @@
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title>Parade</title>
<title>The Weight of Things</title>
<style media="screen">
html,body{
margin: 0;
@ -46,14 +46,16 @@
#annotation{
position: absolute;
top:0;
left:0;
top:1em;
left:1em;
padding: 5px;
background:white;
/* background:white; */
width: 25%;
font-size: 0.7em;
}
#annotation img{
height: 300px;
width: 100%;
}
#annotation .description{
@ -95,11 +97,21 @@
display:block;
}
#nextButton{
background: transparent;
border: 0.5px solid black;
font-size: 0.7em;
border-radius: 5px;
padding: 0.5em;
margin: 1em 0;
}
body.finished #nextButton{
display:none;
}
h4 {
font-size: 1.4em;
}
</style>
@ -131,14 +143,14 @@
<input type='button' value='Resume interview' id='resumeButton'>
<audio id='interview'
src="/interview/interview-with-ellen.mp3">
src="/the-weight-of-things/interview/interview-with-ellen.mp3">
<track kind="captions"
srclang="en"
src="/interview/interview-with-ellen_v3.mp3.vtt"/>
src="/the-weight-of-things/interview/interview-with-ellen_v3.mp3.vtt"/>
<track default kind="captions"
srclang="nl"
src="/interview/interview-with-ellen_v3.mp3 copy.vtt"/>
src="/the-weight-of-things/interview/interview-with-ellen-NL.vtt"/>
</audio>
</div>
@ -150,7 +162,7 @@
</div>
<div id='workmsg'>
<h2>Annotate to listen...</h2>
<h2>Keep the parade going...</h2>
</div>

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

View File

@ -377,11 +377,11 @@ class Parade {
// This creates a basic Babylon Scene object
this.scene = new BABYLON.Scene(this.engine);
this.scene.clearColor = new BABYLON.Color3(.22,0.27,0.38); // color RGB
this.scene.clearColor = new BABYLON.Color3(98,44,246); // color RGB
// this.scene.clearColor = new BABYLON.Color4(0.6, 0.6, 0.,0); // transparent - RGBA
this.scene.fogMode = BABYLON.Scene.FOGMODE_EXP;
this.scene.fogColor = this.scene.clearColor;
this.scene.fogDensity = 0.002;
this.scene.fogDensity = 0.000;
// let camera = new BABYLON.UniversalCamera("camera1", new BABYLON.Vector3( 0.0, 0.0, 120.86337575312979), this.scene);
// camera.rotation = new BABYLON.Vector3(0, Math.PI, 0);
@ -517,10 +517,10 @@ class ParadeImage {
mat.roughness = 1;
mat.emissiveColor = new BABYLON.Color3.White();
var textPlane = BABYLON.MeshBuilder.CreatePlane("text", {width:planeWidth, height:planeHeight, sideOrientation: BABYLON.Mesh.DOUBLESIDE}, scene);
textPlane.material = mat;
textPlane.parent = this.mesh;
textPlane.position.y = -4.3; // text sits below image
// var textPlane = BABYLON.MeshBuilder.CreatePlane("text", {width:planeWidth, height:planeHeight, sideOrientation: BABYLON.Mesh.DOUBLESIDE}, scene);
// textPlane.material = mat;
// textPlane.parent = this.mesh;
// textPlane.position.y = -4.3;