adjustment css and import module

livresaber · Oct 18, 2024 · 7f4e87e · 7f4e87e
1 parent 84aeff8
commit 7f4e87e
Show file tree

Hide file tree

Showing 3 changed files with 25 additions and 37 deletions.
diff --git a/projects/darkmode-angular/src/lib/darkmode-angular.component.scss b/projects/darkmode-angular/src/lib/darkmode-angular.component.scss
@@ -1,19 +1,15 @@
 .btn-mode {
-  background: var(--primary);
+  background: var(--color-primary);
   color: #fff;
+  padding: 1rem;
   border-radius: 50px;
   box-shadow: inset 0 0 0 3px rgba(255,255,255,.2), 0 0 0 5px rgba(0,0,0,.1);
   border: 0;
   cursor: pointer;
   display: flex;
   justify-content: center;
   align-items: center;
-  margin: 2rem 1rem;
-  position: fixed;
-  top: 0;
-  right: 0;
-  padding: .6rem;
-  z-index: 11;
+  margin: 2rem auto;
   &.hiddenLabel svg {
     margin-right: 0;
   }

diff --git a/projects/darkmode-angular/src/lib/darkmode-angular.component.ts b/projects/darkmode-angular/src/lib/darkmode-angular.component.ts
@@ -2,41 +2,39 @@ import { Component, Input, OnInit, ViewEncapsulation } from '@angular/core';
 import { CommonModule } from '@angular/common';
 
 @Component({
-  selector: 'app-darkmode',
+  selector: 'darkmode-angular',
   standalone: true,
   imports: [CommonModule],
-  templateUrl: './darkmode.component.html',
-  styleUrls: ['./darkmode.component.scss'],
-  encapsulation: ViewEncapsulation.None
+  templateUrl: './darkmode-angular.component.html',
+  styleUrls: ['./darkmode-angular.component.scss'],
+  encapsulation: ViewEncapsulation.None,
 })
 export class DarkmodeComponent implements OnInit {
-
   @Input() hiddenLabel: boolean | undefined;
 
-  constructor() { }
+  constructor() {}
 
-  modeLocal = localStorage.getItem('darkmode')
-  mode = this.modeLocal == null ? false : JSON.parse(this.modeLocal)
+  modeLocal = localStorage.getItem('darkmode');
+  mode = this.modeLocal == null ? false : JSON.parse(this.modeLocal);
 
   toggleMode = () => {
-    this.mode = !this.mode
-    this.setMode(this.mode)
-  }
+    this.mode = !this.mode;
+    this.setMode(this.mode);
+  };
 
   setMode = (value: boolean) => {
-    localStorage.setItem('darkmode', JSON.stringify(value))
+    localStorage.setItem('darkmode', JSON.stringify(value));
 
-    if(value) {
-      document.body.classList.add('darkmode')
-      document.body.classList.remove('lightmode')
+    if (value) {
+      document.body.classList.add('darkmode');
+      document.body.classList.remove('lightmode');
     } else {
-      document.body.classList.add('lightmode')
-      document.body.classList.remove('darkmode')
+      document.body.classList.add('lightmode');
+      document.body.classList.remove('darkmode');
     }
-  }
+  };
 
   ngOnInit(): void {
-    this.setMode(this.mode)
+    this.setMode(this.mode);
   }
-
 }
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
@@ -4,16 +4,10 @@ import { BrowserModule } from '@angular/platform-browser';
 import { AppComponent } from './app.component';
 import { DarkmodeComponent } from 'projects/darkmode-angular/src/public-api';
 
-
 @NgModule({
-  declarations: [
-    AppComponent,
-    DarkmodeComponent
-  ],
-  imports: [
-    BrowserModule
-  ],
+  declarations: [AppComponent],
+  imports: [BrowserModule, DarkmodeComponent],
   providers: [],
-  bootstrap: [AppComponent]
+  bootstrap: [AppComponent],
 })
-export class AppModule { }
+export class AppModule {}