diff --git a/packages/portal/src/app/authentication/authentication.component.scss b/packages/portal/src/app/authentication/authentication.component.scss
index cc7d9492..0afa2621 100644
--- a/packages/portal/src/app/authentication/authentication.component.scss
+++ b/packages/portal/src/app/authentication/authentication.component.scss
@@ -24,9 +24,20 @@ section {
width: 100%;
max-width: 400px;
- button {
+ a {
width: 100%;
margin: 10px 0;
+
+ .content {
+ display: flex;
+ height: 100%;
+ justify-content: center;
+ align-items: center;
+
+ .text {
+ margin-left: 16px;
+ }
+ }
}
}
img {
@@ -46,7 +57,7 @@ section {
}
.btn__twitter {
- background-color: #1da1f2;
+ background-color: #183343dd;
color: #fff;
}
diff --git a/packages/portal/src/app/authentication/authentication.component.ts b/packages/portal/src/app/authentication/authentication.component.ts
index 8bccc79a..6bc265c0 100644
--- a/packages/portal/src/app/authentication/authentication.component.ts
+++ b/packages/portal/src/app/authentication/authentication.component.ts
@@ -1,6 +1,8 @@
import { CommonModule } from "@angular/common";
import { Component, OnInit, inject } from "@angular/core";
import { MatButtonModule } from "@angular/material/button";
+import { DomSanitizer } from "@angular/platform-browser";
+import { MatIconRegistry, MatIconModule } from "@angular/material/icon";
import { MatCardModule } from "@angular/material/card";
import { MatFormFieldModule } from "@angular/material/form-field";
import { MatInputModule } from "@angular/material/input";
@@ -12,10 +14,16 @@ import { TextBlockComponent } from "../shared/text-block/text-block.component";
selector: "app-authentication",
templateUrl: "./authentication.component.html",
styleUrls: ["./authentication.component.scss"],
- imports: [CommonModule, MatButtonModule, MatCardModule, MatFormFieldModule, MatInputModule, TextBlockComponent],
+ imports: [CommonModule, MatButtonModule, MatCardModule, MatFormFieldModule, MatInputModule, TextBlockComponent, MatIconModule],
standalone: true,
})
export class AuthenticationComponent implements OnInit {
+ public constructor(iconRegistry: MatIconRegistry, santizer: DomSanitizer) {
+ for (const provider of this.providers) {
+ iconRegistry.addSvgIcon(provider.id, santizer.bypassSecurityTrustResourceUrl(`../assets/company-logos/${provider.id}.svg`));
+ }
+ }
+
redirectURL = "/home";
providers = [
diff --git a/packages/portal/src/assets/company-logos/apple.svg b/packages/portal/src/assets/company-logos/apple.svg
new file mode 100644
index 00000000..8897cc7e
--- /dev/null
+++ b/packages/portal/src/assets/company-logos/apple.svg
@@ -0,0 +1 @@
+