mirror of
https://github.com/Max-Stevenson/jurassic-park-interface.git
synced 2024-06-14 03:29:31 +00:00
Breaker glow effect added.
This commit is contained in:
Max Stevenson
parent
3a6e6dbdc3
commit
4e07a36938
|
|
@ -35,7 +35,7 @@
|
|||
>
|
||||
<div class="power-screen__voltage-switches-container">
|
||||
<div class="toggle-switch-container">
|
||||
<p>High</p>
|
||||
<p class="breaker-active">High</p>
|
||||
<div class="toggle-switch switch-vertical">
|
||||
<input
|
||||
checked
|
||||
|
|
@ -57,7 +57,7 @@
|
|||
<p>Low</p>
|
||||
</div>
|
||||
<div class="toggle-switch-container">
|
||||
<p>High</p>
|
||||
<p class="breaker-active">High</p>
|
||||
<div class="toggle-switch switch-vertical">
|
||||
<input
|
||||
checked
|
||||
|
|
@ -79,7 +79,7 @@
|
|||
<p>Low</p>
|
||||
</div>
|
||||
<div class="toggle-switch-container">
|
||||
<p>High</p>
|
||||
<p class="breaker-active">High</p>
|
||||
<div class="toggle-switch switch-vertical">
|
||||
<input
|
||||
checked
|
||||
|
|
@ -101,7 +101,7 @@
|
|||
<p>Low</p>
|
||||
</div>
|
||||
<div class="toggle-switch-container">
|
||||
<p>High</p>
|
||||
<p class="breaker-active">High</p>
|
||||
<div class="toggle-switch switch-vertical">
|
||||
<input
|
||||
checked
|
||||
|
|
|
|||
|
|
@ -62,6 +62,7 @@ const enablePower = () => {
|
|||
];
|
||||
|
||||
loadInstructions(powerInstructionsArr);
|
||||
|
||||
// Voltage toggles
|
||||
const voltageDisplay = document.getElementById("current-voltage");
|
||||
const voltageToggleInputs = document.querySelectorAll('input[type="radio"]');
|
||||
|
|
@ -86,11 +87,29 @@ const enablePower = () => {
|
|||
for (let i = 0; i < voltageToggleInputs.length; i++) {
|
||||
voltageToggleInputs[i].addEventListener("click", event => {
|
||||
updateVoltage();
|
||||
toggleBreakerGlow(event);
|
||||
});
|
||||
}
|
||||
|
||||
updateVoltage();
|
||||
////////////////////////
|
||||
//////////////////////
|
||||
|
||||
// Breaker glow effect
|
||||
const toggleBreakerGlow = (event) => {
|
||||
let highLabel = event.target.parentElement.previousElementSibling;
|
||||
let lowLabel = event.target.parentElement.nextElementSibling;
|
||||
let selection = event.target.parentElement.querySelector("input:checked").classList.value.split("-")[1];
|
||||
|
||||
if (selection === "low") {
|
||||
highLabel.classList.remove("breaker-active");
|
||||
lowLabel.classList.add("breaker-active");
|
||||
} else if (selection === "high") {
|
||||
lowLabel.classList.remove("breaker-active");
|
||||
highLabel.classList.add("breaker-active");
|
||||
}
|
||||
}
|
||||
//////////////////////
|
||||
|
||||
// Charge code
|
||||
const chargeButton = document.getElementById("power-charge");
|
||||
const chargeStatus = document.getElementById("charge-status");
|
||||
|
|
@ -106,7 +125,7 @@ const enablePower = () => {
|
|||
chargeStatus.innerHTML = "Discharged";
|
||||
}
|
||||
});
|
||||
////////////////////////
|
||||
//////////////////////
|
||||
|
||||
// Contact code
|
||||
const closeButton = document.getElementById("power-close");
|
||||
|
|
@ -122,7 +141,7 @@ const enablePower = () => {
|
|||
initCircuitBreakers();
|
||||
}
|
||||
});
|
||||
////////////////////////
|
||||
//////////////////////
|
||||
|
||||
// Circuit Breaker Init
|
||||
const initCircuitBreakers = () => {
|
||||
|
|
@ -142,7 +161,7 @@ const enablePower = () => {
|
|||
breakerOffButtons[i].addEventListener("click", handleBreakerOff);
|
||||
}
|
||||
};
|
||||
////////////////////////
|
||||
//////////////////////
|
||||
|
||||
// Breaker On
|
||||
const handleBreakerOn = event => {
|
||||
|
|
@ -152,7 +171,7 @@ const enablePower = () => {
|
|||
"#C23457";
|
||||
event.target.style.backgroundColor = "#E40141";
|
||||
};
|
||||
////////////////////////
|
||||
//////////////////////
|
||||
|
||||
// Breaker Off
|
||||
const handleBreakerOff = event => {
|
||||
|
|
@ -163,7 +182,7 @@ const enablePower = () => {
|
|||
event.target.parentElement.nextElementSibling.style.backgroundColor =
|
||||
"#1F1115";
|
||||
};
|
||||
////////////////////////
|
||||
//////////////////////
|
||||
|
||||
// Circuit Breaker Reset
|
||||
const resetCircuitBreakers = () => {
|
||||
|
|
@ -188,7 +207,7 @@ const enablePower = () => {
|
|||
breakerOffButtons[i].removeEventListener("click", handleBreakerOff);
|
||||
}
|
||||
};
|
||||
////////////////////////
|
||||
//////////////////////
|
||||
|
||||
// Open code
|
||||
const openButton = document.getElementById("power-open");
|
||||
|
|
@ -204,7 +223,7 @@ const enablePower = () => {
|
|||
}
|
||||
resetCircuitBreakers();
|
||||
});
|
||||
////////////////////////
|
||||
//////////////////////
|
||||
};
|
||||
enablePower();
|
||||
////////////////////////
|
||||
|
|
|
|||
|
|
@ -312,12 +312,16 @@ body {
|
|||
|
||||
.toggle-switch-container {
|
||||
align-content: center;
|
||||
padding: 2.5vw;
|
||||
padding: 1.5vw;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.breaker-active {
|
||||
box-shadow: 0 0 0.5vw 0.5vw;
|
||||
}
|
||||
|
||||
.toggle-switch-container p {
|
||||
color: white;
|
||||
background: #ed1a3b;
|
||||
|
|
@ -1045,7 +1049,7 @@ body {
|
|||
.power-screen__breaker-container {
|
||||
display: flex;
|
||||
flex: 1;
|
||||
margin-bottom: 5px;
|
||||
margin-bottom: 0.25vw;
|
||||
}
|
||||
|
||||
.breaker-wrapper {
|
||||
|
|
@ -1092,14 +1096,15 @@ body {
|
|||
#power-display__inner > div.power-screen__votage-output-container {
|
||||
display: flex;
|
||||
justify-content: space-evenly;
|
||||
margin-bottom: 1vw;
|
||||
}
|
||||
|
||||
.breaker-label__text {
|
||||
color: black;
|
||||
font-size: 14px;
|
||||
font-size: 1vw;
|
||||
text-transform: uppercase;
|
||||
border: 2px solid black;
|
||||
padding: 4px;
|
||||
border: 0.2vw solid black;
|
||||
padding: 0.4vw;
|
||||
background-color: #37291f;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1 +1 @@
|
|||
{"version":3,"sourceRoot":"","sources":["../../sass/components/_buttons.scss","../../sass/base/_base.scss","../../sass/components/_layout.scss","../../sass/components/_instructions-panel.scss","../../sass/components/_borders.scss","../../sass/components/_display-text.scss","../../sass/components/_level-info.scss","../../sass/components/_screen-display.scss","../../sass/components/_video-screen.scss","../../sass/components/_control-panel.scss","../../sass/components/_output-display.scss","../../sass/components/_system-icons.scss","../../sass/components/_modal.scss","../../sass/components/_main-display.scss","../../sass/components/_power-screen.scss"],"names":[],"mappings":"AAoEQ;ACpER;AAAA;AAAA;EAGE;;;AAGF;EACE;;;AAGF;AAAA;EAEE;EACA;EACA;;;AAGF;EACE;IACE;;;AAIJ;EACE;EACA;;;AAGF;EACE;EACA;EACA;;;AC/BF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;;;AC/DF;EACE;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;;;ACXF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EAEE;EACA;;;AAGF;EAEE;EACA;;;AAGF;EAEE;EACA;;;AAGF;EAEE;EACA;;;AAGF;EAEE;EACA;;;AAGF;EAEE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AJ3HF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EAEE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;;;AAIF;AAAA;AAAA;EAGE;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AK3MF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAIF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAGF;AAAA;EAEE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;AAAA;EAEE;;;AAGF;EACE;EACA;;;ACnEF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EAEA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AC5DF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAEF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AC3HF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;AAAA;EAEE;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;IACE;;EAEF;IACE;;;AAIJ;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAGF;AAAA;EAEE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;;;ACrLF;EACE;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;ACnCF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;;;AChCF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAGF;EACE;;;ACvDF;EACE;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;ACxBF;EACE;;;ACDF;EACE;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EAEE;;;AAGF;EACE;;;AAIF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EAEA;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EAGE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA","file":"styles.css"}
|
||||
{"version":3,"sourceRoot":"","sources":["../../sass/components/_buttons.scss","../../sass/base/_base.scss","../../sass/components/_layout.scss","../../sass/components/_instructions-panel.scss","../../sass/components/_borders.scss","../../sass/components/_display-text.scss","../../sass/components/_level-info.scss","../../sass/components/_screen-display.scss","../../sass/components/_video-screen.scss","../../sass/components/_control-panel.scss","../../sass/components/_output-display.scss","../../sass/components/_system-icons.scss","../../sass/components/_modal.scss","../../sass/components/_main-display.scss","../../sass/components/_power-screen.scss"],"names":[],"mappings":"AAoEQ;ACpER;AAAA;AAAA;EAGE;;;AAGF;EACE;;;AAGF;AAAA;EAEE;EACA;EACA;;;AAGF;EACE;IACE;;;AAIJ;EACE;EACA;;;AAGF;EACE;EACA;EACA;;;AC/BF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;;;AC/DF;EACE;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;;;ACXF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EAEE;EACA;;;AAGF;EAEE;EACA;;;AAGF;EAEE;EACA;;;AAGF;EAEE;EACA;;;AAGF;EAEE;EACA;;;AAGF;EAEE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AJ3HF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EAEE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;;;AAIF;AAAA;AAAA;EAGE;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AK/MF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAIF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAGF;AAAA;EAEE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;AAAA;EAEE;;;AAGF;EACE;EACA;;;ACnEF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EAEA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AC5DF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAEF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AC3HF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;AAAA;EAEE;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;IACE;;EAEF;IACE;;;AAIJ;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAGF;AAAA;EAEE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;;;ACrLF;EACE;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;ACnCF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;;;AChCF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAGF;EACE;;;ACvDF;EACE;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;ACxBF;EACE;;;ACDF;EACE;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EAEE;;;AAGF;EACE;;;AAIF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EAEA;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA","file":"styles.css"}
|
||||
|
|
@ -80,12 +80,16 @@ body {
|
|||
|
||||
.toggle-switch-container {
|
||||
align-content: center;
|
||||
padding: 2.5vw;
|
||||
padding: 1.5vw;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.breaker-active {
|
||||
box-shadow: 0 0 0.5vw 0.5vw;
|
||||
}
|
||||
|
||||
.toggle-switch-container p {
|
||||
color: white;
|
||||
background: #ed1a3b;
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
.power-screen__breaker-container {
|
||||
display: flex;
|
||||
flex: 1;
|
||||
margin-bottom: 5px;
|
||||
margin-bottom: .25vw;
|
||||
}
|
||||
|
||||
.breaker-wrapper {
|
||||
|
|
@ -51,16 +51,15 @@
|
|||
#power-display__inner > div.power-screen__votage-output-container {
|
||||
display: flex;
|
||||
justify-content: space-evenly;
|
||||
margin-bottom: 1vw;
|
||||
}
|
||||
|
||||
.breaker-label__text {
|
||||
// background-color: #CDA08E;
|
||||
// background-color: #1F1115;
|
||||
color: black;
|
||||
font-size: 14px;
|
||||
font-size: 1vw;
|
||||
text-transform: uppercase;
|
||||
border: 2px solid black;
|
||||
padding: 4px;
|
||||
border: .2vw solid black;
|
||||
padding: .4vw;
|
||||
background-color: darken($color: #c2a693, $amount: 50%) ; // activated
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user