Add created by bn digital to header, fix container's height and heade…

…r-text width

src/components/header/Header.scss

@@ -1,4 +1,5 @@
 .app-header {
+  position: relative;
   height: 100vh;
   padding: 200px 56px 0 64px;
   background-color: #ffffff;
@@ -25,8 +26,28 @@
     }
 
     .header-text {
+      display: block;
+      max-width: 330px;
       font-weight: 500;
       color: #8d8d8f;
     }
   }
+
+  .rights {
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    display: flex;
+    align-items: center;
+    gap: 7px;
+    padding: 31px 65px 30px 65px;
+
+    span {
+      font-family: "Inter Medium";
+      font-size: 14px;
+      line-height: 1.15;
+      color: #8d8d8f;
+    }
+  }
 }

src/components/header/Header.tsx

@@ -1,8 +1,10 @@
 import { Button, Layout, Typography } from "antd";
 import logo from "../../assets/logo.png"
+import bnLogo from "../../assets/bn-logo.png"
 import './Header.scss'
 import { useNavigate } from "react-router-dom";
 
+
 const {Title, Text} = Typography
 const Header = () => {
   const navigate = useNavigate()
@@ -13,8 +15,12 @@ const Header = () => {
           <img src={logo}/>
           {'Mortgage Calculator'}</Button>
         <Title level={1}>{'Find your refinance options'}</Title>
-        <Text className={'header-text'}>{'Mortgage refinancing is when you replace your current home loan with a new one.\n' +
-          'This is a demo of a form submission.'}</Text>
+        <Text className={'header-text'}>{'Mortgage refinancing is when you replace your current home loan with a new one.'}</Text>
+        <Text className={'header-text'}>{'This is a demo of a form submission.'}</Text>
+      </div>
+      <div className={'rights'}>
+        <Text>{'created by'}</Text>
+        <img src={bnLogo}/>
       </div>
     </Layout.Sider>
   );

src/styles/global.scss

@@ -1,6 +1,6 @@
 .container {
   max-width: 960px;
-  height: 100%;
+  height: fit-content;
   margin: 0 auto;
   padding: 200px 176px 100px 144px;
 }