yigitfindikli

<div class="p-d-flex p-ai-center p-jc-between p-mt-3">
	<div class="p-col-6">
		<h2 class="p-ml-3">{{ 'demo.greetings' | translate }}</h2>
	</div>
	<div class="p-d-flex p-col-6 p-jc-end">
		<div class="p-mr-3">
			<p-radioButton (ngModelChange)="changeLang($event)" name="language" value="en" [(ngModel)]="lang"
				inputId="en"></p-radioButton>
			<label class="p-ml-1" for="en">{{ 'demo.en' | translate }}</label>
		</div>

yigitfindikli

{
  "demo": {
    "greetings": "Bonjour!",
    "en": "Anglaise",
    "fr": "Français"
  }
}

yigitfindikli

{
  "demo": {
    "greetings": "Hello!",
    "en": "English",
    "fr": "French"
  }
}

yigitfindikli

import { HttpClient, HttpClientModule } from '@angular/common/http';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { BrowserModule } from '@angular/platform-browser';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { TranslateLoader, TranslateModule } from '@ngx-translate/core';
import { TranslateHttpLoader } from '@ngx-translate/http-loader';
import { RadioButtonModule } from 'primeng/radiobutton';
import { CalendarModule } from 'primeng/calendar';
import { DropdownModule } from 'primeng/dropdown';

yigitfindikli

<div class="app">
    <div class="topbar p-shadow-2 p-p-2">
        <button pButton pRipple type="button" class="p-button-rounded" (click)="visibleSidebar = true" icon="pi pi-bars"></button>
    </div>

    <div class="content p-p-4">
        <div class="p-fluid p-formgrid p-grid">
          <div class="p-field p-col-12 p-md-6">
            <label for="firstname">Firstname</label>
            <input id="firstname" [(ngModel)]="firstname" type="text" pInputText />

yigitfindikli

import { Component } from '@angular/core';
import { MessageService, PrimeNGConfig } from 'primeng/api';
@Component({
    selector: 'app-root',
    templateUrl: './app.component.html',
    styleUrls: ['./app.component.css']
})
export class AppComponent {
    adress: string;

yigitfindikli

.topbar {
  height: 55px;
  background-color: var(--primary-color);
  color: var(--text-color);
}

yigitfindikli

<div class="app">
  <div class="topbar p-shadow-2 p-p-2">
    <button pButton pRipple type="button" class="p-button-rounded" icon="pi pi-bars"></button>
  </div>
</div>

yigitfindikli

body {
    padding: 0;
    margin: 0;
    font-family: var(--font-family);
    background-color: var(--surface-0);
    color: var(--text-color);
}

yigitfindikli

import { NgModule } from "@angular/core";
import { BrowserModule } from "@angular/platform-browser";
import { FormsModule } from "@angular/forms";
import { BrowserAnimationsModule } from "@angular/platform-browser/animations";

import { AppComponent } from "./app.component";

// Import PrimeNG modules
import { ButtonModule } from "primeng/button";
import { SidebarModule } from "primeng/sidebar";