Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Мобильная версия страниц Регистрации и Логина #118

Merged
merged 17 commits into from
Jun 7, 2023

Conversation

bevuxyna
Copy link
Contributor

@bevuxyna bevuxyna commented Jun 7, 2023

Добавила адаптив для страниц Регистрации и Логина.
Добавила два стандартных шрифта в srandard-fonts.

Comment on lines 20 to 25
@media (min-width: 1440px) {
.orange-ball_user {
left: 64px;
top: 15px;
}
}
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

мы можем сокращать код scss вложив @media для .orange-ball_user в класс .orange-ball_user. таким образом

.orange-ball_user {
position: absolute;
left: calc(52px + (100vw - 768px) * 0.017);
top: calc((100vw - 768px) * 0.022);

@media (min-width: 1440px) {
left: 64px;
top: 15px;
}
}

это может помочь быстрее ориентировать к какому классу относится media при поддержке кода в дальнейшем

это можно сделать в этом файле, а также во всех scss файлах ниже😌

src/pages/App/App.scss Outdated Show resolved Hide resolved
@ponomareva-frontend
Copy link
Contributor

ponomareva-frontend commented Jun 7, 2023

Предлагаю при мерже всегда делать squash, чтобы не запутаться в большом количестве коммитов🤘🏼
Круто, что заметила опечатку в standard классах, как мы все ее пропустили?🥲

@bevuxyna
Copy link
Contributor Author

bevuxyna commented Jun 7, 2023

Предлагаю при мерже всегда делать squash, чтобы не запутаться в большом количестве коммитов🤘🏼 Круто, что заметила опечатку в standard классах, как мы все ее пропустили?smiling_face_with_tear

Да, это обязательно.
Опечатку webstorm определил)

@ponomareva-frontend
Copy link
Contributor

ponomareva-frontend commented Jun 7, 2023

Да, это обязательно. Опечатку webstorm определил)

Кажется, ты еще не везде во всем проекте опечатку класса исправила в файлах scss, не забудь, пожалуйста, перед мержем заглянуть поправить🤓

display: block;
}

.user-container {
Copy link
Contributor

@Artyom774 Artyom774 Jun 7, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Лучше сначала селектор блока .user-container, а потом селектор элемента .user-container__container

padding: 24px 16px 38px;
}

.user-container_register-confirm {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Так как тут модификаторы, то в целом можно записать во вложенных стилях так:

.user-container {
  ...
  padding: 24px 16px 38px;
  
  &_register-confirm {
    ...
  }
  &_login {
    padding-bottom: 142px;
  }
  &_recovery {
    ...
  }
}

Но Таня уже предложила подкорректировать доку, так что можем обсудить

cursor: pointer;
}

.register__text {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Получилось, что сначала идут селекторы для блока register, потом селекторы для блока checkbox, причём начинаются с селекторов элементов, а потом опять селекторы для блока register


&:hover {
cursor: pointer;
}
}

.password-visibility_opened {
background-image: url("../../images/password__visibility_opened.svg");
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Не в тему этого ПР, но в css используем одинарные кавычки (во всяком случае до этого момента так казалось), так что если есть желание, то можно заменить, чтобы привести к единообразию

Чисто предложение: так как один и тот же путь по папки images используется дважды в этом файле, то можно добавить в начала файла переменную:
$images-path: '../../images';
Тогда стиль тут будет:
background-image: url('#{$images-path}/password__visibility_opened.svg');

Copy link
Contributor

@Artyom774 Artyom774 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Спасибо!

Можно склеивать (сквошивать)

@bevuxyna bevuxyna merged commit 7f0a040 into dev Jun 7, 2023
@bevuxyna bevuxyna deleted the feat/profile_mobile_version branch September 2, 2023 09:34
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants