diff --git a/web/src/components/MemoEditor.tsx b/web/src/components/MemoEditor.tsx
index ca88a4f1..4d6992f7 100644
--- a/web/src/components/MemoEditor.tsx
+++ b/web/src/components/MemoEditor.tsx
@@ -333,6 +333,11 @@ const MemoEditor: React.FC = () => {
+
+
{sortedMemos.map((memo) => (
))}
diff --git a/web/src/less/memo-content.less b/web/src/less/memo-content.less
index 6f55ac71..e98fd9bc 100644
--- a/web/src/less/memo-content.less
+++ b/web/src/less/memo-content.less
@@ -34,14 +34,15 @@
@apply text-blue-600 cursor-pointer underline break-all hover:opacity-80;
}
- .counter-block,
+ .ol-block,
+ .ul-block,
.todo-block {
- @apply float-left inline-block box-border text-center w-7 font-mono select-none;
+ @apply inline-block box-border text-center w-7 font-mono select-none;
}
.todo-block {
@apply w-4 h-4 leading-4 border rounded box-border text-lg cursor-pointer shadow-inner hover:opacity-80;
- margin-top: 6px;
+ transform: translateY(2px);
margin-left: 6px;
margin-right: 6px;
}
diff --git a/web/src/less/memo-editor.less b/web/src/less/memo-editor.less
index 835672f4..70444b0e 100644
--- a/web/src/less/memo-editor.less
+++ b/web/src/less/memo-editor.less
@@ -5,11 +5,11 @@
&.float {
@media (max-width: 640px) {
- @apply fixed w-full bottom-2 left-0 border-none rounded-none sm:relative sm:bottom-0 sm:w-full;
+ @apply fixed w-full bottom-0 left-0 border-none rounded-none;
background-color: #f6f5f4;
> .memo-editor {
- @apply p-4 rounded-lg border-2 flex flex-col flex-grow justify-start items-start relative w-full h-full bg-white;
+ @apply p-4 mb-2 rounded-lg border-2 flex flex-col flex-grow justify-start items-start relative w-full h-full bg-white;
.tag-action > .tag-list {
@apply bottom-7;
@@ -18,7 +18,8 @@
}
.emoji-picker-react {
- @apply bottom-16;
+ @apply !bottom-8;
+ top: unset !important;
}
}
}
@@ -28,20 +29,21 @@
background-color: #f6f5f4;
> .memo-editor {
- @apply p-4 rounded-lg border shadow-lg flex flex-col flex-grow justify-start items-start relative w-full h-full bg-white;
+ @apply p-4 mb-4 rounded-lg border shadow-lg flex flex-col flex-grow justify-start items-start relative w-full h-full bg-white;
> .common-editor-inputer {
@apply flex-grow w-full !h-full max-h-full;
}
+ }
- .tag-action > .tag-list {
- @apply bottom-7;
- top: unset;
- }
+ .tag-action > .tag-list {
+ @apply bottom-7;
+ top: unset;
}
.emoji-picker-react {
- @apply bottom-20;
+ @apply !bottom-8;
+ top: unset !important;
}
}
@@ -66,7 +68,7 @@
}
> .common-tools-wrapper {
- @apply w-full flex flex-row justify-between items-center;
+ @apply relative w-full flex flex-row justify-between items-center;
> .common-tools-container {
@apply flex flex-row justify-start items-center;
@@ -104,6 +106,14 @@
@apply hidden ml-1 text-xs leading-5 text-gray-700 border border-gray-300 rounded-xl px-2;
}
}
+
+ .emoji-picker-react {
+ @apply absolute shadow left-6 top-8;
+
+ li.emoji::before {
+ @apply hidden;
+ }
+ }
}
> .btns-container {
@@ -146,12 +156,4 @@
}
}
}
-
- .emoji-picker-react {
- @apply absolute shadow;
-
- li.emoji::before {
- @apply hidden;
- }
- }
}
diff --git a/web/src/less/memo-list.less b/web/src/less/memo-list.less
index 4df2a833..39d7c228 100644
--- a/web/src/less/memo-list.less
+++ b/web/src/less/memo-list.less
@@ -1,7 +1,7 @@
@import "./mixin.less";
.memo-list-container {
- @apply flex flex-col justify-start items-start w-full max-w-full overflow-y-scroll;
+ @apply flex flex-col justify-start items-start w-full max-w-full overflow-y-scroll !pb-36;
.hide-scroll-bar();
> .status-text-container {