Michatec/wk_wars2x
1
1
Fork 0
mirror of https://github.com/Michatec/wk_wars2x.git synced 2026-04-01 08:26:27 +02:00
Code Issues Packages Projects Releases Activity

Updated UI, added custom font

Browse Source 
Font link: https://fontlibrary.org/en/font/segment7
This commit is contained in:
Dan
2019-11-13 11:07:35 +00:00
parent f0c6bf3add
commit 085fadb633
3 changed files with 29 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
nui/Segment7Standard.otf Normal file
View File

Binary file not shown.

48
nui/radar.css
View File

@@ -1,18 +1,17 @@
/* Set all div elements to use the box-sizing property of border-box */
div { div {
box-sizing: border-box; box-sizing: border-box;
} }
/* Here we set all of the main style properties for the main radar container */
#radar { #radar {
transform: scale( 2 ); transform: scale( 2 );
width: 550px; width: 550px;
height: 210px; height: 200px;
padding: 0; padding: 0;
/* Temp border and pos
border: 1px solid black;*/
position: absolute; position: absolute;
margin: auto; margin: auto;
@@ -24,7 +23,8 @@ div {
background-color: rgb(30, 33, 38); background-color: rgb(30, 33, 38);
display: grid; display: grid;
grid-template-columns: 50px repeat( 6, auto ); grid-template-columns: 40px 160px auto;
column-gap: 5px;
} }
#radar > div { #radar > div {
border: 1px solid orange; border: 1px solid orange;
@@ -35,7 +35,7 @@ div {
display: grid; display: grid;
grid-template-rows: 50% 50%; grid-template-rows: 50% 50%;
} }
#radar .modes div { #radar .modes .modes_container {
display: grid; display: grid;
grid-template-rows: repeat( 3, auto ); grid-template-rows: repeat( 3, auto );
@@ -48,7 +48,7 @@ div {
width: 100%; width: 100%;
font-family: Verdana; font-family: Verdana;
font-size: 12px; font-size: 10px;
text-align: center; text-align: center;
@@ -58,25 +58,19 @@ div {
} }
#radar .speeds { #radar .speeds {
display: grid;
grid-template-rows: 50% 50%;
} }
#radar .speeds .speed_display {
display: flex;
#radar .dirs { margin: 15px 0;
background-color: orange;
} }
#radar .speeds .speed_display .speed_number {
#radar .fast_modes { /* width: 100%;
margin: 0; */
} margin: auto;
font-size: 50px;
#radar .fast_speeds { text-align: center;
}
}
#radar .fast_dirs {
}
#radar .patrol {
}

30
nui/radar.html
View File

@@ -7,13 +7,13 @@
<body onselectstart="return false;" ondragstart="return false;"> <body onselectstart="return false;" ondragstart="return false;">
<div id="radar"> <div id="radar">
<div class="modes"> <div class="modes">
<div class="front_modes"> <div class="modes_container">
<p class="mode_text" id="frontSame">SAME</p> <p class="mode_text" id="frontSame">SAME</p>
<p class="mode_text" id="frontOpp">OPP</p> <p class="mode_text" id="frontOpp">OPP</p>
<p class="mode_text" id="frontXmit">XMIT</p> <p class="mode_text" id="frontXmit">XMIT</p>
</div> </div>
<div class="rear_modes"> <div class="modes_container">
<p class="mode_text" id="rearSame">SAME</p> <p class="mode_text" id="rearSame">SAME</p>
<p class="mode_text" id="rearOpp">OPP</p> <p class="mode_text" id="rearOpp">OPP</p>
<p class="mode_text" id="rearXmit">XMIT</p> <p class="mode_text" id="rearXmit">XMIT</p>
@@ -21,27 +21,13 @@
</div> </div>
<div class="speeds"> <div class="speeds">
<div class="speed_display">
<p class="speed_number">000</p>
</div>
</div> <div class="speed_display">
<p class="speed_number">000</p>
<div class="dirs"> </div>
</div>
<div class="fast_modes">
</div>
<div class="fast_speeds">
</div>
<div class="fast_dirs">
</div>
<div class="patrol">
</div> </div>
</div> </div>
</body> </body>