mirror of
https://github.com/TriliumNext/Notes.git
synced 2025-07-29 02:52:27 +08:00
Add initial templates
This commit is contained in:
Zack Rauen
parent
d9e33270b0
commit
2ae6d4c5a4
132
src/templates/page.ejs
Normal file
132
src/templates/page.ejs
Normal file
@ -0,0 +1,132 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<% if (note.hasLabel("shareDescription")) { %>
|
||||
<meta name="description" content="<%= note.getLabelValue("shareDescription") %>">
|
||||
<% } %>
|
||||
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<% if (note.hasRelation("shareFavicon")) { %>
|
||||
<link rel="shortcut icon" href="api/notes/<%= note.getRelation("shareFavicon").value %>/download">
|
||||
<% } else { %>
|
||||
<link rel="shortcut icon" href="../favicon.ico">
|
||||
<% } %>
|
||||
<script src="../<%= appPath %>/share.js"></script>
|
||||
<% if (!note.hasLabel("shareOmitDefaultCss")) { %>
|
||||
<link href="../<%= assetPath %>/libraries/normalize.min.css" rel="stylesheet">
|
||||
<!--<link href="../<%= assetPath %>/stylesheets/share.css" rel="stylesheet">-->
|
||||
<% } %>
|
||||
<% if (note.hasLabel("shareSwagger")) { %>
|
||||
<link href="https://unpkg.com/swagger-ui-dist@4.5.0/swagger-ui.css" rel="stylesheet">
|
||||
<script src="https://unpkg.com/swagger-ui-dist@4.5.0/swagger-ui-bundle.js"></script>
|
||||
<script>
|
||||
document.addEventListener("DOMContentLoaded", function() {
|
||||
SwaggerUIBundle({
|
||||
url: `<%= note.getLabelValue("shareSwagger") %>`,
|
||||
domNode: "#content"
|
||||
});
|
||||
});
|
||||
</script>
|
||||
<% } %>
|
||||
<% if (note.type === 'text' || note.type === 'book') { %>
|
||||
<link href="../<%= assetPath %>/libraries/ckeditor/ckeditor-content.css" rel="stylesheet">
|
||||
<% } %>
|
||||
<% for (const cssRelation of note.getRelations("shareCss")) { %>
|
||||
<link href="api/notes/<%= cssRelation.value %>/download" rel="stylesheet">
|
||||
<% } %>
|
||||
<% for (const jsRelation of note.getRelations("shareJs")) { %>
|
||||
<script type="module" src="api/notes/<%= jsRelation.value %>/download"></script>
|
||||
<% } %>
|
||||
<% if (note.hasLabel('shareDisallowRobotIndexing')) { %>
|
||||
<meta name="robots" content="noindex,follow" />
|
||||
<% } %>
|
||||
<%- header %>
|
||||
<title><%= note.title %><% if (note.noteId !== subRoot.noteId) { %> - <%= subRoot.title %><% } %></title>
|
||||
</head>
|
||||
<%
|
||||
const currentTheme = note.getLabel("shareTheme") === "light" ? "light" : "dark";
|
||||
const themeClass = currentTheme === "light" ? " theme-light" : " theme-dark";
|
||||
%>
|
||||
<body data-note-id="<%= note.noteId %>" class="type-<%= note.type %><%= themeClass %>">
|
||||
<div id="mobile-header">
|
||||
<a href="./<%= subRoot.shareId %>">
|
||||
<% if (subRoot.hasRelation("shareLogo")) { %>
|
||||
<img src="api/notes/<%= subRoot.getRelation("shareLogo").value %>/download" alt="Logo" />
|
||||
<% } %>
|
||||
<%= subRoot.title %>
|
||||
</a>
|
||||
<button id="show-menu-button"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor"><path d="M4 6h16v2H4zm0 5h16v2H4zm0 5h16v2H4z"></path></svg></button>
|
||||
</div>
|
||||
<div id="split-pane">
|
||||
<div id="left-pane">
|
||||
<div id="navigation">
|
||||
<div id="site-header">
|
||||
<a href="./<%= subRoot.shareId %>">
|
||||
<% if (subRoot.hasRelation("shareLogo")) { %>
|
||||
<img src="api/notes/<%= subRoot.getRelation("shareLogo").value %>/download" alt="Logo" />
|
||||
<% } %>
|
||||
<%= subRoot.title %>
|
||||
</a>
|
||||
<div class="theme-selection">
|
||||
Site Theme
|
||||
<label class="switch">
|
||||
<input type="checkbox" checked="<%= currentTheme === "dark" %>">
|
||||
<span class="slider"></span>
|
||||
<svg class="dark-icon" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor"><path d="M20.742 13.045a8.088 8.088 0 0 1-2.077.271c-2.135 0-4.14-.83-5.646-2.336a8.025 8.025 0 0 1-2.064-7.723A1 1 0 0 0 9.73 2.034a10.014 10.014 0 0 0-4.489 2.582c-3.898 3.898-3.898 10.243 0 14.143a9.937 9.937 0 0 0 7.072 2.93 9.93 9.93 0 0 0 7.07-2.929 10.007 10.007 0 0 0 2.583-4.491 1.001 1.001 0 0 0-1.224-1.224zm-2.772 4.301a7.947 7.947 0 0 1-5.656 2.343 7.953 7.953 0 0 1-5.658-2.344c-3.118-3.119-3.118-8.195 0-11.314a7.923 7.923 0 0 1 2.06-1.483 10.027 10.027 0 0 0 2.89 7.848 9.972 9.972 0 0 0 7.848 2.891 8.036 8.036 0 0 1-1.484 2.059z"></path></svg>
|
||||
<svg class="light-icon" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor"><path d="M6.993 12c0 2.761 2.246 5.007 5.007 5.007s5.007-2.246 5.007-5.007S14.761 6.993 12 6.993 6.993 9.239 6.993 12zM12 8.993c1.658 0 3.007 1.349 3.007 3.007S13.658 15.007 12 15.007 8.993 13.658 8.993 12 10.342 8.993 12 8.993zM10.998 19h2v3h-2zm0-17h2v3h-2zm-9 9h3v2h-3zm17 0h3v2h-3zM4.219 18.363l2.12-2.122 1.415 1.414-2.12 2.122zM16.24 6.344l2.122-2.122 1.414 1.414-2.122 2.122zM6.342 7.759 4.22 5.637l1.415-1.414 2.12 2.122zm13.434 10.605-1.414 1.414-2.122-2.122 1.414-1.414z"></path></svg>
|
||||
</label>
|
||||
</div>
|
||||
<div class="search-item">
|
||||
<svg class="search-icon" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor"><path d="M10 18a7.952 7.952 0 0 0 4.897-1.688l4.396 4.396 1.414-1.414-4.396-4.396A7.952 7.952 0 0 0 18 10c0-4.411-3.589-8-8-8s-8 3.589-8 8 3.589 8 8 8zm0-14c3.309 0 6 2.691 6 6s-2.691 6-6 6-6-2.691-6-6 2.691-6 6-6z"></path></svg>
|
||||
<input type="text" class="search-input" placeholder="Search...">
|
||||
</div>
|
||||
</div>
|
||||
<% if (subRoot.hasVisibleChildren()) { %>
|
||||
<nav id="menu">
|
||||
<%- include('tree_item', {note: subRoot, activeNote: note, subRoot: subRoot}) %>
|
||||
</nav>
|
||||
<% } %>
|
||||
</div>
|
||||
</div>
|
||||
<div id="right-pane">
|
||||
<div id="main">
|
||||
|
||||
|
||||
<% if (note.hasLabel("pageUrl")) { %>
|
||||
<div id="noteClippedFrom">This note was originally clipped from <a href="<%= note.getLabelValue("pageUrl") %>"><%= note.getLabelValue("pageUrl") %></a></div>
|
||||
<% } %>
|
||||
|
||||
<% if (!isEmpty) { %>
|
||||
<div id="content" class="type-<%= note.type %><% if (note.type === 'text') { %> ck-content<% } %>">
|
||||
<h1 id="title"><%= note.title %></h1>
|
||||
<%- content %>
|
||||
</div>
|
||||
<% } %>
|
||||
|
||||
<% if (note.hasVisibleChildren()) { %>
|
||||
<nav id="childLinks" class="<% if (isEmpty) { %>grid<% } else { %>list<% } %>">
|
||||
<% if (!isEmpty) { %>
|
||||
<span>Subpages:</span>
|
||||
<% } %>
|
||||
|
||||
<ul>
|
||||
<% for (const childNote of note.getVisibleChildNotes()) { %>
|
||||
<li>
|
||||
<a href="<%= childNote.shareId %>"
|
||||
class="type-<%= childNote.type %>"><%= childNote.title %></a>
|
||||
</li>
|
||||
<% } %>
|
||||
</ul>
|
||||
</nav>
|
||||
<% } else if (isEmpty) { %>
|
||||
<div id="content" class="type-<%= note.type %><% if (note.type === 'text') { %> ck-content<% } %>">
|
||||
<h1 id="title"><%= note.title %></h1>
|
||||
<p>This note has no content.</p>
|
||||
</div>
|
||||
<% } %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
25
src/templates/tree_item.ejs
Normal file
25
src/templates/tree_item.ejs
Normal file
@ -0,0 +1,25 @@
|
||||
<%
|
||||
const linkClass = `type-${note.type}` + (activeNote.noteId === note.noteId ? " active" : "");
|
||||
const isExternalLink = note.hasLabel("shareExternal");
|
||||
const linkHref = isExternalLink ? note.getLabelValue("shareExternal") : `./${note.shareId}`;
|
||||
const target = isExternalLink ? ` target="_blank" rel="noopener noreferrer"` : "";
|
||||
%>
|
||||
|
||||
<% if (note.noteId !== subRoot.noteId) { %>
|
||||
<a class="<%= linkClass %>" href="<%= linkHref %>"<%= target %>>
|
||||
<% if (note.hasVisibleChildren()) { %><button class="collapse-button"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="svg-icon right-triangle"><path d="M3 8L12 17L21 8"></path></svg></button><% } %>
|
||||
<%= note.title %>
|
||||
</a>
|
||||
<% } %>
|
||||
|
||||
|
||||
<% if (note.hasVisibleChildren()) { %>
|
||||
<ul>
|
||||
<% note.getVisibleChildNotes().forEach(function (childNote) { %>
|
||||
<% const hasChildren = childNote.hasVisibleChildren(); %>
|
||||
<li class="<% if (hasChildren) { %>submenu-<% } %>item">
|
||||
<%- include('tree_item', {note: childNote, subRoot: subRoot}) %>
|
||||
</li>
|
||||
<% }) %>
|
||||
</ul>
|
||||
<% } %>
|
||||
Loading…
x
Reference in New Issue
Block a user