chore: update dialogs and add prettierr config

yanmariomenev · yanmariomenev · commit 3a9e83061b51 · 2025-04-28T17:14:04.000+03:00
diff --git a/examples-standalone/kendoangular-landing-page/.prettierignore b/examples-standalone/kendoangular-landing-page/.prettierignore
@@ -0,0 +1,3 @@
+# Add files here to ignore them from prettier formatting
+
+/dist
diff --git a/examples-standalone/kendoangular-landing-page/.prettierrc b/examples-standalone/kendoangular-landing-page/.prettierrc
@@ -0,0 +1,5 @@
+{
+    "singleQuote": true,
+    "printWidth": 120,
+    "tabWidth": 4
+}
diff --git a/examples-standalone/kendoangular-landing-page/src/app/components/dialogs/dialogs.component.css b/examples-standalone/kendoangular-landing-page/src/app/components/dialogs/dialogs.component.css
@@ -25,22 +25,14 @@
     font-size: 20px;
 }
 
-.window-content {
-    padding: 15px;
-}
-
-.window-header {
-    display: flex;
-    align-items: center;
-    margin-bottom: 20px;
-    padding-bottom: 15px;
-    border-bottom: 1px solid #eee;
+kendo-window {
+    --kendo-window-titlebar-bg: #3f51b5;
+    --kendo-window-titlebar-text: white;
+    margin-top: 0;
 }
 
-.window-header .k-icon {
-    font-size: 24px;
-    margin-right: 10px;
-    color: #ff6358;
+.window-content {
+    padding: 15px;
 }
 
 .success-message,
@@ -57,11 +49,6 @@
     border-left-color: #2196f3;
 }
 
-kendo-window {
-    --kendo-window-titlebar-bg: #3f51b5;
-    --kendo-window-titlebar-text: white;
-}
-
 .k-form-field {
     margin-bottom: 15px;
 }
@@ -75,12 +62,14 @@ fieldset {
 
 legend {
     padding: 0 10px;
-    font-weight: 500;
+    font-size: 14px;
+    font-weight: bold;
+    margin-bottom: 5px;
     color: #455a64;
 }
 
 .k-actions {
-    margin-top: 20px;
+    margin-top: 15px;
 }
 
 @media (max-width: 768px) {
diff --git a/examples-standalone/kendoangular-landing-page/src/app/components/dialogs/dialogs.component.html b/examples-standalone/kendoangular-landing-page/src/app/components/dialogs/dialogs.component.html
@@ -32,18 +32,13 @@ <h4>Kendo Angular Dialog</h4>
         title="Complete Your Profile"
         [minWidth]="320"
         [width]="500"
-        [height]="590"
-        [top]="160"
+        [height]="430"
+        [top]="80"
         [resizable]="true"
         [draggable]="true"
         (close)="closeWindow()"
     >
         <div class="window-content">
-            <div class="window-header">
-                <span class="k-icon k-i-user"></span>
-                <p>Please fill in your profile information to continue</p>
-            </div>
-
             <form class="k-form">
                 <fieldset>
                     <legend>Personal Information</legend>
@@ -69,10 +64,6 @@ <h4>Kendo Angular Dialog</h4>
                         <label>Date of Birth</label>
                         <kendo-datepicker placeholder="Select your birth date"></kendo-datepicker>
                     </div>
-                    <div class="k-form-field">
-                        <label>Bio</label>
-                        <kendo-textarea placeholder="Tell us about yourself" [rows]="3"></kendo-textarea>
-                    </div>
                 </fieldset>
 
                 <div class="k-actions k-actions-end">
diff --git a/examples-standalone/kendoangular-landing-page/src/app/components/dialogs/dialogs.component.ts b/examples-standalone/kendoangular-landing-page/src/app/components/dialogs/dialogs.component.ts
@@ -1,23 +1,23 @@
-import { Component } from "@angular/core";
-import { FormsModule } from "@angular/forms";
-import { KENDO_BUTTONS } from "@progress/kendo-angular-buttons";
-import { KENDO_DATEINPUTS } from "@progress/kendo-angular-dateinputs";
-import { KENDO_DIALOGS } from "@progress/kendo-angular-dialog";
-import { KENDO_INPUTS } from "@progress/kendo-angular-inputs";
+import { Component } from '@angular/core';
+import { FormsModule } from '@angular/forms';
+import { KENDO_BUTTONS } from '@progress/kendo-angular-buttons';
+import { KENDO_DATEINPUTS } from '@progress/kendo-angular-dateinputs';
+import { KENDO_DIALOGS } from '@progress/kendo-angular-dialog';
+import { KENDO_INPUTS } from '@progress/kendo-angular-inputs';
 
 @Component({
-    selector: "app-dialogs",
+    selector: 'app-dialogs',
     imports: [KENDO_DIALOGS, KENDO_BUTTONS, KENDO_INPUTS, KENDO_DATEINPUTS, FormsModule],
-    templateUrl: "./dialogs.component.html",
-    styleUrl: "./dialogs.component.css",
+    templateUrl: './dialogs.component.html',
+    styleUrl: './dialogs.component.css',
 })
 export class DialogsComponent {
     public windowOpened = true;
     public formSubmitted = false;
-    public firstName = "";
-    public lastName = "";
+    public firstName = '';
+    public lastName = '';
     public dialogOpened = false;
-    public confirmationResult = "";
+    public confirmationResult = '';
 
     public openWindow(): void {
         this.windowOpened = true;
@@ -47,8 +47,8 @@ export class DialogsComponent {
 
     public reset(): void {
         this.formSubmitted = false;
-        this.confirmationResult = "";
-        this.firstName = "";
-        this.lastName = "";
+        this.confirmationResult = '';
+        this.firstName = '';
+        this.lastName = '';
     }
 }
diff --git a/examples-standalone/kendoangular-landing-page/src/app/components/scheduler/scheduler.component.ts b/examples-standalone/kendoangular-landing-page/src/app/components/scheduler/scheduler.component.ts
@@ -1,74 +1,73 @@
-import { ChangeDetectorRef, Component, Inject, LOCALE_ID } from "@angular/core";
-import { FormBuilder, FormGroup, ReactiveFormsModule } from "@angular/forms";
-import { KENDO_DROPDOWNLIST } from "@progress/kendo-angular-dropdowns";
-import { CldrIntlService, IntlService } from "@progress/kendo-angular-intl";
-import { MessageService } from "@progress/kendo-angular-l10n";
-import { CreateFormGroupArgs, KENDO_SCHEDULER } from "@progress/kendo-angular-scheduler";
-import { KENDO_TOOLBAR } from "@progress/kendo-angular-toolbar";
-import { customModelFields, displayDate, sampleDataWithCustomSchema } from "../../data/scheduler-data";
-import { SchedulerMessageService } from "../../services/scheduler-message.service";
+import { Component, Inject, LOCALE_ID } from '@angular/core';
+import { FormBuilder, FormGroup, ReactiveFormsModule } from '@angular/forms';
+import { KENDO_DROPDOWNLIST } from '@progress/kendo-angular-dropdowns';
+import { CldrIntlService, IntlService } from '@progress/kendo-angular-intl';
+import { MessageService } from '@progress/kendo-angular-l10n';
+import { CreateFormGroupArgs, KENDO_SCHEDULER } from '@progress/kendo-angular-scheduler';
+import { KENDO_TOOLBAR } from '@progress/kendo-angular-toolbar';
+import { customModelFields, displayDate, sampleDataWithCustomSchema } from '../../data/scheduler-data';
+import { SchedulerMessageService } from '../../services/scheduler-message.service';
 
-import "@progress/kendo-angular-intl/locales/en/all";
-import "@progress/kendo-angular-intl/locales/es/all";
+import '@progress/kendo-angular-intl/locales/en/all';
+import '@progress/kendo-angular-intl/locales/es/all';
 
 interface LanguageOption {
     text: string;
     value: string;
 }
 @Component({
-    selector: "app-scheduler",
+    selector: 'app-scheduler',
     imports: [KENDO_SCHEDULER, KENDO_TOOLBAR, KENDO_DROPDOWNLIST, ReactiveFormsModule],
     providers: [
         { provide: MessageService, useClass: SchedulerMessageService },
-        { provide: LOCALE_ID, useValue: "en" },
+        { provide: LOCALE_ID, useValue: 'en' },
     ],
-    templateUrl: "./scheduler.component.html",
-    styleUrls: ["./scheduler.component.css"],
+    templateUrl: './scheduler.component.html',
+    styleUrls: ['./scheduler.component.css'],
 })
 export class SchedulerComponent {
     public selectedDate: Date = displayDate;
     public events: any[] = sampleDataWithCustomSchema;
-    public currentView: string = "day";
+    public currentView: string = 'day';
     public modelFields = customModelFields;
-    public orientation: "horizontal" | "vertical" = "horizontal";
+    public orientation: 'horizontal' | 'vertical' = 'horizontal';
     public formGroup!: FormGroup;
-    public group: any = { resources: ["Rooms", "Persons"] };
+    public group: any = { resources: ['Rooms', 'Persons'] };
 
     public resources = [
         {
-            name: "Rooms",
+            name: 'Rooms',
             data: [
-                { text: "Meeting Room 101", value: 1, color: "#5392E4" },
-                { text: "Meeting Room 201", value: 2, color: "#FF7272" },
+                { text: 'Meeting Room 101', value: 1, color: '#5392E4' },
+                { text: 'Meeting Room 201', value: 2, color: '#FF7272' },
             ],
-            field: "RoomID",
-            valueField: "value",
-            textField: "text",
-            colorField: "color",
+            field: 'RoomID',
+            valueField: 'value',
+            textField: 'text',
+            colorField: 'color',
         },
         {
-            name: "Persons",
+            name: 'Persons',
             data: [
-                { text: "Peter", value: 1, color: "#5392E4" },
-                { text: "Alex", value: 2, color: "#54677B" },
+                { text: 'Peter', value: 1, color: '#5392E4' },
+                { text: 'Alex', value: 2, color: '#54677B' },
             ],
-            field: "PersonIDs",
-            valueField: "value",
-            textField: "text",
-            colorField: "color",
+            field: 'PersonIDs',
+            valueField: 'value',
+            textField: 'text',
+            colorField: 'color',
         },
     ];
     public languages: LanguageOption[] = [
-        { text: "English", value: "en" },
-        { text: "Spanish", value: "es" },
+        { text: 'English', value: 'en' },
+        { text: 'Spanish', value: 'es' },
     ];
-    public selectedLanguage: any = { text: "English", value: "en-US" };
+    public selectedLanguage: any = { text: 'English', value: 'en-US' };
     constructor(
         private formBuilder: FormBuilder,
         private messages: MessageService,
         @Inject(LOCALE_ID) public localeId: string,
-        public intlService: IntlService,
-        private cdr: ChangeDetectorRef
+        public intlService: IntlService
     ) {
         this.createFormGroup = this.createFormGroup.bind(this);
     }
@@ -121,12 +120,12 @@ export class SchedulerComponent {
         }
     }
 
-    public handleOrientationChange(orientation: "horizontal" | "vertical"): void {
+    public handleOrientationChange(orientation: 'horizontal' | 'vertical'): void {
         this.orientation = orientation;
     }
     public changeLanguage(language: LanguageOption): void {
         const svc = <SchedulerMessageService>this.messages;
-        svc.language = svc.language === "es" ? "en" : "es";
+        svc.language = svc.language === 'es' ? 'en' : 'es';
         (this.intlService as CldrIntlService).localeId = language.value;
     }
 }
diff --git a/examples-standalone/kendoangular-landing-page/src/app/services/locale.service.ts b/examples-standalone/kendoangular-landing-page/src/app/services/locale.service.ts

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,3 @@`
	`1`	`+# Add files here to ignore them from prettier formatting`
	`2`	`+`
	`3`	`+/dist`