Macintosh-Tools
/
jurassic-park-interface
mirror of https://github.com/Max-Stevenson/jurassic-park-interface.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Even more progress on vehicle screen.

This commit is contained in:
Max Stevenson 2020-09-10 12:04:32 -05:00
parent 68ed22657c
commit 41a92434e5
5 changed files with 101 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

58
index.html
View File

@ -28,9 +28,61 @@
id="vehicle-display__inner"
>
<div class="vehicle-display__upper-wrapper">
<div class="vehicle-display__left-wrapper"></div>
<div class="vehicle-display__left-wrapper">
<div class="left-wrapper__location">
<div class="left-wrapper__group">
<p class="black-font-white-background">location</p>
</div>
<div class="left-wrapper__group">
<p>main:</p>
</div>
<div class="left-wrapper__group">
<p>x=90</p>
<p>y=78</p>
<p>z=65</p>
</div>
</div>
<div class="left-wrapper__labels">
<p class="black-font-white-background">security</p>
<p class="black-font-white-background">power</p>
<p class="black-font-white-background">fence</p>
</div>
<div class="left-wrapper__area">
<div class="left-wrapper__group">
<p class="black-font-white-background">area</p>
</div>
<div class="left-wrapper__group">
<p>entry:</p>
</div>
<div class="left-wrapper__group">
<p>t099</p>
<p>t098</p>
<p>t097</p>
<p>t095</p>
<p>t094</p>
<p>t093</p>
<p>t092</p>
<p>p00p</p>
<p>p02p</p>
<p>p04p</p>
<p>p06p</p>
<p>p08p</p>
</div>
<div class="left-wrapper__group">
<p>t234</p>
<p>t038</p>
<p>t078</p>
<p>t545</p>
<p>t632</p>
</div>
<div class="left-wrapper__group">
<p>sp488</p>
<p>sp22p</p>
</div>
</div>
</div>
<div class="vehicle-display__centre-wrapper">
<img src="./public/images/island.png" alt="">
<img id="island-img" src="./public/images/island.png" alt="">
</div>
<div class="vehicle-display__right-wrapper"></div>
</div>
@ -370,7 +422,7 @@
>
<div class="video-screen__vehicle-status__wrapper">
<p class="white-font-black-background">vehicle status</p>
<p class="white-font-black-background">headlights on<span class="vehicle-details__white-dot"></span></p>
<p class="white-font-black-background">headlights on <span class="vehicle-details__white-dot"></span></p>
</div>
<div
class="video-screen__vehicle-img__wrapper"

23
public/stylesheets/styles.css
View File

@ -548,6 +548,7 @@ body {
.room-info__title-container {
display: flex;
flex: 0 0 75%;
flex-direction: column;
justify-content: space-between;
}
@ -1263,15 +1264,35 @@ body {
flex-direction: column;
}
.vehicle-display__left-wrapper,
.vehicle-display__right-wrapper {
display: flex;
flex-direction: column;
flex: 1;
}
.vehicle-display__upper-wrapper {
display: flex;
flex-direction: row;
flex: 1;
flex: 1 0 77%;
padding: 0.5vw 0;
}
.vehicle-display__centre-wrapper {
flex: 0 0 78%;
}
.vehicle-display__lower-wrapper {
display: flex;
flex-direction: column;
flex: 1;
}
#island-img {
border: solid 0.1vw #3b6285;
object-fit: cover;
width: 100%;
height: 100%;
}
/*# sourceMappingURL=styles.css.map */

2
public/stylesheets/styles.css.map
View File

File diff suppressed because one or more lines are too long

2
sass/components/_level-info.scss
View File

@ -36,7 +36,7 @@
.room-info__title-container {
display: flex;
// flex: 0 0 75%;
flex: 0 0 75%;
flex-direction: column;
justify-content: space-between;
}

24
sass/components/_vehicle-display.scss
View File

@ -2,13 +2,33 @@
flex-direction: column;
}
.vehicle-display__left-wrapper,
.vehicle-display__right-wrapper {
display: flex;
flex-direction: column;
flex: 1;
}
.vehicle-display__upper-wrapper {
display: flex;
flex-direction: row;
flex: 1;
flex: 1 0 77%;
padding: 0.5vw 0;
}
.vehicle-display__centre-wrapper {
flex: 0 0 78%;
}
.vehicle-display__lower-wrapper {
display: flex;
flex-direction: column;
flex: 1;
}
}
#island-img {
border: solid 0.1vw #3b6285;
object-fit: cover;
width: 100%;
height: 100%;
}