Add sponsort

FencerJudgeFront/src/app/app.module.ts

@@ -12,6 +12,7 @@ import { LogoutComponent } from './components/essentials/logout/logout.component
 import { MatchesComponent } from './components/match/matches/matches.component';
 import { MatchesIdComponent } from './components/match/matches-id/matches-id.component';
 import { MatchesAddComponent } from './components/match/matches-add/matches-add.component';
+import { SponsortComponent } from './templates/sponsort/sponsort.component';
 
 @NgModule({
   declarations: [
@@ -24,6 +25,7 @@ import { MatchesAddComponent } from './components/match/matches-add/matches-add.
     MatchesComponent,
     MatchesIdComponent,
     MatchesAddComponent,
+    SponsortComponent,
   ],
   imports: [BrowserModule, AppRoutingModule, FormsModule],
   providers: [],

FencerJudgeFront/src/app/components/home/home.component.html

@@ -1 +1 @@
-<p>HELLO !</p>
+<app-sponsort></app-sponsort>

FencerJudgeFront/src/app/templates/sponsort/sponsort.component.css

@@ -0,0 +1,56 @@
+@keyframes slides {
+  from {
+    transform: translateX(0);
+  }
+  to {
+    transform: translateX(-100%);
+  }
+}
+
+.logos {
+  overflow: hidden;
+  padding: 30px 0px;
+  white-space: nowrap;
+  position: relative;
+}
+
+.logos:before,
+.logos:after {
+  position: absolute;
+  top: 0;
+  content: "";
+  width: 250px;
+  height: 100%;
+  z-index: 2;
+}
+
+.logos:before {
+  left: 0;
+  background: linear-gradient(
+    to left,
+    rgba(255, 255, 255, 0),
+    rgb(255, 255, 255)
+  );
+}
+
+.logos:after {
+  right: 0;
+  background: linear-gradient(
+    to right,
+    rgba(255, 255, 255, 0),
+    rgb(255, 255, 255)
+  );
+}
+
+.logo_items {
+  display: inline-block;
+  animation: 35s slides infinite linear;
+}
+
+.logos:hover .logo_items {
+  animation-play-state: paused;
+}
+
+.logo_items img {
+  height: 100px;
+}

FencerJudgeFront/src/app/templates/sponsort/sponsort.component.html

@@ -0,0 +1,23 @@
+<div class="logos">
+  <div class="logo_items">
+    <img
+      src="https://upload.wikimedia.org/wikipedia/en/9/93/French_Fencing_Federation_logo.png"
+    />
+    <img
+      src="https://apollon.de/wp-content/uploads/2022/11/allstar_Logo_red_4c-1.png"
+    />
+    <img
+      src="https://oca.asia/media/sports/federations/logos/1920px-International_Fencing_Federation_logo.svg.png"
+    />
+    <img
+      src="https://www.leonpaul.com/media/wysiwyg/logos/Round_Leon-Paul_London-outlines800-W_B.jpg"
+    />
+    <img src="https://trademarks.justia.com/media/image.php?serial=79024409" />
+    <img
+      src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSKR6GOyFsui_qK69EuxP7iGvrh590QkDTciA&s"
+    />
+    <img
+      src="https://www.prieur-sports.us/assets/images/prieur-sport-fencing-equipment.png"
+    />
+  </div>
+</div>

FencerJudgeFront/src/app/templates/sponsort/sponsort.component.spec.ts

@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { SponsortComponent } from './sponsort.component';
+
+describe('SponsortComponent', () => {
+  let component: SponsortComponent;
+  let fixture: ComponentFixture<SponsortComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [SponsortComponent]
+    })
+    .compileComponents();
+
+    fixture = TestBed.createComponent(SponsortComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

FencerJudgeFront/src/app/templates/sponsort/sponsort.component.ts

@@ -0,0 +1,11 @@
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'app-sponsort',
+  standalone: false,
+  templateUrl: './sponsort.component.html',
+  styleUrl: './sponsort.component.css'
+})
+export class SponsortComponent {
+
+}