mirror of https://github.com/alexta69/metube
changes to the theme toggle button
parent
61900a7ba8
commit
498e30c633
File diff suppressed because it is too large
Load Diff
|
@ -26,7 +26,6 @@
|
||||||
"@fortawesome/free-solid-svg-icons": "^5.15.4",
|
"@fortawesome/free-solid-svg-icons": "^5.15.4",
|
||||||
"@ng-bootstrap/ng-bootstrap": "^10.0.0",
|
"@ng-bootstrap/ng-bootstrap": "^10.0.0",
|
||||||
"bootstrap": "^4.5.0",
|
"bootstrap": "^4.5.0",
|
||||||
"bootstrap-icons": "^1.7.2",
|
|
||||||
"ngx-cookie-service": "^12.0.3",
|
"ngx-cookie-service": "^12.0.3",
|
||||||
"ngx-socket-io": "^4.1.0",
|
"ngx-socket-io": "^4.1.0",
|
||||||
"rxjs": "~6.6.0",
|
"rxjs": "~6.6.0",
|
||||||
|
|
|
@ -12,12 +12,9 @@
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
-->
|
-->
|
||||||
<div>
|
<div class="ml-auto">
|
||||||
<button class="btn btn-secondary" aria-label="Toggle theme" (click)="themeChanged()">
|
<button class="btn btn-outline-light button-toggle-theme" aria-label="Toggle theme" (click)="themeChanged()">
|
||||||
<i *ngIf="darkMode; else sunIcon" class="bi bi-sun-fill"></i>
|
<fa-icon [icon]="darkMode ? faSun : faMoon"></fa-icon>
|
||||||
<ng-template #sunIcon>
|
|
||||||
<i class="bi bi-moon-stars-fill"></i>
|
|
||||||
</ng-template>
|
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</nav>
|
</nav>
|
||||||
|
|
|
@ -1,3 +1,7 @@
|
||||||
|
.button-toggle-theme:focus, .button-toggle-theme:active
|
||||||
|
box-shadow: none
|
||||||
|
outline: 0px
|
||||||
|
|
||||||
.add-url-box
|
.add-url-box
|
||||||
max-width: 720px
|
max-width: 720px
|
||||||
margin: 4rem auto
|
margin: 4rem auto
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
import { Component, ViewChild, ElementRef, AfterViewInit } from '@angular/core';
|
import { Component, ViewChild, ElementRef, AfterViewInit } from '@angular/core';
|
||||||
import { faTrashAlt, faCheckCircle, faTimesCircle } from '@fortawesome/free-regular-svg-icons';
|
import { faTrashAlt, faCheckCircle, faTimesCircle } from '@fortawesome/free-regular-svg-icons';
|
||||||
import { faRedoAlt } from '@fortawesome/free-solid-svg-icons';
|
import { faRedoAlt, faSun, faMoon } from '@fortawesome/free-solid-svg-icons';
|
||||||
import { CookieService } from 'ngx-cookie-service';
|
import { CookieService } from 'ngx-cookie-service';
|
||||||
|
|
||||||
import { DownloadsService, Status } from './downloads.service';
|
import { DownloadsService, Status } from './downloads.service';
|
||||||
|
@ -32,6 +32,8 @@ export class AppComponent implements AfterViewInit {
|
||||||
faCheckCircle = faCheckCircle;
|
faCheckCircle = faCheckCircle;
|
||||||
faTimesCircle = faTimesCircle;
|
faTimesCircle = faTimesCircle;
|
||||||
faRedoAlt = faRedoAlt;
|
faRedoAlt = faRedoAlt;
|
||||||
|
faSun = faSun;
|
||||||
|
faMoon = faMoon;
|
||||||
|
|
||||||
constructor(public downloads: DownloadsService, private cookieService: CookieService) {
|
constructor(public downloads: DownloadsService, private cookieService: CookieService) {
|
||||||
this.format = cookieService.get('metube_format') || 'any';
|
this.format = cookieService.get('metube_format') || 'any';
|
||||||
|
|
|
@ -2,4 +2,3 @@
|
||||||
|
|
||||||
/* Importing Bootstrap SCSS file. */
|
/* Importing Bootstrap SCSS file. */
|
||||||
@import '~bootstrap/scss/bootstrap'
|
@import '~bootstrap/scss/bootstrap'
|
||||||
@import '~bootstrap-icons/font/bootstrap-icons.css'
|
|
||||||
|
|
Loading…
Reference in New Issue