Bring back the axis labels

Author: rinriko

src/components/LightCurvePlot.tsx

@@ -170,30 +170,58 @@ export default function LightCurvePlot() {
       const layout: PlotLayout = {
         height: 500,
         grid: { rows: 2, columns: 1, pattern: 'independent' },
-        margin: { l: 50, r: 30, t: 40, b: 40 },
+        margin: { l: 60, r: 40, t: 60, b: 60 },
+
+        // ───────── X1 (top panel) ─────────
         xaxis: {
-          title: xAxis, matches: 'x2', domain: [0.0, 1.0], anchor: 'y1',
-          titlefont: { size: labelFontSize }, tickfont: { size: labelFontSize }, showgrid: true
+          domain: [0, 1],
+          anchor: 'y1',
+          matches: 'x2',
+          title: { text: xAxis, standoff: 12 },
+          titlefont: { size: labelFontSize },
+          tickfont: { size: labelFontSize },
+          showgrid: true,
+          automargin: true,
         },
+
+        // ───────── Y1 (top panel) ─────────
         yaxis: {
-          title: 'SW: Surf Bright (MJy/sr)', domain: [0.51, 1.0], anchor: 'x2',
-          titlefont: { size: labelFontSize }, tickfont: { size: labelFontSize }, showgrid: true, automargin: true
+          domain: [0.52, 1],
+          anchor: 'x1',
+          title: { text: 'SW: Surf Bright (MJy/sr)', standoff: 10 },
+          titlefont: { size: labelFontSize },
+          tickfont: { size: labelFontSize },
+          showgrid: true,
+          automargin: true,
         },
+
+        // ───────── X2 (bottom panel) ─────────
         xaxis2: {
-          title: xAxis, domain: [0.0, 1.0], anchor: 'y2',
-          titlefont: { size: labelFontSize }, tickfont: { size: labelFontSize }, showgrid: true
+          domain: [0, 1],
+          anchor: 'y2',
+          title: { text: xAxis, standoff: 12 },
+          titlefont: { size: labelFontSize },
+          tickfont: { size: labelFontSize },
+          showgrid: true,
+          automargin: true,
         },
+
+        // ───────── Y2 (bottom panel) ─────────
         yaxis2: {
-          title: 'LW: Surf Bright (MJy/sr)', domain: [0.0, 0.49], anchor: 'x2',
-          titlefont: { size: labelFontSize }, tickfont: { size: labelFontSize }, showgrid: true, automargin: true
+          domain: [0, 0.48],
+          anchor: 'x2',
+          title: { text: 'LW: Surf Bright (MJy/sr)', standoff: 10 },
+          titlefont: { size: labelFontSize },
+          tickfont: { size: labelFontSize },
+          showgrid: true,
+          automargin: true,
         },
+
         annotations: annotations,
         legend: { font: { size: legendFontSize }, groupclick: 'toggleitem' },
         hoverlabel: { font: { size: tooltipFontSize } },
         font: { size: labelFontSize },
-        modebar: {
-          orientation: 'v', // Vertical modebar
-        },
+        modebar: { orientation: 'v' },
       };
 
       const fullData = [
@@ -221,13 +249,15 @@ export default function LightCurvePlot() {
       xaxis: axisX,
       yaxis: axisY,
     });
-
+    console.log("Updating figure with new styles");
+    console.log(figure?.layout);
     setSettings({
       figure: {
         data: [
           ...rawFigure.tracesSW.map(tr => applyStyle(tr, 'x2', 'y')),
           ...rawFigure.tracesLW.map(tr => applyStyle(tr, 'x2', 'y2')),
-        ], layout: figure?.layout || {}
+        ],
+        layout: figure?.layout || {}
       }
     });