feat: added borders to cards

frontend/src/App.tsx

@@ -11,6 +11,8 @@ import { MoviePage } from "./components/MoviePage";
 import { DirectorPage } from "./components/DirectorPage";
 import { BrowseDirectors } from "./components/BrowseDirectors";
 
+export const mainColor = "#bae7ff"
+
 function App() {
   return (
     <div className="app">

frontend/src/components/PreviewBox.tsx

 import { Card, Col, Row } from "antd";
 import Meta from "antd/lib/card/Meta";
 import { Link } from "react-router-dom";
+import { mainColor } from "../App";
 import { MovieDTO } from "../dto";
 
 interface IPreviewBoxProps {
@@ -9,8 +10,10 @@ interface IPreviewBoxProps {
 }
 
 export const PreviewBox: React.FC<IPreviewBoxProps> = ({ title, movies }) => {
+  
+  
   return (
-    <Card title={title}>
+    <Card title={title}  style={{ borderWidth: 4, borderColor:mainColor}}>
       <Row justify="space-evenly" align="bottom" gutter={50}>
         {movies.map((movie) => {
           return (
@@ -20,6 +23,8 @@ export const PreviewBox: React.FC<IPreviewBoxProps> = ({ title, movies }) => {
                   hoverable
                   style={{
                     width: "240px",
+                    borderWidth: "2px",
+                    borderColor: mainColor
                   }}
                   cover={<img alt={movie.name} src={movie.picture} />}
                 >