diff --git a/.DS_Store b/.DS_Store
index b448bc0..8ad8af9 100644
Binary files a/.DS_Store and b/.DS_Store differ
diff --git a/prem-data/src/components/bar-chart/bar.css b/prem-data/src/components/bar-chart/bar.css
index 82908fe..4a0439d 100644
--- a/prem-data/src/components/bar-chart/bar.css
+++ b/prem-data/src/components/bar-chart/bar.css
@@ -17,11 +17,12 @@
}
.bar {
width: 100%;
- overflow: hidden; /* Hide overflow content */
+ overflow: hidden;
font-weight: 400;
display: flex;
align-items: center;
font-style: italic;
+ gap: 1em;
}
.value{
width: 15%;
diff --git a/prem-data/src/components/bar-chart/defensive-barchart.js b/prem-data/src/components/bar-chart/defensive-barchart.js
new file mode 100644
index 0000000..7dc754f
--- /dev/null
+++ b/prem-data/src/components/bar-chart/defensive-barchart.js
@@ -0,0 +1,66 @@
+import React from "react";
+import './bar.css';
+import { Bar } from "./bar";
+
+export function DefensiveBars(stats, percentileGroup){
+
+ var statistics = stats.stats;
+
+ return(
+
+
Defensive Work
+
+
Tackles and Interceptions per 90
+
+
+
+
Tackles Attempted per 90
+
+
+
+
+
Tackles in Attacking 3rd per 90
+
+
+
+
Tackles in Middle 3rd per 90
+
+
+
+
Tackles in Defensive 3rd per 90
+
+
+
+
Interceptions per 90
+
+
+
+
Dribblers Challenged per 90
+
+
+
+
Dribblers Tackled per 90
+
+
+
+
Challenges Lost per 90
+
+
+
+
+
Aerials Lost per 90
+
+
+
+
+ )
+}
\ No newline at end of file
diff --git a/prem-data/src/components/bar-chart/involvement-barchart.js b/prem-data/src/components/bar-chart/involvement-barchart.js
index 032dbe9..d1d22b6 100644
--- a/prem-data/src/components/bar-chart/involvement-barchart.js
+++ b/prem-data/src/components/bar-chart/involvement-barchart.js
@@ -8,27 +8,6 @@ export function InvolvementBars(stats, percentileGroup){
return(
-
Ball Security
-
-
Successful Take-ons per 90
-
-
-
-
Take-ons Attempted per 90
-
-
-
-
Successful Take-on percent
-
-
-
-
Times dispossessed per 90
-
-
-
Involvement
Touches per 90
@@ -51,8 +30,36 @@ export function InvolvementBars(stats, percentileGroup){
-
Passes Received per 90
-
+ Ball Recoveries per 90
+
+
+
+
Successful Take-ons per 90
+
+
+
+
Take-ons Attempted per 90
+
+
+
+
+
Fouls Committed per 90
+
+
+
+
Times dispossessed per 90
+
+
+
+
)
diff --git a/prem-data/src/components/bar-chart/passing-barchart.js b/prem-data/src/components/bar-chart/passing-barchart.js
index 80db139..dd62774 100644
--- a/prem-data/src/components/bar-chart/passing-barchart.js
+++ b/prem-data/src/components/bar-chart/passing-barchart.js
@@ -41,6 +41,18 @@ export function PassingBars(stats, percentileGroup){
Short Passes Completed per 90
+
+
+
+
Passes Offside per 90
+
+
)
}
\ No newline at end of file
diff --git a/prem-data/src/pages/page-style.css b/prem-data/src/pages/page-style.css
index 17aa868..c8e9935 100644
--- a/prem-data/src/pages/page-style.css
+++ b/prem-data/src/pages/page-style.css
@@ -91,6 +91,7 @@
display: flex;
gap: 1em;
box-sizing: border-box;
+ justify-content: space-between;
}
.chart-container{
max-height: fit-content;
@@ -136,14 +137,17 @@
box-sizing: border-box;
}
.numbers-container{
- width: 70%;
- display: grid;
- grid-template-columns: repeat(2, 1fr);
+ width: 65%;
+ display: flex;
+ /* grid-template-columns: repeat(2, 1fr); */
box-sizing: border-box;
+ overflow-x: scroll;
+ font-size: 0.8em;
}
.player-statistics{
padding: 1em;
box-sizing: border-box;
+ min-width: 45%;
}
@media screen and (max-width: 1023px) {
@@ -175,9 +179,14 @@
height: fit-content;
max-width: 80vw;
}
+}
+@media screen and (max-width: 800px) {
+ .player-statistics{
+ min-width: 90%;
+ }
.numbers-container{
- grid-template-rows: repeat(5, 1fr);
- grid-template-columns: none;
+ border-top: #C0C0C0 1px solid;
+ border-bottom: #C0C0C0 1px solid;
}
}
@@ -205,4 +214,28 @@
.player-page-position{
font-size: 0.5em;
}
+}
+@media screen and (min-width: 1800px) {
+ .player-name{
+ font-size: 1.8em;
+ }
+ .player-page-club{
+ font-size: 1em;
+ margin-bottom: 0.5em;
+ }
+ .player-page-position{
+ font-size: 1em;
+ }
+ .numbers-container{
+ font-size: 1.2em;
+ }
+ .chart-container p{
+ font-size: 1em;
+ }
+ .position-tabs button{
+ font-size: 1.5em;
+ }
+ .player-statistics{
+ min-width: 60%;
+ }
}
\ No newline at end of file
diff --git a/prem-data/src/pages/player-page-body/player-page-body.js b/prem-data/src/pages/player-page-body/player-page-body.js
index 8f2791c..d10daf8 100644
--- a/prem-data/src/pages/player-page-body/player-page-body.js
+++ b/prem-data/src/pages/player-page-body/player-page-body.js
@@ -5,6 +5,7 @@ import { CreationBars } from '../../components/bar-chart/creation-barchart';
import { ProgressionBars } from '../../components/bar-chart/progression-barchart';
import { InvolvementBars } from '../../components/bar-chart/involvement-barchart';
import { PassingBars } from '../../components/bar-chart/passing-barchart';
+import { DefensiveBars } from '../../components/bar-chart/defensive-barchart';
import {useState} from 'react';
function PlayerPageBody(props){
@@ -33,8 +34,9 @@ function PlayerPageBody(props){
- 1
- 1
+
+
+
)
diff --git a/prem-data/src/styles.css b/prem-data/src/styles.css
index 8889dd3..f225b28 100644
--- a/prem-data/src/styles.css
+++ b/prem-data/src/styles.css
@@ -152,3 +152,11 @@
flex-direction: column;
}
}
+@media screen and (min-width: 1800px) {
+ .player-card .player-info .player-name{
+ font-size: 2.5em;
+ }
+ .player-card .player-info .club-name{
+ font-size: 1.2em;
+ }
+}
diff --git a/server/.DS_Store b/server/.DS_Store
index 74b1fc5..a98c27d 100644
Binary files a/server/.DS_Store and b/server/.DS_Store differ