add resource page - in process

angular.json

 {
   "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
+  "cli": {
+    "analytics": false
+  },
   "version": 1,
   "newProjectRoot": "projects",
   "projects": {
@@ -27,7 +30,11 @@
               "src/assets"
             ],
             "styles": [
-              "src/styles.css"
+              "src/styles.css",
+              "node_modules/primeicons/primeicons.css",
+              "node_modules/primeng/resources/themes/md-light-indigo/theme.css",
+              "node_modules/primeng/resources/primeng.css",
+              "node_modules/primeflex/primeflex.scss"
             ],
             "scripts": []
           },

package.json

@@ -18,12 +18,17 @@
     "@angular/platform-browser": "~12.0.2",
     "@angular/platform-browser-dynamic": "~12.0.2",
     "@angular/router": "~12.0.2",
+    "package.json": "~2.0.1",
+    "primeflex": "~2.0.0",
+    "primeicons": "~4.1.0",
+    "primeng": "~12.0.0-rc.1",
     "rxjs": "~6.6.0",
     "tslib": "^2.1.0",
     "zone.js": "~0.11.4"
   },
   "devDependencies": {
     "@angular-devkit/build-angular": "~12.0.2",
+    "@angular/cdk": "~12.0.2",
     "@angular/cli": "~12.0.2",
     "@angular/compiler-cli": "~12.0.2",
     "@types/jasmine": "~3.6.0",

src/app/app-routing.module.ts

 import { NgModule } from '@angular/core';
 import { RouterModule, Routes } from '@angular/router';
+import {HomeComponent} from './component/home/home.component';
+import {ResourceComponent} from "./component/resource/resource.component";
+import {AddResourceComponent} from "./component/add-resource/add-resource.component";
 
-const routes: Routes = [];
+const routes: Routes = [
+  {path: '', component: HomeComponent, pathMatch: 'full'},
+  {path: 'home', component: HomeComponent, pathMatch: 'full'},
+  {path:'resource/add', component:AddResourceComponent, pathMatch:'full'},
+  {path:'resource/:id', component:ResourceComponent, pathMatch:'full'}
+
+
+];
 
 @NgModule({
   imports: [RouterModule.forRoot(routes)],

src/app/app.component.ts

-import { Component } from '@angular/core';
+import {Component, ViewEncapsulation} from '@angular/core';
+import {MenuItem, PrimeNGConfig} from "primeng/api";
 
 @Component({
   selector: 'app-root',
@@ -7,4 +8,10 @@ import { Component } from '@angular/core';
 })
 export class AppComponent {
   title = 'ipmworks-web';
+  items: MenuItem[] = [] ;
+  constructor(private primengConfig: PrimeNGConfig) { }
+
+  ngOnInit() {
+
+  }
 }

src/app/app.module.ts

 import { NgModule } from '@angular/core';
 import { BrowserModule } from '@angular/platform-browser';
-
 import { AppRoutingModule } from './app-routing.module';
 import { AppComponent } from './app.component';
+import {MenubarModule} from 'primeng/menubar';
+import {MenuModule} from 'primeng/menu';
+import {ButtonModule} from 'primeng/button';
+import {BrowserAnimationsModule} from "@angular/platform-browser/animations";
+import {HomeComponent} from './component/home/home.component';
+import {AccordionModule} from 'primeng/accordion';
+import {SharedModule} from "primeng/api";
+import {CheckboxModule} from 'primeng/checkbox';
+import {FormsModule} from "@angular/forms";
+import {DataViewModule} from "primeng/dataview";
+import {RatingModule} from "primeng/rating";
+import {RouterModule} from "@angular/router";
+import {HttpClientModule} from "@angular/common/http";
+import {MultiSelectModule} from 'primeng/multiselect';
+import {DropdownModule} from "primeng/dropdown";
+import {InputTextModule} from "primeng/inputtext";
+import {TooltipModule} from "primeng/tooltip";
+import {CardModule} from "primeng/card";
+import {TagModule} from "primeng/tag";
+import { ResourceComponent } from './component/resource/resource.component';
+import { AddResourceComponent } from './component/add-resource/add-resource.component';
+import {InputTextareaModule} from "primeng/inputtextarea";
+import {RadioButtonModule} from "primeng/radiobutton";
+
 
 @NgModule({
   declarations: [
-    AppComponent
+    AppComponent,
+    HomeComponent,
+    ResourceComponent,
+    AddResourceComponent
   ],
   imports: [
     BrowserModule,
-    AppRoutingModule
+    BrowserAnimationsModule,
+    AppRoutingModule,
+    MenubarModule,
+    ButtonModule,
+    MenuModule,
+    AccordionModule,
+    SharedModule,
+    CheckboxModule,
+    FormsModule,
+    DataViewModule,
+    RatingModule,
+    RouterModule,
+    HttpClientModule,
+    MultiSelectModule,
+    DropdownModule,
+    InputTextModule,
+    TooltipModule,
+    CardModule,
+    TagModule,
+    InputTextModule,
+    CheckboxModule,
+    ButtonModule,
+    RadioButtonModule,
+    InputTextareaModule,
   ],
   providers: [],
   bootstrap: [AppComponent]

src/app/component/add-resource/add-resource.component.css

-.imageSizeHome{
-  max-width: 100%;
-  max-height: 120px;
-  display: block;
-  margin-left: auto;
-  margin-right: auto;
-}

src/app/component/add-resource/add-resource.component.ts

-import {Component, Inject, LOCALE_ID, OnInit} from '@angular/core';
-import {ResourceType, Language, Region, Sector, Project, Resource, Pest, Crop} from "../../model/resource";
+import { Component, OnInit } from '@angular/core';
+import {ContentType, Language, Region, Sector} from "../../model/resource";
 import {ResourceService} from "../../service/resource.service";
-import {ConfirmationService, MessageService} from 'primeng/api';
-import {ActivatedRoute, Router} from "@angular/router";
-import {FormControl} from "@angular/forms";
-import {environment} from "../../../environments/environment";
-
 
 @Component({
   selector: 'app-add-resource',
@@ -15,178 +10,15 @@ import {environment} from "../../../environments/environment";
 export class AddResourceComponent implements OnInit {
   sectors: Sector[] = [];
   regions: Region[] = [];
-  resourceTypes: ResourceType[] = [];
+  contentTypes: ContentType[] = [];
   languages: Language[] = [];
-  projects: Project[] = [];
-  pests:Pest[] = [];
-  crops: Crop [] = [];
-  resource: Resource = {};
-  image: any;
-  resourceContent: File[] = [];
-  displayPestModal=false;
-  displayCropModal=false;
-  newPest:Pest = {};
-  newCrop: Crop = {};
-  resourceControl = new FormControl('');
-  resourceId?:string;
-  edit:boolean = false;
-  imageExist:boolean = false;
-  imagePath = environment.baseUrl+"/resource/image/raw";
-  showOldImg = true;
-  logo: any;
-  showOldLogo = true;
-  logoExist:boolean = false;
-  displayTerms = false;
-  termChecked = false;
-
-  constructor(private resourceService:ResourceService, private route: ActivatedRoute, private messageService: MessageService, private router: Router, @Inject(LOCALE_ID) public locale: string, private confirmationService: ConfirmationService) { }
+  constructor(private resourceService:ResourceService) { }
 
   ngOnInit(): void {
-    this.resourceService.getAllSectors().subscribe((sectors: Sector[]) => {
-      this.sectors = sectors;});
-    this.resourceService.getAllRegions().subscribe((regions: Region[]) => {
-      this.regions = regions;});
-    this.resourceService.getAllResourceTypes().subscribe((contentTypes: ResourceType[]) => {
-      this.resourceTypes = contentTypes;});
-    this.resourceService.getAllLanguages().subscribe((languages: Language[]) => {
-      this.languages = languages;});
-    this.resourceService.getAllProjects().subscribe((projects: Project[]) => {
-      this.projects = projects;});
-    this.resourceService.getAllPests().subscribe((pests: Pest[]) => {
-      this.pests = pests;});
-
-    this.resourceService.getAllCrops().subscribe((crops: Crop[]) => {
-      this.crops = crops;});
-
-    // @ts-ignore
-    this.resourceId = this.route.snapshot.paramMap.get('id');
-    if(this.resourceId != undefined){
-      // @ts-ignore
-      this.resourceService.getResource(this.resourceId).subscribe(data =>{
-        this.resource = data;
-        this.edit = true;
-      });
-      this.resourceService.hasImage(this.resourceId,"image").subscribe( data =>{
-        this.imageExist = data
-      });
-      this.resourceService.hasImage(this.resourceId,"logo").subscribe( data =>{
-        this.logoExist = data
-      });
-    }
-
-  }
-
-  saveResource(){
-    this.resource.canEdit=true;
-    this.resourceService.saveResource(this.resource,this.edit).subscribe((data: Resource) => {
-      this.resource = data;
-      this.resourceService.addFiles(this.image, this.logo, this.resourceContent, this.resource.idResource).subscribe(data => {
-          if(!this.edit){
-            this.messageService.add({severity: 'success', detail: 'Resource is saved, but need to be approved by administrator!'});
-            this.router.navigate(['/home']);
-          }else{
-            this.messageService.add({severity: 'success', detail: 'Resource is updated!'});
-            this.router.navigate(['/resource/'+this.resourceId]);
-          }
-
-        }, error => {
-          this.messageService.add({severity: 'error', detail: 'Some error occurred!'})
-        });
-    },error => {
-      //TODO obrisati sve fajlove koji su se mozda sacuvali ako je doslo do greske
-      this.messageService.add({severity: 'error', detail: 'Some error occurred!'})
-    });
-    }
-
-  public fileUploader(type:string,event:any){
-    if(type === 'image'){
-        this.image = event.files[0]
-    }
-    else if(type === 'logo'){
-      this.logo = event.files[0]
-    }
-    else{
-      this.resourceContent = event.files;
-    }
-  }
-  public openPestModal(){
-    // @ts-ignore
-    if (this.resource.pests.filter(e => e.commonName === 'Other').length > 0) {
-      this.displayPestModal=true;
-    }
-  }
-
-  public addPest(){
-    // @ts-ignore
-    var selectedPests = this.resource.pests.filter(function(el) { return el.commonName != "Other"; });
-    this.resource.pests = selectedPests;
-    this.resource.pests.push(this.newPest);
-    this.pests.push(this.newPest);
-    this.newPest={};
-    this.displayPestModal=false;
+    this.sectors = this.resourceService.getAllSectors();
+    this.regions = this.resourceService.getAllRegions();
+    this.contentTypes = this.resourceService.getAllContentTypes();
+    this.languages = this.resourceService.getAllLanguages();
   }
 
-  public openCropModal(){
-    // @ts-ignore
-    if (this.resource.crops.filter(e => e.commonName === 'Other').length > 0) {
-      this.displayCropModal=true;
-    }
-  }
-
-  public addCrop(){
-    // @ts-ignore
-    var selectedCrops = this.resource.crops.filter(function(el) { return el.commonName != "Other"; });
-    this.resource.crops = selectedCrops;
-    this.resource.crops.push(this.newCrop);
-    this.crops.push(this.newCrop);
-    this.newCrop={};
-    this.displayCropModal=false;
-  }
-  hideOldImage(){
-    this.showOldImg = false;
-  }
-  removeImage(){
-    this.image=undefined;
-    this.showOldImg = true;
-  }
-  hideOldLogo(){
-    this.showOldLogo = false;
-  }
-  removeLogo(){
-    this.logo=undefined;
-    this.showOldLogo = true;
-  }
-  showTerms(){
-    this.displayTerms = true;
-  }
-  delete(fileId?: String) {
-    this.confirmationService.confirm({
-      message: 'Are you sure that you want to delete resource?',
-      icon: 'pi pi-exclamation-triangle',
-      accept: () => {
-        // @ts-ignore
-        this.resourceService.deleteFile(fileId).subscribe(r => {
-            this.messageService.add({severity: 'success', detail: 'Resource has been deleted.'});
-            this.router.navigate(['/resource/edit/'+this.resource.idResource]);
-          }, error => {
-            this.messageService.add({severity: 'error', detail: 'Some error occurred!'});
-          }
-        );
-      }
-    });
-  }
-  downloadFile(fileName: any): void {
-    this.resourceService.downloadFile(fileName).subscribe((file: any) => {
-      const blob = new Blob([file], {type: file.type});
-
-      var url = window.URL.createObjectURL(blob);
-      /*const link = document.createElement('a');
-      link.href = this.url;
-      link.target="_blank";
-      link.download = fileName;*/
-      window.open(url,"_blank")
-    }, error => {
-      console.log(error)
-    });
-  }
 }

src/app/component/home/home.component.css

-.imageSizeHome{
-  max-width: 100%;
-  max-height: 120px;
-  display: block;
-  margin-left: auto;
-  margin-right: auto;
-}
+
 .card {
   padding: 2rem;
   box-shadow: 0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);
   border-radius: 4px;
   margin-bottom: 2rem;
-  justify-content: space-between;
 }
 .button-center{
   display: flex;
@@ -34,8 +27,5 @@
   padding:5px;
   display: inline-block;
 }
-.hoverResource:hover{
-  background: rgba(63, 81, 181, 0.04);
-  cursor: pointer;
 
-}
+

src/app/component/home/home.component.ts

-import {Component, Inject, LOCALE_ID, OnDestroy, OnInit} from '@angular/core';
-import {
-  Crop,
-  Keyword,
-  Language,
-  PageableResource,
-  Pest,
-  Project,
-  Region,
-  Resource,
-  ResourceType,
-  Sector
-} from "../../model/resource";
+import { Component, OnInit } from '@angular/core';
+import {ContentType, Keyword, Language, Region, Resource, Sector} from "../../model/resource";
 import {ResourceService} from "../../service/resource.service";
-import {Message, MessageService} from "primeng/api";
-import {environment} from "../../../environments/environment";
-import {SearchModel} from "../../model/search-model";
-import {NavigationEnd, Router} from "@angular/router";
-
 @Component({
   selector: 'app-home',
   templateUrl: './home.component.html',
   styleUrls: ['./home.component.css']
 })
-export class HomeComponent implements OnInit{
+export class HomeComponent implements OnInit {
   resources: Resource[] = [];
-  totalResources: Resource[] = [];
-  search:boolean=false;
-  pageableResponse?: PageableResource;
-  pageSize = 10;
-  totalElements: number = 0;
   sectors: Sector[] = [];
   regions: Region[] = [];
-  projects: Project[] = [];
-  crops:Crop[] = [];
-  pests: Pest[] = [];
-  pestType: object[] = [{name:"weeds"}, {name:"disease"},{name:"invertebrate"}];
-  contentTypes: ResourceType[] = [];
+  contentTypes: ContentType[] = [];
   languages: Language[] = [];
   keywords: Keyword[] = [];
-  disclaimer: Message[] = [];
+
   selectedSectors: Sector[] = [];
   selectedRegions: Region[] = [];
-  selectedTypes: ResourceType[] = [];
+  selectedTypes: ContentType[] = [];
   selectedLanguages: Language[] = [];
-  selectedProjects: Project[] = [];
-  selectedCrops: Crop[] = [];
-  selectedPests:Pest[] = [];
-  selectedPestType: string | undefined;
-  serachRunning= false;
+  selectedKeywords: Keyword[] = [];
   searchTerm: string = "";
-  more= true;
-  close = false;
-  imagePath = environment.baseUrl+"/resource/image";
-  imagePathRaw = environment.baseUrl+"/resource/image/raw";
-  searchModel:SearchModel = {};
-  loading:boolean = true;
-  counter:number = 0;
-  constructor(private resourceService:ResourceService, private router:Router,private messageService: MessageService, @Inject(LOCALE_ID) public locale: string) {
-    this.pageableResponse = {totalElements:0}
-  }
+  more= false;
+
+
+  constructor(private resourceService:ResourceService) { }
 
   ngOnInit(): void {
-    this.resourceService.getAllProjects().subscribe((projects: Project[]) => {
-      this.projects = projects;});
-    this.resourceService.getAllSectors().subscribe((sectors: Sector[]) => {
-      this.sectors = sectors;});
-    this.resourceService.getAllRegions().subscribe((regions: Region[]) => {
-      this.regions = regions;});
-    this.resourceService.getAllResourceTypes().subscribe((contentTypes: ResourceType[]) => {
-      this.contentTypes = contentTypes;});
-    this.resourceService.getAllLanguages().subscribe((languages: Language[]) => {
-      this.languages = languages;});
-    this.resourceService.getAllPests().subscribe((pests: Pest[]) => {
-      this.pests = pests;});
-    this.resourceService.getAllCrops().subscribe((crops: Crop[]) => {
-      this.crops = crops;});
-    this.resourceService.getAllResources().subscribe((resources: PageableResource) => {
-      // @ts-ignore
-      this.resources = resources.content;
-      // @ts-ignore
-      this.totalElements = resources.totalElements;
-      this.search = false;
-      this.serachRunning=false;
-    });
+    this.sectors = this.resourceService.getAllSectors();
+    this.regions = this.resourceService.getAllRegions();
+    this.contentTypes = this.resourceService.getAllContentTypes();
+    this.languages = this.resourceService.getAllLanguages();
+    this.resources = this.resourceService.getAllResources()
+    this.keywords = this.resourceService.getAllKeywords()
     }
-  public closeDisclaimer(){
-    this.close = true;
-  }
+
     public toggleFilters(){
     //kada se zatvore dodatni filteri isprazniti ako je nesto bilo selektovano u tim filterima
     this.more = !this.more;
     }
-    public searchResource(){
-      // @ts-ignore
-      this.serachRunning = true;
-      this.resourceService.searchResource(this.searchModel).subscribe((resources: Resource[]) => {
-        this.resources = resources;
-        this.totalResources = resources;
-        this.totalElements = resources.length
-        this.search = true;
-        this.serachRunning=false;
-      },error => {
-        this.messageService.add({severity: 'error', detail: 'Some error occurred!'})
-        this.serachRunning=false;
-      });
-    }
-
-  onPageChange(event:any) {
-    if (this.search === false){
-      var pNum = event.first / event.rows
-      this.resourceService.getAllResources(pNum, event.rows,)
-      .subscribe(ret => this.populate(ret));
-    }else {
-      this.resources = this.totalResources.slice(event.first, this.totalResources.length)
-    }
-  }
-  populate(ret: PageableResource) {
-    this.pageableResponse = ret;
-    // @ts-ignore
-    this.resources = this.pageableResponse?.content;
-    // @ts-ignore
-    this.totalElements = this.pageableResponse.totalElements;
-  }
-  public resetSearch(){
-    this.router.navigate(['home']);
-
-    /*this.serachRunning=true;
-    this.resourceService.getAllResources().subscribe((resources: PageableResource) => {
-      // @ts-ignore
-      this.resources = resources.content;
-      // @ts-ignore
-      this.totalElements = resources.totalElements;
-      this.searchModel = {};
-      this.search = false;
-      this.serachRunning=false;*/
-
-    //});
-  }
-  isEmptySearch(){
-    return JSON.stringify(this.searchModel) === '{}';
-  }
-  public getRegion(resource:Resource){
-    if (resource.regions !== undefined && resource.regions?.length >1){
-      return "EU"
-    }else if (resource.regions?.length ===1){
-      // if(this.locale !== 'en'){
-      //   return Reflect.get(resource.regions[0],'name_'+this.locale)
-      // }else{
-        return resource.regions[0].name;
-      //}
-    }else{
-      return "EU"
-    }
-  }
-  public getResourceType(resource:Resource){
-      // if(this.locale !== 'en'){
-      //   // @ts-ignore
-      //   return Reflect.get(resource.resourceType,'name_'+this.locale)
-      // }else{
-        // @ts-ignore
-        return resource.resourceType.name;
-     // }
-  }
-  public getProject(resource:Resource){
-    if (resource.sectors == undefined|| resource.sectors.length==0 ){
-      return null;
-    }else{
-      return resource.project;
-    }
-  }
-  public getLang(){
-    if (this.searchModel.language !=undefined){
-      return this.searchModel.language[0].code;
-    }
-    return "";
-  }
 }

src/app/component/resource/resource.component.css

-.imageSize{
-  max-height: 400px;
-  max-width: 100%;
-}
-.horizontal{
-  padding:5px;
-  display: inline-block;
-}
-.sector{
-  width:25px;
-  height:25px;
-}
-.button-center{
-  display: flex;
-  justify-content: space-around;
-}
-.button-link{
-  background-color: unset !important;
-}
-
-.overflow-text{
-  overflow-wrap: anywhere;
-}
-.link-wrap {
-  white-space: pre-wrap; /* CSS3 */
-  white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
-  white-space: -o-pre-wrap; /* Opera 7 */
-  word-wrap: break-word; /* Internet Explorer 5.5+ */
-}
-.keep-format{
-  white-space: pre-wrap;
-}

src/app/component/resource/resource.component.html

-<div class="grid pt-6 pl-6 flex flex-wrap">
-  <div class="flex col-12 justify-content-center">
-    <p class="text-3xl">{{resource.resourceName}}
-    </p>
-  </div>
-  <div class="md:col-6 flex flex-column">
-    <div class="col-12 text-center">
-      <img [src]="imagePath+'/'+resourceId" class="imageSize" >
-    </div>
-    <div class="col-12">
-      <p-panel class="col-12 inline">
-        <div class="flex align-items-center"><div class="col-3 inline my-0" [ngStyle]="{color:'var(--surface-500)'}" i18n="@@{project}">Project</div><div class="my-0">{{resource.project}}</div></div>
-        <div class="flex align-items-center"><div class="col-3 inline my-0" [ngStyle]="{color:'var(--surface-500)'}" i18n="@@{language}">Resource language</div><div class="my-0">{{resource.language?.name}}</div></div>
-        <div class="flex align-items-center"><div class="col-3 inline my-0" [ngStyle]="{color:'var(--surface-500)'}" i18n="@@{resourceOrigin}">Resource origin</div> <div class="my-0 overflow-text"><a href="{{resource.resourceOrigin}}" target="_blank">{{resource.resourceOrigin}}</a></div></div>
-        <div class="flex align-items-center"> <div class="col-3 inline my-0" [ngStyle]="{color:'var(--surface-500)'}" i18n="@@{resourceType}">Resource type</div><div class="my-0">{{resource.resourceType?.name}}</div></div>
-        <div class="flex align-items-center"><div class="col-3 inline my-0" [ngStyle]="{color:'var(--surface-500)'}" i18n="@@{contactInstitution}">Organization name</div><div class="my-0">{{resource.contactInstitution}}</div></div>
-        <div class="flex align-items-center"><div class="col-3 inline my-0"[ngStyle]="{color:'var(--surface-500)'}" i18n="@@{contactEmail}">Contact email</div><div class="my-0"></div>{{resource.contactEmail}}</div>
-        <div class="flex align-items-center"><div class="col-3 inline my-0"[ngStyle]="{color:'var(--surface-500)'}" i18n="@@{contactPhone}">Contact phone</div><div class="my-0">{{resource.contactPhone}}</div></div>
-        <div class="flex align-items-center"><div class="col-3 inline my-0" [ngStyle]="{color:'var(--surface-500)'}" i18n="@@{citation}">Citation (DOI)</div><div class="overflow-text my-0">{{resource.citation}}</div></div>
-      </p-panel>
-    </div>
-  </div>
-  <div class="md:col-6 flex flex-column">
-  <p-panel i18n-header="@@{short_summary}" header="Short summary" class="col-12 p-d-block">
-      <div *ngIf="resource.descriptionNative == undefined" class="flex keep-format" [innerHTML]="resource.description"></div>
-    <p-tabView *ngIf="resource.descriptionNative != undefined">
-      <p-tabPanel i18n-header="@@{tab_english}" header="English" >
-        <div class="flex keep-format"> {{resource.description}}</div>
-      </p-tabPanel>
-      <p-tabPanel i18n-header="@@{tab_native}}" header="Native">
-        <div class="flex keep-format"> {{resource.descriptionNative}}</div>
-      </p-tabPanel>
-    </p-tabView>
-      <div class="flex mt-5">
-        <div class="inline col-3 my-0"[ngStyle]="{color:'var(--surface-500)'}" i18n="@@{sectors}">Sectors</div>
-        <div class="inline my-0" *ngFor="let sector of resource.sectors">
-          <img class="sector mx-2" [src]="'assets/sectors/'+sector.sectorIcon" pTooltip="{{sector.name}}">
-        </div>
-      </div>
-      <div class="flex flex-wrap">
-        <div class="inline col-3 my-0" [ngStyle]="{color:'var(--surface-500)'}" i18n="@@{regions}">Regions</div>
-        <div *ngFor="let region of resource.regions" class="inline my-0">
-          <p class=" my-0 py-2 mx-2" >{{region.name}}</p>
-        </div>
-      </div>
-      <div class="flex">
-        <div class="inline col-3" [ngStyle]="{color:'var(--surface-500)'}"i18n="@@{relevant_pests}">Relevant pest(s)</div>
-        <div class="col-9">
-        <div *ngFor="let pest of resource.pests" class="inline-flex pr-2 pb-2">
-          <p-badge  severity="danger" value={{pest.commonName}}></p-badge>
-        </div>
-        </div>
-      </div>
-      <div class="flex">
-        <div class="inline col-3" [ngStyle]="{color:'var(--surface-500)'}" i18n="@@{relevant_crops}"> Relevant crop(s)</div>
-        <div class="col-9">
-          <div class="inline-flex pr-2 pb-2" *ngFor="let crop of resource.crops">
-            <p-badge  severity="success" value={{crop.commonName}}></p-badge>
-          </div>
-        </div>
+<div class="p-grid p-pt-6 p-pl-6">
 
-
-      </div>
-    </p-panel>
-    <p-panel class="col-12 p-d-block" i18n-header="@@{find_more}" header="Find out more" *ngIf="(resource.files != undefined) || (resource.links != undefined)">
-      <div *ngFor="let file of resource.files" >
-        <i class="pi pi-file p-mr-2" style="font-size: 2rem"></i>
-        <button pButton type="button" label="{{file.description}}" class="p-button-link button-link" (click)="downloadFile(file.description)"></button>
-      </div>
-      <div class="mt-2" *ngFor="let link of resource.links" >
-        <i class="pi pi-link p-mr-2" style="font-size: 2rem"></i>
-        <a class="link-wrap" href="{{link}}" target="_blank">{{link}}</a>
-      </div>
-    </p-panel>
-</div>
-  <div class="col-12 pt-3 flex justify-content-center">
-    <div class="pr-2">
-      <p-button i18n-label="@@{back_to_search}" label="Back to search" icon="pi pi-search" routerLink="/home" [loading]="false"></p-button>
-      <p-button i18n-label="@@{share}" label="Share" icon="pi pi-share-alt" class="ml-3"(click)=linkCopied(getPermLink(resource.idResource)) [loading]="false"></p-button>
-      <p-button i18n-label="@@{download}" label="Download" icon="pi pi-share-alt" class="ml-3"(click)=download(resource) [loading]="false"></p-button>
-
-    </div>
-    <div class="pr-2" *ngIf="!resource.approved && resource.canEdit && (loggeduser| async)?.roles?.includes('ADMIN')">
-      <p-button i18n-label="@@{approve}" label="Approve" icon="pi pi-check" (onClick)="approve($event)" [loading]="false"></p-button>
-    </div>
-    <div class="pr-2" *ngIf="(loggeduser| async)?.roles?.includes('ADMIN') && resource.canEdit">
-      <p-button  i18n-label="@@{edit}" label="Edit" icon="pi pi-pencil" routerLink="/resource/edit/{{resourceId}}" [loading]="false"></p-button>
-    </div>
-    <div *ngIf="(loggeduser| async)?.roles?.includes('ADMIN') && resource.canEdit">
-      <p-button  i18n-label="@@{delete]" label="Delete" icon="pi pi-trash" (onClick)="delete($event)" [loading]="false"></p-button>
-    </div>
-  </div>
+<p>ovde ide detaljan opis resursa sa linkovima itd</p>
 </div>
-<p-toast position="bottom-center" key="bc"></p-toast>
-<p-confirmDialog></p-confirmDialog>
-<p-dialog id="shareModal" name="shareModal" header="Copy link to share" [(visible)]="displayModal"  [style]="{width: '40vw'}">
-  <div class="field">
-    <label i18n="@@{link}">Link</label>
-    <input id="link" type="text" [(ngModel)]="copiedLink" pInputText/>
-  </div>
-
-  <div class="field button-center">
-    <button pButton type="button" class="p-button-help" label="Ok"  (click)="displayModal=false" ></button>
-  </div>
-</p-dialog>

src/app/component/resource/resource.component.ts

 import { Component, OnInit } from '@angular/core';
-import {ResourceService} from "../../service/resource.service";
-import {ActivatedRoute, Router} from "@angular/router";
-import {environment} from "../../../environments/environment";
-import {Resource} from "../../model/resource";
-import {ConfirmationService, MessageService} from "primeng/api";
-import {Observable} from "rxjs";
-import {User} from "../../model/user";
-import {UserState} from "../../states/user.state";
-import {Store} from "@ngxs/store";
-import {HttpResponse} from "@angular/common/http";
 
 @Component({
   selector: 'app-resource',
@@ -16,119 +6,10 @@ import {HttpResponse} from "@angular/common/http";
   styleUrls: ['./resource.component.css']
 })
 export class ResourceComponent implements OnInit {
-  resource: Resource ={};
-  imagePath = environment.baseUrl+"/resource/image";
-  filePath = environment.baseUrl+"/resource/file";
-  url:any;
-  resourceId = null;
-  lang = null;
-  displayModal=false;
-  copiedLink="";
-  // @ts-ignore
-  public loggeduser: Observable<User> = this.store.select(UserState.userDetails);
 
-  constructor(private resourceService:ResourceService, private route: ActivatedRoute,
-              private router: Router, private store:Store, private messageService:MessageService, private confirmationService: ConfirmationService) { }
+  constructor() { }
 
   ngOnInit(): void {
-    // @ts-ignore
-    this.resourceId = this.route.snapshot.paramMap.get('id');
-    // @ts-ignore
-    this.lang = this.route.snapshot.paramMap.get('lang');
-
-    // @ts-ignore
-     this.resourceService.getResource(this.resourceId,this.lang).subscribe(data =>{
-       this.resource =data;
-     });
-
-  }
-  downloadFile(fileName: any): void {
-    this.resourceService.downloadFile(fileName).subscribe((file: any) => {
-      const blob = new Blob([file], {type: file.type});
-
-      this.url = window.URL.createObjectURL(blob);
-      /*const link = document.createElement('a');
-      link.href = this.url;
-      link.target="_blank";
-      link.download = fileName;*/
-      window.open(this.url,"_blank")
-    }, error => {
-      console.log(error)
-    });
   }
 
-  approve(event: Event) {
-    this.confirmationService.confirm({
-      message: 'Are you sure that you want to approve resource?',
-      icon: 'pi pi-exclamation-triangle',
-      accept: () => {
-        // @ts-ignore
-        this.resourceService.approveResource(this.resourceId).subscribe(r =>{
-          this.messageService.add({severity:'success', detail:'Resource has been approved.'});
-          this.router.navigate(['/home'])
-        },error =>{
-          this.messageService.add({severity:'error', detail:'Some error occured!'});
-        }
-      );
-      }
-      });
-  }
-  delete(event: Event) {
-    this.confirmationService.confirm({
-      message: 'Are you sure that you want to delete resource?',
-      icon: 'pi pi-exclamation-triangle',
-      accept: () => {
-        // @ts-ignore
-        this.resourceService.deleteResource(this.resourceId).subscribe(r =>{
-            this.messageService.add({severity:'success', detail:'Resource has been deleted.'});
-            this.router.navigate(['/home'])
-          },(error: { status: any; }) =>{
-            this.messageService.add({severity:'error', detail:'Some error occurred!'});
-          }
-        );
-      }
-    });
-  }
-  showInfo() {
-    this.messageService.add({severity:'info', summary: 'Info', detail: 'This feature has not been implemented yet!'});
-  }
-  getPermLink(resourceId: string|undefined) {
-    if(resourceId != undefined){
-      return location.origin + '/toolbox/#/resource/' + resourceId;
-    }else{
-      return location.origin + '/toolbox/#/home';
-    }
-  }
-
-  linkCopied(link: string) {
-      this.copiedLink=link;
-      this.displayModal=true;
-  }
-
-  download(resource:Resource) {
-    this.resourceService.download(resource).subscribe({
-      next: (data) => {
-        // @ts-ignore
-        if (resource.resourceName ==undefined){
-          resource.resourceName = "unknown"
-        }
-        this.downloadPDF(data as unknown as HttpResponse<any>, resource.resourceName)
-      },
-      error: () => {
-        this.messageService.add({severity:'error', detail:'Some error occurred!'});
-      }
-    });
-  }
-  private downloadPDF(resp: HttpResponse<any>,fileName:string) {
-    const content = resp.headers.get('Content-Type');
-    const blob = new Blob([resp.body], { type: resp.body.type });
-    const anchor = document.createElement('a');
-    anchor.href = window.URL.createObjectURL(blob);
-    anchor.download = fileName +'.pdf';
-    anchor.target = '_blank';
-    anchor.dataset.downloadurl = ['text/plain', anchor.download, anchor.href].join(':');
-    document.body.appendChild(anchor);
-    anchor.click();
-    document.body.removeChild(anchor);
-  }
 }

src/app/json_mockup/keywords.json

+[
+  {
+    "keywordId": 1,
+    "value": "IPM technique"
+  },
+  {
+    "keywordId": 2,
+    "value":"Economic Threshold"
+  },
+  {
+    "keywordId": 3,
+    "value":"DSS"
+  },
+  {
+    "keywordId": 4,
+    "value":"EU project"
+  },
+  {
+    "keywordId": 5,
+    "value":"Forecasts"
+  },
+  {
+    "keywordId": 6,
+    "value":"Monitoring tools"
+  },
+  {
+    "keywordId": 7,
+    "value":"Other"
+  }
+]

src/app/json_mockup/language.json

+[
+  {
+    "languageId": 1,
+    "value": "English"
+  },
+  {
+    "resourceTypeId": 2,
+    "value":"Spanish"
+  },
+  {
+    "resourceTypeId": 3,
+    "value":"German"
+  },
+  {
+    "resourceTypeId": 4,
+    "value":"French"
+  },
+  {
+    "resourceTypeId": 5,
+    "value":"Italian"
+  },
+  {
+    "resourceTypeId": 6,
+    "value":"Dutch"
+  },
+  {
+    "resourceTypeId": 7,
+    "value":"Serbian"
+  }
+]

src/app/json_mockup/regions.json

+[
+  {
+  "regionId": 1,
+  "value": "Serbia"
+},
+  {
+    "regionId": 2,
+    "value": "Italy"
+  },
+  {
+    "regionId": 3,
+    "value": "France"
+  },
+  {
+    "regionId": 4,
+    "value": "Germany"
+  }
+]

src/app/json_mockup/resources.json

+[
+  {
+    "resourceId": 1,
+    "title": "Resource 1",
+    "description": "Some description",
+    "rating": 5,
+    "imagePath": "assets/asset1.jpg",
+    "language": "Italian",
+    "relevantSectors": [{
+      "sectorId": 1,
+      "value": "Arable field crops"
+    },
+      {
+        "sectorId": 2,
+        "value":"Vineyard"
+      }
+    ],
+    "contentType": {
+      "resourceTypeId": 6,
+      "value":"Monitoring tools"
+    }
+  },
+  {
+    "resourceId": 2,
+    "title": "Resource 2",
+    "description": "Some description",
+    "rating": 5,
+    "imagePath": "assets/asset2.jpg",
+    "language": "German",
+    "contentType": {
+      "resourceTypeId": 5,
+      "value":"Forecasts"
+    },
+    "relevantSectors": [{
+      "sectorId": 1,
+      "value": "Arable field crops"
+    },
+      {
+        "sectorId": 4,
+        "value":"Outdoor vegetables, soft fruits and ornamentals"
+      },
+      {
+        "sectorId": 2,
+        "value":"Vineyard"
+      }
+    ]
+  },
+  {
+    "resourceId": 3,
+    "title": "Resource 3",
+    "description": "Some description",
+    "rating": 5,
+    "imagePath": "assets/asset3.jpg",
+    "language": "English",
+    "contentType": {
+      "resourceTypeId": 1,
+      "value": "IPM technique"
+    },
+    "relevantSectors": [{
+      "sectorId": 3,
+      "value":"Orchards"
+    },
+      {
+        "sectorId": 2,
+        "value":"Vineyard"
+      },
+      {
+        "sectorId": 5,
+        "value":"Greenhouse and protected horticulture"
+      }
+    ]
+  },
+  {
+    "resourceId": 4,
+    "title": "Resource 4",
+    "description": "Some description",
+    "rating": 3,
+    "imagePath": "assets/asset4.jpg",
+    "language": "Serbian",
+    "contentType": {
+      "resourceTypeId": 2,
+      "value":"Economic Threshold"
+    },
+    "relevantSectors": [{
+    "sectorId": 5,
+    "value":"Greenhouse and protected horticulture"
+  }]
+  },
+  {
+    "title": "Resource 5",
+    "description": "Some description",
+    "rating": 1,
+    "imagePath": "assets/logo.png",
+    "language": "English",
+    "contentType":{
+      "resourceTypeId": 3,
+      "value":"DSS"
+    },
+    "relevantSectors": [ {
+      "sectorId": 5,
+      "value":"Greenhouse and protected horticulture"
+    }]
+  }
+,
+  {
+    "resourceId": 5,
+    "title": "Resource 5",
+    "description": "Some description",
+    "rating": 1,
+    "imagePath": "assets/asset5.jpg",
+    "language": "French",
+    "contentType": {
+      "resourceTypeId": 4,
+      "value":"EU project"
+    },
+    "relevantSectors": [{
+      "sectorId": 1,
+      "value": "Arable field crops"
+    },
+      {
+        "sectorId": 4,
+        "value":"Outdoor vegetables, soft fruits and ornamentals"
+      },
+      {
+        "sectorId": 2,
+        "value":"Vineyard"
+      }
+    ]
+  }
+,
+  {
+    "resourceId": 6,
+    "title": "Resource 5",
+    "description": "Some description",
+    "rating": 1,
+    "language": "Serbian"
+  }
+,
+  {
+    "resourceId": 7,
+    "title": "Resource 5",
+    "description": "Some description",
+    "rating": 1
+  }
+,
+  {
+    "title": "Resource 5",
+    "description": "Some description",
+    "rating": 1
+  }
+,
+  {
+    "title": "Resource 5",
+    "description": "Some description",
+    "rating": 1
+  }
+,
+  {
+    "title": "Resource 5",
+    "description": "Some description",
+    "rating": 1
+  }
+,
+  {
+    "title": "Resource 5",
+    "description": "Some description",
+    "rating": 1
+  }
+
+,
+  {
+    "title": "Resource 5",
+    "description": "Some description",
+    "rating": 1
+  }
+,
+  {
+    "title": "Resource 5",
+    "description": "Some description",
+    "rating": 1
+  }
+,
+  {
+    "title": "Resource 5",
+    "description": "Some description",
+    "rating": 1
+  }
+,
+  {
+    "title": "Resource 5",
+    "description": "Some description",
+    "rating": 1
+  }
+,
+  {
+    "title": "Resource 5",
+    "description": "Some description",
+    "rating": 1
+  }
+]

src/app/json_mockup/sectors.json

+[
+  {
+    "sectorId": 1,
+    "value": "Arable field crops"
+  },
+  {
+    "sectorId": 2,
+    "value":"Vineyard"
+  },
+  {
+    "sectorId": 3,
+    "value":"Orchards"
+  },
+  {
+    "sectorId": 4,
+    "value":"Outdoor vegetables, soft fruits and ornamentals"
+  },
+  {
+    "sectorId": 5,
+    "value":"Greenhouse and protected horticulture"
+  }
+]

src/app/json_mockup/types.json

+[
+  {
+    "resourceTypeId": 1,
+    "value": "IPM technique"
+  },
+  {
+    "resourceTypeId": 2,
+    "value":"Economic Threshold"
+  },
+  {
+    "resourceTypeId": 3,
+    "value":"DSS"
+  },
+  {
+    "resourceTypeId": 4,
+    "value":"EU project"
+  },
+  {
+    "resourceTypeId": 5,
+    "value":"Forecasts"
+  },
+  {
+    "resourceTypeId": 6,
+    "value":"Monitoring tools"
+  },
+  {
+    "resourceTypeId": 7,
+    "value":"Other"
+  }
+]

src/app/model/resource.ts

 export interface Resource {
-  idResource?: string;
-  resourceName?: string;
+  resourceId?: number;
+  title?: string;
   description?: string;
-  descriptionNative?:string;
-  links?:string[];
-  files?:any[];
-  resourceOrigin?: string;
-  resourceType?: ResourceType;
-  sectors?: Sector[];
-  regions?: Region[];
-  crops?:Crop[];
-  pests?:Pest[];
-  language?: Language;
-  project?: Project;
-  projectWeb?: string;
-  projectGrantNo?:string;
-  contactInstitution?: string;
-  contactEmail?: string;
-  contactPhone?: string;
-  canEdit?:boolean;
-  citation?:string;
-  creationDate?:Date;
-  approved?:boolean;
-  external?:boolean;
+  contentType: ContentType;
+  relevantSectors: Sector[];
+  relevantRegions: Region[];
+  imagePath?: string;
+  files: string[];
+  links:string[];
+  originalSource: string;
+  keywords:string[];
+  language: string;
+  contactName: string;
+  contactInstitution: string;
+  contactDetails: string;
+  rating?: number;
 }
 
-export class Crop{
-  public idCrop?:string;
-  public commonName?: string;
-  public latinName?:string;
-  public eppo?:string;
-}
-export class Pest{
-  public idPest?:string;
-  public commonName?: string;
-  public latinName?:string;
-  public eppo?:string;
-}
-export class ResourceType{
-  public idResourceType!:string;
-  public name!: string;
+
+export class ContentType{
+  public resourceTypeId!:number;
+  public value!: string;
 }
 export class Sector{
-  public idSector!: string;
-  public name!: string;
-  public name_sr!: string;
-  public sectorIcon!:string;
-
+  public sectorId!: number;
+  public value!: string;
 }
 export class Region{
-  public idRegion!: string;
-  public name!: string;
-  public code!:string;
-
-
+  public regionId!: number;
+  public value!: string;
 }
 export class Language{
-  public idLanguage!: string;
-  public name!: string;
-  public code!:string;
-}
-export class Project{
-  public idProject!: string;
-  public name!: string;
-  public description!: string;
+  public languageId!: number;
+  public value!: string;
 }
 export class Keyword{
-  public idKeyword!: string;
-  public name!: string;
-}
-export class FileDesc{
-  public fileIdentifier?: string;
-  public description?: string;
-}
-export class PageableResource {
-  content?: Resource[] = [];
-  empty?: boolean;
-  first?: boolean;
-  last?: boolean;
-  number?: number = 0;
-  numberOfElements?: number;
-  pageable?: any;
-  size?: number = 0;
-  sort?: any;
-  totalElements: number|undefined;
-  totalPages?: number =0;
+  public keywordId!: number;
+  public value!: string;
 }

src/app/service/resource.service.ts

 import { Injectable } from '@angular/core';
 import {HttpClient} from "@angular/common/http";
+import resources from '../json_mockup/resources.json';
+import sectors from '../json_mockup/sectors.json'
+import regions from '../json_mockup/regions.json'
+import types from '../json_mockup/types.json'
+import languages from '../json_mockup/language.json'
+import keywords from '../json_mockup/keywords.json'
 
 
 
 import {AppConfig} from "../../config/app.config";
-import {
-  ResourceType,
-  Language,
-  Region,
-  Resource,
-  Sector,
-  Project,
-  Keyword,
-  Pest,
-  Crop,
-  PageableResource, FileDesc
-} from "../model/resource";
-import {SearchModel} from "../model/search-model";
 
 @Injectable({
   providedIn: 'root'
@@ -28,111 +21,25 @@ export class ResourceService {
   public constructor(httpClient: HttpClient) {
     this._httpClient = httpClient;
   }
-  public getAllResources(pageNo: number = 0,pageSize: number = 10) {
-    return this._httpClient.get<PageableResource>(`${AppConfig.ApiPaths.getAllResources}?pageNumber=${pageNo}&pageSize=${pageSize}`);
-  }
-  public getResourcesForApproval() {
-    return this._httpClient.get<Resource []>(`${AppConfig.ApiPaths.getResourcesForApproval}`);
-  }
-  public getResource(id:string, lang:string) {
-    return this._httpClient.get<Resource>(`${AppConfig.ApiPaths.getResource}`+"/"+id+"/"+lang);
-  }
-  public hasImage(id:string,type:string) {
-    return this._httpClient.get<boolean>(`${AppConfig.ApiPaths.hasImage}`+"/"+type+"/"+id);
-  }
-  public approveResource(id:string) {
-    return this._httpClient.get<Resource>(`${AppConfig.ApiPaths.approveResource}`+"/"+id);
-  }
-  public deleteResource(id:string) {
-    return this._httpClient.get<Resource>(`${AppConfig.ApiPaths.deleteResource}`+"/"+id);
-  }
-  public deleteFile(id:string) {
-    return this._httpClient.get<Resource>(`${AppConfig.ApiPaths.deleteFile}`+"/"+id);
-  }
-
-  public downloadFile(name: string) {
-    const httpOptions = {
-      responseType: 'blob' as 'json',
-    };
-    return this._httpClient.get<Resource>(`${AppConfig.ApiPaths.getFile}`+"/"+name, httpOptions);
-  }
-  public downloadFileById(id: string) {
-    const httpOptions = {
-      responseType: 'blob' as 'json',
-    };
-    return this._httpClient.get<any>(`${AppConfig.ApiPaths.getFileById}`+"/"+id, httpOptions);
-  }
-  public saveResource(resource: Resource,edit:boolean) {
-    resource.creationDate = new Date();
-    if(!edit){
-      resource.approved = false;
-    }
-    return this._httpClient.post<Resource>(`${AppConfig.ApiPaths.saveResource}`, resource);
-  }
-
-  public searchResource(search: SearchModel) {
-    return this._httpClient.post<Resource[]>(`${AppConfig.ApiPaths.searchResource}`, search);
-  }
-
-  public addFiles(image:File,logo:File,resourceContent:File[],idResource:any){
-
-    const formData: FormData = new FormData();
-    if(image != undefined) {
-      formData.append("image", image);
-    }
-    if(logo != undefined) {
-      formData.append("logo", logo);
-    }
-    resourceContent.forEach(r =>{
-      formData.append("files",r);
-    })
-    return this._httpClient.post(`${AppConfig.ApiPaths.addFile}`+"/"+idResource,formData)
-  }
-  public addFile(file:File,description:string, type:string){
-
-    const formData: FormData = new FormData();
-    if(file != undefined) {
-      formData.append("file", file);
-    }
-    if(description != undefined) {
-      formData.append("description", description);
-    }
-    if(type != undefined) {
-      formData.append("type", type);
-    }
-
-    return this._httpClient.post(`${AppConfig.ApiPaths.addHelpFile}`,formData)
+  public getAllResources() {
+    //return this._httpClient.get<Resource[]>(`${AppConfig.ApiPaths.getAllResources}`);
+    //this is just mockup of backend
+    return resources;
   }
   public getAllSectors() {
-    return this._httpClient.get<Sector[]>(`${AppConfig.ApiPaths.getAllSectors}`);
+    return sectors;
   }
   public getAllRegions() {
-    return this._httpClient.get<Region[]>(`${AppConfig.ApiPaths.getAllRegions}`);
+    return regions;
   }
-  public getAllResourceTypes() {
-    return this._httpClient.get<ResourceType[]>(`${AppConfig.ApiPaths.getAllResourceTypes}`);
+  public getAllContentTypes() {
+    return types;
   }
   public getAllLanguages() {
-    return this._httpClient.get<Language[]>(`${AppConfig.ApiPaths.getAllLanguages}`);
-  }
-  public getAllProjects() {
-    return this._httpClient.get<Project[]>(`${AppConfig.ApiPaths.getAllProjects}`);
-  }
-  public getAllPests() {
-    return this._httpClient.get<Pest[]>(`${AppConfig.ApiPaths.getAllPests}`);
-  }
-  public getAllCrops() {
-    return this._httpClient.get<Crop[]>(`${AppConfig.ApiPaths.getAllCrops}`);
+    return languages;
   }
   public getAllKeywords() {
-    return this._httpClient.get<Keyword[]>(`${AppConfig.ApiPaths.getAllKeywords}`);
-  }
-
-  public getAllHelpFilesDesc() {
-    return this._httpClient.get<FileDesc[]>(`${AppConfig.ApiPaths.getAllHelpFilesDesc}`);
-  }
-  public download(resource:Resource){
-    return this._httpClient.post(`${AppConfig.ApiPaths.download}`,resource,{responseType: 'blob' as 'blob', observe: 'response'})
+    return keywords;
   }
 
 }

src/assets/flags/danish.svg

+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 512.001 512.001" style="enable-background:new 0 0 512.001 512.001;" xml:space="preserve">
+<path style="fill:#FF4B55;" d="M503.172,423.725H8.828c-4.875,0-8.828-3.953-8.828-8.828V97.104c0-4.875,3.953-8.828,8.828-8.828
+	h494.345c4.875,0,8.828,3.953,8.828,8.828v317.793C512,419.773,508.047,423.725,503.172,423.725z"/>
+<polygon style="fill:#F5F5F5;" points="512,229.518 211.862,229.518 211.862,88.277 158.897,88.277 158.897,229.518 0,229.518 
+	0,282.484 158.897,282.484 158.897,423.725 211.862,423.725 211.862,282.484 512,282.484 "/>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+</svg>

src/assets/flags/dutch.svg

+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
+<rect y="85.337" style="fill:#F0F0F0;" width="512" height="341.326"/>
+<rect y="85.337" style="fill:#A2001D;" width="512" height="113.775"/>
+<rect y="312.888" style="fill:#0052B4;" width="512" height="113.775"/>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+</svg>

src/assets/flags/english.svg

+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
+<rect y="85.333" style="fill:#F0F0F0;" width="512" height="341.337"/>
+<polygon style="fill:#D80027;" points="288,85.33 224,85.33 224,223.996 0,223.996 0,287.996 224,287.996 224,426.662 288,426.662 
+	288,287.996 512,287.996 512,223.996 288,223.996 "/>
+<g>
+	<polygon style="fill:#0052B4;" points="393.785,315.358 512,381.034 512,315.358 	"/>
+	<polygon style="fill:#0052B4;" points="311.652,315.358 512,426.662 512,395.188 368.307,315.358 	"/>
+	<polygon style="fill:#0052B4;" points="458.634,426.662 311.652,344.998 311.652,426.662 	"/>
+</g>
+<polygon style="fill:#F0F0F0;" points="311.652,315.358 512,426.662 512,395.188 368.307,315.358 "/>
+<polygon style="fill:#D80027;" points="311.652,315.358 512,426.662 512,395.188 368.307,315.358 "/>
+<g>
+	<polygon style="fill:#0052B4;" points="90.341,315.356 0,365.546 0,315.356 	"/>
+	<polygon style="fill:#0052B4;" points="200.348,329.51 200.348,426.661 25.491,426.661 	"/>
+</g>
+<polygon style="fill:#D80027;" points="143.693,315.358 0,395.188 0,426.662 0,426.662 200.348,315.358 "/>
+<g>
+	<polygon style="fill:#0052B4;" points="118.215,196.634 0,130.958 0,196.634 	"/>
+	<polygon style="fill:#0052B4;" points="200.348,196.634 0,85.33 0,116.804 143.693,196.634 	"/>
+	<polygon style="fill:#0052B4;" points="53.366,85.33 200.348,166.994 200.348,85.33 	"/>
+</g>
+<polygon style="fill:#F0F0F0;" points="200.348,196.634 0,85.33 0,116.804 143.693,196.634 "/>
+<polygon style="fill:#D80027;" points="200.348,196.634 0,85.33 0,116.804 143.693,196.634 "/>
+<g>
+	<polygon style="fill:#0052B4;" points="421.659,196.636 512,146.446 512,196.636 	"/>
+	<polygon style="fill:#0052B4;" points="311.652,182.482 311.652,85.331 486.509,85.331 	"/>
+</g>
+<polygon style="fill:#D80027;" points="368.307,196.634 512,116.804 512,85.33 512,85.33 311.652,196.634 "/>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+</svg>

src/assets/flags/finnish.svg

+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 512.001 512.001" style="enable-background:new 0 0 512.001 512.001;" xml:space="preserve">
+<path style="fill:#F5F5F5;" d="M503.172,423.725H8.828c-4.875,0-8.828-3.953-8.828-8.828V97.104c0-4.875,3.953-8.828,8.828-8.828
+	h494.345c4.875,0,8.828,3.953,8.828,8.828v317.793C512,419.773,508.047,423.725,503.172,423.725z"/>
+<polygon style="fill:#41479B;" points="512,229.518 211.862,229.518 211.862,88.277 158.897,88.277 158.897,229.518 0,229.518 
+	0,282.484 158.897,282.484 158.897,423.725 211.862,423.725 211.862,282.484 512,282.484 "/>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+</svg>

src/assets/flags/french.svg

+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
+<rect y="85.331" style="fill:#F0F0F0;" width="512" height="341.337"/>
+<rect y="85.331" style="fill:#0052B4;" width="170.663" height="341.337"/>
+<rect x="341.337" y="85.331" style="fill:#D80027;" width="170.663" height="341.337"/>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+</svg>

src/assets/flags/german.svg

+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 512.001 512.001" style="enable-background:new 0 0 512.001 512.001;" xml:space="preserve">
+<path style="fill:#464655;" d="M512,200.093H0V97.104c0-4.875,3.953-8.828,8.828-8.828h494.345c4.875,0,8.828,3.953,8.828,8.828
+	L512,200.093L512,200.093z"/>
+<path style="fill:#FFE15A;" d="M503.172,423.725H8.828c-4.875,0-8.828-3.953-8.828-8.828V311.909h512v102.988
+	C512,419.773,508.047,423.725,503.172,423.725z"/>
+<rect y="200.091" style="fill:#FF4B55;" width="512" height="111.81"/>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+</svg>

src/assets/flags/greek.svg

+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 362.023 362.023" style="enable-background:new 0 0 362.023 362.023;" xml:space="preserve">
+<rect y="60.338" style="fill:#F0F0F0;" width="362.023" height="241.346"/>
+<g>
+	<rect y="60.338" style="fill:#338AF3;" width="362.023" height="30.168"/>
+	<rect y="120.679" style="fill:#338AF3;" width="362.023" height="30.168"/>
+	<rect y="181.014" style="fill:#338AF3;" width="362.023" height="30.168"/>
+	<rect y="241.35" style="fill:#338AF3;" width="362.023" height="30.168"/>
+	<rect y="60.338" style="fill:#338AF3;" width="133.788" height="120.676"/>
+</g>
+<g>
+	<rect y="107.27" style="fill:#F0F0F0;" width="133.788" height="26.814"/>
+	<rect x="53.487" y="60.338" style="fill:#F0F0F0;" width="26.814" height="120.676"/>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+</svg>

src/assets/flags/italian.svg

+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
+<polygon style="fill:#F0F0F0;" points="341.334,85.33 170.666,85.33 0,85.33 0,426.662 170.666,426.662 341.334,426.662 
+	512,426.662 512,85.33 "/>
+<rect y="85.333" style="fill:#6DA544;" width="170.663" height="341.337"/>
+<rect x="341.337" y="85.333" style="fill:#D80027;" width="170.663" height="341.337"/>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+</svg>

src/assets/flags/polish.svg

+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 512.001 512.001" style="enable-background:new 0 0 512.001 512.001;" xml:space="preserve">
+<path style="fill:#FF4B55;" d="M0,256h512v158.897c0,4.875-3.953,8.828-8.828,8.828H8.828c-4.875,0-8.828-3.953-8.828-8.828V256z"/>
+<path style="fill:#F5F5F5;" d="M512,256H0V97.103c0-4.875,3.953-8.828,8.828-8.828h494.345c4.875,0,8.828,3.953,8.828,8.828L512,256
+	L512,256z"/>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+</svg>

src/assets/flags/portuguese.svg

+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
+<rect y="85.337" style="fill:#D80027;" width="512" height="341.326"/>
+<polygon style="fill:#6DA544;" points="196.641,85.337 196.641,261.565 196.641,426.663 0,426.663 0,85.337 "/>
+<circle style="fill:#FFDA44;" cx="196.641" cy="256" r="64"/>
+<path style="fill:#D80027;" d="M160.638,224v40.001c0,19.882,16.118,36,36,36s36-16.118,36-36V224H160.638z"/>
+<path style="fill:#F0F0F0;" d="M196.638,276c-6.617,0-12-5.383-12-12v-16h24.001v16C208.638,270.616,203.254,276,196.638,276z"/>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+</svg>

src/assets/flags/serbian.svg

+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 512.001 512.001" style="enable-background:new 0 0 512.001 512.001;" xml:space="preserve">
+<path style="fill:#F5F5F5;" d="M0,311.908h512v102.988c0,4.875-3.953,8.828-8.828,8.828H8.828c-4.875,0-8.828-3.953-8.828-8.828
+	V311.908z"/>
+<path style="fill:#FF4B55;" d="M8.828,88.276h494.345c4.875,0,8.828,3.953,8.828,8.828v102.988H0V97.103
+	C0,92.228,3.953,88.276,8.828,88.276z"/>
+<rect y="200.09" style="fill:#41479B;" width="512" height="111.81"/>
+<polygon style="fill:#FFE15A;" points="173.021,200.07 109.462,200.07 106.814,184.18 175.669,184.18 "/>
+<polygon style="fill:#FFD350;" points="108.8,196.097 109.462,200.07 173.021,200.07 173.683,196.097 "/>
+<g>
+	<rect x="139.92" y="147.1" style="fill:#FFE15A;" width="2.648" height="10.593"/>
+	<rect x="137.27" y="149.75" style="fill:#FFE15A;" width="7.945" height="2.648"/>
+	<path style="fill:#FFE15A;" d="M173.228,189.476c-0.3,0-0.604-0.052-0.903-0.158c-1.375-0.499-2.086-2.017-1.587-3.393l5.61-15.481
+		c0.278-0.768,0.212-1.613-0.18-2.319c-0.209-0.375-0.695-1.035-1.624-1.234c-6.839-1.453-20.096-3.897-32.023-3.897h-2.558
+		c-11.927,0-25.184,2.444-32.026,3.9c-0.926,0.196-1.414,0.856-1.622,1.231c-0.392,0.706-0.458,1.551-0.179,2.319l5.608,15.481
+		c0.499,1.376-0.212,2.894-1.587,3.393c-1.374,0.491-2.895-0.215-3.392-1.588l-5.61-15.481c-0.8-2.209-0.609-4.648,0.526-6.694
+		c1.097-1.978,2.973-3.38,5.149-3.843c7.047-1.5,20.718-4.017,33.131-4.017h2.558c12.413,0,26.084,2.516,33.128,4.013
+		c2.179,0.466,4.055,1.867,5.152,3.846c1.135,2.046,1.326,4.484,0.527,6.694l-5.611,15.481
+		C175.328,188.807,174.31,189.476,173.228,189.476z"/>
+	<path style="fill:#FFE15A;" d="M141.251,187.159c-1.462,0-2.648-1.184-2.648-2.648v-21.517c0-1.464,1.186-2.648,2.648-2.648
+		s2.648,1.184,2.648,2.648v21.517C143.9,185.974,142.714,187.159,141.251,187.159z"/>
+	<path style="fill:#FFE15A;" d="M159.559,189.476c-0.179,0-0.36-0.018-0.541-0.054c-1.432-0.298-2.353-1.699-2.055-3.132
+		l3.212-15.481c0.418-2.017-0.236-3.784-0.608-4.094c-3.672-1.347-11.039-3.722-17.594-3.722h-1.465
+		c-6.554,0-13.921,2.375-17.73,3.791c-0.235,0.241-0.889,2.007-0.472,4.024l3.212,15.481c0.298,1.432-0.622,2.835-2.055,3.132
+		c-1.434,0.277-2.836-0.623-3.13-2.056l-3.212-15.481c-0.8-3.859,0.428-8.801,3.808-10.063c5.063-1.882,12.565-4.125,19.578-4.125
+		h1.465c7.014,0,14.516,2.242,19.576,4.122c3.383,1.265,4.611,6.207,3.811,10.066l-3.212,15.481
+		C161.889,188.618,160.787,189.476,159.559,189.476z"/>
+</g>
+<polygon style="fill:#FFD350;" points="107.476,188.152 175.007,188.152 175.669,184.18 106.814,184.18 "/>
+<path style="fill:#FF4B55;" d="M90.924,200.07c-1.462,0-2.648,1.186-2.648,2.648v92.486c0,29.365,23.713,53.17,52.966,53.17
+	s52.966-23.805,52.966-53.17v-92.486c0-1.462-1.186-2.648-2.648-2.648L90.924,200.07L90.924,200.07z"/>
+<path style="fill:#F5F5F5;" d="M146.538,287.464l5.297-13.241l-10.593,2.648l-10.593-2.648l5.297,13.241l-13.241,45.021
+	c0,0,7.945,5.297,18.538,5.297s18.538-5.297,18.538-5.297L146.538,287.464z"/>
+<polygon style="fill:#FFE15A;" points="122.061,298.135 117.388,299.304 127.667,280.803 123.037,278.232 110.552,300.704 
+	98.869,300.704 98.869,306.001 104.559,306.001 97.215,311.876 100.523,316.014 106.762,311.022 104.301,318.404 109.326,320.079 
+	114.163,305.568 123.346,303.272 "/>
+<path style="fill:#F5F5F5;" d="M122.703,226.552l-12.089-6.045c-2.22-1.11-3.372-3.614-2.77-6.022l0.684-2.735
+	c0.474-1.898-0.961-3.736-2.918-3.736c-0.914,0-1.778,0.415-2.348,1.129c-6.273,7.841-9.69,17.583-9.69,27.625v55.991
+	c0,0,11.059-2.211,21.048-16.742c1.834-2.668,4.853-4.247,8.072-4.412l-5.286,15.857L128,290.111l9.269-11.03L122.703,226.552z"/>
+<polygon style="fill:#FFE15A;" points="160.422,298.135 165.095,299.304 154.816,280.803 159.446,278.232 171.93,300.704 
+	183.614,300.704 183.614,306.001 177.923,306.001 185.268,311.876 181.96,316.014 175.721,311.022 178.182,318.404 173.156,320.079 
+	168.32,305.568 159.137,303.272 "/>
+<path style="fill:#F5F5F5;" d="M159.779,226.552l12.089-6.045c2.22-1.11,3.372-3.614,2.77-6.022l-0.684-2.735
+	c-0.474-1.898,0.961-3.736,2.918-3.736c0.914,0,1.778,0.415,2.348,1.129c6.273,7.841,9.69,17.583,9.69,27.625v55.991
+	c0,0-11.059-2.211-21.048-16.742c-1.834-2.668-4.853-4.247-8.072-4.412l5.286,15.857l-10.593,2.648l-9.269-11.03L159.779,226.552z"
+	/>
+<g>
+	<polygon style="fill:#FFE15A;" points="125.352,208.014 112.11,208.014 116.083,213.311 125.352,215.959 120.055,218.607 
+		128,218.607 	"/>
+	<polygon style="fill:#FFE15A;" points="157.131,208.014 170.372,208.014 166.4,213.311 157.131,215.959 162.428,218.607 
+		154.483,218.607 	"/>
+</g>
+<path style="fill:#F5F5F5;" d="M158.996,205.938l-12.458,2.076l-5.297,10.593l-5.297-10.593l-12.458-2.076
+	c-1.428-0.238-2.524,1.245-1.876,2.54l6.39,12.778l-5.297,5.297h18.538h18.538l-5.297-5.297l6.389-12.778
+	C161.519,207.182,160.424,205.699,158.996,205.938z"/>
+<circle style="fill:#FFBE50;" cx="141.24" cy="185.34" r="3.972"/>
+<ellipse style="fill:#41479B;" cx="141.19" cy="194.82" rx="3.139" ry="2.207"/>
+<ellipse style="fill:#FF4B55;" cx="125.52" cy="194.82" rx="3.139" ry="2.207"/>
+<g>
+	<ellipse style="fill:#41479B;" cx="109.85" cy="194.82" rx="3.139" ry="2.207"/>
+	<ellipse style="fill:#41479B;" cx="172.52" cy="194.82" rx="3.139" ry="2.207"/>
+</g>
+<ellipse style="fill:#FF4B55;" cx="156.85" cy="194.82" rx="3.139" ry="2.207"/>
+<g>
+	<circle style="fill:#FFBE50;" cx="159.65" cy="185.34" r="3.972"/>
+	<circle style="fill:#FFBE50;" cx="174.17" cy="185.34" r="3.972"/>
+	<circle style="fill:#FFBE50;" cx="122.86" cy="185.34" r="3.972"/>
+	<circle style="fill:#FFBE50;" cx="108.33" cy="185.34" r="3.972"/>
+</g>
+<path style="fill:#41479B;" d="M145.803,162.994c0.455-0.781,0.735-1.678,0.735-2.648c0-2.925-2.371-5.297-5.297-5.297
+	s-5.297,2.371-5.297,5.297c0,0.97,0.279,1.867,0.735,2.648H145.803z"/>
+<path style="fill:#FF4B55;" d="M141.241,280.842c-10.953,0-19.862-8.909-19.862-19.862v-35.752h39.724v35.752
+	C161.103,271.934,152.194,280.842,141.241,280.842z"/>
+<path style="fill:#A54B50;" d="M159.779,226.552v34.428c0,10.238-8.3,18.538-18.538,18.538s-18.538-8.3-18.538-18.538v-34.428
+	H159.779 M162.428,223.904h-2.648h-37.076h-2.648v2.648v34.428c0,11.682,9.504,21.186,21.186,21.186
+	c11.682,0,21.186-9.504,21.186-21.186v-34.428V223.904L162.428,223.904z"/>
+<g>
+	<path style="fill:#F5F5F5;" d="M137.269,279.08c1.281,0.28,2.607,0.437,3.972,0.437s2.691-0.158,3.972-0.437v-52.529h-7.945
+		C137.269,226.551,137.269,279.08,137.269,279.08z"/>
+	<rect x="122.7" y="248.4" style="fill:#F5F5F5;" width="37.08" height="7.945"/>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+</svg>

src/assets/flags/slovenian.svg

+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
+<rect y="85.337" style="fill:#F0F0F0;" width="512" height="341.326"/>
+<rect y="199.112" style="fill:#0052B4;" width="512" height="113.775"/>
+<rect y="312.888" style="fill:#D80027;" width="512" height="113.775"/>
+<path style="fill:#F0F0F0;" d="M233.606,196.639v14.837c0,34.081-44.522,44.522-44.522,44.522s-44.522-10.44-44.522-44.522v-14.837
+	l-0.145-44.188l89.043-0.266L233.606,196.639z"/>
+<path style="fill:#0052B4;" d="M233.606,196.639v14.837c0,34.081-44.522,44.522-44.522,44.522s-44.522-10.44-44.522-44.522v-14.837
+	l-0.145-44.188l89.043-0.266L233.606,196.639z"/>
+<path style="fill:#F0F0F0;" d="M233.606,196.639v14.837c0,34.081-44.522,44.522-44.522,44.522s-44.522-10.44-44.522-44.522v-14.837
+	l14.848,14.837l29.674-22.261l29.685,22.261L233.606,196.639z"/>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+</svg>

src/assets/flags/spanish.svg

+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
+<rect y="85.331" style="fill:#FFDA44;" width="512" height="341.337"/>
+<g>
+	<rect y="85.331" style="fill:#D80027;" width="512" height="113.775"/>
+	<rect y="312.882" style="fill:#D80027;" width="512" height="113.775"/>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+</svg>

src/assets/sectors/arable.svg

+<svg height="477pt" viewBox="-7 0 477 477.656" width="477pt" xmlns="http://www.w3.org/2000/svg"><path d="m11.679688 387.3125 39.007812-39c1.074219-.390625 2.054688-1.007812 2.871094-1.808594 3.089844-3.113281 6.007812-6.390625 8.738281-9.824218l33.277344-33.265626c47.332031 42.933594 120.039062 41.128907 165.179687-4.101562 3.121094-3.125 3.121094-8.1875 0-11.3125-31.347656-31.28125-77.34375-42.8125-119.738281-30.023438l26.601563-26.601562c47.410156 42.183594 119.496093 40.046875 164.328124-4.871094 3.121094-3.125 3.121094-8.1875 0-11.3125-30.792968-30.734375-75.808593-42.398437-117.648437-30.480468l19.039063-19.054688h39.535156c41.988281.113281 82.273437-16.574219 111.882812-46.34375l-11.3125-11.3125c-21.632812 21.664062-49.726562 35.707031-80.042968 40 35.773437-21.710938 57.636718-60.5 57.699218-102.34375 0-4.417969-3.582031-8-8-8-42.820312.050781-82.367187 22.917969-103.777344 60 1-32.519531 14.390626-63.429688 37.433594-86.398438l-11.3125-11.257812c-20.945312 20.890625-34.917968 47.746094-40 76.886719-5.917968-16.570313-15.429687-31.625-27.855468-44.078125-3.125-3.125-8.191407-3.125-11.3125 0-44.492188 44.421875-47.066407 115.683594-5.898438 163.199218l-23.613281 23.617188c10.65625-41.101562-1.210938-84.769531-31.203125-114.824219-3.121094-3.125-8.1875-3.125-11.3125 0-44.488282 44.421875-47.0625 115.683594-5.894532 163.199219l-23.617187 23.617188c10.660156-41.101563-1.207031-84.769532-31.199219-114.824219-3.125-3.125-8.1875-3.125-11.3125 0-44.488281 44.421875-47.0625 115.679687-5.894531 163.199219l-36 36zm231.640624-93.65625c-38.859374 33.085938-95.980468 33.085938-134.839843 0 38.859375-33.085938 95.980469-33.085938 134.839843 0zm71.199219-72.800781c-38.859375 33.089843-95.988281 33.089843-134.847656 0 38.871094-33.054688 95.976563-33.054688 134.847656 0zm20.25-166.871094c-4.15625 50.835937-44.507812 91.1875-95.34375 95.34375 4.152344-50.835937 44.503907-91.1875 95.34375-95.34375zm-167.671875 63.671875c-.078125-24.71875 8.722656-48.644531 24.796875-67.425781 32.226563 37.839843 33.128907 93.203125 2.160157 132.074219l-2.398438 2.398437c-15.902344-18.714844-24.613281-42.488281-24.558594-67.046875zm-72 72c-.078125-24.71875 8.722656-48.644531 24.796875-67.425781 32.226563 37.839843 33.128907 93.203125 2.160157 132.074219l-2.398438 2.398437c-15.902344-18.714844-24.613281-42.488281-24.558594-67.046875zm-72 72c-.078125-24.71875 8.722656-48.644531 24.796875-67.425781 16.066407 18.785156 24.867188 42.707031 24.800781 67.425781.035157 23.496094-7.949218 46.304688-22.632812 64.648438l-2.398438 2.398437c-15.90625-18.714844-24.617187-42.488281-24.566406-67.046875zm0 0"/><path d="m415.097656 445.65625c-.078125-66.242188-53.757812-119.925781-120-120-4.421875 0-8 3.582031-8 8 .074219 66.242188 53.753906 119.925781 120 120 4.417969 0 8-3.582031 8-8zm-111.671875-103.671875c50.835938 4.15625 91.1875 44.507813 95.34375 95.34375-50.839843-4.15625-91.191406-44.507813-95.34375-95.34375zm0 0"/><path d="m422.296875 356.054688c2.121094 0 4.15625-.84375 5.65625-2.34375 46.859375-46.863282 46.859375-122.839844 0-169.703126-3.175781-3-8.140625-3-11.3125 0-46.777344 46.898438-46.777344 122.808594 0 169.703126 1.5 1.5 3.535156 2.34375 5.65625 2.34375zm0-154.605469c33.074219 38.855469 33.074219 95.96875 0 134.824219-33.003906-38.886719-33.003906-95.949219 0-134.832032zm0 0"/><path d="m271.097656 357.65625c0-4.417969-3.582031-8-8-8-66.246094.074219-119.925781 53.757812-120 120 0 4.417969 3.578125 8 8 8 66.242188-.074219 119.921875-53.757812 120-120zm-16.328125 8.328125c-4.15625 50.835937-44.507812 91.1875-95.34375 95.34375 4.152344-50.835937 44.503907-91.1875 95.34375-95.34375zm0 0"/></svg>
\ No newline at end of file

src/assets/sectors/greenhouse.svg

+<svg id="Capa_1" enable-background="new 0 0 512 512" height="512" viewBox="0 0 512 512" width="512" xmlns="http://www.w3.org/2000/svg"><g><path d="m486.358 450.754h-6.537v-237.058c29.427 5.051 44.601-34.302 19.531-50.471l-48.743-31.429c-3.48-2.243-8.122-1.241-10.368 2.239-2.245 3.481-1.242 8.123 2.239 10.368l48.743 31.428c13.72 8.85.545 30.342-13.658 21.182l-211.143-136.145c-6.331-4.082-14.513-4.082-20.845 0l-211.142 136.146c-13.901 8.958-27.64-12.166-13.658-21.182l232.93-150.194c1.393-.898 3.193-.899 4.587.001l154.717 99.761c3.482 2.244 8.123 1.242 10.367-2.238 2.245-3.481 1.242-8.123-2.239-10.368l-154.716-99.761c-6.332-4.084-14.515-4.084-20.846-.001l-232.93 150.193c-25.074 16.17-9.884 55.506 19.532 50.456v176.192c0 4.143 3.358 7.5 7.5 7.5s7.5-3.357 7.5-7.5v-183.229l206.526-133.169c1.394-.898 3.196-.898 4.588 0l206.527 133.168v244.111h-57.902c-40.029-25.836-90.394-40.606-142.878-41.979 1.103-8.928 4.868-24.631 17.516-37.197.549.121 1.107.22 1.676.279 110.005 11.457 146.699-72.367 136.87-91.387-.044-.088-.089-.176-.136-.261-.026-.046-.048-.097-.074-.143-1.599-2.751-5.14-6.13-18.449-7.843-8.895-1.145-19.473-1.062-29.786.232-47.358 5.948-85.254 34.608-99.678 85.473v.001c-.222.782-.332 1.583-.354 2.385-3.062 2.957-5.722 6.041-8.026 9.181v-49.703c57.11-45.438 43.777-115.808 2.047-172.839-2.178-2.977-5.744-4.753-9.539-4.753-3.796 0-7.362 1.776-9.539 4.753-41.699 56.99-55.14 127.326 2.032 172.827v48.943c-2.358-3.012-5.087-5.941-8.231-8.72-.041-.698-.154-1.393-.347-2.075 0-.001 0-.001 0-.001-7.774-27.414-22.286-48.922-43.133-63.93-25.57-18.407-59.874-25.185-86.331-21.776-13.203 1.699-16.792 5.038-18.409 7.776-.008.014-.016.027-.024.04-.005.009-.011.017-.016.026-9.293 15.997 19.996 92.911 115.751 92.911 4.447 0 18.571-.434 22.872-1.475 13.581 12.206 16.965 28.259 17.734 37.26-52.666 1.29-103.226 16.072-143.384 41.992h-57.903v-25.647c0-4.143-3.358-7.5-7.5-7.5s-7.5 3.357-7.5 7.5v25.647h-6.537c-14.136 0-25.638 11.501-25.638 25.638s11.501 25.638 25.638 25.638h460.716c14.137 0 25.638-11.501 25.638-25.638 0-14.134-11.502-25.635-25.638-25.635zm-188.161-92.881c40.274-30.653 86.372-53.001 107.019-62.305-10.14 33.584-46.989 64.371-107.019 62.305zm91.024-71.503c-22.867 10.759-60.501 30.194-95.442 56.054 18.562-38.548 56.945-56.43 95.442-56.054zm-170.172 57.807c-36.678-25.476-75.603-46.373-98.125-57.772 39.347-1.085 79.465 17.209 98.125 57.772zm-112.069-47.981c20.419 10.084 64.664 33.052 105.527 61.706-58.696 1.59-95.048-28.46-105.527-61.706zm156.619 3.491v-128.657c26.132 43.6 35.54 92.593 0 128.657zm-15-128.63v128.613c-35.526-36.066-26.103-85.048 0-128.613zm127.954 279.697h-241.106c72.978-36.095 168.002-36.158 241.106 0zm109.805 36.277h-460.716c-5.866 0-10.638-4.772-10.638-10.639s4.772-10.638 10.638-10.638h460.716c5.866 0 10.638 4.772 10.638 10.638s-4.773 10.639-10.638 10.639z"/></g></svg>
\ No newline at end of file

src/assets/sectors/orchard.svg

+<svg id="Capa_1" enable-background="new 0 0 512 512" height="512" viewBox="0 0 512 512" width="512" xmlns="http://www.w3.org/2000/svg"><g id="XMLID_1032_"><g id="XMLID_140_"><path id="XMLID_830_" d="m512 273c0-27.974-11.097-54.773-30.661-74.556 2.494-7.771 3.755-15.866 3.755-24.15 0-43.612-35.481-79.094-79.094-79.094-10.101 0-20.02 1.921-29.278 5.61-11.336-46.327-53.198-80.81-102.968-80.81-31.278 0-59.431 13.621-78.85 35.238-17.132-22.024-43.606-35.238-72.03-35.238-50.309 0-91.238 40.929-91.238 91.238 0 9.917 1.566 19.601 4.663 28.874-23.149 23.002-36.299 54.396-36.299 87.181 0 17.159 3.472 33.765 10.317 49.355 1.646 3.749 5.313 5.982 9.161 5.982 1.343 0 2.708-.272 4.016-.846 5.057-2.221 7.356-8.12 5.136-13.177-5.727-13.04-8.63-26.94-8.63-41.314 0-29.395 12.627-57.453 34.644-76.982 3.209-2.846 4.245-7.422 2.576-11.373-3.705-8.769-5.584-18.088-5.584-27.7 0-39.28 31.957-71.238 71.238-71.238 24.136 0 46.473 12.205 59.587 32.193-9.337 15.783-14.707 34.178-14.707 53.807v76.805l-34.88 34.88v-84.654c0-5.523-4.478-10-10-10s-10 4.477-10 10v48.524l-19.294-19.293c-3.906-3.905-10.236-3.905-14.143 0-3.905 3.905-3.905 10.237 0 14.142l33.437 33.436v99.834c-8.826-.849-17.461-2.812-25.771-5.894-5.178-1.921-10.934.72-12.854 5.899-1.921 5.178.721 10.933 5.898 12.853 10.544 3.91 21.514 6.326 32.727 7.228v60.855c-7.278-3.316-15.247-5.061-23.491-5.061-31.271 0-56.712 25.441-56.712 56.712 0 8.352 1.787 16.415 5.311 23.963 1.644 3.52 5.177 5.77 9.062 5.77h414.418c5.522 0 10-4.477 10-10s-4.478-10-10-10h-45.462v-93.476c53.776-5.055 96-50.447 96-105.523zm-106-157.8c32.584 0 59.094 26.509 59.094 59.094 0 7.973-1.558 15.704-4.631 22.977-1.669 3.951-.633 8.526 2.576 11.373 18.405 16.326 28.961 39.782 28.961 64.356 0 44.036-33.276 80.427-76 85.4v-35.355l34.805-34.805c3.905-3.905 3.905-10.237 0-14.142-3.906-3.905-10.236-3.905-14.143 0l-20.662 20.662v-68.39c0-5.523-4.478-10-10-10s-10 4.477-10 10v37.661l-16.246-16.246v-121.785c0-1.545-.041-3.08-.106-4.608 8.143-4.062 17.145-6.192 26.352-6.192zm-26.919 160.197 16.919 16.919v66.09c-17.252-2.031-33.551-9.266-46.638-20.705 16.166-16.468 27.009-38.172 29.719-62.304zm-105.327-235.397c47.421 0 86 38.58 86 86v137.488c0 44.036-33.276 80.427-76 85.4v-35.355l34.806-34.805c3.905-3.905 3.905-10.237 0-14.142s-10.235-3.905-14.143 0l-20.663 20.663v-68.389c0-5.523-4.478-10-10-10s-10 4.477-10 10v37.661l-13.857-13.857c-3.906-3.905-10.236-3.905-14.143 0-3.905 3.905-3.905 10.237 0 14.143l28 28v66.083c-42.724-4.973-76-41.363-76-85.4v-137.49c0-47.42 38.579-86 86-86zm-26.466 365.555c-6.019 0-12 .964-17.686 2.826-11.351-19.088-31.845-30.964-54.622-30.964-15.875 0-30.741 6.031-42.106 16.071v-43.723c20.913-1.658 40.689-8.517 58.09-20.162 17.481 21.846 43.41 36.648 72.79 39.411v38.986c-5.214-1.585-10.741-2.445-16.466-2.445zm-79.534-174.466v32.399c0 17.824 4.429 34.63 12.233 49.388-14.139 9.489-30.161 15.189-47.113 16.801v-63.707zm-115.083 231.178c0-20.243 16.469-36.712 36.712-36.712 9.889 0 19.165 3.879 26.12 10.924 2.574 2.607 6.367 3.598 9.889 2.583 3.521-1.016 6.204-3.876 6.993-7.455 4.368-19.811 22.282-34.189 42.596-34.189 18.002 0 33.925 10.82 40.565 27.566 1.058 2.667 3.21 4.751 5.909 5.723 2.696.972 5.685.738 8.2-.643 5.37-2.949 11.468-4.508 17.633-4.508 20.243 0 36.712 16.469 36.712 36.712 0 3.328-.438 6.584-1.306 9.733h-228.717c-.869-3.15-1.306-6.407-1.306-9.734zm250.487 9.733c.553-3.191.842-6.438.842-9.733 0-17.394-7.878-32.977-20.246-43.388v-49.865c18.509-1.74 35.646-8.259 50.167-18.307 17.068 15.812 38.942 25.604 62.079 27.809v93.484z"/><path id="XMLID_1251_" d="m52.49 316.46c1.859-1.86 2.93-4.44 2.93-7.07s-1.07-5.21-2.93-7.07-4.44-2.93-7.07-2.93c-2.641 0-5.21 1.07-7.07 2.93-1.87 1.86-2.93 4.44-2.93 7.07s1.06 5.21 2.93 7.07c1.86 1.86 4.43 2.93 7.07 2.93 2.63 0 5.21-1.07 7.07-2.93z"/></g></g></svg>
\ No newline at end of file

src/assets/sectors/vegetables.svg

+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
+<g>
+	<g>
+		<path d="M70.127,453.096l-0.092-0.07c-4.384-3.357-10.66-2.527-14.02,1.858c-3.358,4.384-2.526,10.661,1.857,14.02l0.092,0.07
+			c1.814,1.39,3.952,2.062,6.074,2.062c3.005,0,5.977-1.35,7.945-3.92C75.343,462.731,74.511,456.455,70.127,453.096z"/>
+	</g>
+</g>
+<g>
+	<g>
+		<path d="M70.127,371.096l-0.092-0.07c-4.384-3.357-10.66-2.527-14.02,1.858c-3.358,4.384-2.526,10.661,1.857,14.02l0.092,0.07
+			c1.814,1.39,3.952,2.062,6.074,2.062c3.005,0,5.977-1.35,7.945-3.92C75.343,380.731,74.511,374.455,70.127,371.096z"/>
+	</g>
+</g>
+<g>
+	<g>
+		<path d="M70.127,289.096l-0.092-0.07c-4.384-3.357-10.66-2.527-14.02,1.858c-3.358,4.384-2.526,10.661,1.857,14.02l0.092,0.07
+			c1.814,1.39,3.952,2.062,6.074,2.062c3.005,0,5.977-1.35,7.945-3.92C75.343,298.731,74.511,292.455,70.127,289.096z"/>
+	</g>
+</g>
+<g>
+	<g>
+		<path d="M454.04,453.065l-0.093-0.07c-4.402-3.336-10.674-2.472-14.01,1.93c-3.336,4.401-2.472,10.674,1.93,14.01l0.093,0.07
+			c1.807,1.369,3.928,2.031,6.032,2.031c3.023,0,6.011-1.365,7.978-3.96C459.306,462.674,458.441,456.401,454.04,453.065z"/>
+	</g>
+</g>
+<g>
+	<g>
+		<path d="M454.04,371.066l-0.093-0.07c-4.402-3.336-10.674-2.472-14.01,1.93c-3.335,4.4-2.471,10.673,1.93,14.009l0.093,0.07
+			c1.807,1.369,3.928,2.031,6.032,2.031c3.023,0,6.011-1.365,7.978-3.96C459.306,380.675,458.442,374.402,454.04,371.066z"/>
+	</g>
+</g>
+<g>
+	<g>
+		<path d="M454.04,289.066l-0.093-0.07c-4.402-3.336-10.674-2.472-14.01,1.93s-2.471,10.673,1.93,14.009l0.093,0.07
+			c1.807,1.369,3.928,2.031,6.032,2.031c3.023,0,6.011-1.365,7.978-3.96C459.306,298.675,458.442,292.402,454.04,289.066z"/>
+	</g>
+</g>
+<g>
+	<g>
+		<path d="M369.472,328h-0.13c-5.522,0-10,4.477-10,10s4.477,10,10,10h0.13c5.522,0,10-4.477,10-10S374.994,328,369.472,328z"/>
+	</g>
+</g>
+<g>
+	<g>
+		<path d="M142.658,410h-0.13c-5.522,0-10,4.477-10,10s4.478,10,10,10h0.13c5.522,0,10-4.477,10-10S148.181,410,142.658,410z"/>
+	</g>
+</g>
+<g>
+	<g>
+		<path d="M80.79,185.19c-1.86-1.86-4.44-2.93-7.07-2.93c-2.63,0-5.21,1.07-7.07,2.93c-1.859,1.86-2.93,4.44-2.93,7.08
+			c0,2.63,1.07,5.2,2.93,7.06c1.86,1.87,4.431,2.93,7.07,2.93c2.63,0,5.21-1.06,7.07-2.93c1.859-1.86,2.93-4.43,2.93-7.06
+			C83.72,189.63,82.65,187.06,80.79,185.19z"/>
+	</g>
+</g>
+<g>
+	<g>
+		<path d="M502,246h-41.534c17.872-10.28,29.941-29.556,29.941-51.611c0-22.896-12.99-43.277-32.78-53.194
+			c3.414-7.59,5.185-15.833,5.185-24.348c0-32.814-26.696-59.511-59.511-59.511c-10.346,0-20.282,2.61-29.137,7.605
+			c-11.618-8.188-25.511-12.627-39.854-12.627c-0.973,0-1.938,0.034-2.902,0.074c-10.565-30.798-40.025-52.34-73.205-52.34
+			c-29.92,0-56.994,17.329-69.75,43.882c-2.393-0.222-4.797-0.334-7.199-0.334c-31.445,0-59.373,18.989-71.297,47.304
+			c-2.116-0.646-4.269-1.21-6.454-1.699c1.146-12.781,5.2-22.579,12.117-29.167c6.025-5.739,12.077-6.928,12.332-6.976l-0.139,0.023
+			l-0.002-0.011c2.114-0.311,4.115-1.286,5.634-2.812c1.859-1.86,2.93-4.43,2.93-7.06c0-2.64-1.07-5.21-2.93-7.08
+			c-1.86-1.86-4.44-2.93-7.07-2.93c-0.561,0-1.118,0.059-1.668,0.153l-0.003-0.017c-5.938,0.935-14.059,4.263-21.549,11.025V10
+			c0-5.523-4.478-10-10-10h-24c-5.522,0-10,4.477-10,10v37.391C47.651,33.292,35.232,25.05,34.269,24.421
+			c-4.619-3.013-10.797-1.711-13.818,2.901c-3.022,4.613-1.731,10.808,2.875,13.839c0.331,0.217,30.586,20.477,35.081,49.622
+			C24.568,100.948,0,130.689,0,165.714C0,180.266,8.299,215.208,16.444,246H10c-5.522,0-10,4.477-10,10v246c0,5.523,4.478,10,10,10
+			h492c5.522,0,10-4.477,10-10V256C512,250.477,507.522,246,502,246z M181.254,63.596c3.847,0,7.699,0.385,11.452,1.145
+			c4.884,0.988,9.749-1.767,11.411-6.465c8.093-22.865,29.828-38.228,54.086-38.228c23.64,0,44.737,14.739,53.3,36.142
+			c-27.011,9.451-46.445,35.178-46.445,65.374c0,5.523,4.478,10,10,10c5.522,0,10-4.477,10-10c0-27.157,22.094-49.25,49.251-49.25
+			c12.043,0,23.641,4.403,32.655,12.399c3.555,3.153,8.84,3.368,12.64,0.516c6.877-5.164,15.071-7.893,23.695-7.893
+			c21.786,0,39.511,17.725,39.511,39.511c0,8.565-2.695,16.714-7.796,23.564c-1.994,2.679-2.52,6.178-1.399,9.325
+			c1.121,3.147,3.737,5.527,6.977,6.344c17.554,4.426,29.814,20.179,29.814,38.309c0,21.786-17.725,39.511-39.511,39.511
+			c-2.482,0-5.002-0.242-7.491-0.719c-4.847-0.932-9.646,1.816-11.304,6.464c-0.783,2.197-1.774,4.324-2.939,6.355h-12.624
+			l40.949-58.7c1.539-2.206,2.124-4.94,1.623-7.583c-0.501-2.643-2.046-4.973-4.285-6.463l-29.155-19.402
+			c-2.271-1.512-5.063-2.031-7.724-1.434c-2.662,0.596-4.966,2.253-6.376,4.589l-14.579,24.14l11.934-60.369
+			c1.064-5.389-2.416-10.628-7.796-11.734l-25.445-5.233c-2.629-0.542-5.367-0.002-7.595,1.496c-2.228,1.498-3.76,3.829-4.251,6.468
+			l-3.265,17.535h-23.337c-5.522,0-10,4.477-10,10v57.544c-6.646-34.029-36.673-59.794-72.617-59.794
+			c-16.197,0-31.581,5.139-44.487,14.862c-10.643,8.017-19.002,18.929-24.032,31.197c1.274-7.51,1.902-13.27,1.902-17.404
+			c0-13.561-3.683-26.332-10.16-37.482c5.254-14.295,18.913-24.006,34.363-24.006c2.455,0,4.915,0.247,7.313,0.733
+			c4.887,0.994,9.759-1.769,11.418-6.472c2.146-6.078,5.88-11.515,10.8-15.723c4.196-3.59,4.688-9.903,1.098-14.1
+			c-3.589-4.197-9.901-4.688-14.1-1.099c-5.494,4.7-10.03,10.398-13.373,16.749c-1.051-0.059-2.104-0.088-3.155-0.088
+			c-19.904,0-37.884,10.42-48.028,26.672c-4.75-4.573-10.082-8.608-15.891-11.998C137.066,77.779,157.846,63.596,181.254,63.596z
+			 M365.622,238.655l37.666-62.365l11.947,7.951L372.153,246h-7.983L365.622,238.655z M353.113,198.797V171.03
+			c0.053-0.21,0.111-0.418,0.151-0.634l8.369-44.944l5.745,1.182L353.113,198.797z M327.163,228.653
+			c0.043-0.379,0.072-0.763,0.072-1.153v-78.191h5.879V246h-3.156c0.027-0.626,0.042-1.253,0.042-1.882
+			C330,238.667,328.988,233.455,327.163,228.653z M190,182c-0.296,0-0.587,0.019-0.883,0.022c9.777-15.18,26.909-24.963,45.5-24.963
+			c26.422,0,48.458,19.081,53.09,44.184c-13.837,0.098-26.099,7.061-33.687,17.714C241.199,196.885,217.313,182,190,182z
+			 M243.057,246h-104.54h-1.573c4.705-25.012,26.699-44,53.057-44C216.359,202,238.352,220.988,243.057,246z M288,221.236
+			c12.131,0,22,10.265,22,22.882c0,0.631-0.03,1.258-0.079,1.882h-43.843c-0.049-0.624-0.079-1.251-0.079-1.882
+			C266,231.501,275.869,221.236,288,221.236z M79.155,20h4v67.057c-1.341,0.013-2.675,0.049-4,0.12V20z M20.597,157.81
+			c0.624,0.122,1.268,0.19,1.927,0.19h49.438c5.522,0,10-4.477,10-10s-4.478-10-10-10H27.606
+			c10.81-18.415,32.031-30.963,56.394-30.963c35.29,0,64,26.322,64,58.677c0,2.609-0.417,7.423-2.006,16.286h-39.719
+			c-5.522,0-10,4.477-10,10s4.478,10,10,10h33.206c-12.133,11.359-20.442,26.74-22.786,44H37.141
+			C26.216,205.214,20,176.152,20,165.714C20,163.033,20.215,160.398,20.597,157.81z M492,328h-88c-5.522,0-10,4.477-10,10
+			s4.478,10,10,10h88v62H176.606c-5.522,0-10,4.477-10,10s4.478,10,10,10H492v62H20v-62h88c5.522,0,10-4.477,10-10s-4.478-10-10-10
+			H20v-62h315.394c5.522,0,10-4.477,10-10s-4.478-10-10-10H20v-62h9.483H492V328z"/>
+	</g>
+</g>
+<g>
+	<g>
+		<path d="M245.465,54h-0.132c-5.522,0-10,4.477-10,10s4.478,10,10,10h0.132c5.522,0,10-4.477,10-10S250.987,54,245.465,54z"/>
+	</g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+</svg>

src/assets/sectors/vineyard.svg

+<svg id="Layer_1" enable-background="new 0 0 512 512" height="512" viewBox="0 0 512 512" width="512" xmlns="http://www.w3.org/2000/svg"><g><g><path d="m466.698 273.56c-2.02-8.08-5.27-15.69-9.67-22.62-4.07-6.42-9.141-12.28-15.06-17.42-7.91-6.86-17.439-12.7-28.349-17.36-9.03-3.86-19.301-7.03-30.53-9.42-19.41-4.1-37.63-4.97-49.5-4.98-2.342 0-4.331.035-5.92.079-8.21-6.769-18.723-10.839-30.17-10.839-4.527 0-8.961.633-13.212 1.861-4.055-19.283-17.97-34.974-36.209-41.538 27.449-58.494 19.235-94.671 6.9-115.058-13.534-22.369-39.16-36.265-66.875-36.265-21.704 0-37.647 4.646-48.741 14.204-5.125 4.415-9.434 10.224-13.097 17.666-18.38 7.345-38.402 21.057-59.587 40.818-4.038 3.767-4.259 10.095-.491 14.134 3.768 4.038 10.095 4.259 14.134.491 13.956-13.019 27.52-23.293 40.012-30.369.142 4.036.802 8.097 1.98 12.167 3.326 11.49 10.817 20.462 21.093 25.263 9.713 4.538 21.104 4.783 30.469.66 9.792-4.307 17.432-13.226 20.433-23.857 2.807-9.937 1.212-19.941-4.491-28.173-7.396-10.67-18.56-16.493-32.172-17.184 7.27-3.865 17.476-5.819 30.457-5.819 16.271 0 37.889 6.993 49.763 26.618 10.121 16.727 16.246 47.769-10.41 101.419-5.039.136-9.921.917-14.556 2.292-2.818-7.812-7.487-14.897-13.729-20.632-9.613-8.834-22.103-13.698-35.171-13.698-19.3 0-36.165 10.577-45.137 26.232-5.582-1.799-11.449-2.732-17.362-2.732-31.154 0-56.5 25.346-56.5 56.5 0 18.171 8.774 34.84 22.739 45.294-12.651 10.37-20.739 26.11-20.739 43.706 0 18.353 8.931 35.331 23.455 45.82-4.114 7.833-6.455 16.736-6.455 26.18 0 17.37 7.925 33.412 21.015 43.971-7.467 8.394-12.015 19.438-12.015 31.529 0 26.191 21.308 47.5 47.5 47.5 12.297 0 23.516-4.698 31.96-12.392l4.619 35.672c.359 2.74 1.84 5.23 4.08 6.83 1.68 1.22 3.77 1.89 5.859 1.89.641 0 1.28-.06 1.9-.19 46.34-8.96 69.21-31.63 80.24-49.07 5.21-8.18 9.199-17.2 11.87-26.79 2.069-7.41 3.35-15.19 3.819-23.11 7.32 5.93 13.19 13.75 17.46 23.22 2.65 5.96 4.08 11.39 4.811 14.89.319 1.52.569 3.02.76 4.43.06.47.1.85.12 1.09.01.11.02.18.02.21v.01c.271 3.86 2.77 7.24 6.37 8.64 1.16.44 2.37.67 3.61.67 2.6 0 5.06-.99 6.93-2.79 13.88-13.36 23.88-30.72 29.72-51.62 3.16-11.34 5.011-23.32 5.5-35.6 2.561 1.39 5.181 3.09 7.79 5.04 11.94 8.79 23.31 22.1 29.03 29.25 4.05 5.04 7.29 9.47 9.29 12.3.9 1.26 1.75 2.48 2.53 3.64.29.42.5.74.64.95s.19.28.19.28c1.85 2.85 4.979 4.55 8.37 4.55.46 0 .93-.03 1.39-.09 3.88-.55 7.01-3.2 8.17-6.95 2.41-7.76 4.34-15.51 5.73-23.06.489-2.62-.07-5.28-1.591-7.48-1.51-2.21-3.79-3.69-6.42-4.17-.6-.11-1.22-.17-1.83-.17-4.81 0-8.939 3.44-9.819 8.18v.02c-.04.21-.08.43-.12.64-3.391-4.27-6.851-8.36-10.28-12.17-8.16-9.06-15.809-16.19-23.39-21.8-10.38-7.62-19.471-11.71-28.62-12.88-3.01-.36-6.01.65-8.18 2.76-2.181 2.12-3.271 5.07-2.99 8.1l.01.03c.02.27.22 2.78.22 6.94.011 7.01-.62 21.06-4.89 36.31-2.9 10.4-7.04 19.8-12.3 27.94-.761-2.1-1.601-4.2-2.5-6.22-3.761-8.52-8.77-16.21-14.891-22.86-4.077-4.434-8.622-8.33-13.569-11.696 7.385-8.375 11.88-19.356 11.88-31.374 0-8.28-2.134-16.069-5.874-22.854 14.797-10.443 23.874-27.502 23.874-46.146 0-2.435-.172-4.829-.473-7.183 24.312-2.053 43.472-22.483 43.472-47.317 0-5.831-1.062-11.418-2.993-16.584 13.253.495 34.935 2.43 54.993 9.294 12.95 4.4 23.649 10.25 31.819 17.38 6.86 6.02 11.85 12.69 15.25 20.41-9.75 2.17-24.809 4.75-41.25 4.75h-.22c-12.439 0-23.819-1.46-33.83-4.36-.899-.26-1.83-.39-2.77-.39-3.82 0-7.25 2.12-8.95 5.55-2.15 4.3-.92 9.53 2.92 12.43l.01.01c.12.08 13.24 10.23 23.48 30.07 1.729 3.33 5.13 5.4 8.89 5.4 1.58 0 3.17-.38 4.59-1.12 4.891-2.53 6.82-8.58 4.28-13.47-2.59-4.99-5.51-9.84-8.689-14.41 3.289.19 6.699.29 10.13.29 12.55-.01 25.62-1.29 38.849-3.8 8.89-1.69 15.26-3.45 18.27-4.35.109-.03.18-.05.21-.06 5.052-1.58 8.002-6.84 6.712-11.98zm-293.319-219.164c2.869 4.142 2.499 8.455 1.683 11.345-1.377 4.875-4.917 9.085-9.244 10.988-4.105 1.808-9.449 1.626-13.945-.474-3.519-1.644-8.17-5.183-10.348-12.706-1.558-5.377-1.618-10.558-.167-15.734 10.115-2.845 24.467-4.318 32.021 6.581zm92.12 150.104c0 13.328-7.388 25.654-18.994 32.026-.336-.006-.668-.026-1.006-.026-7.044 0-13.925 1.305-20.349 3.785-2.164-19.679-14.468-36.349-31.565-44.647 3.96-15.952 18.372-27.638 35.414-27.638 20.126 0 36.5 16.374 36.5 36.5zm-1.5 157.5c0 14.402-11.132 26.246-25.241 27.4-1.588-17.652-11.324-32.981-25.412-42.2 4.972-7.725 13.653-12.699 23.154-12.699 15.162-.001 27.499 12.335 27.499 27.499zm-96.226 65.905c-1.434-14.866-9.752-27.742-21.716-35.412 1.045-19.196 16.99-34.493 36.442-34.493 20.126 0 36.5 16.374 36.5 36.5s-16.374 36.5-36.5 36.5c-5.106 0-10.115-1.061-14.726-3.095zm1.226-217.905c20.126 0 36.5 16.374 36.5 36.5 0 8.608-3.058 16.885-8.516 23.412-3.679-.917-7.524-1.412-11.484-1.412-9.66 0-18.65 2.906-26.157 7.878-2.526-16.426-12.16-30.53-25.643-39.094 4.121-15.711 18.573-27.284 35.3-27.284zm43.516 111.055c-7.399 4.346-13.591 10.652-17.763 18.299-3.948-.877-8.044-1.354-12.252-1.354-2.912 0-5.772.222-8.567.649-3.201-9.294-8.751-17.45-15.903-23.811.612-14.626 12.697-26.338 27.47-26.338 15.163 0 27.5 12.336 27.5 27.5-.001 1.706-.176 3.394-.485 5.055zm-48.516-185.055c14.742 0 27.149 9.77 30.857 23.485-9.933 7.538-17.309 18.29-20.54 30.773-1.751-.164-3.523-.258-5.317-.258-7.877 0-15.553 1.633-22.612 4.718-8.862-5.864-14.387-15.918-14.387-26.718-.001-17.645 14.355-32 31.999-32zm-98.999 60c0-20.126 16.374-36.5 36.5-36.5 3.735 0 7.435.582 10.96 1.688-.293 2.232-.46 4.502-.46 6.812 0 14.831 6.418 28.793 17.099 38.514-6.548 6.532-11.333 14.483-14.035 23.18-3.734-.78-7.601-1.194-11.563-1.194-4.957 0-9.766.647-14.35 1.852-14.345-5.148-24.151-18.907-24.151-34.352zm38.5 52.5c20.126 0 36.5 16.374 36.5 36.5 0 .988-.042 1.969-.118 2.941-.011.124-.022.248-.029.372-.445 5.05-1.914 9.857-4.332 14.237-4.801-1.333-9.84-2.049-15.02-2.049-14.499 0-27.735 5.494-37.748 14.504-9.731-6.741-15.753-17.904-15.753-30.005 0-20.126 16.374-36.5 36.5-36.5zm17 72c15.783 0 29.56 10.206 34.527 24.654-14.775 8.259-25.479 22.954-28.288 40.269-2.043-.27-4.123-.423-6.239-.423-6.441 0-12.584 1.294-18.19 3.627-11.238-6.465-18.31-18.448-18.31-31.627 0-20.126 16.374-36.5 36.5-36.5zm0 139.5c-15.163 0-27.5-12.336-27.5-27.5s12.337-27.5 27.5-27.5 27.5 12.336 27.5 27.5-12.337 27.5-27.5 27.5zm111.799-8.02c-11.86 18.39-30.44 30.75-56.799 37.79l-5.194-40.102c3.982.878 8.067 1.332 12.194 1.332 25.965 0 47.881-17.611 54.466-41.512 2.744-.027 5.431-.292 8.046-.767-.278 10.135-2.473 27.273-12.713 43.259zm32.576-128.049c-7.923-5.921-17.747-9.431-28.376-9.431-1.187 0-2.364.051-3.535.139-.408-14.404-7.252-27.219-17.761-35.667 3.092-4.401 5.541-9.208 7.27-14.282 6.498-5.293 14.581-8.19 23.026-8.19 20.126 0 36.5 16.374 36.5 36.5 0 12.74-6.569 24.325-17.124 30.931zm32.623-57.931c-.823 0-1.639-.049-2.45-.12-5.521-10.046-14.011-18.232-24.276-23.39 7.142-7.883 12.009-17.699 13.874-28.296 3.939-2.092 8.312-3.194 12.852-3.194 15.163 0 27.5 12.336 27.5 27.5s-12.337 27.5-27.5 27.5z"/><path d="m405.298 345.295c-.39 0-.78.03-1.17.07-2.65.31-5.02 1.629-6.679 3.718-1.66 2.099-2.4 4.708-2.1 7.366.59 5.038 4.85 8.846 9.919 8.846.391 0 .78-.03 1.17-.07 5.47-.64 9.409-5.608 8.78-11.085 0 0 0 0 0-.01-.591-5.037-4.861-8.835-9.92-8.835z"/></g></g></svg>
\ No newline at end of file

src/config/app.config.ts

@@ -5,42 +5,7 @@ export class AppConfig {
   public static Origin: string = environment.baseUrl;
 
   public static ApiPaths = {
-    getAllResources: `${AppConfig.Origin}/resource/getAllResources`,
-    getResourcesForApproval: `${AppConfig.Origin}/admin/getResourceForApproval`,
-    getResource: `${AppConfig.Origin}/resource/get`,
-    hasImage: `${AppConfig.Origin}/resource/imageExist`,
-
-    approveResource: `${AppConfig.Origin}/admin/approve`,
-    deleteResource: `${AppConfig.Origin}/admin/delete`,
-    deleteFile: `${AppConfig.Origin}/file/delete`,
-
-
-    getFile: `${AppConfig.Origin}/resource/file`,
-    getFileById: `${AppConfig.Origin}/file/get`,
-
-
-    saveResource: `${AppConfig.Origin}/resource/saveResource`,
-    searchResource: `${AppConfig.Origin}/resource/search`,
-    addFile: `${AppConfig.Origin}/resource/add`,
-    addHelpFile: `${AppConfig.Origin}/file/add`,
-    download: `${AppConfig.Origin}/resource/download`,
-
-
-    getAllLanguages: `${AppConfig.Origin}/codebooks/getAllLanguages`,
-    getAllSectors: `${AppConfig.Origin}/codebooks/getAllSectors`,
-    getAllRegions: `${AppConfig.Origin}/codebooks/getAllRegions`,
-    getAllResourceTypes: `${AppConfig.Origin}/codebooks/getAllResourceTypes`,
-    getAllProjects: `${AppConfig.Origin}/codebooks/getAllProjects`,
-    getAllPests: `${AppConfig.Origin}/codebooks/getAllPests`,
-    getAllCrops: `${AppConfig.Origin}/codebooks/getAllCrops`,
-    getAllKeywords: `${AppConfig.Origin}/codebooks/getAllKeywords`,
-    getAllHelpFilesDesc: `${AppConfig.Origin}/file/help/list`,
-
-    login:`${AppConfig.Origin}/auth/authenticate`,
-    startChangingPassword:`${AppConfig.Origin}/auth/startChangingPassword`,
-    getUserName:`${AppConfig.Origin}/auth/validateToken`,
-    changePassword:`${AppConfig.Origin}/auth/changePassword`
-
+    getAllResources: `${AppConfig.Origin}/getAllResources`,
 
   };
 

src/environments/environment.ts

@@ -3,7 +3,8 @@
 // The list of file replacements can be found in `angular.json`.
 
 export const environment = {
-  production: false
+  production: false,
+  baseUrl: 'http://localhost:8080'
 };
 
 /*

src/styles.css

-/* You can add global styles to this file, and also import other style files */
+.p-menubar{
+  margin:-8px;
+  background-color:#00662e !important;
+}
+.p-button:not(.p-button-outlined){
+  background-color:#00662e !important;
+}
+.p-rating .p-rating-icon.pi-star {
+  color: darkorange !important;
+}
+.p-rating .p-rating-icon {
+  color:#00662e !important;
+}
+.p-multiselect, .p-inputtext	 {
+  width: 100%;
+}
+.p-inputtext:enabled:focus{
+  box-shadow:unset !important;
+  border-color: rgba(0, 0, 0, 0.87) !important;
+}
+.p-button.p-button-text{
+  color:#00662e !important;
+}
+.p-card	 {
+  padding: 1rem;
+  margin-bottom: 2rem;
+  margin-right: 2rem;
+}
+.p-card-header {
+  display:block;
+  height:150px;
+  overflow:hidden;
+  position: relative;
+}
+.p-card-header img{
+  height:100%;
+  width:100%;
+}
+.p-card .p-card-footer {
+  display: flex;
+  justify-content: center;
+}
+.p-button.p-button-outlined{
+  color:#00662e !important;
+}