From 9625cf71070be0c167d1b2898704ee605e8f219e Mon Sep 17 00:00:00 2001 From: sanchezvem Date: Fri, 7 Nov 2025 12:21:48 +0100 Subject: [PATCH] added ng zoro --- angular.json | 9 + package-lock.json | 322 +++++++++++++++++++- package.json | 4 +- src/app/app.config.ts | 11 +- src/app/app.css | 80 +++++ src/app/app.html | 388 +++--------------------- src/app/app.routes.ts | 5 +- src/app/app.ts | 11 +- src/app/icons-provider.ts | 8 + src/app/pages/welcome/welcome.css | 0 src/app/pages/welcome/welcome.html | 1 + src/app/pages/welcome/welcome.routes.ts | 6 + src/app/pages/welcome/welcome.ts | 9 + src/theme.less | 9 + 14 files changed, 515 insertions(+), 348 deletions(-) create mode 100644 src/app/icons-provider.ts create mode 100644 src/app/pages/welcome/welcome.css create mode 100644 src/app/pages/welcome/welcome.html create mode 100644 src/app/pages/welcome/welcome.routes.ts create mode 100644 src/app/pages/welcome/welcome.ts create mode 100644 src/theme.less diff --git a/angular.json b/angular.json index 3c28a44..1c1536a 100644 --- a/angular.json +++ b/angular.json @@ -47,9 +47,15 @@ { "glob": "**/*", "input": "public" + }, + { + "glob": "**/*", + "input": "./node_modules/@ant-design/icons-angular/src/inline-svg/", + "output": "/assets/" } ], "styles": [ + "src/theme.less", "src/styles.css" ] }, @@ -94,5 +100,8 @@ } } } + }, + "cli": { + "analytics": "febfc8c2-c74c-4a15-8e18-6b2dec722273" } } diff --git a/package-lock.json b/package-lock.json index e61f0fc..ed19d7d 100644 --- a/package-lock.json +++ b/package-lock.json @@ -14,6 +14,7 @@ "@angular/forms": "^20.3.0", "@angular/platform-browser": "^20.3.0", "@angular/router": "^20.3.0", + "ng-zorro-antd": "^20.4.0", "rxjs": "~7.8.0", "tslib": "^2.3.0", "zone.js": "~0.15.0" @@ -22,6 +23,7 @@ "@angular/build": "^20.3.9", "@angular/cli": "^20.3.9", "@angular/compiler-cli": "^20.3.0", + "less": "^4.2.0", "typescript": "~5.9.2" } }, @@ -311,6 +313,22 @@ "yarn": ">= 1.13.0" } }, + "node_modules/@angular/animations": { + "version": "20.3.10", + "resolved": "https://registry.npmjs.org/@angular/animations/-/animations-20.3.10.tgz", + "integrity": "sha512-WSKHyF82URlAQkYGWZjozZgSYj2ClH40GDunayz6kuRewup639iH91HE8sbFfVqKgqELKIAy2E0LhmtDKnMwZA==", + "license": "MIT", + "peer": true, + "dependencies": { + "tslib": "^2.3.0" + }, + "engines": { + "node": "^20.19.0 || ^22.12.0 || >=24.0.0" + }, + "peerDependencies": { + "@angular/core": "20.3.10" + } + }, "node_modules/@angular/build": { "version": "20.3.9", "resolved": "https://registry.npmjs.org/@angular/build/-/build-20.3.9.tgz", @@ -410,6 +428,21 @@ } } }, + "node_modules/@angular/cdk": { + "version": "20.2.12", + "resolved": "https://registry.npmjs.org/@angular/cdk/-/cdk-20.2.12.tgz", + "integrity": "sha512-hz8GtiMy3N9/e8407ZfrByHD5GEC4SkWtxyUknWuTM9P88AOie0jDZ6CfQg9gQ0OJX+6BAbJV3RpYZA1uzNUqA==", + "license": "MIT", + "dependencies": { + "parse5": "^8.0.0", + "tslib": "^2.3.0" + }, + "peerDependencies": { + "@angular/common": "^20.0.0 || ^21.0.0", + "@angular/core": "^20.0.0 || ^21.0.0", + "rxjs": "^6.5.3 || ^7.4.0" + } + }, "node_modules/@angular/cli": { "version": "20.3.9", "resolved": "https://registry.npmjs.org/@angular/cli/-/cli-20.3.9.tgz", @@ -589,6 +622,43 @@ "rxjs": "^6.5.3 || ^7.4.0" } }, + "node_modules/@ant-design/colors": { + "version": "7.2.1", + "resolved": "https://registry.npmjs.org/@ant-design/colors/-/colors-7.2.1.tgz", + "integrity": "sha512-lCHDcEzieu4GA3n8ELeZ5VQ8pKQAWcGGLRTQ50aQM2iqPpq2evTxER84jfdPvsPAtEcZ7m44NI45edFMo8oOYQ==", + "license": "MIT", + "dependencies": { + "@ant-design/fast-color": "^2.0.6" + } + }, + "node_modules/@ant-design/fast-color": { + "version": "2.0.6", + "resolved": "https://registry.npmjs.org/@ant-design/fast-color/-/fast-color-2.0.6.tgz", + "integrity": "sha512-y2217gk4NqL35giHl72o6Zzqji9O7vHh9YmhUVkPtAOpoTCH4uWxo/pr4VE8t0+ChEPs0qo4eJRC5Q1eXWo3vA==", + "license": "MIT", + "dependencies": { + "@babel/runtime": "^7.24.7" + }, + "engines": { + "node": ">=8.x" + } + }, + "node_modules/@ant-design/icons-angular": { + "version": "20.0.0", + "resolved": "https://registry.npmjs.org/@ant-design/icons-angular/-/icons-angular-20.0.0.tgz", + "integrity": "sha512-KMTytjYxprCI/oOEs0KoxNUsT5g+DVCp5JMMgDOSlSpyTpWg5P54kea0398v8urr4QJFpoCucJshFZ8+uv67cA==", + "license": "MIT", + "dependencies": { + "@ant-design/colors": "^7.0.0", + "tslib": "^2.0.0" + }, + "peerDependencies": { + "@angular/common": "^20.0.0", + "@angular/core": "^20.0.0", + "@angular/platform-browser": "^20.0.0", + "rxjs": "^6.5.3 || ^7.4.0" + } + }, "node_modules/@babel/code-frame": { "version": "7.27.1", "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.27.1.tgz", @@ -834,6 +904,15 @@ "node": ">=6.0.0" } }, + "node_modules/@babel/runtime": { + "version": "7.28.4", + "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.28.4.tgz", + "integrity": "sha512-Q/N6JNWvIvPnLDvjlE1OUBLPQHH6l3CltCEsHIujp45zQUSSh8K+gHnaEX45yAT1nyngnINhvWtzN+Nb9D8RAQ==", + "license": "MIT", + "engines": { + "node": ">=6.9.0" + } + }, "node_modules/@babel/template": { "version": "7.27.2", "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.27.2.tgz", @@ -882,6 +961,15 @@ "node": ">=6.9.0" } }, + "node_modules/@ctrl/tinycolor": { + "version": "3.6.1", + "resolved": "https://registry.npmjs.org/@ctrl/tinycolor/-/tinycolor-3.6.1.tgz", + "integrity": "sha512-SITSV6aIXsuVNV3f3O0f2n/cgyEDWoSqtZMYiAmcsYHydcKrOz3gUxB/iXd/Qf08+IZX4KpgNbvUdMBmWz+kcA==", + "license": "MIT", + "engines": { + "node": ">=10" + } + }, "node_modules/@esbuild/aix-ppc64": { "version": "0.25.9", "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.25.9.tgz", @@ -4060,6 +4148,19 @@ "node": ">=6.6.0" } }, + "node_modules/copy-anything": { + "version": "2.0.6", + "resolved": "https://registry.npmjs.org/copy-anything/-/copy-anything-2.0.6.tgz", + "integrity": "sha512-1j20GZTsvKNkc4BY3NpMOM8tt///wY3FpIzozTOFO2ffuZcV61nojHXVKIy3WM+7ADCy5FVhdZYHYDdgTU0yJw==", + "dev": true, + "license": "MIT", + "dependencies": { + "is-what": "^3.14.1" + }, + "funding": { + "url": "https://github.com/sponsors/mesqueeb" + } + }, "node_modules/cors": { "version": "2.8.5", "resolved": "https://registry.npmjs.org/cors/-/cors-2.8.5.tgz", @@ -4119,6 +4220,22 @@ "url": "https://github.com/sponsors/fb55" } }, + "node_modules/date-fns": { + "version": "2.30.0", + "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-2.30.0.tgz", + "integrity": "sha512-fnULvOpxnC5/Vg3NCiWelDsLiUc9bRwAPs/+LfTLNvetFCtCTN+yQz15C/fs4AwX1R9K5GLtLfn8QW+dWisaAw==", + "license": "MIT", + "dependencies": { + "@babel/runtime": "^7.21.0" + }, + "engines": { + "node": ">=0.11" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/date-fns" + } + }, "node_modules/debug": { "version": "4.4.3", "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.3.tgz", @@ -4338,6 +4455,20 @@ "dev": true, "license": "MIT" }, + "node_modules/errno": { + "version": "0.1.8", + "resolved": "https://registry.npmjs.org/errno/-/errno-0.1.8.tgz", + "integrity": "sha512-dJ6oBr5SQ1VSd9qkk7ByRgb/1SH4JZjCHSW/mr63/QcXO9zLVxvJ6Oy13nio03rxpSnVDDjFor75SjVeZWPW/A==", + "dev": true, + "license": "MIT", + "optional": true, + "dependencies": { + "prr": "~1.0.1" + }, + "bin": { + "errno": "cli.js" + } + }, "node_modules/es-define-property": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/es-define-property/-/es-define-property-1.0.1.tgz", @@ -5002,6 +5133,20 @@ "url": "https://github.com/sponsors/isaacs" } }, + "node_modules/image-size": { + "version": "0.5.5", + "resolved": "https://registry.npmjs.org/image-size/-/image-size-0.5.5.tgz", + "integrity": "sha512-6TDAlDPZxUFCv+fuOkIoXT/V/f3Qbq8e37p+YOiYrUv3v9cc3/6x78VdfPgFVaB9dZYeLUfKgHRebpkm/oP2VQ==", + "dev": true, + "license": "MIT", + "optional": true, + "bin": { + "image-size": "bin/image-size.js" + }, + "engines": { + "node": ">=0.10.0" + } + }, "node_modules/immutable": { "version": "5.1.4", "resolved": "https://registry.npmjs.org/immutable/-/immutable-5.1.4.tgz", @@ -5154,6 +5299,13 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/is-what": { + "version": "3.14.1", + "resolved": "https://registry.npmjs.org/is-what/-/is-what-3.14.1.tgz", + "integrity": "sha512-sNxgpk9793nzSs7bA6JQJGeIuRBQhAaNGG77kzYQgMkrID+lS6SlK07K5LaptscDlSaIgH+GPFzf+d75FVxozA==", + "dev": true, + "license": "MIT" + }, "node_modules/isexe": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz", @@ -5271,6 +5423,44 @@ ], "license": "MIT" }, + "node_modules/less": { + "version": "4.4.2", + "resolved": "https://registry.npmjs.org/less/-/less-4.4.2.tgz", + "integrity": "sha512-j1n1IuTX1VQjIy3tT7cyGbX7nvQOsFLoIqobZv4ttI5axP923gA44zUj6miiA6R5Aoms4sEGVIIcucXUbRI14g==", + "dev": true, + "license": "Apache-2.0", + "dependencies": { + "copy-anything": "^2.0.1", + "parse-node-version": "^1.0.1", + "tslib": "^2.3.0" + }, + "bin": { + "lessc": "bin/lessc" + }, + "engines": { + "node": ">=14" + }, + "optionalDependencies": { + "errno": "^0.1.1", + "graceful-fs": "^4.1.2", + "image-size": "~0.5.0", + "make-dir": "^2.1.0", + "mime": "^1.4.1", + "needle": "^3.1.0", + "source-map": "~0.6.0" + } + }, + "node_modules/less/node_modules/source-map": { + "version": "0.6.1", + "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz", + "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==", + "dev": true, + "license": "BSD-3-Clause", + "optional": true, + "engines": { + "node": ">=0.10.0" + } + }, "node_modules/listr2": { "version": "9.0.1", "resolved": "https://registry.npmjs.org/listr2/-/listr2-9.0.1.tgz", @@ -5456,6 +5646,32 @@ "@jridgewell/sourcemap-codec": "^1.5.0" } }, + "node_modules/make-dir": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-2.1.0.tgz", + "integrity": "sha512-LS9X+dc8KLxXCb8dni79fLIIUA5VyZoyjSMCwTluaXA0o27cCK0bhXkpgw+sTXVpPy/lSO57ilRixqk0vDmtRA==", + "dev": true, + "license": "MIT", + "optional": true, + "dependencies": { + "pify": "^4.0.1", + "semver": "^5.6.0" + }, + "engines": { + "node": ">=6" + } + }, + "node_modules/make-dir/node_modules/semver": { + "version": "5.7.2", + "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.2.tgz", + "integrity": "sha512-cBznnQ9KjJqU67B52RMC65CMarK2600WFnbkcaiwWq3xy/5haFJlshgnpjovMVJ+Hff49d8GEn0b87C5pDQ10g==", + "dev": true, + "license": "ISC", + "optional": true, + "bin": { + "semver": "bin/semver" + } + }, "node_modules/make-fetch-happen": { "version": "14.0.3", "resolved": "https://registry.npmjs.org/make-fetch-happen/-/make-fetch-happen-14.0.3.tgz", @@ -5541,6 +5757,20 @@ "url": "https://github.com/sponsors/jonschlinkert" } }, + "node_modules/mime": { + "version": "1.6.0", + "resolved": "https://registry.npmjs.org/mime/-/mime-1.6.0.tgz", + "integrity": "sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg==", + "dev": true, + "license": "MIT", + "optional": true, + "bin": { + "mime": "cli.js" + }, + "engines": { + "node": ">=4" + } + }, "node_modules/mime-db": { "version": "1.54.0", "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.54.0.tgz", @@ -5839,6 +6069,38 @@ "node": "^10 || ^12 || ^13.7 || ^14 || >=15.0.1" } }, + "node_modules/needle": { + "version": "3.3.1", + "resolved": "https://registry.npmjs.org/needle/-/needle-3.3.1.tgz", + "integrity": "sha512-6k0YULvhpw+RoLNiQCRKOl09Rv1dPLr8hHnVjHqdolKwDrdNyk+Hmrthi4lIGPPz3r39dLx0hsF5s40sZ3Us4Q==", + "dev": true, + "license": "MIT", + "optional": true, + "dependencies": { + "iconv-lite": "^0.6.3", + "sax": "^1.2.4" + }, + "bin": { + "needle": "bin/needle" + }, + "engines": { + "node": ">= 4.4.x" + } + }, + "node_modules/needle/node_modules/iconv-lite": { + "version": "0.6.3", + "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.3.tgz", + "integrity": "sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==", + "dev": true, + "license": "MIT", + "optional": true, + "dependencies": { + "safer-buffer": ">= 2.1.2 < 3.0.0" + }, + "engines": { + "node": ">=0.10.0" + } + }, "node_modules/negotiator": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-1.0.0.tgz", @@ -5849,6 +6111,27 @@ "node": ">= 0.6" } }, + "node_modules/ng-zorro-antd": { + "version": "20.4.0", + "resolved": "https://registry.npmjs.org/ng-zorro-antd/-/ng-zorro-antd-20.4.0.tgz", + "integrity": "sha512-aAa8+sRQlMOaHuVJJTDA6lAudbYbepHlOurop9JniJjG0W/BMc6ayccf+EmL9d+x5uKVP82mHpD0wpwX3MJ0OA==", + "license": "MIT", + "dependencies": { + "@angular/cdk": "^20.0.0", + "@ant-design/icons-angular": "^20.0.0", + "@ctrl/tinycolor": "^3.6.0", + "date-fns": "^2.16.1", + "tslib": "^2.3.0" + }, + "peerDependencies": { + "@angular/animations": "^20.0.0", + "@angular/common": "^20.0.0", + "@angular/core": "^20.0.0", + "@angular/forms": "^20.0.0", + "@angular/platform-browser": "^20.0.0", + "@angular/router": "^20.0.0" + } + }, "node_modules/node-addon-api": { "version": "6.1.0", "resolved": "https://registry.npmjs.org/node-addon-api/-/node-addon-api-6.1.0.tgz", @@ -6363,11 +6646,20 @@ "node": "^18.17.0 || >=20.5.0" } }, + "node_modules/parse-node-version": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/parse-node-version/-/parse-node-version-1.0.1.tgz", + "integrity": "sha512-3YHlOa/JgH6Mnpr05jP9eDG254US9ek25LyIxZlDItp2iJtwyaXQb57lBYLdT3MowkUFYEV2XXNAYIPlESvJlA==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">= 0.10" + } + }, "node_modules/parse5": { "version": "8.0.0", "resolved": "https://registry.npmjs.org/parse5/-/parse5-8.0.0.tgz", "integrity": "sha512-9m4m5GSgXjL4AjumKzq1Fgfp3Z8rsvjRNbnkVwfu2ImRqE5D0LnY2QfDen18FSY9C573YU5XxSapdHZTZ2WolA==", - "dev": true, "license": "MIT", "dependencies": { "entities": "^6.0.0" @@ -6421,7 +6713,6 @@ "version": "6.0.1", "resolved": "https://registry.npmjs.org/entities/-/entities-6.0.1.tgz", "integrity": "sha512-aN97NXWF6AWBTahfVOIrB/NShkzi5H7F9r1s9mD3cDj4Ko5f2qhhVoYMibXF7GlLveb/D2ioWay8lxI97Ven3g==", - "dev": true, "license": "BSD-2-Clause", "engines": { "node": ">=0.12" @@ -6512,6 +6803,17 @@ "url": "https://github.com/sponsors/jonschlinkert" } }, + "node_modules/pify": { + "version": "4.0.1", + "resolved": "https://registry.npmjs.org/pify/-/pify-4.0.1.tgz", + "integrity": "sha512-uB80kBFb/tfd68bVleG9T5GGsGPjJrLAUpR5PZIrhBnIaRTQRjqdJSsIKkOP6OAIFbj7GOrcudc5pNjZ+geV2g==", + "dev": true, + "license": "MIT", + "optional": true, + "engines": { + "node": ">=6" + } + }, "node_modules/piscina": { "version": "5.1.3", "resolved": "https://registry.npmjs.org/piscina/-/piscina-5.1.3.tgz", @@ -6609,6 +6911,14 @@ "node": ">= 0.10" } }, + "node_modules/prr": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/prr/-/prr-1.0.1.tgz", + "integrity": "sha512-yPw4Sng1gWghHQWj0B3ZggWUm4qVbPwPFcRG8KyxiU7J2OHFSoEHKS+EZ3fv5l1t9CyCiop6l/ZYeWbrgoQejw==", + "dev": true, + "license": "MIT", + "optional": true + }, "node_modules/punycode": { "version": "2.3.1", "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.3.1.tgz", @@ -6864,6 +7174,14 @@ "@parcel/watcher": "^2.4.1" } }, + "node_modules/sax": { + "version": "1.4.3", + "resolved": "https://registry.npmjs.org/sax/-/sax-1.4.3.tgz", + "integrity": "sha512-yqYn1JhPczigF94DMS+shiDMjDowYO6y9+wB/4WgO0Y19jWYk0lQ4tuG5KI7kj4FTp1wxPj5IFfcrz/s1c3jjQ==", + "dev": true, + "license": "BlueOak-1.0.0", + "optional": true + }, "node_modules/semver": { "version": "7.7.2", "resolved": "https://registry.npmjs.org/semver/-/semver-7.7.2.tgz", diff --git a/package.json b/package.json index b1e438d..04b15ec 100644 --- a/package.json +++ b/package.json @@ -27,6 +27,7 @@ "@angular/forms": "^20.3.0", "@angular/platform-browser": "^20.3.0", "@angular/router": "^20.3.0", + "ng-zorro-antd": "^20.4.0", "rxjs": "~7.8.0", "tslib": "^2.3.0", "zone.js": "~0.15.0" @@ -35,6 +36,7 @@ "@angular/build": "^20.3.9", "@angular/cli": "^20.3.9", "@angular/compiler-cli": "^20.3.0", + "less": "^4.2.0", "typescript": "~5.9.2" } -} \ No newline at end of file +} diff --git a/src/app/app.config.ts b/src/app/app.config.ts index d953f4c..2abdb03 100644 --- a/src/app/app.config.ts +++ b/src/app/app.config.ts @@ -2,11 +2,20 @@ import { ApplicationConfig, provideBrowserGlobalErrorListeners, provideZoneChang import { provideRouter } from '@angular/router'; import { routes } from './app.routes'; +import { icons } from './icons-provider'; +import { provideNzIcons } from 'ng-zorro-antd/icon'; +import { fr_FR, provideNzI18n } from 'ng-zorro-antd/i18n'; +import { registerLocaleData } from '@angular/common'; +import fr from '@angular/common/locales/fr'; +import { provideAnimationsAsync } from '@angular/platform-browser/animations/async'; +import { provideHttpClient } from '@angular/common/http'; + +registerLocaleData(fr); export const appConfig: ApplicationConfig = { providers: [ provideBrowserGlobalErrorListeners(), provideZoneChangeDetection({ eventCoalescing: true }), - provideRouter(routes) + provideRouter(routes), provideNzIcons(icons), provideNzI18n(fr_FR), provideAnimationsAsync(), provideHttpClient() ] }; diff --git a/src/app/app.css b/src/app/app.css index e69de29..163c43a 100644 --- a/src/app/app.css +++ b/src/app/app.css @@ -0,0 +1,80 @@ +:host { + display: flex; + text-rendering: optimizeLegibility; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +.app-layout { + height: 100vh; +} + +.menu-sidebar { + position: relative; + z-index: 10; + min-height: 100vh; + box-shadow: 2px 0 6px rgba(0,21,41,.35); +} + +.header-trigger { + height: 64px; + padding: 20px 24px; + font-size: 20px; + cursor: pointer; + transition: all .3s,padding 0s; +} + +.trigger:hover { + color: #1890ff; +} + +.sidebar-logo { + position: relative; + height: 64px; + padding-left: 24px; + overflow: hidden; + line-height: 64px; + background: #001529; + transition: all .3s; +} + +.sidebar-logo img { + display: inline-block; + height: 32px; + width: 32px; + vertical-align: middle; +} + +.sidebar-logo h1 { + display: inline-block; + margin: 0 0 0 20px; + color: #fff; + font-weight: 600; + font-size: 14px; + font-family: Avenir,Helvetica Neue,Arial,Helvetica,sans-serif; + vertical-align: middle; +} + +nz-header { + padding: 0; + width: 100%; + z-index: 2; +} + +.app-header { + position: relative; + height: 64px; + padding: 0; + background: #fff; + box-shadow: 0 1px 4px rgba(0,21,41,.08); +} + +nz-content { + margin: 24px; +} + +.inner-content { + padding: 24px; + background: #fff; + height: 100%; +} diff --git a/src/app/app.html b/src/app/app.html index 7528372..47c5362 100644 --- a/src/app/app.html +++ b/src/app/app.html @@ -1,342 +1,52 @@ - - - - - - - - - - - -
-
-
- -

Hello, {{ title() }}

-

Congratulations! Your app is running. 🎉

+ + + - -
-
- @for (item of [ - { title: 'Explore the Docs', link: 'https://angular.dev' }, - { title: 'Learn with Tutorials', link: 'https://angular.dev/tutorials' }, - { title: 'Prompt and best practices for AI', link: 'https://angular.dev/ai/develop-with-ai'}, - { title: 'CLI Docs', link: 'https://angular.dev/tools/cli' }, - { title: 'Angular Language Service', link: 'https://angular.dev/tools/language-service' }, - { title: 'Angular DevTools', link: 'https://angular.dev/tools/devtools' }, - ]; track item.title) { - - {{ item.title }} - - - - - } + + + + +
+ + +
- -
-
- - - - - - - - - - - + + + diff --git a/src/app/app.routes.ts b/src/app/app.routes.ts index dc39edb..fab3a73 100644 --- a/src/app/app.routes.ts +++ b/src/app/app.routes.ts @@ -1,3 +1,6 @@ import { Routes } from '@angular/router'; -export const routes: Routes = []; +export const routes: Routes = [ + { path: '', pathMatch: 'full', redirectTo: '/welcome' }, + { path: 'welcome', loadChildren: () => import('./pages/welcome/welcome.routes').then(m => m.WELCOME_ROUTES) } +]; diff --git a/src/app/app.ts b/src/app/app.ts index bd808ca..1f00e8b 100644 --- a/src/app/app.ts +++ b/src/app/app.ts @@ -1,12 +1,15 @@ -import { Component, signal } from '@angular/core'; -import { RouterOutlet } from '@angular/router'; +import { Component } from '@angular/core'; +import { RouterLink, RouterOutlet } from '@angular/router'; +import { NzIconModule } from 'ng-zorro-antd/icon'; +import { NzLayoutModule } from 'ng-zorro-antd/layout'; +import { NzMenuModule } from 'ng-zorro-antd/menu'; @Component({ selector: 'app-root', - imports: [RouterOutlet], + imports: [RouterLink, RouterOutlet, NzIconModule, NzLayoutModule, NzMenuModule], templateUrl: './app.html', styleUrl: './app.css' }) export class App { - protected readonly title = signal('library-frontend'); + isCollapsed = false; } diff --git a/src/app/icons-provider.ts b/src/app/icons-provider.ts new file mode 100644 index 0000000..f54ada6 --- /dev/null +++ b/src/app/icons-provider.ts @@ -0,0 +1,8 @@ +import { + MenuFoldOutline, + MenuUnfoldOutline, + FormOutline, + DashboardOutline +} from '@ant-design/icons-angular/icons'; + +export const icons = [MenuFoldOutline, MenuUnfoldOutline, DashboardOutline, FormOutline]; diff --git a/src/app/pages/welcome/welcome.css b/src/app/pages/welcome/welcome.css new file mode 100644 index 0000000..e69de29 diff --git a/src/app/pages/welcome/welcome.html b/src/app/pages/welcome/welcome.html new file mode 100644 index 0000000..608dfe6 --- /dev/null +++ b/src/app/pages/welcome/welcome.html @@ -0,0 +1 @@ +

welcome works!

\ No newline at end of file diff --git a/src/app/pages/welcome/welcome.routes.ts b/src/app/pages/welcome/welcome.routes.ts new file mode 100644 index 0000000..b1857b5 --- /dev/null +++ b/src/app/pages/welcome/welcome.routes.ts @@ -0,0 +1,6 @@ +import { Routes } from '@angular/router'; +import { Welcome } from './welcome'; + +export const WELCOME_ROUTES: Routes = [ + { path: '', component: Welcome }, +]; diff --git a/src/app/pages/welcome/welcome.ts b/src/app/pages/welcome/welcome.ts new file mode 100644 index 0000000..92e8bde --- /dev/null +++ b/src/app/pages/welcome/welcome.ts @@ -0,0 +1,9 @@ +import { Component } from '@angular/core'; + +@Component({ + selector: 'app-welcome', + imports: [], + templateUrl: './welcome.html', + styleUrl: './welcome.css' +}) +export class Welcome {} diff --git a/src/theme.less b/src/theme.less new file mode 100644 index 0000000..ecf2541 --- /dev/null +++ b/src/theme.less @@ -0,0 +1,9 @@ + +// Custom Theming for NG-ZORRO +// For more information: https://ng.ant.design/docs/customize-theme/en +@import "../node_modules/ng-zorro-antd/ng-zorro-antd.less"; + +// Override less variables to here +// View all variables: https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/components/style/themes/default.less + +// @primary-color: #1890ff;