dabubble/src/app/components/main-login/password-reset/password-reset.component.scss
2024-05-26 19:51:04 +02:00

111 lines
1.6 KiB
SCSS

@import "../../../shared/components/login/mixins/mixin.scss";
section {
@include SectionBody;
}
.passwordContainer {
max-width: 606px;
width: 100%;
background-color: #fff;
border-radius: 30px;
box-sizing: border-box;
padding: 32px;
display: flex;
flex-direction: column;
align-items: center;
position: relative;
gap: 24px;
max-height: 470px;
height: 100%;
}
.passwordTop {
@include topText;
> span {
width: 90%;
padding-right: 48px;
}
}
.passwordBackImg {
cursor: pointer;
}
.inputContainer {
position: relative;
margin-bottom: 48px;
}
.iconP {
position: absolute;
top: 18px;
left: 20px;
}
.inputField {
@include inputStyle;
}
.error {
@include errorStyle;
}
.contactForm {
width: 90%;
}
.passwordBottom {
display: flex;
justify-content: end;
margin-top: 32px;
gap: 30px;
}
button {
@include buttonGrey;
}
.aktivButton {
@include aktivButtonBlue;
}
.aktivInput {
border: 1px solid#686868;
}
@media (max-width: 570px) {
.passwordTop {
> span {
font-size: 38px;
}
}
}
@media (max-width: 570px) {
.passwordTop {
margin-bottom: 48px;
> span {
font-size: 34px;
}
}
.inputField {
padding-left: 40px;
font-size: 17px;
}
.iconP {
left: 12px;
}
}
@media (max-width: 420px) {
.passwordTop {
> span {
font-size: 28px;
}
}
.contactForm {
min-width: 262px;
}
.passwordContainer {
gap: 16px;
}
.inputField {
font-size: 15px;
}
.bottomInfoText {
margin-bottom: 24px;
}
.inputContainer {
margin-bottom: 48px;
}
}