Files
Frontend-Internal-Developer…/frontend/src/app/users/[usersId]/styles.module.css

165 lines
2.8 KiB
CSS

.editUserContainer {
display: flex;
padding: 0px 144px 0 144px;
/* align-items: flex-start; */
gap: 24px;
flex: 1 0 0;
align-self: stretch;
/* position: relative; */
}
.inputFieldContainer {
display: flex;
align-items: flex-start;
gap: 24px;
flex: 1 0 0;
align-self: stretch;
}
.userDetails {
display: flex;
width: 400px;
padding: 20px 24px 48px 24px;
margin-top: 36px;
flex-direction: column;
align-items: flex-start;
border-radius: 6px;
background: #1d1e2a;
}
.imanginaryDiv {
padding: 18px;
}
.userPermissions {
display: flex;
flex-direction: column;
align-items: flex-start;
flex: 1 0 0;
align-self: stretch;
height: calc(100vh - 175px);
position: relative;
overflow-y: auto;
scrollbar-width: none;
padding-bottom: 60px;
}
.header {
display: flex;
padding-bottom: 24px;
align-items: flex-start;
gap: 17px;
align-self: stretch;
}
.header > div {
display: flex;
flex-direction: column;
justify-content: center;
align-items: flex-start;
gap: 5px;
flex: 1 0 0;
}
.header > div > p {
width: 163px;
color: #d2d3e1;
font-family: Inter;
font-size: 20px;
font-style: normal;
font-weight: 500;
line-height: normal;
}
.fields {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 16px;
align-self: stretch;
}
.selectRoleContainer,
.inputMainContainer {
display: flex;
justify-content: center;
align-items: center;
gap: 8px;
align-self: stretch;
}
.inputContainer {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 12px;
flex: 1 0 0;
}
.label {
display: flex;
align-items: flex-start;
gap: 2px;
align-self: stretch;
}
.label > .required {
color: #cfb000;
font-weight: 600;
}
.label > .optionalTxt {
color: #85869b;
color: color(display-p3 0.5216 0.5255 0.6);
font-family: Inter;
font-size: 16 px;
font-style: normal;
font-weight: 300;
line-height: normal;
}
.label > p {
color: #d2d3e1;
color: color(display-p3 0.8235 0.8275 0.8784);
font-family: Inter;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: normal;
}
.roleField {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 10px;
align-self: stretch;
}
.inputField {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 8px;
align-self: stretch;
}
@media (max-width: 950px) {
.hiddenMobile {
display: none;
}
.editUserContainer {
align-self: stretch;
padding: 0 16px;
flex-direction: column;
gap: 0px;
}
.imanginaryDiv {
padding: 5px;
}
.header {
display: none;
}
.userDetails {
background: none;
padding: 0px 0px 0px 0px;
margin-top: 32x;
}
.userPermissions {
height: calc(100vh - 295px);
}
}
@media (max-width: 768px) {
.userDetails {
background: none;
padding: 0px 0px 0px 0px;
width: 100%;
}
}