diff --git a/src/components/control-panel/branding.js b/src/components/control-panel/branding.js
new file mode 100644
index 00000000..722448ea
--- /dev/null
+++ b/src/components/control-panel/branding.js
@@ -0,0 +1,49 @@
+import React from 'react';
+import {
+ Box,
+ Stack,
+} from '@mui/joy';
+import apsLogo from '@images/aps-trans-logo.png';
+import noppLogo from '@images/nopp-logo.png';
+import { getBrandingHandler } from "@utils/map-utils";
+
+
+export const Branding = () => {
+
+ // get the branded website if any
+ let product_code = getBrandingHandler();
+ // for testing: let product_code = '&project_code=nopp';
+ if (product_code) {
+ product_code = product_code.split('=')[1];
+ }
+
+ return (
+
+ {product_code === "nopp" ?
+ (
+
+
+ )
+ :
+ (
+
+ )
+ }
+
+ );
+};
diff --git a/src/components/control-panel/control-panel.js b/src/components/control-panel/control-panel.js
index 244b3199..d70e6e23 100644
--- a/src/components/control-panel/control-panel.js
+++ b/src/components/control-panel/control-panel.js
@@ -6,7 +6,6 @@ import {
Accordion,
AccordionDetails,
AccordionSummary,
- Box,
Divider,
IconButton,
Stack,
@@ -23,8 +22,8 @@ import {
Water as MaxElevationIcon,
Waves as HIResMaxElevationIcon,
} from '@mui/icons-material';
-import apsLogo from '@images/aps-trans-logo.png';
import { getBrandingHandler, getNamespacedEnvParam } from "@utils/map-utils";
+import { Branding } from './branding';
const layerIcons = {
maxele63: ,
@@ -327,15 +326,7 @@ export const ControlPanel = () => {
}}
>
- {/* */}
-
-
-
+
diff --git a/src/images/nopp-logo.png b/src/images/nopp-logo.png
new file mode 100644
index 00000000..f906f129
Binary files /dev/null and b/src/images/nopp-logo.png differ