diff --git a/package-lock.json b/package-lock.json
index 118446b..cfd5904 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -16,6 +16,7 @@
"@angular/platform-browser": "^18.2.2",
"@angular/platform-browser-dynamic": "^18.2.2",
"@angular/router": "^18.2.2",
+ "nucleus-angular": "^0.0.6",
"rxjs": "~7.8.1",
"tslib": "^2.7.0",
"zone.js": "~0.14.10"
@@ -5093,6 +5094,18 @@
"ajv": "^8.8.2"
}
},
+ "node_modules/angular-techs-logos": {
+ "version": "0.1.29",
+ "resolved": "https://registry.npmjs.org/angular-techs-logos/-/angular-techs-logos-0.1.29.tgz",
+ "integrity": "sha512-blcIwlD3K4AC+B6ujH0LsZ0YsA4uD/ISF7oEWhmPDi9Tbrz+249v02dApE2XbtGTe4dLKLozn3pH6+LjYKJH8g==",
+ "dependencies": {
+ "tslib": "^2.3.0"
+ },
+ "peerDependencies": {
+ "@angular/common": "^18.0.0",
+ "@angular/core": "^18.0.0"
+ }
+ },
"node_modules/ansi-colors": {
"version": "4.1.3",
"resolved": "https://registry.npmjs.org/ansi-colors/-/ansi-colors-4.1.3.tgz",
@@ -6584,6 +6597,18 @@
"dev": true,
"license": "MIT"
},
+ "node_modules/darkmode-angular": {
+ "version": "0.1.4",
+ "resolved": "https://registry.npmjs.org/darkmode-angular/-/darkmode-angular-0.1.4.tgz",
+ "integrity": "sha512-NWtUoB2Uj4GRE9+8C7buGRcJRmMaeB2ap2Fp0ufU+5GLtoA4QiNpiaqH94/k3YjqKfUSZqFndTX4vJd0G48OMQ==",
+ "dependencies": {
+ "tslib": "^2.3.0"
+ },
+ "peerDependencies": {
+ "@angular/common": "^18.2.0",
+ "@angular/core": "^18.2.0"
+ }
+ },
"node_modules/data-uri-to-buffer": {
"version": "6.0.2",
"resolved": "https://registry.npmjs.org/data-uri-to-buffer/-/data-uri-to-buffer-6.0.2.tgz",
@@ -8162,6 +8187,15 @@
"node": ">= 0.4"
}
},
+ "node_modules/highlight.js": {
+ "version": "11.10.0",
+ "resolved": "https://registry.npmjs.org/highlight.js/-/highlight.js-11.10.0.tgz",
+ "integrity": "sha512-SYVnVFswQER+zu1laSya563s+F8VDGt7o35d4utbamowvUNLLMovFqwCLSocpZTz3MgaSRA1IbqRWZv97dtErQ==",
+ "license": "BSD-3-Clause",
+ "engines": {
+ "node": ">=12.0.0"
+ }
+ },
"node_modules/hosted-git-info": {
"version": "7.0.2",
"resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-7.0.2.tgz",
@@ -11163,6 +11197,21 @@
"url": "https://github.com/fb55/nth-check?sponsor=1"
}
},
+ "node_modules/nucleus-angular": {
+ "version": "0.0.6",
+ "resolved": "https://registry.npmjs.org/nucleus-angular/-/nucleus-angular-0.0.6.tgz",
+ "integrity": "sha512-abV2FfMLiQnVnYNDBMpmqch9Dbl4i2JXrzQ2kY2g6Cb/nx/9RdMugXgcbCIWEkKwVfBlwRWGTvrmlzyMjKXkzg==",
+ "dependencies": {
+ "angular-techs-logos": "^0.1.29",
+ "darkmode-angular": "^0.1.4",
+ "highlight.js": "^11.10.0",
+ "tslib": "^2.3.0"
+ },
+ "peerDependencies": {
+ "@angular/common": "^18.2.0",
+ "@angular/core": "^18.2.0"
+ }
+ },
"node_modules/object-assign": {
"version": "4.1.1",
"resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
diff --git a/package.json b/package.json
index efada62..e2f00e1 100644
--- a/package.json
+++ b/package.json
@@ -35,6 +35,7 @@
"@angular/platform-browser": "^18.2.2",
"@angular/platform-browser-dynamic": "^18.2.2",
"@angular/router": "^18.2.2",
+ "nucleus-angular": "^0.0.6",
"rxjs": "~7.8.1",
"tslib": "^2.7.0",
"zone.js": "~0.14.10"
diff --git a/src/app/app.component.html b/src/app/app.component.html
index b2a5adb..d553154 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -1,13 +1,5 @@
-
- 
-
-
-
-
-
+
+
+
+
+
diff --git a/src/app/app.component.scss b/src/app/app.component.scss
index c764229..52ef24d 100644
--- a/src/app/app.component.scss
+++ b/src/app/app.component.scss
@@ -1,9 +1,8 @@
-footer {
- display: flex;
- justify-content: center;
- align-items: center;
- a {
- text-decoration: none;
- color: var(--color-text);
- }
+::ng-deep .content .btn-mode {
+ position: relative !important;
+ z-index: 1;
+}
+
+::ng-deep .btn-mode.hiddenLabel {
+ display: none;
}
diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index 935528f..b608527 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -1,6 +1,7 @@
import { Component } from '@angular/core';
import pkg from '../../package.json';
+import { ExampleComponent } from './app.example';
@Component({
selector: 'app-root',
@@ -8,5 +9,38 @@ import pkg from '../../package.json';
styleUrls: ['./app.component.scss']
})
export class AppComponent {
- appVersion = pkg.version;
+ public appVersion;
+ public angularVersion;
+ public configNucleus: {
+ name: string;
+ github: string;
+ npm: string;
+ appVersion: string;
+ angularVersion: string;
+ stepsInstall: Array<{ name: string; language: string; content: string }>;
+ };
+
+ constructor() {
+ this.appVersion = pkg.version;
+ this.angularVersion = pkg.dependencies?.['@angular/core'].replace('^', '');
+ this.configNucleus = {
+ name: 'darkmode-angular',
+ github: 'https://github.com/livresaber/darkmode-angular',
+ npm: 'https://www.npmjs.com/package/darkmode-angular',
+ appVersion: this.appVersion,
+ angularVersion: this.angularVersion,
+ stepsInstall: [
+ {
+ name: 'Install',
+ language: 'bash',
+ content: 'npm install darkmode-angular',
+ },
+ {
+ name: 'Usage',
+ language: 'tsx',
+ content: ExampleComponent,
+ },
+ ],
+ };
+ }
}
diff --git a/src/app/app.example.ts b/src/app/app.example.ts
new file mode 100644
index 0000000..593d355
--- /dev/null
+++ b/src/app/app.example.ts
@@ -0,0 +1,10 @@
+export const ExampleComponent = `// Example Component
+import { Component } from '@angular/core';
+import { DarkmodeComponent } from 'darkmode-angular';
+
+@Component({
+ selector: 'app-example',
+ imports: [DarkmodeComponent],
+ template: \`\`,
+})
+export class AppExample {}`
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 3605ab9..f68226f 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -3,10 +3,11 @@ import { BrowserModule } from '@angular/platform-browser';
import { AppComponent } from './app.component';
import { DarkmodeComponent } from 'projects/darkmode-angular/src/public-api';
+import { NucleusAngularApp } from 'nucleus-angular';
@NgModule({
declarations: [AppComponent],
- imports: [BrowserModule, DarkmodeComponent],
+ imports: [BrowserModule, DarkmodeComponent, NucleusAngularApp],
providers: [],
bootstrap: [AppComponent],
})
diff --git a/src/styles.scss b/src/styles.scss
index e1799cc..3b40730 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -1,11 +1,4 @@
body {
- display: flex;
- justify-content: center;
- align-items: center;
- min-height: 100vh;
- padding: 0;
- margin: 0;
- font-family: Arial;
color: var(--color-text);
background: var(--color-background);
}