priyatham
/
gcs-user-interface
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Removed Icon

This commit is contained in:
Steven C 2024-03-08 12:46:18 -08:00
parent 89f0b729c7 850623e02d
commit e16e44af2f
1 changed files with 40 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

55
src/views/fourCam.vue
View File

@ -7,36 +7,45 @@ import Camera from "../components/Camera.vue";
<template> <template>
<div class="grid"> <div class="grid">
<div style="position: relative;"> <div style="position: relative; display: flex;">
<Camera :cameraNumber="2"/> <Camera :cameraNumber="2"/>
<div class="status_div"> <!-- the Battery and Connection component's size is dependent on its parent element. So changing 'status_div' size will change their size--> <Battery :percentage=85 :charging="false" class="battery_test"/>
<Connection :latency=65 class="connection_test"/>
<!-- the Battery and Connection component's size is dependent on its parent element. So changing 'status_div' size will change their size-->
<!-- <div class="status_div">
<Battery :percentage=89 :charging="false" class="adjust_Battery"/> <Battery :percentage=89 :charging="false" class="adjust_Battery"/>
<Connection :latency=65 /> <Connection :latency=65 />
</div> </div> -->
</div> </div>
<div style="position: relative;"> <div style="position: relative; display: flex;">
<Camera :cameraNumber="1"/> <Camera :cameraNumber="2"/>
<div class="status_div"> <Battery :percentage=12 :charging="false" class="battery_test"/>
<Connection :latency=3 class="connection_test"/>
<!-- <div class="status_div">
<Battery :percentage=12 :charging="false" class="adjust_Battery"/> <Battery :percentage=12 :charging="false" class="adjust_Battery"/>
<Connection :latency=3 /> <Connection :latency=3 />
</div> </div> -->
</div> </div>
<div style="position: relative;"> <div style="position: relative; display: flex;">
<Camera :cameraNumber="1"/> <Camera :cameraNumber="2"/>
<div class="status_div"> <Battery :percentage=46 :charging="false" class="battery_test"/>
<Connection :latency=82 class="connection_test"/>
<!-- <div class="status_div">
<Battery :percentage=46 :charging="false" class="adjust_Battery"/> <Battery :percentage=46 :charging="false" class="adjust_Battery"/>
<Connection :latency=82 /> <Connection :latency=82 />
</div> </div> -->
</div> </div>
<div style="position: relative;"> <div style="position: relative; display: flex;">
<Camera :cameraNumber="2"/> <Camera :cameraNumber="1"/>
<div class="status_div"> <Battery :percentage=0 :charging="false" class="battery_test"/>
<Connection :latency=5 class="connection_test"/>
<!-- <div class="status_div">
<Battery :percentage=0 :charging="false" class="adjust_Battery"/> <Battery :percentage=0 :charging="false" class="adjust_Battery"/>
<Connection :latency=5 /> <Connection :latency=5 />
</div> </div> -->
</div> </div>
</div> </div>
</template> </template>
@ -58,4 +67,20 @@ it directly in their file component's style*/
top: 5%; top: 5%;
margin-right: 3%; margin-right: 3%;
} }
.battery_test {
position:absolute;
height: 7%;
width: 6.3%;
top: 4%;
left: 2%;
}
.connection_test {
position:absolute;
height: 11%;
width: 4%;
top: 1%;
left: 9.5%;
}
</style> </style>