diff --git a/frontend/src/app/components/auth/register/register.component.html b/frontend/src/app/components/auth/register/register.component.html
index 6da5173..376d645 100644
--- a/frontend/src/app/components/auth/register/register.component.html
+++ b/frontend/src/app/components/auth/register/register.component.html
@@ -16,22 +16,25 @@
onsubmit="return false"
(input)="this.errorService.clearError()"
>
-
@if (!mail.valid && mail.touched) {
Please enter your email
@@ -56,8 +59,9 @@
"
required
/>
+
![]()
@@ -88,8 +92,9 @@
"
required
/>
+
![]()
diff --git a/frontend/src/app/components/home/browse/upload-movie/upload-movie.component.scss b/frontend/src/app/components/home/browse/upload-movie/upload-movie.component.scss
index 58b2b58..1b340e1 100644
--- a/frontend/src/app/components/home/browse/upload-movie/upload-movie.component.scss
+++ b/frontend/src/app/components/home/browse/upload-movie/upload-movie.component.scss
@@ -31,7 +31,6 @@
width: 100vw;
height: 100vh;
backdrop-filter: blur(2px);
- background-color: rgba($black, 0.3);
display: flex;
justify-content: center;
align-items: center;
diff --git a/frontend/src/assets/img/mail.svg b/frontend/src/assets/img/mail.svg
new file mode 100644
index 0000000..e31528c
--- /dev/null
+++ b/frontend/src/assets/img/mail.svg
@@ -0,0 +1,8 @@
+
diff --git a/frontend/src/assets/img/password.svg b/frontend/src/assets/img/password.svg
new file mode 100644
index 0000000..c7cd2f6
--- /dev/null
+++ b/frontend/src/assets/img/password.svg
@@ -0,0 +1,8 @@
+
diff --git a/frontend/src/assets/style/form.scss b/frontend/src/assets/style/form.scss
index 763ac0b..19dcf62 100644
--- a/frontend/src/assets/style/form.scss
+++ b/frontend/src/assets/style/form.scss
@@ -62,12 +62,19 @@ form {
// Show / Hide Password
-.password-field {
+.password-field,
+.mail-field {
position: relative;
width: 100%;
+
+ input,
+ textarea,
+ select {
+ padding-left: 60px;
+ }
}
-.passwordEye {
+.password-eye {
position: absolute;
right: 48px;
top: 50%;
@@ -77,6 +84,18 @@ form {
hue-rotate(241deg) brightness(93%) contrast(88%);
}
+// Icons
+
+.mail-icon,
+.password-icon {
+ position: absolute;
+ left: 44px;
+ top: 50%;
+ width: 28px;
+ height: auto;
+ transform: translateY(-50%);
+}
+
/*------------- RESPONSIVE -------------*/
@media screen and (max-width: 600px) {