chore: fix panel display issue on firefox

Author: AXeL-dev

src/__tests__/__snapshots__/Panel.test.js.snap

@@ -20,7 +20,7 @@ exports[`renders panel correctly 1`] = `
       </h2>
     </div>
     <div
-      class="ub-dspl_flex ub-flx-drct_column ub-flx_1 ub-min-h_115px ub-pl_16px ub-pr_16px ub-pb_20px ub-pt_20px ub-box-szg_border-box"
+      class="ub-dspl_flex ub-flx-drct_column ub-min-h_115px ub-pl_16px ub-pr_16px ub-pb_20px ub-pt_20px ub-box-szg_border-box"
     >
       <div
         class="ub-dspl_flex ub-box-szg_border-box"

src/components/Panel/index.jsx

@@ -124,10 +124,10 @@ export class Panel extends Component {
   render() {
     return (
       <Pane minWidth={350}>
-        <Header />
         {!this.state.ready ? null : (
           <>
-            <Pane display="flex" flexDirection="column" flex={1} minHeight={115} paddingX={16} paddingY={20}>
+            <Header />
+            <Pane display="flex" flexDirection="column" minHeight={115} paddingX={16} paddingY={20}>
               {this.state.isEnabled && this.state.schedule.isEnabled ? (
                 <Pane display="flex">
                   <Pane display="flex" alignItems="center" flex={1}>

src/components/Timer/index.jsx

@@ -112,9 +112,9 @@ export class Timer extends Component {
   render() {
     return (
       <Pane minWidth={350}>
-        {/* <Header /> */}
         {!this.state.ready ? null : (
           <>
+            {/* <Header /> */}
             <Pane display="flex" minHeight={177} paddingX={16} paddingY={18} alignItems="center" justifyContent="center">
               <CountdownCircleTimer
                 key={this.state.key}