Update scoring panel for 2020.

This commit is contained in:
Patrick Fairbank
2020-03-21 23:32:28 -07:00
parent fd84cdcd73
commit 93cbce7aa1
6 changed files with 318 additions and 414 deletions

View File

@@ -12,27 +12,45 @@ body {
background-color: #222;
}
.container {
padding-top: 2vw;
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: center;
}
#alliance {
width: 90%;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: center;
border-radius: 25px;
border: 1px solid #333;
}
#alliance[data-alliance="red"] {
background-color: #322;
}
#alliance[data-alliance="blue"] {
background-color: #223;
}
#matchName {
font-size: 2vw;
}
#robots {
.scoring-section {
margin-bottom: 0.5vw;
display: flex;
font-size: 1.5vw;
color: #ccc;
}
#robotHeader {
margin-right: 1vw;
.scoring-header>div{
height: 2.5vw;
margin: 0.4vw 1vw 0.4vw 0.2vw;
color: #666;
}
.robot-field {
min-width: 12vw;
width: 17vw;
height: 2.5vw;
display: flex;
justify-content: space-between;
@@ -42,180 +60,91 @@ body {
.team {
display: flex;
justify-content: center;
font-weight: bold;
}
.robot-start-level[data-value="0"] {
background-color: #633;
}
.robot-start-level[data-value="1"] {
background-color: #236;
}
.robot-start-level[data-value="2"] {
background-color: #263;
}
.robot-start-level[data-value="3"] {
background-color: #850;
}
.sandstorm-bonus[data-value="false"] {
.boolean[data-value="false"] {
background-color: #333;
}
.sandstorm-bonus[data-value="true"] {
.boolean[data-value="true"] {
background-color: #263;
}
.robot-end-level[data-value="0"] {
.endgame-status[data-value="0"] {
background-color: #333;
}
.robot-end-level[data-value="1"] {
.endgame-status[data-value="1"] {
background-color: #236;
}
.robot-end-level[data-value="2"] {
background-color: #224d4d;
}
.robot-end-level[data-value="3"] {
.endgame-status[data-value="2"] {
background-color: #263;
}
.robot-shortcut {
width: 2vw;
.control-panel[data-value="disabled"] {
background-color: #333;
}
.control-panel[data-value="false"] {
background-color: #236;
}
.control-panel[data-value="true"] {
background-color: #263;
}
.shortcut {
margin: 0 0.2vw;
font-size: 1vw;
align-self: flex-start;
}
.team {
font-weight: bold;
}
#scoringElements {
#elements {
width: 100%;
height: 100%;
display: flex;
justify-content: space-evenly;
align-items: center;
}
.goal-header {
height: 5vw;
margin: 0.4vw 0vw;
color: #666;
display: flex;
flex-direction: column;
justify-content: center;
}
.goal-period {
text-align: center;
color: #666;
}
.goal {
width: 13vw;
height: 5vw;
margin: 0.4vw 3vw;
display: flex;
justify-content: space-between;
}
.rocket {
display: flex;
align-items: flex-end;
}
.rocket-outline {
display: flex;
align-items: flex-end;
padding: 5vw 2vw 1vw 2vw;
border: 1px solid #222;
border-radius: 40% 40% 0% 0%;
}
.alliance-color[data-alliance="red"] {
background-color: #633;
}
.alliance-color[data-alliance="blue"] {
background-color: #236;
}
.outer-rocket {
height: 26vw;
margin: 0.2vw;
}
.inner-rocket {
margin: 0.2vw;
}
#centerColumn {
display: flex;
flex-direction: column;
align-items: center;
}
#cargoShipContainer {
display: flex;
flex-direction: column;
align-items: center;
}
#cargoShip {
display: flex;
flex-direction: column;
align-items: center;
padding: 1vw;
border: 1px solid #222;
border-radius: 10%;
}
.cargo-ship-side {
width: 25vw;
.number-button {
width: 4vw;
height: 4vw;
display: flex;
justify-content: space-between;
align-items: center;
border: 1px solid #666;
border-radius: 0.5vw;
font-size: 3vw;
}
.cargo-ship-front {
display: flex;
.plus {
background: #263;
}
.bay {
position: relative;
width: 7vw;
height: 7vw;
margin: 0.2vw;
border: 1px solid #222;
background-color: #666;
border-radius: 10%;
}
.bay[data-value="0"] .hatch-panel {
display: none;
}
.bay[data-value="1"] .hatch-panel {
display: flex;
}
.bay[data-value="2"] .hatch-panel {
display: flex;
}
.bay[data-value="3"] .hatch-panel {
display: none;
}
.bay[data-value="0"] .cargo {
display: none;
}
.bay[data-value="1"] .cargo {
display: none;
}
.bay[data-value="2"] .cargo {
display: flex;
}
.bay[data-value="3"] .cargo {
display: flex;
}
.shortcut {
position: absolute;
left: 0.3vw;
top: -0.1vw;
font-size: 1.2vw;
color: #fff
}
.hatch-panel {
width: 6vw;
height: 6vw;
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
display: none;
margin: auto auto;
border: 1vw solid #c80;
border-radius: 50%;
}
.cargo {
width: 3vw;
height: 3vw;
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
display: none;
margin: auto auto;
background-color: #c50;
border-radius: 50%;
.minus {
background: #633;
}
#instructions {
margin-top: 0.3vw;
}
#preMatchMessage, #postMatchMessage {
height: 100%;
#postMatchMessage {
height: 5vw;
display: none;
align-items: center;
font-size: 1.5vw;
color: #c90;
}
#commitMatchScore {
height: 100%;
height: 5vw;
display: none;
align-items: center;
}