Integrate knowledge docs and admin updates
This commit is contained in:
dcconstructions
+263
@@ -802,6 +802,15 @@ body[data-admin-mode="seo"] .json-details {
|
||||
display: none;
|
||||
}
|
||||
|
||||
body[data-admin-mode="knowledge"] #block-form,
|
||||
body[data-admin-mode="knowledge"] #empty-state {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
body:not([data-admin-mode="knowledge"]) #knowledge-form {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.hidden {
|
||||
display: none !important;
|
||||
}
|
||||
@@ -1669,6 +1678,221 @@ select {
|
||||
line-height: 1.45;
|
||||
}
|
||||
|
||||
.knowledge-editor {
|
||||
display: grid;
|
||||
min-height: 0;
|
||||
overflow: auto;
|
||||
gap: 1rem;
|
||||
padding: 0 0.2rem 5rem;
|
||||
scrollbar-color: rgba(255, 255, 255, 0.25) transparent;
|
||||
}
|
||||
|
||||
.knowledge-tree {
|
||||
display: grid;
|
||||
gap: 0.28rem;
|
||||
padding-inline: 0.35rem;
|
||||
}
|
||||
|
||||
.knowledge-tree-item,
|
||||
.knowledge-tree-children {
|
||||
display: grid;
|
||||
gap: 0.22rem;
|
||||
}
|
||||
|
||||
.knowledge-tree-row {
|
||||
display: grid;
|
||||
grid-template-columns: minmax(0, 1fr) auto;
|
||||
min-height: 3.1rem;
|
||||
align-items: center;
|
||||
gap: 0.28rem;
|
||||
border-radius: var(--launcher-radius-circle);
|
||||
background: rgba(255, 255, 255, 0.035);
|
||||
padding: 0.24rem 0.34rem 0.24rem calc(0.34rem + (var(--depth, 0) * 0.82rem));
|
||||
opacity: 0.86;
|
||||
}
|
||||
|
||||
.knowledge-tree-row[data-active="true"] {
|
||||
background: rgba(255, 255, 255, 0.14);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.knowledge-tree-row[data-disabled="true"] {
|
||||
opacity: 0.42;
|
||||
}
|
||||
|
||||
.knowledge-tree-select {
|
||||
display: grid;
|
||||
grid-template-columns: 2.2rem minmax(0, 1fr);
|
||||
min-width: 0;
|
||||
min-height: 2.55rem;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
border-radius: var(--launcher-radius-circle);
|
||||
background: transparent;
|
||||
color: var(--text-secondary);
|
||||
padding: 0;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.knowledge-tree-icon {
|
||||
display: grid;
|
||||
width: 2.2rem;
|
||||
height: 2.2rem;
|
||||
place-items: center;
|
||||
border-radius: var(--launcher-radius-circle);
|
||||
background: rgba(255, 255, 255, 0.055);
|
||||
color: var(--text-muted);
|
||||
font-size: 0.72rem;
|
||||
font-weight: 850;
|
||||
}
|
||||
|
||||
.knowledge-tree-copy {
|
||||
display: grid;
|
||||
min-width: 0;
|
||||
gap: 0.1rem;
|
||||
}
|
||||
|
||||
.knowledge-tree-title,
|
||||
.knowledge-tree-meta {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.knowledge-tree-title {
|
||||
color: var(--text-primary);
|
||||
font-size: 0.82rem;
|
||||
font-weight: 850;
|
||||
}
|
||||
|
||||
.knowledge-tree-meta {
|
||||
color: var(--text-muted);
|
||||
font-size: 0.68rem;
|
||||
font-weight: 720;
|
||||
}
|
||||
|
||||
.knowledge-tree-actions {
|
||||
display: inline-flex;
|
||||
gap: 0.18rem;
|
||||
opacity: 0;
|
||||
transition: opacity 160ms ease;
|
||||
}
|
||||
|
||||
.knowledge-tree-row:hover .knowledge-tree-actions,
|
||||
.knowledge-tree-row[data-active="true"] .knowledge-tree-actions {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.knowledge-tree-action {
|
||||
display: grid;
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
place-items: center;
|
||||
border-radius: var(--launcher-radius-circle);
|
||||
background: rgba(255, 255, 255, 0.07);
|
||||
color: var(--text-secondary);
|
||||
padding: 0;
|
||||
font-size: 0.82rem;
|
||||
}
|
||||
|
||||
.knowledge-tree-action:hover {
|
||||
background: rgba(255, 255, 255, 0.14);
|
||||
color: var(--text-primary);
|
||||
}
|
||||
|
||||
.knowledge-tree-action .trash-can-icon {
|
||||
width: 0.92rem;
|
||||
height: 0.92rem;
|
||||
}
|
||||
|
||||
.knowledge-empty-tree {
|
||||
margin-inline: calc(var(--admin-nav-pad) + 0.35rem);
|
||||
}
|
||||
|
||||
.knowledge-rich-panel {
|
||||
gap: 0.8rem;
|
||||
}
|
||||
|
||||
.knowledge-rich-toolbar {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 0.35rem;
|
||||
}
|
||||
|
||||
.knowledge-rich-toolbar button {
|
||||
min-height: 2.15rem;
|
||||
border-radius: var(--launcher-radius-circle);
|
||||
background: rgba(255, 255, 255, 0.075);
|
||||
color: var(--text-secondary);
|
||||
padding: 0 0.72rem;
|
||||
font-size: 0.72rem;
|
||||
font-weight: 850;
|
||||
}
|
||||
|
||||
.knowledge-rich-toolbar button:hover {
|
||||
background: rgba(255, 255, 255, 0.14);
|
||||
color: var(--text-primary);
|
||||
}
|
||||
|
||||
.knowledge-rich-editor {
|
||||
min-height: 28rem;
|
||||
overflow: auto;
|
||||
border-radius: var(--launcher-radius-card);
|
||||
background: rgba(255, 255, 255, 0.04);
|
||||
color: var(--text-secondary);
|
||||
padding: 1.1rem;
|
||||
font-size: 1rem;
|
||||
line-height: 1.55;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.knowledge-rich-editor:focus {
|
||||
background: rgba(255, 255, 255, 0.06);
|
||||
}
|
||||
|
||||
.knowledge-rich-editor h2,
|
||||
.knowledge-rich-editor h3,
|
||||
.knowledge-rich-editor strong {
|
||||
color: var(--text-primary);
|
||||
}
|
||||
|
||||
.knowledge-rich-editor h2 {
|
||||
margin: 1.4rem 0 0.6rem;
|
||||
font-size: 1.85rem;
|
||||
line-height: 1.1;
|
||||
}
|
||||
|
||||
.knowledge-rich-editor h3 {
|
||||
margin: 1.2rem 0 0.55rem;
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
|
||||
.knowledge-rich-editor p {
|
||||
margin: 0 0 1rem;
|
||||
}
|
||||
|
||||
.knowledge-rich-editor img {
|
||||
display: block;
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
border-radius: 0.65rem;
|
||||
margin: 1rem 0;
|
||||
}
|
||||
|
||||
.knowledge-rich-editor .knowledge-button {
|
||||
display: inline-flex;
|
||||
min-height: 2.75rem;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 999px;
|
||||
background: rgba(255, 255, 255, 0.92);
|
||||
color: rgba(8, 8, 10, 0.96);
|
||||
padding: 0 1.25rem;
|
||||
font-size: 0.88rem;
|
||||
font-weight: 850;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.status {
|
||||
min-height: 1.25rem;
|
||||
margin: 0.8rem 0.35rem 0;
|
||||
@@ -2469,18 +2693,57 @@ select {
|
||||
width: min(28rem, calc(100vw - 2.8rem));
|
||||
}
|
||||
|
||||
.knowledge-button-modal-layer {
|
||||
z-index: 300;
|
||||
}
|
||||
|
||||
.knowledge-button-modal {
|
||||
width: min(34rem, calc(100vw - 2.8rem));
|
||||
}
|
||||
|
||||
.media-action-head {
|
||||
padding-right: 1.25rem;
|
||||
}
|
||||
|
||||
.knowledge-button-head {
|
||||
padding-right: 4.5rem;
|
||||
}
|
||||
|
||||
.media-action-body {
|
||||
padding: 0 1.25rem 1.25rem;
|
||||
}
|
||||
|
||||
.knowledge-button-body {
|
||||
display: grid;
|
||||
gap: 0.9rem;
|
||||
padding: 0 1.25rem 1.25rem;
|
||||
}
|
||||
|
||||
.knowledge-button-hint,
|
||||
.knowledge-button-error {
|
||||
margin: 0;
|
||||
font-size: 0.78rem;
|
||||
font-weight: 650;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
.knowledge-button-hint {
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
.knowledge-button-error {
|
||||
min-height: 1.1rem;
|
||||
color: rgba(255, 123, 108, 0.95);
|
||||
}
|
||||
|
||||
.media-action-foot {
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.knowledge-button-foot {
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.media-modal-foot {
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
+1083
-26
File diff suppressed because it is too large
Load Diff
+41
-2
@@ -27,6 +27,9 @@
|
||||
<button id="admin-mode-seo" class="nodedc-expanded-nav-button" type="button" data-active="false">
|
||||
<span>SEO</span>
|
||||
</button>
|
||||
<button id="admin-mode-knowledge" class="nodedc-expanded-nav-button" type="button" data-active="false">
|
||||
<span>База знаний</span>
|
||||
</button>
|
||||
</nav>
|
||||
</div>
|
||||
<div class="nodedc-expanded-toolbar-right">
|
||||
@@ -113,8 +116,9 @@
|
||||
<input id="block-template" name="template" type="text" autocomplete="off" readonly />
|
||||
</label>
|
||||
<label class="field-control">
|
||||
<span>Anchor</span>
|
||||
<input id="block-anchor" name="anchor" type="text" autocomplete="off" />
|
||||
<span>Target</span>
|
||||
<input id="block-anchor" name="target" type="text" autocomplete="off" list="block-target-options" />
|
||||
<datalist id="block-target-options"></datalist>
|
||||
</label>
|
||||
</div>
|
||||
</section>
|
||||
@@ -174,6 +178,8 @@
|
||||
</details>
|
||||
</form>
|
||||
|
||||
<div id="knowledge-form" class="knowledge-editor hidden"></div>
|
||||
|
||||
<pre id="status" class="status"></pre>
|
||||
</section>
|
||||
</main>
|
||||
@@ -300,6 +306,39 @@
|
||||
</footer>
|
||||
</article>
|
||||
</div>
|
||||
<div id="knowledge-button-modal" class="template-modal-layer knowledge-button-modal-layer hidden" role="dialog" aria-modal="true" aria-labelledby="knowledge-button-title">
|
||||
<article class="template-modal knowledge-button-modal">
|
||||
<header class="template-modal-head knowledge-button-head">
|
||||
<div>
|
||||
<div class="section-kicker">База знаний</div>
|
||||
<h2 id="knowledge-button-title">Кнопка в статье</h2>
|
||||
<p>Ссылка ведёт на лендинг или внешний адрес. Target открывает нужный блок лендинга.</p>
|
||||
</div>
|
||||
<button id="knowledge-button-close" class="admin-panel-close modal-close-button" type="button" aria-label="Закрыть">×</button>
|
||||
</header>
|
||||
<div class="knowledge-button-body">
|
||||
<label class="field-control">
|
||||
<span>Название</span>
|
||||
<input id="knowledge-button-name" type="text" autocomplete="off" placeholder="Посмотреть демо" />
|
||||
</label>
|
||||
<label class="field-control">
|
||||
<span>Ссылка</span>
|
||||
<input id="knowledge-button-link" type="text" autocomplete="off" placeholder="/" />
|
||||
</label>
|
||||
<label class="field-control">
|
||||
<span>Target / блок лендинга</span>
|
||||
<input id="knowledge-button-target" type="text" autocomplete="off" list="knowledge-button-target-options" placeholder="hub-video" />
|
||||
<datalist id="knowledge-button-target-options"></datalist>
|
||||
</label>
|
||||
<p class="knowledge-button-hint">Можно выбрать target из списка или ввести ID блока лендинга. Если target пустой, ссылка откроет первый экран.</p>
|
||||
<p id="knowledge-button-error" class="knowledge-button-error" aria-live="polite"></p>
|
||||
</div>
|
||||
<footer class="template-modal-foot knowledge-button-foot">
|
||||
<button id="knowledge-button-cancel" class="ghost-btn" type="button">Отмена</button>
|
||||
<button id="knowledge-button-confirm" class="primary-btn" type="button">Добавить кнопку</button>
|
||||
</footer>
|
||||
</article>
|
||||
</div>
|
||||
<script src="./admin.js" type="module"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user