deblan-mirror/editor.js
deblan-mirror/editor.js
1
0
Fork 0
mirror of https://github.com/codex-team/editor.js synced 2026-03-16 15:45:47 +01:00
Code Issues Projects Releases Wiki Activity

Fix mobile

Browse source
This commit is contained in:
Tanya Fomina 2024-03-09 18:32:00 +03:00
commit 6be9cf2840
2 changed files with 21 additions and 23 deletions
Download patch file Download diff file Expand all files Collapse all files

7
src/components/utils/popover/popover-item.ts
View file

@ -78,7 +78,8 @@ export class PopoverItem {
title: 'ce-popover-item__title',
secondaryTitle: 'ce-popover-item__secondary-title',
icon: 'ce-popover-item__icon',
iconChevronRight: 'ce-popover-item__icon-chevron-right',
iconTool: 'ce-popover-item__icon--tool',
iconChevronRight: 'ce-popover-item__icon--chevron-right',
active: 'ce-popover-item--active',
disabled: 'ce-popover-item--disabled',
focused: 'ce-popover-item--focused',
@ -173,7 +174,7 @@ export class PopoverItem {
el.dataset.itemName = params.name;
}
this.nodes.icon = Dom.make('div', PopoverItem.CSS.icon, {
this.nodes.icon = Dom.make('div', [PopoverItem.CSS.icon, PopoverItem.CSS.iconTool], {
innerHTML: params.icon || IconDotCircle,
});
@ -190,7 +191,7 @@ export class PopoverItem {
}
if (this.children.length > 0) {
el.appendChild(Dom.make('div', PopoverItem.CSS.iconChevronRight, {
el.appendChild(Dom.make('div', [PopoverItem.CSS.icon, PopoverItem.CSS.iconChevronRight], {
innerHTML: IconChevronRight,
}));
}

37
src/styles/popover.css
View file

@ -96,16 +96,19 @@
}
@media (--mobile) {
--offset: 5px;
position: fixed;
max-width: none;
min-width: calc(100% - var(--offset) * 2);
left: var(--offset);
right: var(--offset);
bottom: calc(var(--offset) + env(safe-area-inset-bottom));
top: auto;
border-radius: 10px;
.ce-popover__container {
--offset: 5px;
position: fixed;
max-width: none;
min-width: calc(100% - var(--offset) * 2);
left: var(--offset);
right: var(--offset);
bottom: calc(var(--offset) + env(safe-area-inset-bottom));
top: auto;
border-radius: 10px;
}
.ce-popover__search {
display: none;
@ -191,15 +194,11 @@
}
&__icon {
border-radius: 5px;
width: 26px;
height: 26px;
box-shadow: 0 0 0 1px var(--color-border-icon);
background: #fff;
display: flex;
align-items: center;
justify-content: center;
margin-right: 10px;
svg {
width: var(--icon-size);
@ -218,13 +217,11 @@
}
}
&__icon-chevron-right {
svg {
width: var(--icon-size);
height: var(--icon-size);
display: block;
}
&__icon--tool {
border-radius: 5px;
box-shadow: 0 0 0 1px var(--color-border-icon);
background: #fff;
margin-right: 10px;
}
&__title {