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

More progress on vehicle tab. 

- Added images for vehicle tab.
- Tried to create responsive displays for vehicle tab.
This commit is contained in:
Max Stevenson 2020-09-09 14:22:57 -05:00
parent 94679a95d5
commit 534023b1cf
8 changed files with 39 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
index.html
View File

@ -340,7 +340,9 @@
<p class="white-font-black-background">vehicle status</p>
<p class="white-font-black-background">headlights on</p>
</div>
<div class="video-screen__vehicle-img__wrapper"></div>
<div class="video-screen__vehicle-img__wrapper">
<!-- <img id="vehicle-details__tour-vehicle" src="./public/images/vehicleGraphic.png" alt=""> -->
</div>
<div class="video-screen__vehicle-details__wrapper">
<div class="video-screen__vehicle-details__left">
<div class="vehicle-details__detail-container">
@ -377,7 +379,9 @@
</div>
</div>
<div class="vide-screen__vehicle-details__right">
<div class="vehicle-details__graphic-wrapper">
<!-- <img src="./public/images/explorerGraphic.png" alt=""> -->
</div>
</div>
</div>
</div>

BIN
public/images/explorerGraphic.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 113 KiB

BIN
public/images/vehicleGraphic.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 105 KiB

BIN
public/images/visitorCentre.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 674 KiB

20
public/stylesheets/styles.css
View File

@ -460,7 +460,7 @@ body {
justify-content: space-between;
background-color: black;
background: url("../../public/images/mapE.png") no-repeat center;
background-size: 25vw 34vw;
background-size: 100% 100%;
}
.tour-display__system-status {
@ -813,8 +813,8 @@ body {
.video-screen__vehicle-status__wrapper p {
margin: 0;
text-transform: none;
font-size: 1.5vw;
padding: 0.5vw 1vw 0 1vw;
font-size: 1.25vw;
padding: 0.25vw 1vw 0 1vw;
font-weight: 600;
}
@ -916,7 +916,15 @@ body {
justify-content: space-between;
flex: 1;
align-items: center;
margin-bottom: 0.2vw;
margin-bottom: 0.1vw;
}
.video-screen__vehicle-img__wrapper {
background: url("../../public/images/vehicleGraphic.png");
width: 100%;
height: 100%;
background-size: contain;
background-repeat: no-repeat;
}
.vehicle-details__detail-container .triangle-wrapper {
@ -970,6 +978,10 @@ body {
left: 0;
}
#vehicle-details__tour-vehicle {
width: 23.75vw;
}
.video-screen__vehicle-details__left .vehicle-details__status-text {
margin: 0;
border-top: 0.1vw solid #3B6285;

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

File diff suppressed because one or more lines are too long

2
sass/components/_display-text.scss
View File

@ -18,7 +18,7 @@
justify-content: space-between;
background-color: black;
background: url("../../public/images/mapE.png") no-repeat center;
background-size: 25vw 34vw;
background-size: 100% 100%;
// background-size: 3em 3em;
// background-image: linear-gradient(to right, white 1px, transparent 1px),
// linear-gradient(to bottom, white 1px, transparent 1px);

18
sass/components/_video-screen.scss
View File

@ -109,8 +109,8 @@
.video-screen__vehicle-status__wrapper p {
margin: 0;
text-transform: none;
font-size: 1.5vw;
padding: 0.5vw 1vw 0 1vw;
font-size: 1.25vw;
padding: 0.25vw 1vw 0 1vw;
font-weight: 600;
}
@ -213,7 +213,15 @@
justify-content: space-between;
flex: 1;
align-items: center;
margin-bottom: .2vw;
margin-bottom: .1vw;
}
.video-screen__vehicle-img__wrapper {
background: url("../../public/images/vehicleGraphic.png");
width: 100%;
height: 100%;
background-size: contain;
background-repeat: no-repeat;
}
.vehicle-details__detail-container .triangle-wrapper {
@ -267,6 +275,10 @@
left: 0;
}
#vehicle-details__tour-vehicle {
width: 23.75vw;
}
.video-screen__vehicle-details__left .vehicle-details__status-text {
margin: 0;
border-top: .1vw solid #3B6285;