bugfixes and project slider updates

client/src/components/graphs/LinearProgress/index.tsx

@@ -2,13 +2,16 @@
 import './linear-progress.scss';
 
 interface Props {
-    percent: number
+    percent: number;
+    color: string;
 }
 
-export default function LinearProgress({ percent }: Props) {
+export default function LinearProgress({ percent, color }: Props) {
     return (
         <div className="linear-progress">
-            <div className="progress" style={{width: percent + '%'}}></div>
+            <div
+                className={'progress' + (color ? 'bg-gradient-horizontal-' + color : '')}
+                style={{ width: percent + '%' }}></div>
         </div>
     );
 }

client/src/components/layout/ProjectsSlider/projects-slider.scss

@@ -6,7 +6,7 @@
     overflow: hidden;
     white-space: nowrap;
     padding: 30px 30px;
-    margin: -30px -30px;
+    margin: -30px -42px;
     position: relative;
 
     .prev-button, .next-button {
@@ -51,14 +51,14 @@
             width: calc(50% - 24px);
         }
 
-        @include mx.breakpoint(xlarge) {
+        @include mx.breakpoint(large) {
             width: calc(33.3% - 24px);
         }
     }
 
     @include mx.breakpoint(large) {
         padding: 30px 90px;
-        margin: -30px -90px;
+        margin: -30px -102px;
 
         .prev-button {
             left: 70px;

client/src/components/ui/ProjectSlide/index.tsx

@@ -45,14 +45,17 @@ export default function ProjectSlide({ project }: ProjectSlideProps) {
                 }
             </div>
             <div className="details">
-                <AssigneeList assignees={assignees} max={3} />
+                {
+                    assignees.length > 0 &&
+                    <AssigneeList assignees={assignees} max={3} />
+                }
                 {
                     (time !== undefined && totalTime !== undefined)
                         ? (
                             <div className="progress">
-                                <LinearProgress percent={time / totalTime * 100} />
+                                <LinearProgress percent={time / totalTime * 100} color={project.color} />
                                 <div className="label">{(time / 60 / 60 / 1000).toFixed(2)}h /
-                                <strong>{(totalTime / 60 / 60 / 1000).toFixed(2)}h</strong></div>
+                                    <strong>{(totalTime / 60 / 60 / 1000).toFixed(2)}h</strong></div>
                             </div>
                         )
                         : <LoadingScreen />

client/src/pages/Landing/partials/Team/index.tsx

@@ -6,11 +6,13 @@ import Tag from 'components/ui/Tag';
 export default function Team() {
     return (
         <section className="team-section content-container">
-            <h2>Our Team</h2>
-            <p className="heading-lead">
-                People are what makes a project great, and here are the people that make us
-                great.
-            </p>
+            <header className="heading-container">
+                <h2>Our Team</h2>
+                <p className="heading-lead">
+                    People are what makes a project great, and here are the people that make us
+                    great.
+                </p>
+            </header>
             <div className="team-list">
                 <div className="team-member">
                     <img className="team-member-image" src={ImageDaniel} width="200" height="200"

client/src/pages/Landing/partials/Team/team.scss

@@ -3,6 +3,9 @@
 
 .landing-page {
     .team-section {
+        .heading-container {
+            text-align: center;
+        }
         .team-container {
             @include mx.breakpoint(large) {
                 display: flex;