对齐 Wolai 编辑器搜索与文档画布
This commit is contained in:
lix-2026
@@ -170,6 +170,11 @@ a:hover {
|
||||
.material-symbols-outlined[data-icon="right_panel_open"] { --mnote-icon-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 5h16v14H4zM14 5v14M8 12h6M11 9l3 3-3 3' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
|
||||
.material-symbols-outlined[data-icon="open_in_new"] { --mnote-icon-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 6H5v13h13v-3M12 5h7v7M10 14 19 5' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
|
||||
.material-symbols-outlined[data-icon="share"] { --mnote-icon-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='18' cy='5' r='3' fill='none' stroke='black' stroke-width='2'/%3E%3Ccircle cx='6' cy='12' r='3' fill='none' stroke='black' stroke-width='2'/%3E%3Ccircle cx='18' cy='19' r='3' fill='none' stroke='black' stroke-width='2'/%3E%3Cpath d='m8.7 10.7 6.6-4.4M8.7 13.3l6.6 4.4' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E"); }
|
||||
|
||||
.material-symbols-outlined[data-icon="comment"] { --mnote-icon-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 5h14v10H9l-4 4V5Z' fill='none' stroke='black' stroke-width='2' stroke-linejoin='round'/%3E%3C/svg%3E"); }
|
||||
.material-symbols-outlined[data-icon="person_add"] { --mnote-icon-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='9' cy='8' r='3.2' fill='none' stroke='black' stroke-width='2'/%3E%3Cpath d='M3.5 20a5.5 5.5 0 0 1 11 0M18 8v6M15 11h6' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E"); }
|
||||
.material-symbols-outlined[data-icon="slideshow"] { --mnote-icon-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 5h16v12H4z' fill='none' stroke='black' stroke-width='2' stroke-linejoin='round'/%3E%3Cpath d='m10 9 5 2-5 2zM9 21h6' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
|
||||
.material-symbols-outlined[data-icon="article"] { --mnote-icon-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 4h12v16H6zM9 8h6M9 12h6M9 16h4' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
|
||||
.material-symbols-outlined[data-icon="link"] { --mnote-icon-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9.5 14.5 14.5 9.5M10.8 6.2l1.1-1.1a4 4 0 0 1 5.7 5.7l-1.6 1.6M13.2 17.8l-1.1 1.1a4 4 0 0 1-5.7-5.7L8 11.6' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E"); }
|
||||
.material-symbols-outlined[data-icon="content_copy"],
|
||||
.material-symbols-outlined[data-icon="file_copy"] { --mnote-icon-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 8h10v12H8zM6 16H4V4h10v2' fill='none' stroke='black' stroke-width='2' stroke-linejoin='round'/%3E%3C/svg%3E"); }
|
||||
@@ -912,15 +917,17 @@ a:hover {
|
||||
/* ===== 响应式 ===== */
|
||||
|
||||
|
||||
.wolai-search-overlay{position:fixed;inset:0;z-index:1200;display:flex;align-items:flex-start;justify-content:center;padding:92px 24px 24px;background:rgba(0,0,0,.32)}
|
||||
.wolai-search-overlay{position:fixed;inset:0;z-index:1200;display:flex;align-items:flex-start;justify-content:center;padding:92px 24px 24px;background:rgba(0,0,0,.32);pointer-events:none}
|
||||
.wolai-search-overlay[hidden]{display:none!important}
|
||||
.wolai-search-dialog{width:min(680px,100%);max-height:min(720px,calc(100vh - 128px));overflow:hidden;display:flex;flex-direction:column;background:#FFF;border:1px solid rgba(27,28,28,.10);border-radius:6px;box-shadow:0 18px 48px rgba(15,23,42,.22),0 2px 8px rgba(15,23,42,.08);color:#37352F}
|
||||
.wolai-search-dialog{width:min(680px,100%);max-height:min(720px,calc(100vh - 128px));overflow:hidden;display:flex;flex-direction:column;background:#FFF;border:1px solid rgba(27,28,28,.10);border-radius:6px;box-shadow:0 18px 48px rgba(15,23,42,.22),0 2px 8px rgba(15,23,42,.08);color:#37352F;pointer-events:auto}
|
||||
.wolai-search-input-row{display:flex;align-items:center;min-height:58px;padding:0 12px 0 18px;border-bottom:1px solid rgba(27,28,28,.08)}
|
||||
.wolai-search-input-icon{width:22px;height:22px;color:#8B8780;margin-right:10px}
|
||||
.wolai-search-input{flex:1 1 auto;min-width:0;height:56px;border:0;outline:none;background:transparent;color:#24211D;font:400 18px/1.4 var(--wolai-font-sans);letter-spacing:0}
|
||||
.wolai-search-input::placeholder{color:#A29E97}
|
||||
.wolai-search-input::-webkit-search-cancel-button{appearance:none;-webkit-appearance:none;display:none}
|
||||
.wolai-search-close{width:28px;height:28px;border:0;border-radius:4px;background:transparent;color:#8B8780;cursor:pointer;font-size:20px;line-height:1}
|
||||
.wolai-search-options{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px 8px;border-bottom:1px solid rgba(27,28,28,.06);color:#A7A39D;font-size:12px;line-height:1}
|
||||
.wolai-search-options[hidden]{display:none!important}
|
||||
.wolai-search-options-left,.wolai-search-options-right,.wolai-search-switch-control,.wolai-search-sort-control{display:inline-flex;align-items:center}
|
||||
.wolai-search-options-left{min-width:0;flex-wrap:wrap;gap:8px 12px}
|
||||
.wolai-search-options-right{margin-left:auto;flex:0 0 auto}
|
||||
@@ -939,9 +946,9 @@ a:hover {
|
||||
.wolai-search-result-icon{width:18px;height:18px;margin-top:2px;color:#8B8780}
|
||||
.wolai-search-result-main{min-width:0;display:flex;flex-direction:column;gap:3px}
|
||||
.wolai-search-result-title{color:#2F2D29;font-size:14px;line-height:1.35;word-break:break-word}
|
||||
.wolai-search-result-title mark{padding:0 1px;border-radius:2px;background:#FFE9E6;color:#D83A32}
|
||||
.wolai-search-result-title mark,.wolai-search-result-snippet mark{padding:0 1px;border-radius:2px;background:#FFE9E6;color:#D83A32}
|
||||
.wolai-search-result-snippet,.wolai-search-empty{color:#8B8780;font-size:12px;line-height:1.35}
|
||||
.wolai-search-empty{padding:28px 12px 32px;text-align:center}
|
||||
.wolai-search-empty,.wolai-search-recent{padding:28px 12px 32px;text-align:center;color:#8B8780;font-size:12px;line-height:1.35}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.mnote-sidebar {
|
||||
@@ -963,6 +970,7 @@ a:hover {
|
||||
|
||||
.document-shell-header h1 {
|
||||
font-size: 28px;
|
||||
line-height: 36px;
|
||||
}
|
||||
|
||||
#mnote-editor-island {
|
||||
@@ -1555,7 +1563,7 @@ body {
|
||||
}
|
||||
|
||||
.wolai-topbar {
|
||||
height: 44px;
|
||||
height: 40px;
|
||||
padding: 0 20px 0 22px;
|
||||
background: rgba(255, 255, 255, 0.92);
|
||||
color: #5A5A5A;
|
||||
@@ -1626,22 +1634,17 @@ body {
|
||||
}
|
||||
|
||||
.wolai-public-pill {
|
||||
height: 26px;
|
||||
height: 22px;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 5px;
|
||||
padding: 0 11px;
|
||||
border: 1px solid #D6F2DC;
|
||||
border-radius: 999px;
|
||||
padding: 0 8px;
|
||||
border: 0;
|
||||
border-radius: 3px;
|
||||
background: #ECFCEF;
|
||||
color: #087B31;
|
||||
font-size: 12px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.wolai-public-pill span {
|
||||
color: var(--atelier-primary-container);
|
||||
font-size: 12px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.wolai-ai-inline {
|
||||
@@ -1649,25 +1652,21 @@ body {
|
||||
}
|
||||
|
||||
.document-shell {
|
||||
max-width: 880px;
|
||||
min-height: calc(100vh - 44px);
|
||||
padding: 78px 48px 160px;
|
||||
box-sizing: border-box;
|
||||
width: min(100%, 760px);
|
||||
min-height: calc(100vh - 40px);
|
||||
padding: 68px 0 160px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.document-shell-header {
|
||||
max-width: none;
|
||||
padding: 0;
|
||||
margin: 0 0 28px;
|
||||
margin: 0 0 50px;
|
||||
}
|
||||
|
||||
.document-page-icon {
|
||||
height: 82px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: #111111;
|
||||
line-height: 1;
|
||||
margin-bottom: 12px;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.mnote-material-page-icon {
|
||||
@@ -1683,18 +1682,18 @@ body {
|
||||
.document-title-heading,
|
||||
.document-shell-header h1 {
|
||||
padding: 0;
|
||||
margin: 0 0 14px;
|
||||
margin: 0;
|
||||
color: var(--atelier-text);
|
||||
font-size: 42px;
|
||||
font-weight: 700;
|
||||
line-height: 1.12;
|
||||
font-size: 34px;
|
||||
font-weight: 600;
|
||||
line-height: 44px;
|
||||
letter-spacing: 0;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.document-title-input {
|
||||
width: 100%;
|
||||
min-height: 52px;
|
||||
min-height: 44px;
|
||||
display: block;
|
||||
resize: none;
|
||||
overflow: hidden;
|
||||
@@ -1719,15 +1718,7 @@ body {
|
||||
}
|
||||
|
||||
.document-shell-meta {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
gap: 18px;
|
||||
padding-bottom: 28px;
|
||||
border-bottom: 1px solid #F0EFED;
|
||||
color: #A19D97;
|
||||
font-size: 14px;
|
||||
line-height: 1.4;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.document-shell-meta span {
|
||||
@@ -1759,7 +1750,7 @@ body {
|
||||
.ProseMirror {
|
||||
color: var(--atelier-text);
|
||||
font-size: 16px;
|
||||
line-height: 1.65;
|
||||
line-height: 24px;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
@@ -1789,7 +1780,33 @@ body {
|
||||
}
|
||||
|
||||
#mnote-leptos-tiptap-island-editor-root .ProseMirror p {
|
||||
margin: 0 0 24px;
|
||||
margin: 0 0 8px;
|
||||
}
|
||||
|
||||
#mnote-leptos-tiptap-island-editor-root .ProseMirror ul,
|
||||
#mnote-leptos-tiptap-island-editor-root .ProseMirror ol {
|
||||
margin: 4px 0 8px;
|
||||
padding-left: 1.5em;
|
||||
}
|
||||
|
||||
#mnote-leptos-tiptap-island-editor-root .ProseMirror li {
|
||||
margin: 2px 0;
|
||||
padding-left: 2px;
|
||||
}
|
||||
|
||||
#mnote-leptos-tiptap-island-editor-root .ProseMirror blockquote {
|
||||
margin: 8px 0;
|
||||
padding: 2px 0 2px 14px;
|
||||
border-left: 3px solid #D9D6D0;
|
||||
color: #5F5B56;
|
||||
}
|
||||
|
||||
#mnote-leptos-tiptap-island-editor-root .ProseMirror input[type="checkbox"] {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
margin: 0 8px 0 0;
|
||||
vertical-align: -3px;
|
||||
accent-color: #2EA44F;
|
||||
}
|
||||
|
||||
#mnote-leptos-tiptap-island-editor-root .ProseMirror h1,
|
||||
@@ -1823,8 +1840,9 @@ body {
|
||||
|
||||
.wolai-floating-actions {
|
||||
right: 24px;
|
||||
bottom: 24px;
|
||||
gap: 10px;
|
||||
bottom: 44px;
|
||||
flex-direction: column-reverse;
|
||||
gap: 16px;
|
||||
z-index: 50;
|
||||
}
|
||||
|
||||
@@ -1848,13 +1866,13 @@ body {
|
||||
}
|
||||
|
||||
.wolai-floating-button--ai {
|
||||
width: 52px;
|
||||
height: 52px;
|
||||
border: 0;
|
||||
background: linear-gradient(135deg, var(--atelier-primary), var(--atelier-primary-container));
|
||||
color: #FFFFFF;
|
||||
box-shadow: 0 16px 32px rgba(0, 110, 40, 0.22);
|
||||
font-size: 23px;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border: 1px solid rgba(27, 28, 28, 0.1);
|
||||
background: #FFFFFF;
|
||||
color: #5A5A5A;
|
||||
box-shadow: 0 10px 24px rgba(27, 28, 28, 0.08);
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
@@ -1874,25 +1892,13 @@ body {
|
||||
}
|
||||
|
||||
.document-shell {
|
||||
width: 100%;
|
||||
padding: 48px 28px 120px;
|
||||
}
|
||||
|
||||
.document-page-icon {
|
||||
height: 60px;
|
||||
}
|
||||
|
||||
.mnote-material-page-icon {
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
font-size: 48px;
|
||||
}
|
||||
|
||||
.mnote-material-page-icon::before {
|
||||
font-size: 48px;
|
||||
}
|
||||
|
||||
.document-shell-header h1 {
|
||||
font-size: 32px;
|
||||
line-height: 40px;
|
||||
}
|
||||
|
||||
#mnote-leptos-tiptap-island-editor-root .block-handle-shell {
|
||||
|
||||
Reference in New Issue
Block a user