Merge branch 'development' of https://github.com/rotirk20/smetovi int…

…o development

angular.json

@@ -100,5 +100,8 @@
         }
       }
     }
+  },
+  "cli": {
+    "analytics": false
   }
 }

src/app/location-card/location-card.component.html

@@ -0,0 +1,16 @@
+<div class="py-6 px-6 max-w-sm mx-auto bg-white rounded-xl space-y-2 sm:py-4 sm:flex sm:items-center sm:space-y-0 sm:space-x-6 w-full mb-4 shadow-lg">
+  <img class="block mx-auto h-16 w-16 rounded-full sm:mx-0 sm:flex-shrink-0" [src]="location.image" alt="">
+  <div class="text-center space-y-2 sm:text-left">
+    <div class="space-y-0.5">
+      <p class="text-lg text-black font-semibold">
+        {{ location.name }}
+      </p>
+      <p class="text-gray-500 font-medium">
+        {{ location.address }}
+      </p>
+      <p class="text-gray-600 font-small">
+        Kategorija: {{ location.type }}
+      </p>
+    </div>
+  </div>
+</div>

src/app/location-card/location-card.component.spec.ts

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

src/app/location-card/location-card.component.ts

@@ -0,0 +1,20 @@
+import { Component, Input } from '@angular/core';
+
+export interface Location {
+  id: number;
+  name: string;
+  address: string;
+  type: string;
+  image?: string;
+}
+
+@Component({
+  selector: 'app-location-card',
+  standalone: true,
+  imports: [],
+  templateUrl: './location-card.component.html',
+  styleUrls: ['./location-card.component.scss'],
+})
+export class LocationCardComponent {
+  @Input() location: Location = {} as Location;
+}

src/app/pages/location/location.component.html

@@ -1,3 +1,12 @@
 <main class="flex h-screen items-center justify-center bg-gray-100">
-    <h1 class="text-center text-4xl leading-relaxed">U pripremi</h1>
-</main>
+  <div class="w-full lg:flex">
+    <div class="lg:w-1/2">
+      <ng-container *ngFor="let locationItem of locations">
+        <app-location-card [location]="locationItem"></app-location-card>
+      </ng-container>
+    </div>
+    <div class="lg:w-1/2">
+     <h1>Google map</h1>
+    </div>
+  </div>
+</main>

src/app/pages/location/location.component.ts

@@ -1,10 +1,36 @@
 import { Component } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { LocationCardComponent } from 'src/app/location-card/location-card.component';
+import { Location } from 'src/app/location-card/location-card.component';
+
+const DUMMY_LOCATIONS = [
+  {
+    id: 1,
+    name: 'Konjicki klub "Smet"',
+    address: 'Smetovi bb',
+    type: 'Zooloski vrt',
+    image: 'https://images.pexels.com/photos/808465/pexels-photo-808465.jpeg',
+  },
+  {
+    id: 2,
+    name: 'Restoran Smetovi',
+    address: 'Smetovi bb',
+    type: 'Restoran',
+    image:
+      'https://images.pexels.com/photos/552785/pexels-photo-552785.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2',
+  },
+];
 
 @Component({
   selector: 'app-location',
+  standalone: true,
+  imports: [LocationCardComponent, CommonModule],
   templateUrl: './location.component.html',
   styleUrls: ['./location.component.scss']
 })
-export class LocationComponent {
 
+
+
+export class LocationComponent {
+  locations: Location[] = DUMMY_LOCATIONS;
 }