Renamed folder

src/app.routes.ts

@@ -1,5 +1,5 @@
 import { Routes } from '@angular/router';
-import { AppLayout } from './app/layout/core/app.layout';
+import { AppLayout } from './app/layout/component/app.layout';
 import { Dashboard } from './app/pages/dashboard/dashboard';
 import { Documentation } from './app/pages/documentation/documentation';
 import { Landing } from './app/pages/landing/landing';

src/app/layout/component/app.configurator.ts

@@ -1,6 +1,7 @@
 import { CommonModule, isPlatformBrowser } from '@angular/common';
-import { Component, computed, inject, PLATFORM_ID, Signal, signal } from '@angular/core';
+import { Component, computed, inject, PLATFORM_ID, signal } from '@angular/core';
 import { FormsModule } from '@angular/forms';
+import { Router } from '@angular/router';
 import { $t, updatePreset, updateSurfacePalette } from '@primeng/themes';
 import Aura from '@primeng/themes/aura';
 import Lara from '@primeng/themes/lara';
@@ -8,7 +9,6 @@ import Nora from '@primeng/themes/nora';
 import { PrimeNG } from 'primeng/config';
 import { SelectButtonModule } from 'primeng/selectbutton';
 import { LayoutService } from '../service/layout.service';
-import { Router } from '@angular/router';
 
 const presets = {
     Aura,
@@ -91,7 +91,6 @@ declare type SurfacesType = {
     }
 })
 export class AppConfigurator {
-
     router = inject(Router);
 
     config: PrimeNG = inject(PrimeNG);

src/app/pages/auth/access.ts

@@ -2,7 +2,7 @@ import { Component } from '@angular/core';
 import { RouterModule } from '@angular/router';
 import { ButtonModule } from 'primeng/button';
 import { RippleModule } from 'primeng/ripple';
-import { AppFloatingConfigurator } from '../../layout/core/app.floatingconfigurator';
+import { AppFloatingConfigurator } from '../../layout/component/app.floatingconfigurator';
 
 @Component({
     selector: 'app-access',

src/app/pages/auth/error.ts

@@ -2,7 +2,7 @@ import { Component } from '@angular/core';
 import { RouterModule } from '@angular/router';
 import { ButtonModule } from 'primeng/button';
 import { RippleModule } from 'primeng/ripple';
-import { AppFloatingConfigurator } from '../../layout/core/app.floatingconfigurator';
+import { AppFloatingConfigurator } from '../../layout/component/app.floatingconfigurator';
 
 @Component({
     selector: 'app-error',

src/app/pages/auth/login.ts

@@ -1,12 +1,12 @@
-import { Component, inject } from '@angular/core';
+import { Component } from '@angular/core';
+import { FormsModule } from '@angular/forms';
+import { RouterModule } from '@angular/router';
 import { ButtonModule } from 'primeng/button';
 import { CheckboxModule } from 'primeng/checkbox';
 import { InputTextModule } from 'primeng/inputtext';
 import { PasswordModule } from 'primeng/password';
-import { FormsModule } from '@angular/forms';
-import { RouterModule } from '@angular/router';
 import { RippleModule } from 'primeng/ripple';
-import { AppFloatingConfigurator } from '../../layout/core/app.floatingconfigurator';
+import { AppFloatingConfigurator } from '../../layout/component/app.floatingconfigurator';
 
 @Component({
     selector: 'app-login',

src/app/pages/documentation/documentation.ts

@@ -1,5 +1,5 @@
-import { Component } from '@angular/core';
 import { CommonModule } from '@angular/common';
+import { Component } from '@angular/core';
 
 @Component({
     selector: 'app-documentation',
@@ -23,18 +23,17 @@ ng serve</code></pre>
             <p class="text-lg mb-4">The application should run at <i class="bg-highlight px-2 py-1 rounded-border not-italic text-base">http://localhost:4200/</i> to view the application in your local environment.</p>
 
             <div class="font-semibold text-xl mb-4">Structure</div>
-            <p class="text-lg mb-4">Templates consists of a couple folders, demos and layout have been separated so that you can easily remove what is not necessary for your application.</p>
+            <p class="text-lg mb-4">Templates consists of a couple folders, demos and layout have been separated so that you can easily identify what is necessary for your application.</p>
             <ul class="leading-normal list-disc pl-8 text-lg mb-4">
-                <li><span class="text-primary font-medium">src/layout</span>: Main layout files, needs to be present.</li>
+                <li><span class="text-primary font-medium">src/app/layout</span>: Main layout files, needs to be present.</li>
-                <li><span class="text-primary font-medium">src/pages</span>: Demo pages like Dashboard.</li>
+                <li><span class="text-primary font-medium">src/app/pages</span>: Demo content like Dashboard.</li>
-                <li><span class="text-primary font-medium">public/pages/images/landing</span>: Assets used in demos</li>
+                <li><span class="text-primary font-medium">src/assets/demo</span>: Assets used in demos</li>
-                <li><span class="text-primary font-medium">src/assets/demo</span>: Styles used in demos</li>
                 <li><span class="text-primary font-medium">src/assets/layout</span>: SCSS files of the main layout</li>
             </ul>
 
             <div class="font-semibold text-xl mb-4">Menu</div>
             <p class="text-lg mb-4">
-                Main menu is defined at <span class="bg-highlight px-2 py-1 rounded-border not-italic text-base">src/app/layout/core/app.menu.ts</span> file. Update the
+                Main menu is defined at <span class="bg-highlight px-2 py-1 rounded-border not-italic text-base">src/app/layout/component/app.menu.ts</span> file. Update the
                 <i class="bg-highlight px-2 py-1 rounded-border not-italic text-base">model</i> property to define your own menu items.
             </p>
 
@@ -44,11 +43,11 @@ ng serve</code></pre>
             </p>
 
             <div class="font-semibold text-xl mb-4">Tailwind CSS</div>
-            <p class="text-lg mb-4">The demo pages are developed with Tailwind CSS however the core application shell mainly uses custom CSS.</p>
+            <p class="text-lg mb-4">The demo pages are developed with Tailwind CSS however the core application shell uses custom CSS.</p>
 
             <div class="font-semibold text-xl mb-4">Variables</div>
             <p class="text-lg mb-4">
-                CSS variables used in the template are derived from the default theme. Customize them through the CSS variables in <span class="bg-highlight px-2 py-1 rounded-border not-italic text-base">src/assets/layout/variables</span>.
+                CSS variables used in the template are derived from the applied PrimeNG theme. Customize them through the CSS variables in <span class="bg-highlight px-2 py-1 rounded-border not-italic text-base">src/assets/layout/variables</span>.
             </p>
         </div>
     `,

src/app/pages/notfound/notfound.ts

@@ -1,7 +1,7 @@
 import { Component } from '@angular/core';
 import { RouterModule } from '@angular/router';
 import { ButtonModule } from 'primeng/button';
-import { AppFloatingConfigurator } from '../../layout/core/app.floatingconfigurator';
+import { AppFloatingConfigurator } from '../../layout/component/app.floatingconfigurator';
 
 @Component({
     selector: 'app-notfound',

src/app/pages/uikit/filedemo.ts

@@ -9,11 +9,12 @@ import { ToastModule } from 'primeng/toast';
     selector: 'app-file-demo',
     standalone: true,
     imports: [CommonModule, FileUploadModule, ToastModule, ButtonModule],
-    template: `<div class="grid grid-cols-12 gap-8">
+    template: `<p-toast />
+        <div class="grid grid-cols-12 gap-8">
             <div class="col-span-full lg:col-span-6">
                 <div class="card">
                     <div class="font-semibold text-xl mb-4">Advanced</div>
-                <p-fileupload name="demo[]" (onUpload)="onUpload($event)" [multiple]="true" accept="image/*" maxFileSize="1000000" mode="advanced">
+                    <p-fileupload name="demo[]" (onUpload)="onUpload($event)" [multiple]="true" accept="image/*" maxFileSize="1000000" mode="advanced" url="https://www.primefaces.org/cdn/api/upload.php">
                         <ng-template #empty>
                             <div>Drag and drop files to here to upload.</div>
                         </ng-template>
@@ -28,8 +29,7 @@ import { ToastModule } from 'primeng/toast';
             <div class="col-span-full lg:col-span-6">
                 <div class="card">
                     <div class="font-semibold text-xl mb-4">Basic</div>
-                <div class="card flex flex-col gap-6 items-center justify-center">
+                    <div class="flex flex-col gap-4 items-center justify-center">
-                    <p-toast />
                         <p-fileupload #fu mode="basic" chooseLabel="Choose" chooseIcon="pi pi-upload" name="demo[]" url="https://www.primefaces.org/cdn/api/upload.php" accept="image/*" maxFileSize="1000000" (onUpload)="onUpload($event)" />
                         <p-button label="Upload" (onClick)="fu.upload()" severity="secondary" />
                     </div>

src/app/pages/uikit/panelsdemo.ts

@@ -1,21 +1,21 @@
-import { Component } from '@angular/core';
-import { ButtonModule } from 'primeng/button';
 import { CommonModule } from '@angular/common';
+import { Component } from '@angular/core';
 import { FormsModule } from '@angular/forms';
-import { ToolbarModule } from 'primeng/toolbar';
-import { RippleModule } from 'primeng/ripple';
-import { SplitButtonModule } from 'primeng/splitbutton';
 import { AccordionModule } from 'primeng/accordion';
-import { FieldsetModule } from 'primeng/fieldset';
-import { MenuModule } from 'primeng/menu';
-import { InputTextModule } from 'primeng/inputtext';
-import { DividerModule } from 'primeng/divider';
-import { SplitterModule } from 'primeng/splitter';
-import { PanelModule } from 'primeng/panel';
 import { MenuItem } from 'primeng/api';
-import { TabsModule } from 'primeng/tabs';
+import { ButtonModule } from 'primeng/button';
+import { DividerModule } from 'primeng/divider';
+import { FieldsetModule } from 'primeng/fieldset';
 import { IconFieldModule } from 'primeng/iconfield';
 import { InputIconModule } from 'primeng/inputicon';
+import { InputTextModule } from 'primeng/inputtext';
+import { MenuModule } from 'primeng/menu';
+import { PanelModule } from 'primeng/panel';
+import { RippleModule } from 'primeng/ripple';
+import { SplitButtonModule } from 'primeng/splitbutton';
+import { SplitterModule } from 'primeng/splitter';
+import { TabsModule } from 'primeng/tabs';
+import { ToolbarModule } from 'primeng/toolbar';
 
 @Component({
     selector: 'app-panels-demo',
@@ -138,18 +138,22 @@ import { InputIconModule } from 'primeng/inputicon';
                 <div class="md:w-1/2 mt-6 md:mt-0">
                     <div class="card">
                         <div class="font-semibold text-xl mb-4">Panel</div>
-                        <p-panel header="Header" [toggleable]="true" class="line-height-3 m-0">
+                        <p-panel header="Header" [toggleable]="true">
-                            Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
+                            <p class="m-0">
-                            consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est
+                                Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea
-                            laborum.
+                                commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim
+                                id est laborum.
+                            </p>
                         </p-panel>
                     </div>
                     <div class="card">
                         <div class="font-semibold text-xl mb-4">Fieldset</div>
-                        <p-fieldset legend="Legend" [toggleable]="true" class="line-height-3 m-0">
+                        <p-fieldset legend="Legend" [toggleable]="true">
-                            Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
+                            <p class="m-0">
-                            consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est
+                                Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea
-                            laborum.
+                                commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim
+                                id est laborum.
+                            </p>
                         </p-fieldset>
                     </div>
                 </div>