Skip to content
Snippets Groups Projects

Compare revisions

Changes are shown as if the source revision was being merged into the target revision. Learn more about comparing revisions.

Source

Select target project
No results found

Target

Select target project
  • xhavlic/pb138-film-database-group-project
1 result
Show changes
Commits on Source (4)
......@@ -11,6 +11,10 @@ import { MoviePage } from "./components/MoviePage";
import { DirectorPage } from "./components/DirectorPage";
import { BrowseDirectors } from "./components/BrowseDirectors";
export const mainColor = "#69c0ff"
export const middleColor = "#bae7ff"
export const sideColor = "#e6f7ff"
function App() {
return (
<div className="app">
......
......@@ -8,6 +8,7 @@ import {
import Meta from "antd/lib/card/Meta";
import { useEffect, useState } from "react";
import { Link } from "react-router-dom";
import { mainColor, middleColor, sideColor } from "../App";
import axiosConfig from "../axios-config";
import { CategoryDTO } from "../dto";
import { ErrorPage } from "./ErrorPage";
......@@ -39,7 +40,7 @@ export const BrowseMovies = () => {
return (
<div className="browse-container">
<Space direction="vertical" style={{ padding: "3rem", display: "flex"}} >
<Collapse >
<Collapse style={{background: sideColor}}>
{categories.map((category) => {
return (
<Panel header={category.name} key={category.id}>
......@@ -74,7 +75,7 @@ export const BrowseMovies = () => {
cover={
<Image
width={"16rem"}
style={{ objectFit: "cover" }}
style={{ objectFit: "cover"}}
src={movie.picture}
></Image>
}
......
......@@ -44,7 +44,7 @@ export const MoviePage = () => {
<Descriptions
title={movie.name}
bordered
style={{ padding: "5%" }}
style={{ padding: "5%",}}
>
<Descriptions.Item label="Title picture" span={3}>
<Image height={400} src={movie.picture}></Image>
......
import { Card, Col, Row } from "antd";
import Meta from "antd/lib/card/Meta";
import { Link } from "react-router-dom";
import { mainColor, middleColor, sideColor } 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, background: sideColor, borderRadius: "10px",}}>
<Row justify="space-evenly" align="bottom" gutter={50}>
{movies.map((movie) => {
return (
......@@ -20,6 +23,9 @@ export const PreviewBox: React.FC<IPreviewBoxProps> = ({ title, movies }) => {
hoverable
style={{
width: "240px",
borderWidth: "2px",
borderRadius: "5px",
borderColor: middleColor
}}
cover={<img alt={movie.name} src={movie.picture} />}
>
......