Initial commit
This commit is contained in:
commit
0bafd71c73
4
.gitignore
vendored
Normal file
4
.gitignore
vendored
Normal file
|
|
@ -0,0 +1,4 @@
|
|||
vendor
|
||||
composer.lock
|
||||
config.inc.php
|
||||
docs
|
||||
20
composer.json
Normal file
20
composer.json
Normal file
|
|
@ -0,0 +1,20 @@
|
|||
{
|
||||
"name": "codespace/wiki",
|
||||
"description": "Simple documentation/wiki framework",
|
||||
"autoload": {
|
||||
"psr-4": {
|
||||
"CodeSpace\\Wiki\\": "src/"
|
||||
}
|
||||
},
|
||||
"scripts": {
|
||||
"dev" : [
|
||||
"Composer\\Config::disableProcessTimeout",
|
||||
"php -S localhost:8000 -t public"
|
||||
]
|
||||
},
|
||||
"require": {
|
||||
"erusev/parsedown": "^1.7",
|
||||
"erusev/parsedown-extra": "^0.8.1",
|
||||
"twig/twig": "^3.8"
|
||||
}
|
||||
}
|
||||
6
public/.htaccess
Normal file
6
public/.htaccess
Normal file
|
|
@ -0,0 +1,6 @@
|
|||
RewriteEngine On
|
||||
RewriteBase /
|
||||
|
||||
RewriteCond %{REQUEST_FILENAME} !-f
|
||||
RewriteCond %{REQUEST_FILENAME} !-d
|
||||
RewriteRule ^(.*)$ index.php?slug=$1 [L,QSA]
|
||||
132
public/assets/client.js
Normal file
132
public/assets/client.js
Normal file
|
|
@ -0,0 +1,132 @@
|
|||
function setup() {
|
||||
let content = document.querySelector(".content");
|
||||
content.addEventListener("click", () => {
|
||||
document.querySelector("#menu-toggle").checked = false;
|
||||
});
|
||||
}
|
||||
|
||||
function convertLinks() {
|
||||
let links = document.querySelectorAll("a");
|
||||
links.forEach(el => {
|
||||
el.removeEventListener("click", linkClick);
|
||||
el.addEventListener("click", linkClick);
|
||||
});
|
||||
}
|
||||
|
||||
async function linkClick(event) {
|
||||
let a = event.currentTarget;
|
||||
if (a.origin == location.origin) {
|
||||
if (a.hash != "" && a.pathname == location.pathname) return;
|
||||
event.preventDefault();
|
||||
changePage(a.href);
|
||||
} else {
|
||||
a.target = "_blank";
|
||||
}
|
||||
}
|
||||
|
||||
async function changePage(url, addHistory = true) {
|
||||
document.querySelector(".content").classList.add("hidden");
|
||||
let page = await downloadPage(url);
|
||||
let data = parsePage(page);
|
||||
if (data) {
|
||||
updatePage(url, data, addHistory);
|
||||
}
|
||||
}
|
||||
|
||||
function updatePage(url, d, addHistory) {
|
||||
document.title = d.title;
|
||||
if (addHistory) history.pushState({}, d.title, url);
|
||||
if (d.sidebar.classList.contains("hidden")) {
|
||||
document.querySelector(".sidebar").classList.add("hidden");
|
||||
}
|
||||
updateHTML("nav .right ul", d.links);
|
||||
setTimeout(() => {
|
||||
updateHTML(".sidebar", d.sidebar);
|
||||
document.querySelector(".markdown-body").innerHTML = d.content.innerHTML;
|
||||
convertLinks();
|
||||
document.querySelector("head").innerHTML = d.head.innerHTML;
|
||||
document.querySelector("html").scrollTo(0, 0);
|
||||
document.querySelector(".content").classList.remove("hidden");
|
||||
}, 300);
|
||||
}
|
||||
|
||||
function parsePage(html) {
|
||||
let parser = new DOMParser().parseFromString(html ?? "", "text/html");
|
||||
let content = parser.querySelector(".markdown-body");
|
||||
let links = parser.querySelector("nav .right ul");
|
||||
let sidebar = parser.querySelector(".sidebar");
|
||||
let head = parser.querySelector("head");
|
||||
if (!content || !links || !sidebar || !head) return null;
|
||||
let titleEl = head.querySelector("title");
|
||||
let title = titleEl ? titleEl.innerText : "";
|
||||
return {title, content, links, sidebar, head};
|
||||
}
|
||||
|
||||
async function downloadPage(url) {
|
||||
return new Promise(function(resolve, reject) {
|
||||
var xhr = new XMLHttpRequest();
|
||||
xhr.onreadystatechange = function() {
|
||||
if (this.readyState !== 4) return;
|
||||
if (!this.responseText) reject(this);
|
||||
try {
|
||||
resolve(this.responseText);
|
||||
} catch(e) {
|
||||
reject();
|
||||
}
|
||||
};
|
||||
xhr.open("GET", url, true);
|
||||
xhr.send();
|
||||
});
|
||||
}
|
||||
|
||||
function updateHTML(selector, newEl) {
|
||||
|
||||
let origEl = document.querySelector(selector);
|
||||
if (!origEl) return;
|
||||
|
||||
function updateElement(el, newEl) {
|
||||
|
||||
// Replace element if it has different tagName
|
||||
if (el.tagName != newEl.tagName) {
|
||||
el.replaceWith(newEl);
|
||||
return;
|
||||
}
|
||||
// Change element's innerHTML, if there is different children count or there is non-empty text node
|
||||
if (el.children.length != newEl.children.length || getTextNodeCount(newEl.childNodes) || getTextNodeCount(el.childNodes)) {
|
||||
el.innerHTML = newEl.innerHTML;
|
||||
return;
|
||||
}
|
||||
// Add all attributes of the new element
|
||||
for (const { name, value } of newEl.attributes) {
|
||||
el.setAttribute(name, value);
|
||||
}
|
||||
// Remove no longer present attributes
|
||||
for (const { name } of el.attributes) {
|
||||
if (!newEl.getAttribute(name)) el.removeAttribute(name);
|
||||
}
|
||||
// Update all childrens
|
||||
for (let i=0; i<el.children.length; i++) {
|
||||
updateElement(el.children[i], newEl.children[i]);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
updateElement(origEl, newEl);
|
||||
|
||||
}
|
||||
|
||||
function getTextNodeCount(nodes) {
|
||||
return [...nodes].map(
|
||||
e => (e.nodeType == 3 && e.textContent != undefined && e.textContent.trim() != "") ? 1 : 0
|
||||
).reduce((p, c) => p + c, 0);
|
||||
}
|
||||
|
||||
window.addEventListener("popstate", e => {
|
||||
if (e.state === null) return;
|
||||
changePage(window.location.href, false);
|
||||
});
|
||||
|
||||
window.addEventListener("load", () => {
|
||||
convertLinks();
|
||||
setup();
|
||||
});
|
||||
983
public/assets/markdown.css
Normal file
983
public/assets/markdown.css
Normal file
|
|
@ -0,0 +1,983 @@
|
|||
.markdown-body .octicon {
|
||||
display: inline-block;
|
||||
fill: currentColor;
|
||||
vertical-align: text-bottom;
|
||||
}
|
||||
|
||||
.markdown-body .anchor {
|
||||
float: left;
|
||||
line-height: 1;
|
||||
margin-left: -20px;
|
||||
padding-right: 4px;
|
||||
}
|
||||
|
||||
.markdown-body .anchor:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.markdown-body h1 .octicon-link,
|
||||
.markdown-body h2 .octicon-link,
|
||||
.markdown-body h3 .octicon-link,
|
||||
.markdown-body h4 .octicon-link,
|
||||
.markdown-body h5 .octicon-link,
|
||||
.markdown-body h6 .octicon-link {
|
||||
color: #1b1f23;
|
||||
vertical-align: middle;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.markdown-body h1:hover .anchor,
|
||||
.markdown-body h2:hover .anchor,
|
||||
.markdown-body h3:hover .anchor,
|
||||
.markdown-body h4:hover .anchor,
|
||||
.markdown-body h5:hover .anchor,
|
||||
.markdown-body h6:hover .anchor {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.markdown-body h1:hover .anchor .octicon-link,
|
||||
.markdown-body h2:hover .anchor .octicon-link,
|
||||
.markdown-body h3:hover .anchor .octicon-link,
|
||||
.markdown-body h4:hover .anchor .octicon-link,
|
||||
.markdown-body h5:hover .anchor .octicon-link,
|
||||
.markdown-body h6:hover .anchor .octicon-link {
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
.markdown-body h1:hover .anchor .octicon-link:before,
|
||||
.markdown-body h2:hover .anchor .octicon-link:before,
|
||||
.markdown-body h3:hover .anchor .octicon-link:before,
|
||||
.markdown-body h4:hover .anchor .octicon-link:before,
|
||||
.markdown-body h5:hover .anchor .octicon-link:before,
|
||||
.markdown-body h6:hover .anchor .octicon-link:before {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
content: ' ';
|
||||
display: inline-block;
|
||||
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' version='1.1' width='16' height='16' aria-hidden='true'%3E%3Cpath fill-rule='evenodd' d='M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z'%3E%3C/path%3E%3C/svg%3E");
|
||||
}.markdown-body {
|
||||
-ms-text-size-adjust: 100%;
|
||||
-webkit-text-size-adjust: 100%;
|
||||
line-height: 1.5;
|
||||
color: #24292e;
|
||||
font-size: 16px;
|
||||
line-height: 1.5;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
.markdown-body details {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.markdown-body summary {
|
||||
display: list-item;
|
||||
}
|
||||
|
||||
.markdown-body a {
|
||||
background-color: initial;
|
||||
}
|
||||
|
||||
.markdown-body a:active,
|
||||
.markdown-body a:hover {
|
||||
outline-width: 0;
|
||||
}
|
||||
|
||||
.markdown-body strong {
|
||||
font-weight: inherit;
|
||||
font-weight: bolder;
|
||||
}
|
||||
|
||||
.markdown-body h1 {
|
||||
font-size: 2em;
|
||||
margin: .67em 0;
|
||||
}
|
||||
|
||||
.markdown-body img {
|
||||
border-style: none;
|
||||
}
|
||||
|
||||
.markdown-body code,
|
||||
.markdown-body kbd,
|
||||
.markdown-body pre {
|
||||
font-family: monospace,monospace;
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
.markdown-body hr {
|
||||
box-sizing: initial;
|
||||
height: 0;
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
.markdown-body input {
|
||||
font: inherit;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.markdown-body input {
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
.markdown-body [type=checkbox] {
|
||||
box-sizing: border-box;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.markdown-body * {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.markdown-body input {
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
line-height: inherit;
|
||||
}
|
||||
|
||||
.markdown-body a {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.markdown-body a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.markdown-body strong {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.markdown-body hr {
|
||||
height: 0;
|
||||
margin: 15px 0;
|
||||
overflow: hidden;
|
||||
background: transparent;
|
||||
border: 0;
|
||||
border-bottom: 1px solid #dfe2e5;
|
||||
}
|
||||
|
||||
.markdown-body hr:after,
|
||||
.markdown-body hr:before {
|
||||
display: table;
|
||||
content: "";
|
||||
}
|
||||
|
||||
.markdown-body hr:after {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.markdown-body table {
|
||||
border-spacing: 0;
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
.markdown-body td,
|
||||
.markdown-body th {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.markdown-body details summary {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.markdown-body kbd {
|
||||
display: inline-block;
|
||||
padding: 3px 5px;
|
||||
font: 11px SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;
|
||||
line-height: 10px;
|
||||
color: #444d56;
|
||||
vertical-align: middle;
|
||||
background-color: #fafbfc;
|
||||
border: 1px solid #d1d5da;
|
||||
border-radius: 3px;
|
||||
box-shadow: inset 0 -1px 0 #d1d5da;
|
||||
}
|
||||
|
||||
.markdown-body h1,
|
||||
.markdown-body h2,
|
||||
.markdown-body h3,
|
||||
.markdown-body h4,
|
||||
.markdown-body h5,
|
||||
.markdown-body h6 {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.markdown-body h1 {
|
||||
font-size: 32px;
|
||||
}
|
||||
|
||||
.markdown-body h1,
|
||||
.markdown-body h2 {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.markdown-body h2 {
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
.markdown-body h3 {
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.markdown-body h3,
|
||||
.markdown-body h4 {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.markdown-body h4 {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.markdown-body h5 {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.markdown-body h5,
|
||||
.markdown-body h6 {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.markdown-body h6 {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.markdown-body p {
|
||||
margin-top: 0;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.markdown-body blockquote {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.markdown-body ol,
|
||||
.markdown-body ul {
|
||||
padding-left: 0;
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.markdown-body ol ol,
|
||||
.markdown-body ul ol {
|
||||
list-style-type: lower-roman;
|
||||
}
|
||||
|
||||
.markdown-body ol ol ol,
|
||||
.markdown-body ol ul ol,
|
||||
.markdown-body ul ol ol,
|
||||
.markdown-body ul ul ol {
|
||||
list-style-type: lower-alpha;
|
||||
}
|
||||
|
||||
.markdown-body dd {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.markdown-body code,
|
||||
.markdown-body pre {
|
||||
font-family: SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.markdown-body pre {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.markdown-body input::-webkit-inner-spin-button,
|
||||
.markdown-body input::-webkit-outer-spin-button {
|
||||
margin: 0;
|
||||
-webkit-appearance: none;
|
||||
appearance: none;
|
||||
}
|
||||
|
||||
.markdown-body :checked+.radio-label {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
border-color: #0366d6;
|
||||
}
|
||||
|
||||
.markdown-body .border {
|
||||
border: 1px solid #e1e4e8!important;
|
||||
}
|
||||
|
||||
.markdown-body .border-0 {
|
||||
border: 0!important;
|
||||
}
|
||||
|
||||
.markdown-body .border-bottom {
|
||||
border-bottom: 1px solid #e1e4e8!important;
|
||||
}
|
||||
|
||||
.markdown-body .rounded-1 {
|
||||
border-radius: 3px!important;
|
||||
}
|
||||
|
||||
.markdown-body .bg-white {
|
||||
background-color: #fff!important;
|
||||
}
|
||||
|
||||
.markdown-body .bg-gray-light {
|
||||
background-color: #fafbfc!important;
|
||||
}
|
||||
|
||||
.markdown-body .text-gray-light {
|
||||
color: #6a737d!important;
|
||||
}
|
||||
|
||||
.markdown-body .mb-0 {
|
||||
margin-bottom: 0!important;
|
||||
}
|
||||
|
||||
.markdown-body .my-2 {
|
||||
margin-top: 8px!important;
|
||||
margin-bottom: 8px!important;
|
||||
}
|
||||
|
||||
.markdown-body .pl-0 {
|
||||
padding-left: 0!important;
|
||||
}
|
||||
|
||||
.markdown-body .py-0 {
|
||||
padding-top: 0!important;
|
||||
padding-bottom: 0!important;
|
||||
}
|
||||
|
||||
.markdown-body .pl-1 {
|
||||
padding-left: 4px!important;
|
||||
}
|
||||
|
||||
.markdown-body .pl-2 {
|
||||
padding-left: 8px!important;
|
||||
}
|
||||
|
||||
.markdown-body .py-2 {
|
||||
padding-top: 8px!important;
|
||||
padding-bottom: 8px!important;
|
||||
}
|
||||
|
||||
.markdown-body .pl-3,
|
||||
.markdown-body .px-3 {
|
||||
padding-left: 16px!important;
|
||||
}
|
||||
|
||||
.markdown-body .px-3 {
|
||||
padding-right: 16px!important;
|
||||
}
|
||||
|
||||
.markdown-body .pl-4 {
|
||||
padding-left: 24px!important;
|
||||
}
|
||||
|
||||
.markdown-body .pl-5 {
|
||||
padding-left: 32px!important;
|
||||
}
|
||||
|
||||
.markdown-body .pl-6 {
|
||||
padding-left: 40px!important;
|
||||
}
|
||||
|
||||
.markdown-body .f6 {
|
||||
font-size: 12px!important;
|
||||
}
|
||||
|
||||
.markdown-body .lh-condensed {
|
||||
line-height: 1.25!important;
|
||||
}
|
||||
|
||||
.markdown-body .text-bold {
|
||||
font-weight: 600!important;
|
||||
}
|
||||
|
||||
.markdown-body .pl-c {
|
||||
color: #6a737d;
|
||||
}
|
||||
|
||||
.markdown-body .pl-c1,
|
||||
.markdown-body .pl-s .pl-v {
|
||||
color: #005cc5;
|
||||
}
|
||||
|
||||
.markdown-body .pl-e,
|
||||
.markdown-body .pl-en {
|
||||
color: #6f42c1;
|
||||
}
|
||||
|
||||
.markdown-body .pl-s .pl-s1,
|
||||
.markdown-body .pl-smi {
|
||||
color: #24292e;
|
||||
}
|
||||
|
||||
.markdown-body .pl-ent {
|
||||
color: #22863a;
|
||||
}
|
||||
|
||||
.markdown-body .pl-k {
|
||||
color: #d73a49;
|
||||
}
|
||||
|
||||
.markdown-body .pl-pds,
|
||||
.markdown-body .pl-s,
|
||||
.markdown-body .pl-s .pl-pse .pl-s1,
|
||||
.markdown-body .pl-sr,
|
||||
.markdown-body .pl-sr .pl-cce,
|
||||
.markdown-body .pl-sr .pl-sra,
|
||||
.markdown-body .pl-sr .pl-sre {
|
||||
color: #032f62;
|
||||
}
|
||||
|
||||
.markdown-body .pl-smw,
|
||||
.markdown-body .pl-v {
|
||||
color: #e36209;
|
||||
}
|
||||
|
||||
.markdown-body .pl-bu {
|
||||
color: #b31d28;
|
||||
}
|
||||
|
||||
.markdown-body .pl-ii {
|
||||
color: #fafbfc;
|
||||
background-color: #b31d28;
|
||||
}
|
||||
|
||||
.markdown-body .pl-c2 {
|
||||
color: #fafbfc;
|
||||
background-color: #d73a49;
|
||||
}
|
||||
|
||||
.markdown-body .pl-c2:before {
|
||||
content: "^M";
|
||||
}
|
||||
|
||||
.markdown-body .pl-sr .pl-cce {
|
||||
font-weight: 700;
|
||||
color: #22863a;
|
||||
}
|
||||
|
||||
.markdown-body .pl-ml {
|
||||
color: #735c0f;
|
||||
}
|
||||
|
||||
.markdown-body .pl-mh,
|
||||
.markdown-body .pl-mh .pl-en,
|
||||
.markdown-body .pl-ms {
|
||||
font-weight: 700;
|
||||
color: #005cc5;
|
||||
}
|
||||
|
||||
.markdown-body .pl-mi {
|
||||
font-style: italic;
|
||||
color: #24292e;
|
||||
}
|
||||
|
||||
.markdown-body .pl-mb {
|
||||
font-weight: 700;
|
||||
color: #24292e;
|
||||
}
|
||||
|
||||
.markdown-body .pl-md {
|
||||
color: #b31d28;
|
||||
background-color: #ffeef0;
|
||||
}
|
||||
|
||||
.markdown-body .pl-mi1 {
|
||||
color: #22863a;
|
||||
background-color: #f0fff4;
|
||||
}
|
||||
|
||||
.markdown-body .pl-mc {
|
||||
color: #e36209;
|
||||
background-color: #ffebda;
|
||||
}
|
||||
|
||||
.markdown-body .pl-mi2 {
|
||||
color: #f6f8fa;
|
||||
background-color: #005cc5;
|
||||
}
|
||||
|
||||
.markdown-body .pl-mdr {
|
||||
font-weight: 700;
|
||||
color: #6f42c1;
|
||||
}
|
||||
|
||||
.markdown-body .pl-ba {
|
||||
color: #586069;
|
||||
}
|
||||
|
||||
.markdown-body .pl-sg {
|
||||
color: #959da5;
|
||||
}
|
||||
|
||||
.markdown-body .pl-corl {
|
||||
text-decoration: underline;
|
||||
color: #032f62;
|
||||
}
|
||||
|
||||
.markdown-body .mb-0 {
|
||||
margin-bottom: 0!important;
|
||||
}
|
||||
|
||||
.markdown-body .my-2 {
|
||||
margin-bottom: 8px!important;
|
||||
}
|
||||
|
||||
.markdown-body .my-2 {
|
||||
margin-top: 8px!important;
|
||||
}
|
||||
|
||||
.markdown-body .pl-0 {
|
||||
padding-left: 0!important;
|
||||
}
|
||||
|
||||
.markdown-body .py-0 {
|
||||
padding-top: 0!important;
|
||||
padding-bottom: 0!important;
|
||||
}
|
||||
|
||||
.markdown-body .pl-1 {
|
||||
padding-left: 4px!important;
|
||||
}
|
||||
|
||||
.markdown-body .pl-2 {
|
||||
padding-left: 8px!important;
|
||||
}
|
||||
|
||||
.markdown-body .py-2 {
|
||||
padding-top: 8px!important;
|
||||
padding-bottom: 8px!important;
|
||||
}
|
||||
|
||||
.markdown-body .pl-3 {
|
||||
padding-left: 16px!important;
|
||||
}
|
||||
|
||||
.markdown-body .pl-4 {
|
||||
padding-left: 24px!important;
|
||||
}
|
||||
|
||||
.markdown-body .pl-5 {
|
||||
padding-left: 32px!important;
|
||||
}
|
||||
|
||||
.markdown-body .pl-6 {
|
||||
padding-left: 40px!important;
|
||||
}
|
||||
|
||||
.markdown-body .pl-7 {
|
||||
padding-left: 48px!important;
|
||||
}
|
||||
|
||||
.markdown-body .pl-8 {
|
||||
padding-left: 64px!important;
|
||||
}
|
||||
|
||||
.markdown-body .pl-9 {
|
||||
padding-left: 80px!important;
|
||||
}
|
||||
|
||||
.markdown-body .pl-10 {
|
||||
padding-left: 96px!important;
|
||||
}
|
||||
|
||||
.markdown-body .pl-11 {
|
||||
padding-left: 112px!important;
|
||||
}
|
||||
|
||||
.markdown-body .pl-12 {
|
||||
padding-left: 128px!important;
|
||||
}
|
||||
|
||||
.markdown-body hr {
|
||||
border-bottom-color: #eee;
|
||||
}
|
||||
|
||||
.markdown-body kbd {
|
||||
display: inline-block;
|
||||
padding: 3px 5px;
|
||||
font: 11px SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;
|
||||
line-height: 10px;
|
||||
color: #444d56;
|
||||
vertical-align: middle;
|
||||
background-color: #fafbfc;
|
||||
border: 1px solid #d1d5da;
|
||||
border-radius: 3px;
|
||||
box-shadow: inset 0 -1px 0 #d1d5da;
|
||||
}
|
||||
|
||||
.markdown-body:after,
|
||||
.markdown-body:before {
|
||||
display: table;
|
||||
content: "";
|
||||
}
|
||||
|
||||
.markdown-body:after {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.markdown-body>:first-child {
|
||||
margin-top: 0!important;
|
||||
}
|
||||
|
||||
.markdown-body>:last-child {
|
||||
margin-bottom: 0!important;
|
||||
}
|
||||
|
||||
.markdown-body a:not([href]) {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.markdown-body blockquote,
|
||||
.markdown-body details,
|
||||
.markdown-body dl,
|
||||
.markdown-body ol,
|
||||
.markdown-body p,
|
||||
.markdown-body pre,
|
||||
.markdown-body table,
|
||||
.markdown-body ul {
|
||||
margin-top: 0;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.markdown-body hr {
|
||||
height: .25em;
|
||||
padding: 0;
|
||||
margin: 24px 0;
|
||||
background-color: #e1e4e8;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.markdown-body blockquote {
|
||||
padding: 0 1em;
|
||||
color: #6a737d;
|
||||
border-left: .25em solid #dfe2e5;
|
||||
}
|
||||
|
||||
.markdown-body blockquote>:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.markdown-body blockquote>:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.markdown-body h1,
|
||||
.markdown-body h2,
|
||||
.markdown-body h3,
|
||||
.markdown-body h4,
|
||||
.markdown-body h5,
|
||||
.markdown-body h6 {
|
||||
margin-top: 24px;
|
||||
margin-bottom: 16px;
|
||||
font-weight: 600;
|
||||
line-height: 1.25;
|
||||
}
|
||||
|
||||
.markdown-body h1 {
|
||||
font-size: 2em;
|
||||
}
|
||||
|
||||
.markdown-body h1,
|
||||
.markdown-body h2 {
|
||||
padding-bottom: .3em;
|
||||
border-bottom: 1px solid #eaecef;
|
||||
}
|
||||
|
||||
.markdown-body h2 {
|
||||
font-size: 1.5em;
|
||||
}
|
||||
|
||||
.markdown-body h3 {
|
||||
font-size: 1.25em;
|
||||
}
|
||||
|
||||
.markdown-body h4 {
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
.markdown-body h5 {
|
||||
font-size: .875em;
|
||||
}
|
||||
|
||||
.markdown-body h6 {
|
||||
font-size: .85em;
|
||||
color: #6a737d;
|
||||
}
|
||||
|
||||
.markdown-body ol,
|
||||
.markdown-body ul {
|
||||
padding-left: 2em;
|
||||
}
|
||||
|
||||
.markdown-body ol ol,
|
||||
.markdown-body ol ul,
|
||||
.markdown-body ul ol,
|
||||
.markdown-body ul ul {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.markdown-body li {
|
||||
word-wrap: break-all;
|
||||
}
|
||||
|
||||
.markdown-body li>p {
|
||||
margin-top: 16px;
|
||||
}
|
||||
|
||||
.markdown-body li+li {
|
||||
margin-top: .25em;
|
||||
}
|
||||
|
||||
.markdown-body dl {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.markdown-body dl dt {
|
||||
padding: 0;
|
||||
margin-top: 16px;
|
||||
font-size: 1em;
|
||||
font-style: italic;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.markdown-body dl dd {
|
||||
padding: 0 16px;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.markdown-body table {
|
||||
display: block;
|
||||
width: 100%;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.markdown-body table th {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.markdown-body table td,
|
||||
.markdown-body table th {
|
||||
padding: 6px 13px;
|
||||
border: 1px solid #dfe2e5;
|
||||
}
|
||||
|
||||
.markdown-body table tr {
|
||||
background-color: #fff;
|
||||
border-top: 1px solid #c6cbd1;
|
||||
}
|
||||
|
||||
.markdown-body table tr:nth-child(2n) {
|
||||
background-color: #f6f8fa;
|
||||
}
|
||||
|
||||
.markdown-body img {
|
||||
max-width: 100%;
|
||||
box-sizing: initial;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.markdown-body img[align=right] {
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
.markdown-body img[align=left] {
|
||||
padding-right: 20px;
|
||||
}
|
||||
|
||||
.markdown-body code {
|
||||
padding: .2em .4em;
|
||||
margin: 0;
|
||||
font-size: 85%;
|
||||
background-color: rgba(27,31,35,.05);
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.markdown-body pre {
|
||||
word-wrap: normal;
|
||||
}
|
||||
|
||||
.markdown-body pre>code {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
font-size: 100%;
|
||||
word-break: normal;
|
||||
white-space: pre;
|
||||
background: transparent;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.markdown-body .highlight {
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.markdown-body .highlight pre {
|
||||
margin-bottom: 0;
|
||||
word-break: normal;
|
||||
}
|
||||
|
||||
.markdown-body .highlight pre,
|
||||
.markdown-body pre {
|
||||
padding: 16px;
|
||||
overflow: auto;
|
||||
font-size: 85%;
|
||||
line-height: 1.45;
|
||||
background-color: #f6f8fa;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.markdown-body pre code {
|
||||
display: inline;
|
||||
max-width: auto;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
overflow: visible;
|
||||
line-height: inherit;
|
||||
word-wrap: normal;
|
||||
background-color: initial;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.markdown-body .commit-tease-sha {
|
||||
display: inline-block;
|
||||
font-family: SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;
|
||||
font-size: 90%;
|
||||
color: #444d56;
|
||||
}
|
||||
|
||||
.markdown-body .full-commit .btn-outline:not(:disabled):hover {
|
||||
color: #005cc5;
|
||||
border-color: #005cc5;
|
||||
}
|
||||
|
||||
.markdown-body .blob-wrapper {
|
||||
overflow-x: auto;
|
||||
overflow-y: hidden;
|
||||
}
|
||||
|
||||
.markdown-body .blob-wrapper-embedded {
|
||||
max-height: 240px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.markdown-body .blob-num {
|
||||
width: 1%;
|
||||
min-width: 50px;
|
||||
padding-right: 10px;
|
||||
padding-left: 10px;
|
||||
font-family: SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;
|
||||
font-size: 12px;
|
||||
line-height: 20px;
|
||||
color: rgba(27,31,35,.3);
|
||||
text-align: right;
|
||||
white-space: nowrap;
|
||||
vertical-align: top;
|
||||
cursor: pointer;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.markdown-body .blob-num:hover {
|
||||
color: rgba(27,31,35,.6);
|
||||
}
|
||||
|
||||
.markdown-body .blob-num:before {
|
||||
content: attr(data-line-number);
|
||||
}
|
||||
|
||||
.markdown-body .blob-code {
|
||||
position: relative;
|
||||
padding-right: 10px;
|
||||
padding-left: 10px;
|
||||
line-height: 20px;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.markdown-body .blob-code-inner {
|
||||
overflow: visible;
|
||||
font-family: SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;
|
||||
font-size: 12px;
|
||||
color: #24292e;
|
||||
word-wrap: normal;
|
||||
white-space: pre;
|
||||
}
|
||||
|
||||
.markdown-body .pl-token.active,
|
||||
.markdown-body .pl-token:hover {
|
||||
cursor: pointer;
|
||||
background: #ffea7f;
|
||||
}
|
||||
|
||||
.markdown-body .tab-size[data-tab-size="1"] {
|
||||
-moz-tab-size: 1;
|
||||
tab-size: 1;
|
||||
}
|
||||
|
||||
.markdown-body .tab-size[data-tab-size="2"] {
|
||||
-moz-tab-size: 2;
|
||||
tab-size: 2;
|
||||
}
|
||||
|
||||
.markdown-body .tab-size[data-tab-size="3"] {
|
||||
-moz-tab-size: 3;
|
||||
tab-size: 3;
|
||||
}
|
||||
|
||||
.markdown-body .tab-size[data-tab-size="4"] {
|
||||
-moz-tab-size: 4;
|
||||
tab-size: 4;
|
||||
}
|
||||
|
||||
.markdown-body .tab-size[data-tab-size="5"] {
|
||||
-moz-tab-size: 5;
|
||||
tab-size: 5;
|
||||
}
|
||||
|
||||
.markdown-body .tab-size[data-tab-size="6"] {
|
||||
-moz-tab-size: 6;
|
||||
tab-size: 6;
|
||||
}
|
||||
|
||||
.markdown-body .tab-size[data-tab-size="7"] {
|
||||
-moz-tab-size: 7;
|
||||
tab-size: 7;
|
||||
}
|
||||
|
||||
.markdown-body .tab-size[data-tab-size="8"] {
|
||||
-moz-tab-size: 8;
|
||||
tab-size: 8;
|
||||
}
|
||||
|
||||
.markdown-body .tab-size[data-tab-size="9"] {
|
||||
-moz-tab-size: 9;
|
||||
tab-size: 9;
|
||||
}
|
||||
|
||||
.markdown-body .tab-size[data-tab-size="10"] {
|
||||
-moz-tab-size: 10;
|
||||
tab-size: 10;
|
||||
}
|
||||
|
||||
.markdown-body .tab-size[data-tab-size="11"] {
|
||||
-moz-tab-size: 11;
|
||||
tab-size: 11;
|
||||
}
|
||||
|
||||
.markdown-body .tab-size[data-tab-size="12"] {
|
||||
-moz-tab-size: 12;
|
||||
tab-size: 12;
|
||||
}
|
||||
|
||||
.markdown-body .task-list-item {
|
||||
list-style-type: none;
|
||||
}
|
||||
|
||||
.markdown-body .task-list-item+.task-list-item {
|
||||
margin-top: 3px;
|
||||
}
|
||||
|
||||
.markdown-body .task-list-item input {
|
||||
margin: 0 .2em .25em -1.6em;
|
||||
vertical-align: middle;
|
||||
}
|
||||
157
public/assets/style.css
Normal file
157
public/assets/style.css
Normal file
|
|
@ -0,0 +1,157 @@
|
|||
:root {
|
||||
|
||||
--c-bg: #fff;
|
||||
--c-bg-alt: #eee;
|
||||
|
||||
--c-text: #3b434b;
|
||||
--c-text-2: #515961;
|
||||
--c-title: #131518;
|
||||
|
||||
--c-brand: #cf1f5c;
|
||||
--c-brand-alt: #b6154d;
|
||||
|
||||
--c-border: #eaecef;
|
||||
--c-border-dark: #a9acb1;
|
||||
|
||||
--c-table-row: #fff;
|
||||
--c-table-row-alt: #f6f8fa;
|
||||
|
||||
--c-sidebar-bg: transparent;
|
||||
|
||||
}
|
||||
|
||||
|
||||
* {box-sizing: border-box; -webkit-tap-highlight-color: transparent;}
|
||||
|
||||
html, body {overflow-x: hidden;}
|
||||
body {color: var(--c-text); background: var(--c-bg); font-family: Cantarell, Segoe UI, Helvetica, Arial, Open Sans, sans-serif; font-size: 16px; margin: 0; line-height: 1.5;}
|
||||
|
||||
a {color: var(--c-brand); text-decoration: none;}
|
||||
a:hover {color: var(--c-brand-alt);}
|
||||
|
||||
/* Navbar */
|
||||
|
||||
nav {position: fixed; top: 0; left: 0; width: 100%; padding: 16px 20px; z-index: 11; background: var(--c-bg); display: flex; flex-wrap: wrap; flex-direction: row; justify-content: space-between; border-bottom: 1px solid var(--c-border); height: 60px;}
|
||||
nav * {line-height: 1;}
|
||||
nav .left, nav .right {display: flex; align-items: center; align-content: center; gap: 13px}
|
||||
|
||||
nav .icon {height: 24px; width: 24px; color: var(--c-brand); cursor: pointer; margin-top: 1px;}
|
||||
nav .menu {margin-right: 5px; display: none;}
|
||||
|
||||
.logo {display: flex; align-items: center; font-weight: 700; font-size: 21.5px; line-height: 1; gap: 15px; color: var(--c-title);}
|
||||
.logo:hover {color: var(--c-text);}
|
||||
.logo img {height: 24px;}
|
||||
|
||||
nav ul {list-style: none; display: flex; margin: 0; padding: 0; gap: 15px;}
|
||||
nav ul a {color: var(--c-text);}
|
||||
nav ul li.active a {font-weight: 700; color: var(--c-brand-alt);}
|
||||
|
||||
@media screen and (max-width: 900px) {
|
||||
nav ul {display: none;}
|
||||
}
|
||||
|
||||
/* Wrapper */
|
||||
|
||||
.wrapper {overflow: hidden;}
|
||||
|
||||
/* Sidebar */
|
||||
|
||||
.sidebar {transition: all .3s; position: fixed; top: 0; left: 0; width: 260px; height: 100%; z-index: 10; padding-top: 60px; border-right: 1px solid var(--c-border); line-height: 1.7;}
|
||||
.sidebar .inner {padding: 20px 0; padding-top: 36px; overflow-y: auto; height: 100%;}
|
||||
|
||||
.sidebar.hidden {left: -300px;}
|
||||
|
||||
@media screen and (max-width: 900px) {
|
||||
.sidebar .inner {padding-top: 0px;}
|
||||
}
|
||||
|
||||
.sidebar .section {padding: 20px; font-weight: 600;}
|
||||
.sidebar .section .title {color: var(--c-title); margin-bottom: 5px; font-weight: 700;}
|
||||
|
||||
.sidebar .links {display: none; border-bottom: 1px solid var(--c-border);}
|
||||
.sidebar .links {font-weight: 700;}
|
||||
|
||||
.sidebar ul {position: relative; padding-left: 13px; list-style: none; margin: 0px;}
|
||||
.sidebar .section > ul {padding: 0;}
|
||||
.sidebar .section > ul > ul:before {content: ""; position: absolute; top: 0px; left: 2px; height: 100%; width: 1px; background: var(--c-border)}
|
||||
.sidebar li {position: relative;}
|
||||
|
||||
.sidebar a {color: var(--c-text-2);}
|
||||
.sidebar a:hover {color: var(--c-text);}
|
||||
.sidebar li.active a {color: var(--c-brand);}
|
||||
|
||||
/* TODO: Rewrite */
|
||||
.sidebar ul ul li:before {transition: transform .2s; content: ""; display: block; position: absolute; left: -12px; background: var(--c-brand); border-radius: 10px; height: 10px; width: 3px; transform: scale(0); top: 9px;}
|
||||
.sidebar ul ul li.active:before {transform: scale(1);}
|
||||
.sidebar ul ul ul li:before {left: -25px}
|
||||
.sidebar ul ul ul ul li:before {left: -38px}
|
||||
/* END TODO */
|
||||
|
||||
@media screen and (max-width: 900px) {
|
||||
.sidebar .links {display: block;}
|
||||
}
|
||||
|
||||
/* Content */
|
||||
|
||||
.content {transition: all .3s; padding-top: 70px; padding-bottom: 40px; padding-left: 280px; padding-right: 280px;}
|
||||
.content.hidden {opacity: 0; transform: translateY(30px);}
|
||||
.content > .inner {margin: auto; max-width: 1000px; padding: 0 20px;}
|
||||
|
||||
#menu-toggle {display: none;}
|
||||
|
||||
@media screen and (max-width: 1400px) {
|
||||
.content {padding-right: 20%;}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1200px) {
|
||||
.content {padding-right: 20px;}
|
||||
}
|
||||
|
||||
.sidebar.hidden + .content {padding-left: 0; padding-right: 0;}
|
||||
|
||||
#menu-toggle + div .content .inner {transition: all .3s;}
|
||||
|
||||
@media screen and (max-width: 900px) {
|
||||
.content {padding-left: 0; padding-right: 0; left: 0; position: relative;}
|
||||
.sidebar {left: -300px;}
|
||||
#menu-toggle:checked + div .sidebar {left: 0; background: var(--c-sidebar-bg);}
|
||||
#menu-toggle:checked + div .content {left: 300px;}
|
||||
#menu-toggle:checked + div .content .inner {opacity: .3; pointer-events: none;}
|
||||
nav .menu {display: block;}
|
||||
}
|
||||
|
||||
/* Markdown rewrite */
|
||||
|
||||
.markdown-body {margin-top: 40px; padding-top: 4px; font-size: inherit; font-family: inherit; color: var(--c-text);}
|
||||
.markdown-body h1, .markdown-body h2 {border-bottom: 1px solid var(--c-border);}
|
||||
.markdown-body :is(h1, h2, h3, h4, h5, h6) {color: var(--c-title); margin-top: 35px;}
|
||||
.markdown-body code, .markdown-body pre {background: var(--c-bg-alt);}
|
||||
.markdown-body img {background-color: transparent;}
|
||||
.markdown-body hr {background-color: var(--c-border);}
|
||||
.markdown-body table tr {background-color: var(--c-table-row);}
|
||||
.markdown-body table tr:nth-child(2n) {background-color: var(--c-table-row-alt);}
|
||||
.markdown-body table :is(td, th) {border: 1px solid var(--c-border);}
|
||||
|
||||
.markdown-body ol, .markdown-body ul {padding-left: 1.5em;}
|
||||
.markdown-body blockquote, .markdown-body details, .markdown-body dl, .markdown-body ol, .markdown-body p, .markdown-body pre, .markdown-body table, .markdown-body ul {
|
||||
margin: 16px 0;
|
||||
}
|
||||
|
||||
/* Header improvements */
|
||||
|
||||
:is(h1, h2, h3, h4, h5, h6):before {display: block; content: " "; width: 0px; height: 100px; margin-top: -100px; visibility: hidden; z-index: -10;}
|
||||
|
||||
:is(h1, h2, h3, h4, h5, h6) a[aria-hidden=true]:before {content: "#"; opacity: 0; transition: all .2s; position: absolute; display: block; margin: -15px 0; padding: 15px; width: 20px; text-align: right; margin-left: -45px;}
|
||||
:is(h1, h2, h3, h4, h5, h6):hover a[aria-hidden=true]:before {opacity: 1;}
|
||||
|
||||
@media screen and (max-width: 1050px) {
|
||||
:is(h1, h2, h3, h4, h5, h6) a[aria-hidden=true]:before {display: none;}
|
||||
:is(h1, h2, h3, h4, h5, h6):hover a[aria-hidden=true]:before {display: inline; position: static; padding: 0px; margin: 0px; margin-right: .3em;}
|
||||
}
|
||||
|
||||
/* Special card component */
|
||||
|
||||
:is(blockquote, .card) :is(p, ol, ul) {
|
||||
margin: 7px 0;
|
||||
line-height: 1.5;
|
||||
}
|
||||
9
public/index.php
Normal file
9
public/index.php
Normal file
|
|
@ -0,0 +1,9 @@
|
|||
<?php
|
||||
|
||||
require("../vendor/autoload.php");
|
||||
require("../config.inc.php");
|
||||
|
||||
use CodeSpace\Wiki\Engine;
|
||||
|
||||
$engine = new Engine($config);
|
||||
$engine->display();
|
||||
41
src/DataSource.php
Normal file
41
src/DataSource.php
Normal file
|
|
@ -0,0 +1,41 @@
|
|||
<?php namespace CodeSpace\Wiki;
|
||||
|
||||
class DataSource {
|
||||
|
||||
private string $docs_path;
|
||||
|
||||
public function __construct() {
|
||||
$this->docs_path = realpath("../docs/");
|
||||
}
|
||||
|
||||
public function getMarkdown(string $file): ?string {
|
||||
$markdown = file_get_contents($file);
|
||||
return $markdown ?? null;
|
||||
}
|
||||
|
||||
public function getMenu(string $file): ?array {
|
||||
$path = dirname($file);
|
||||
while (strlen($this->docs_path) <= strlen($path)) {
|
||||
$menu_file = "$path/menu.json";
|
||||
if (file_exists($menu_file)) {
|
||||
$data = file_get_contents($menu_file);
|
||||
return $data ? json_decode($data, true) : null;
|
||||
}
|
||||
$path = dirname($path);
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
public function getFile(string $slug): string {
|
||||
if (!$slug) $slug = "index";
|
||||
$files = [
|
||||
"$this->docs_path/$slug.md",
|
||||
"$this->docs_path/$slug/index.md"
|
||||
];
|
||||
foreach ($files as &$file) {
|
||||
if (file_exists($file)) return $file;
|
||||
}
|
||||
return $files[1];
|
||||
}
|
||||
|
||||
}
|
||||
56
src/Engine.php
Normal file
56
src/Engine.php
Normal file
|
|
@ -0,0 +1,56 @@
|
|||
<?php namespace CodeSpace\Wiki;
|
||||
|
||||
use ParsedownExtra;
|
||||
|
||||
class Engine {
|
||||
|
||||
public ParsedownExtra $parsedown;
|
||||
|
||||
public \Twig\Environment $twig;
|
||||
|
||||
public array $config;
|
||||
|
||||
public string $slug;
|
||||
|
||||
public function __construct(array $config) {
|
||||
$this->config = $config;
|
||||
$this->slug = $this->getSlug();
|
||||
$loader = new \Twig\Loader\FilesystemLoader(dirname(__DIR__) . "/view/");
|
||||
$this->twig = new \Twig\Environment($loader, [
|
||||
// "cache" => "../cache",
|
||||
]);
|
||||
$this->twig->addFilter(new \Twig\TwigFilter('isActive', function ($link) {
|
||||
return "/$this->slug" == $link;
|
||||
}));
|
||||
$this->parsedown = new ParsedownExtra();
|
||||
}
|
||||
|
||||
public function getSlug(): string {
|
||||
$slug = parse_url(array_key_exists("slug", $_REQUEST) ? "/" . $_REQUEST["slug"] : $_SERVER["REQUEST_URI"], PHP_URL_PATH);
|
||||
return trim($slug, "/");
|
||||
}
|
||||
|
||||
public function template(string $view, array $data = []) {
|
||||
return $this->twig->render("$view.twig", [
|
||||
"config" => $this->config,
|
||||
...$data
|
||||
]);
|
||||
}
|
||||
|
||||
function render() {
|
||||
$data = new DataSource();
|
||||
$file = $data->getFile($this->slug);
|
||||
$menu = $data->getMenu($file);
|
||||
$markdown = $data->getMarkdown($file);
|
||||
if (!$markdown) return $this->template("404", ["menu" => $menu]);
|
||||
return $this->template("page", [
|
||||
"content" => $this->parsedown->text($markdown),
|
||||
"menu" => $menu
|
||||
]);
|
||||
}
|
||||
|
||||
public function display() {
|
||||
echo $this->render();
|
||||
}
|
||||
|
||||
}
|
||||
5
view/404.twig
Normal file
5
view/404.twig
Normal file
|
|
@ -0,0 +1,5 @@
|
|||
{% extends "base.twig" %}
|
||||
|
||||
{% block content %}
|
||||
<h1>Not found</h1>
|
||||
{% endblock %}
|
||||
61
view/base.twig
Normal file
61
view/base.twig
Normal file
|
|
@ -0,0 +1,61 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Wiki</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="stylesheet" href="/assets/markdown.css">
|
||||
<link rel="stylesheet" href="/assets/style.css">
|
||||
</head>
|
||||
<body>
|
||||
<nav>
|
||||
<div class="left">
|
||||
<label for="menu-toggle" class="menu icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="currentColor" d="M3 18v-2h18v2zm0-5v-2h18v2zm0-5V6h18v2z"/></svg>
|
||||
</label>
|
||||
<a href="/" class="logo">
|
||||
<img src="{{ config.site.logo }}">
|
||||
<div>{{ config.site.name }}</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="right">
|
||||
{% include "links.twig" %}
|
||||
</div>
|
||||
</nav>
|
||||
<input id="menu-toggle" type="checkbox" />
|
||||
<div class="wrapper">
|
||||
<div class="sidebar{% if not menu %} hidden{% endif %}" >
|
||||
<div class="inner">
|
||||
{% if config.links %}
|
||||
<div class="section links">
|
||||
{% include "links.twig" %}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if menu %}
|
||||
<div class="section group">
|
||||
{% for group in menu %}
|
||||
{% if group.title %}
|
||||
<div class="title">{{ group.title }}</div>
|
||||
{% endif %}
|
||||
{% if group.items %}
|
||||
<ul>
|
||||
{% for link in group.items %}
|
||||
<li{% if link.link | isActive %} class="active"{% endif %}>
|
||||
<a href="{{ link.link }}">{{ link.text }}</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="content">
|
||||
<div class="inner">
|
||||
{% block content %}{% endblock %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script src="/assets/client.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
9
view/links.twig
Normal file
9
view/links.twig
Normal file
|
|
@ -0,0 +1,9 @@
|
|||
{% if config.links %}
|
||||
<ul>
|
||||
{% for link in config.links %}
|
||||
<li{% if link.link | isActive %} class="active"{% endif %}>
|
||||
<a href="{{ link.link }}">{{ link.text }}</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% endif %}
|
||||
7
view/page.twig
Normal file
7
view/page.twig
Normal file
|
|
@ -0,0 +1,7 @@
|
|||
{% extends "base.twig" %}
|
||||
|
||||
{% block content %}
|
||||
<div class="markdown-body">
|
||||
{{ content|raw }}
|
||||
</div>
|
||||
{% endblock %}
|
||||
Loading…
Reference in a new issue