справлены проблемы отображения эмодзи на iPhone: добавлены iOS-специфичные стили для модального окна, сетки эмодзи и кнопки эмодзи
This commit is contained in:
parent
ce75907087
commit
70933a6980
@ -2,12 +2,28 @@
|
||||
margin-bottom: var(--spacing-medium);
|
||||
max-height: 300px;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden; /* Предотвращаем горизонтальный скролл */
|
||||
}
|
||||
|
||||
.emojiGrid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(6, 1fr);
|
||||
gap: 8px;
|
||||
margin: 0 auto; /* Центрируем сетку */
|
||||
}
|
||||
|
||||
@supports (-webkit-touch-callout: none) {
|
||||
/* Стили только для iOS устройств */
|
||||
.emojiGrid {
|
||||
width: auto; /* Автоматическая ширина вместо фиксированной */
|
||||
max-width: 300px; /* Ограничиваем максимальную ширину */
|
||||
grid-template-columns: repeat(5, 1fr); /* Меньше колонок для iOS */
|
||||
}
|
||||
|
||||
/* Исправление для предотвращения проблем с прокруткой на iOS */
|
||||
.emojiContainer {
|
||||
-webkit-overflow-scrolling: touch;
|
||||
}
|
||||
}
|
||||
|
||||
.emojiItem {
|
||||
@ -24,6 +40,16 @@
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
@supports (-webkit-touch-callout: none) {
|
||||
/* Стили только для iOS устройств */
|
||||
.emojiItem {
|
||||
-webkit-appearance: none;
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
/* Исправление для iOS Safari, чтобы предотвратить проблемы с рендерингом эмодзи */
|
||||
transform: translateZ(0);
|
||||
}
|
||||
}
|
||||
|
||||
.emojiItem:hover {
|
||||
background-color: rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
|
||||
@ -21,6 +21,15 @@
|
||||
margin: 0 var(--spacing-medium);
|
||||
}
|
||||
|
||||
@supports (-webkit-touch-callout: none) {
|
||||
/* Стили только для iOS устройств */
|
||||
.modal {
|
||||
width: calc(100% - var(--spacing-large) * 2);
|
||||
margin: 0 var(--spacing-large);
|
||||
max-width: 90vw; /* Ограничиваем ширину относительно вьюпорта */
|
||||
}
|
||||
}
|
||||
|
||||
.header {
|
||||
margin-bottom: var(--spacing-medium);
|
||||
}
|
||||
|
||||
@ -113,6 +113,25 @@
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
@supports (-webkit-touch-callout: none) {
|
||||
/* Стили только для iOS устройств */
|
||||
.emojiSelector {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.emojiButton {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 0;
|
||||
line-height: 1; /* Важно для вертикального центрирования текста на iOS */
|
||||
-webkit-appearance: none;
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
.actions {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user