diff --git a/.github/CHANGELOG.md b/.github/CHANGELOG.md
index 661b37427e4..4d61df1a9eb 100644
--- a/.github/CHANGELOG.md
+++ b/.github/CHANGELOG.md
@@ -41,6 +41,7 @@
1. [FMGC] Only emit decel point when an approach is selected - @tracernz (Mike)
1. [MCDU] Fix padding of arc radii on F-PLN - @tracernz (Mike)
1. [FMGC] Allow stringing of STARs with non-runway approaches - @tracernz (Mike)
+1. [SD] Improve COND page visuals, fix some visual bugs on the SD - @lukecologne (luke)
## 0.8.0
diff --git a/src/instruments/src/SD/Common/CommonStyles.scss b/src/instruments/src/SD/Common/CommonStyles.scss
index 4e5e66cac76..952dc14141c 100644
--- a/src/instruments/src/SD/Common/CommonStyles.scss
+++ b/src/instruments/src/SD/Common/CommonStyles.scss
@@ -1,6 +1,8 @@
@import "../style.scss";
@import "../../Common/definitions.scss";
+.ecam-common-styles {
+
.ThickCyanLine {
stroke: $display-cyan !important;
stroke-width: 6;
@@ -124,3 +126,5 @@ tspan {
text-decoration-color: $display-white;
}
}
+
+}
diff --git a/src/instruments/src/SD/Pages/Cond/Cond.scss b/src/instruments/src/SD/Pages/Cond/Cond.scss
deleted file mode 100644
index 8f188123729..00000000000
--- a/src/instruments/src/SD/Pages/Cond/Cond.scss
+++ /dev/null
@@ -1,95 +0,0 @@
-@import "../../style";
-@import "../../Common/definitions";
-
-#cond-page {
-
- .st5 {
- fill: none;
- stroke: $display-green;
- stroke-width: 2;
- }
-
- .pump-off {
- fill: none;
- stroke: $display-amber;
- stroke-width: 2;
- }
-
- #titleAndWarnings {
-
- text {
- font-size: $font-size-xlarge;
- fill: $display-white;
- }
-
- .PageTitle {
- font-size: $font-size-title;
- text-decoration: underline;
- fill: $display-white;
- }
-
- .TempText {
- font-size: $font-size-xlarge;
- fill: $display-white;
- }
-
- .UnitText {
- font-size: $font-size-large;
- fill: $display-cyan;
- }
- }
-
-
- .CondPlane {
- stroke: $display-light-grey;
- stroke-width: 1;
- fill: none;
- }
-
- .Cond {
-
- text-anchor: middle !important;
-
- .title {
- font-size: $font-size-larger;
- fill: $display-white;
- }
-
- .valueText {
- font-size: $font-size-medium;
- fill: $display-green;
- }
-
- .DuctStatus {
- fill: $display-white;
- font-weight: bold;
- font-size: $font-size-huge;
- }
-
- .Gauge {
- fill: none;
- stroke: $display-white;
- stroke-width: 2;
- stroke-miterlimit: 10;
- }
-
- }
-
- #ValveAndTubes {
-
- .valve-moving > .st5 {
- stroke: $display-amber;
- }
-
- .DuctStatus {
- fill: $display-white;
- font-weight: bold;
- font-size: $font-size-huge;
- }
-
- .Hide {
- display:none;
- }
-
- }
-}
diff --git a/src/instruments/src/SD/Pages/Cond/Cond.tsx b/src/instruments/src/SD/Pages/Cond/Cond.tsx
index e41399b4e77..5b898c966bb 100644
--- a/src/instruments/src/SD/Pages/Cond/Cond.tsx
+++ b/src/instruments/src/SD/Pages/Cond/Cond.tsx
@@ -1,15 +1,17 @@
import React from 'react';
+import { SvgGroup } from '../../Common/SvgGroup';
import { render } from '../../../Common';
import { setIsEcamPage } from '../../../Common/defaults';
import { useSimVar } from '../../../Common/simVars';
+import Valve from './Valve';
-import './Cond.scss';
+import '../../Common/CommonStyles.scss';
setIsEcamPage('cond_page');
export const CondPage = () => {
// Disaply trim valve position for each zone
- const gaugeOffset = -50; // Gauges range is from -50 degree to +50 degree
+ const gaugeOffset = -43; // Gauges range is from -43 degree to +43 degree
const [cockpitSelectedTemp] = useSimVar('L:A32NX_OVHD_COND_CKPT_SELECTOR_KNOB', 'number', 1000);
const [cockpitTrimTemp] = useSimVar('L:A32NX_COND_CKPT_DUCT_TEMP', 'celsius', 1000);
@@ -28,50 +30,45 @@ export const CondPage = () => {
const [hotAir] = useSimVar('L:A32NX_AIRCOND_HOTAIR_TOGGLE', 'bool', 1000);
return (
- <>
-
-
+
);
};
@@ -81,40 +78,31 @@ type CondUnitProps = {
cabinTemp: number,
trimTemp: number,
x: number,
+ y: number,
offset: number,
hotAir: number
}
-const CondUnit = ({ title, selectedTemp, cabinTemp, trimTemp, x, offset, hotAir } : CondUnitProps) => {
- const rotateTemp = offset + (selectedTemp / 3);
- const polyPoints = `${x + 4},206 ${x},199 ${x - 4},206`;
- const gaugeD = `m ${x - 26} 208 Q ${x} 186 ${x + 26} 208`;
- const ductC = `${x - 40}`;
- const ductH = `${x + 40}`;
- const transformStyle = {
- transform: `rotate(${rotateTemp.toFixed(0)}deg)`,
- transformOrigin: `${x}px 230px`,
- };
+const CondUnit = ({ title, selectedTemp, cabinTemp, trimTemp, x, y, offset, hotAir } : CondUnitProps) => {
+ const rotateTemp = offset + (selectedTemp * 86 / 300);
return (
- <>
-
- {title}
- {cabinTemp.toFixed(0)}
- {trimTemp.toFixed(0)}
- C
- H
-
-
-
-
-
-
-
-
-
+
+ {title}
+ {cabinTemp.toFixed(0)}
+ {trimTemp.toFixed(0)}
+ C
+ H
+
+
+
+
+
+
+
+
-
+
);
};
diff --git a/src/instruments/src/SD/Pages/Cond/Valve.tsx b/src/instruments/src/SD/Pages/Cond/Valve.tsx
new file mode 100644
index 00000000000..aee3cd041bc
--- /dev/null
+++ b/src/instruments/src/SD/Pages/Cond/Valve.tsx
@@ -0,0 +1,21 @@
+import React, { FC } from 'react';
+
+interface ValveProps {
+ x: number,
+ y: number,
+ radius: number,
+ position: 'V' |'H',
+ css: string,
+ sdacDatum: boolean
+}
+
+const Valve: FC = ({ x, y, radius, position, css, sdacDatum }) => (
+
+
+ {!sdacDatum ? XX : null}
+ {sdacDatum && position === 'V' ? : null}
+ {sdacDatum && position === 'H' ? : null}
+
+);
+
+export default Valve;
diff --git a/src/instruments/src/SD/Pages/Fctl/Fctl.tsx b/src/instruments/src/SD/Pages/Fctl/Fctl.tsx
index 0036801bbb3..d1e48709f58 100644
--- a/src/instruments/src/SD/Pages/Fctl/Fctl.tsx
+++ b/src/instruments/src/SD/Pages/Fctl/Fctl.tsx
@@ -20,7 +20,7 @@ interface HydraulicSystemPairProps {
}
export const FctlPage = () => (
-