settings adaptive

This commit is contained in:
Victor Batischev 2023-12-05 15:18:28 +03:00
parent 6086026617
commit e90ab69e5f
2 changed files with 25 additions and 58 deletions

View File

@ -97,7 +97,7 @@ export const PartnerSettings = () => {
<div className="partner-settings__login">
<h3 className="settings__title">Вход в систему</h3>
<p className="settings__lable-first">Изменение логина</p>
<p className="settings__label">Изменение логина</p>
<div className="settings__input">
<input
className={inputsError.name ? "warning" : ""}
@ -119,7 +119,7 @@ export const PartnerSettings = () => {
)}
</div>
<p className="settings__lable-second">Изменение пароля</p>
<p className="settings__label">Изменение пароля</p>
<div className="settings__input oldPassword">
<input
className={inputsError.password ? "warning" : ""}
@ -185,26 +185,26 @@ export const PartnerSettings = () => {
</div>
<div className="partner-settings__report">
<h3 className="settings__title">Документы и отчеты</h3>
<p className="settings__lable-first">Изменить провадера ЭДО</p>
<p className="settings__label">Изменить провадера ЭДО</p>
<div className="partner-settings__logo">
<div>
<label className="partner-settings__label-first">
<label className="partner-settings__label">
<img src={astral}></img>
<input type="checkbox" />
<span className="checkbox__first"></span>
<span className="checkbox"></span>
</label>
</div>
<div>
<label className="partner-settings__label-second">
<label className="partner-settings__label">
<img src={kontur}></img>
<input type="checkbox" />
<span className="checkbox__second"></span>
<span className="checkbox"></span>
</label>
</div>
</div>
<p className="settings__lable-second">
<p className="settings__label">
Изменение названия компании
</p>
<div className="settings__input">

View File

@ -22,20 +22,11 @@
line-height: 24px;
}
&__lable {
&-first,
&-second {
font-size: 15px;
line-height: 18px;
color: #000000;
}
&-first {
margin: 39px 0 10px 0;
}
&-second {
margin: 15px 0 10px 0;
}
&__label {
font-size: 15px;
line-height: 18px;
color: #000000;
margin: 15px 0 10px 0;
}
&__input {
@ -46,7 +37,6 @@
padding: 5px 10px;
background: #eff2f7;
border-radius: 8px;
width: 373px;
height: 35px;
border: none;
font-size: 15px;
@ -75,11 +65,12 @@
}
&__buttons {
width: 87%;
width: 100%;
display: flex;
flex-direction: row;
justify-content: space-between;
margin: 36px 0 30px 0;
justify-content: flex-start;
gap: 20px;
margin: 30px 0 20px;
&-cancel,
&-save {
@ -113,7 +104,7 @@
}
}
@media (max-width: 570px) {
@media (max-width: 800px) {
&__input {
width: 95%;
}
@ -123,6 +114,7 @@
width: 100%;
flex-direction: column-reverse;
align-items: center;
gap: 0px;
&-save {
margin-bottom: 15px;
@ -132,13 +124,7 @@
}
.checkbox {
&__first {
margin: 0px 0 0 20px;
}
&__second {
margin: 0px 20px 0 0;
}
margin: 0px 0 0 20px;
}
.partner-settings {
@ -147,7 +133,7 @@
&__body {
display: flex;
flex-direction: row;
justify-content: space-between;
justify-content: space-around;
margin-top: 27px;
}
@ -197,15 +183,8 @@
}
&__label {
&-first,
&-second {
display: flex;
align-items: center;
}
&-second {
flex-direction: row-reverse;
}
display: flex;
align-items: center;
}
@media (max-width: 1200px) {
@ -227,10 +206,7 @@
}
&__label {
&-second,
&-first {
flex-direction: row;
}
flex-direction: row;
}
}
@ -276,16 +252,7 @@
}
&__label {
&-second,
&-first {
flex-direction: row;
}
}
.checkbox {
&__second {
margin: 0px 0 0 20px;
}
flex-direction: row;
}
}
}