Smart/smartEnergyView-frontend
2
0
Fork 0
Code Issues 7 Pull Requests Actions Packages Projects Releases Wiki Activity

✨ Add login

Browse Source
This commit is contained in:
Alex Santos 2022-05-10 15:28:16 -03:00
parent 0790f7973a
commit b8d75d436b
1 changed files with 60 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

76
styles/layouts/Login/LoginView.ts
View File

@ -9,6 +9,8 @@ export const LoginView = styled.main<{auth: string}>`
min-height: fit-content; min-height: fit-content;
height: 100vh; height: 100vh;
background-color: #f9f9f9; background-color: #f9f9f9;
padding: 0;
overflow: hidden;
display: ${props => props.auth == '/'? null : 'none'}; display: ${props => props.auth == '/'? null : 'none'};
@ -21,10 +23,8 @@ export const LoginView = styled.main<{auth: string}>`
text-align: center; text-align: center;
border-radius: 4px; border-radius: 4px;
width: 100%; width: 100%;
max-width: 30rem; max-width: 34rem;
padding-left: 50px; margin-left: 13rem;
padding-right: 50px;
margin-left: 8rem;
} }
@media screen and (max-width: 1008px) { @media screen and (max-width: 1008px) {
@ -46,41 +46,57 @@ export const LoginView = styled.main<{auth: string}>`
color: #092C4C; color: #092C4C;
} }
input{ input{
font-size: 1rem;
width: 100%; width: 90%;
height: 15rem; height: 18rem;
border-radius: 5px; border-radius: 5px;
margin-bottom: 10px; margin-bottom: 10px;
border-style: none; border-style: none;
border: solid #D0D0D0 1px; border: solid #D0D0D0 1px;
padding: 9px 20px;
}
input::placeholder {
color: #ABB3BB;
font-size: 12px;
padding: 10px;
}
input:hover
{
border: 1px solid #254F7F;
}
.IconButton{
width: 10px;
} }
button{ .button{
width: 100%; width: 90%;
height: 18rem; height: 24rem;
background-image: linear-gradient(to right, #254F7F 10%, #888888 100%); background-image: linear-gradient(to right, #254F7F 10%, #888888 100%);
color: white; color: white;
font-size: 15px; font-size: 15px;
border-radius: 5px; border-radius: 5px;
border: 0; border: 0;
margin-top: 2.5rem; margin-top: 2.5rem;
cursor: pointer;
} }
input::placeholder {
color: #ABB3BB;
font-size: 12px;
}
span { span {
font-size: 12px; font-size: 12px;
color: #254F7F; color: #254F7F;
margin-left: 23rem;
cursor: pointer;
} }
p { p {
color:#8B8B8B; color:#8B8B8B;
font-size: 12px; font-size: 12px;
margin-bottom: 22px; margin-top: 3px;
} }
fieldset { fieldset {
@ -90,7 +106,7 @@ export const LoginView = styled.main<{auth: string}>`
border-right: none; border-right: none;
display: block; display: block;
text-align: center; text-align: center;
width: 100%; width: 90%;
} }
fieldset legend { fieldset legend {
@ -98,4 +114,32 @@ export const LoginView = styled.main<{auth: string}>`
color: #ABB3BB; color: #ABB3BB;
font-size: 14px; font-size: 14px;
} }
.input-element-wrapper{
display:flex;
margin-top: 5px;
}
.password-field{
padding: 0.5rem 1rem;
font-size: 1rem;
}
.btnInput{
color: #ABB3BB;
font-size: 20px;
background-color: transparent;
border: none;
display: flex;
position: absolute;
justify-content: center;
height: 64px;
margin-left: 26rem;
margin-top: 16rem;
cursor: pointer;
}
`; `;