Restructure project for security and offline capability
- Move content outside public web root for security - Consolidate all code and assets in engine/ directory - Download Bootstrap locally for offline functionality - Update public/ to contain only entry point files - Add router.php for PHP development server security - Update README.md with new structure and setup instructions - Block direct access to content files via URL - Maintain clean separation between content and code
This commit is contained in:
+2078
File diff suppressed because it is too large
Load Diff
Vendored
+6
File diff suppressed because one or more lines are too long
@@ -0,0 +1,11 @@
|
||||
<svg width="32" height="32" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
|
||||
<!-- < -->
|
||||
<path d="M8 8 L3 16 L8 24" stroke="#ffffff" stroke-width="3" fill="none" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
|
||||
<!-- / -->
|
||||
<path d="M12 24 L18 8" stroke="#ffffff" stroke-width="3" stroke-linecap="round"/>
|
||||
|
||||
<!-- .. -->
|
||||
<circle cx="22" cy="20" r="2" fill="#ffffff"/>
|
||||
<circle cx="28" cy="20" r="2" fill="#ffffff"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 442 B |
Binary file not shown.
Binary file not shown.
@@ -0,0 +1,11 @@
|
||||
<svg width="32" height="32" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
|
||||
<!-- < -->
|
||||
<path d="M8 8 L3 16 L8 24" stroke="#ffffff" stroke-width="3" fill="none" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
|
||||
<!-- / -->
|
||||
<path d="M12 24 L18 8" stroke="#ffffff" stroke-width="3" stroke-linecap="round"/>
|
||||
|
||||
<!-- .. -->
|
||||
<circle cx="22" cy="20" r="2" fill="#ffffff"/>
|
||||
<circle cx="28" cy="20" r="2" fill="#ffffff"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 442 B |
+7
File diff suppressed because one or more lines are too long
@@ -0,0 +1,16 @@
|
||||
<?php
|
||||
|
||||
return [
|
||||
'site_title' => 'CodePress',
|
||||
'site_description' => 'A simple PHP CMS',
|
||||
'base_url' => '/',
|
||||
'content_dir' => __DIR__ . '/../../content',
|
||||
'templates_dir' => __DIR__ . '/../templates',
|
||||
'cache_dir' => __DIR__ . '/../../cache',
|
||||
'default_page' => 'home',
|
||||
'error_404' => '404',
|
||||
'markdown_enabled' => true,
|
||||
'php_enabled' => true,
|
||||
'bootstrap_version' => '5.3.0',
|
||||
'jquery_version' => '3.7.1'
|
||||
];
|
||||
@@ -0,0 +1,455 @@
|
||||
<?php
|
||||
|
||||
require_once 'config.php';
|
||||
|
||||
$config = include 'config.php';
|
||||
|
||||
class CodePressCMS {
|
||||
private $config;
|
||||
private $menu = [];
|
||||
private $searchResults = [];
|
||||
|
||||
public function __construct($config) {
|
||||
$this->config = $config;
|
||||
$this->buildMenu();
|
||||
|
||||
if (isset($_GET['search'])) {
|
||||
$this->performSearch($_GET['search']);
|
||||
}
|
||||
}
|
||||
|
||||
private function buildMenu() {
|
||||
$this->menu = $this->scanDirectory($this->config['content_dir'], '');
|
||||
}
|
||||
|
||||
private function scanDirectory($dir, $prefix) {
|
||||
if (!is_dir($dir)) return [];
|
||||
|
||||
$items = scandir($dir);
|
||||
sort($items);
|
||||
$result = [];
|
||||
|
||||
foreach ($items as $item) {
|
||||
if ($item[0] === '.') continue;
|
||||
|
||||
$path = $dir . '/' . $item;
|
||||
$relativePath = $prefix ? $prefix . '/' . $item : $item;
|
||||
|
||||
if (is_dir($path)) {
|
||||
$result[] = [
|
||||
'type' => 'folder',
|
||||
'title' => ucfirst($item),
|
||||
'path' => $relativePath,
|
||||
'children' => $this->scanDirectory($path, $relativePath)
|
||||
];
|
||||
} elseif (preg_match('/\.(md|php|html)$/', $item)) {
|
||||
$title = ucfirst(pathinfo($item, PATHINFO_FILENAME));
|
||||
$result[] = [
|
||||
'type' => 'file',
|
||||
'title' => $title,
|
||||
'path' => $relativePath,
|
||||
'url' => '?page=' . $relativePath
|
||||
];
|
||||
}
|
||||
}
|
||||
|
||||
return $result;
|
||||
}
|
||||
|
||||
private function performSearch($query) {
|
||||
$this->searchResults = [];
|
||||
$this->searchInDirectory($this->config['content_dir'], '', $query);
|
||||
}
|
||||
|
||||
private function searchInDirectory($dir, $prefix, $query) {
|
||||
if (!is_dir($dir)) return;
|
||||
|
||||
$items = scandir($dir);
|
||||
|
||||
foreach ($items as $item) {
|
||||
if ($item[0] === '.') continue;
|
||||
|
||||
$path = $dir . '/' . $item;
|
||||
$relativePath = $prefix ? $prefix . '/' . $item : $item;
|
||||
|
||||
if (is_dir($path)) {
|
||||
$this->searchInDirectory($path, $relativePath, $query);
|
||||
} elseif (preg_match('/\.(md|php|html)$/', $item)) {
|
||||
$content = file_get_contents($path);
|
||||
if (stripos($content, $query) !== false || stripos($item, $query) !== false) {
|
||||
$title = ucfirst(pathinfo($item, PATHINFO_FILENAME));
|
||||
$this->searchResults[] = [
|
||||
'title' => $title,
|
||||
'path' => $relativePath,
|
||||
'url' => '?page=' . $relativePath,
|
||||
'snippet' => $this->createSnippet($content, $query)
|
||||
];
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
private function createSnippet($content, $query) {
|
||||
$content = strip_tags($content);
|
||||
$pos = stripos($content, $query);
|
||||
if ($pos === false) return substr($content, 0, 100) . '...';
|
||||
|
||||
$start = max(0, $pos - 50);
|
||||
$snippet = substr($content, $start, 150);
|
||||
return '...' . $snippet . '...';
|
||||
}
|
||||
|
||||
public function getPage() {
|
||||
if (isset($_GET['search'])) {
|
||||
return $this->getSearchResults();
|
||||
}
|
||||
|
||||
$page = $_GET['page'] ?? $this->config['default_page'];
|
||||
$page = preg_replace('/\.[^.]+$/', '', $page);
|
||||
|
||||
$filePath = $this->config['content_dir'] . '/' . $page;
|
||||
$actualFilePath = null;
|
||||
|
||||
if (file_exists($filePath . '.md')) {
|
||||
$actualFilePath = $filePath . '.md';
|
||||
$result = $this->parseMarkdown(file_get_contents($actualFilePath));
|
||||
} elseif (file_exists($filePath . '.php')) {
|
||||
$actualFilePath = $filePath . '.php';
|
||||
$result = $this->parsePHP($actualFilePath);
|
||||
} elseif (file_exists($filePath . '.html')) {
|
||||
$actualFilePath = $filePath . '.html';
|
||||
$result = $this->parseHTML(file_get_contents($actualFilePath));
|
||||
} elseif (file_exists($filePath)) {
|
||||
$actualFilePath = $filePath;
|
||||
$extension = pathinfo($filePath, PATHINFO_EXTENSION);
|
||||
if ($extension === 'md') {
|
||||
$result = $this->parseMarkdown(file_get_contents($actualFilePath));
|
||||
} elseif ($extension === 'php') {
|
||||
$result = $this->parsePHP($actualFilePath);
|
||||
} elseif ($extension === 'html') {
|
||||
$result = $this->parseHTML(file_get_contents($actualFilePath));
|
||||
}
|
||||
}
|
||||
|
||||
if (isset($result) && $actualFilePath) {
|
||||
$result['file_info'] = $this->getFileInfo($actualFilePath);
|
||||
return $result;
|
||||
}
|
||||
|
||||
return $this->getError404();
|
||||
}
|
||||
|
||||
private function getFileInfo($filePath) {
|
||||
if (!file_exists($filePath)) {
|
||||
return null;
|
||||
}
|
||||
|
||||
$stats = stat($filePath);
|
||||
$created = date('d-m-Y H:i', $stats['ctime']);
|
||||
$modified = date('d-m-Y H:i', $stats['mtime']);
|
||||
|
||||
return [
|
||||
'created' => $created,
|
||||
'modified' => $modified,
|
||||
'size' => $this->formatFileSize($stats['size'])
|
||||
];
|
||||
}
|
||||
|
||||
private function formatFileSize($bytes) {
|
||||
$units = ['B', 'KB', 'MB', 'GB'];
|
||||
$bytes = max($bytes, 0);
|
||||
$pow = floor(($bytes ? log($bytes) : 0) / log(1024));
|
||||
$pow = min($pow, count($units) - 1);
|
||||
|
||||
$bytes /= pow(1024, $pow);
|
||||
|
||||
return round($bytes, 2) . ' ' . $units[$pow];
|
||||
}
|
||||
|
||||
private function getSearchResults() {
|
||||
$query = $_GET['search'];
|
||||
$content = '<h2>Search Results for: "' . htmlspecialchars($query) . '"</h2>';
|
||||
|
||||
if (empty($this->searchResults)) {
|
||||
$content .= '<p>No results found.</p>';
|
||||
} else {
|
||||
$content .= '<p>Found ' . count($this->searchResults) . ' results:</p>';
|
||||
foreach ($this->searchResults as $result) {
|
||||
$content .= '<div class="card mb-3">';
|
||||
$content .= '<div class="card-body">';
|
||||
$content .= '<h5 class="card-title"><a href="' . htmlspecialchars($result['url']) . '">' . htmlspecialchars($result['title']) . '</a></h5>';
|
||||
$content .= '<p class="card-text text-muted">' . htmlspecialchars($result['path']) . '</p>';
|
||||
$content .= '<p class="card-text">' . htmlspecialchars($result['snippet']) . '</p>';
|
||||
$content .= '</div></div>';
|
||||
}
|
||||
}
|
||||
|
||||
return [
|
||||
'title' => 'Search Results',
|
||||
'content' => $content
|
||||
];
|
||||
}
|
||||
|
||||
private function parseMarkdown($content) {
|
||||
$lines = explode("\n", $content);
|
||||
$title = '';
|
||||
$body = '';
|
||||
$inBody = false;
|
||||
|
||||
foreach ($lines as $line) {
|
||||
if (!$inBody && preg_match('/^#\s+(.+)$/', $line, $matches)) {
|
||||
$title = $matches[1];
|
||||
$inBody = true;
|
||||
} elseif ($inBody || trim($line) !== '') {
|
||||
$body .= $line . "\n";
|
||||
$inBody = true;
|
||||
}
|
||||
}
|
||||
|
||||
$body = preg_replace('/### (.+)/', '<h3>$1</h3>', $body);
|
||||
$body = preg_replace('/## (.+)/', '<h2>$1</h2>', $body);
|
||||
$body = preg_replace('/# (.+)/', '<h1>$1</h1>', $body);
|
||||
$body = preg_replace('/\*\*(.+?)\*\*/', '<strong>$1</strong>', $body);
|
||||
$body = preg_replace('/\*(.+?)\*/', '<em>$1</em>', $body);
|
||||
|
||||
// Auto-link page titles to existing content pages (before markdown link processing)
|
||||
$body = $this->autoLinkPageTitles($body);
|
||||
|
||||
// Convert Markdown links to HTML links
|
||||
$body = preg_replace('/\[([^\]]+)\]\(([^)]+)\)/', '<a href="$2">$1</a>', $body);
|
||||
|
||||
// Convert relative internal links to CMS format
|
||||
$body = preg_replace('/href="\/blog\/([^"]+)"/', 'href="?page=blog/$1"', $body);
|
||||
$body = preg_replace('/href="\/([^"]+)"/', 'href="?page=$1"', $body);
|
||||
|
||||
$body = preg_replace('/\n\n/', '</p><p>', $body);
|
||||
$body = '<p>' . $body . '</p>';
|
||||
$body = preg_replace('/<p><\/p>/', '', $body);
|
||||
$body = preg_replace('/<p>(<h[1-6]>)/', '$1', $body);
|
||||
$body = preg_replace('/(<\/h[1-6]>)<\/p>/', '$1', $body);
|
||||
|
||||
return [
|
||||
'title' => $title ?: 'Untitled',
|
||||
'content' => $body
|
||||
];
|
||||
}
|
||||
|
||||
private function autoLinkPageTitles($content) {
|
||||
// Get all available pages with their titles
|
||||
$pages = $this->getAllPageTitles();
|
||||
|
||||
foreach ($pages as $pagePath => $pageTitle) {
|
||||
// Create a pattern that matches the exact page title (case-insensitive)
|
||||
// Use word boundaries to avoid partial matches
|
||||
$pattern = '/\b' . preg_quote($pageTitle, '/') . '\b/i';
|
||||
|
||||
// Replace with link, but avoid linking inside existing links, headings, or markdown
|
||||
$replacement = function($matches) use ($pageTitle, $pagePath) {
|
||||
$text = $matches[0];
|
||||
|
||||
// Check if we're inside an existing link or markdown syntax
|
||||
if (preg_match('/\[.*?\]\(.*?\)/', $text) ||
|
||||
preg_match('/\[.*?\]:/', $text) ||
|
||||
preg_match('/<a[^>]*>/', $text) ||
|
||||
preg_match('/href=/', $text)) {
|
||||
return $text; // Don't link existing links
|
||||
}
|
||||
|
||||
return '<a href="?page=' . $pagePath . '" class="auto-link" title="Ga naar ' . htmlspecialchars($pageTitle) . '">' . $text . '</a>';
|
||||
};
|
||||
|
||||
$content = preg_replace_callback($pattern, $replacement, $content);
|
||||
}
|
||||
|
||||
return $content;
|
||||
}
|
||||
|
||||
private function getAllPageTitles() {
|
||||
$pages = [];
|
||||
$this->scanForPageTitles($this->config['content_dir'], '', $pages);
|
||||
return $pages;
|
||||
}
|
||||
|
||||
private function scanForPageTitles($dir, $prefix, &$pages) {
|
||||
if (!is_dir($dir)) return;
|
||||
|
||||
$items = scandir($dir);
|
||||
sort($items);
|
||||
|
||||
foreach ($items as $item) {
|
||||
if ($item[0] === '.') continue;
|
||||
|
||||
$path = $dir . '/' . $item;
|
||||
$relativePath = $prefix ? $prefix . '/' . $item : $item;
|
||||
|
||||
if (is_dir($path)) {
|
||||
$this->scanForPageTitles($path, $relativePath, $pages);
|
||||
} elseif (preg_match('/\.(md|php|html)$/', $item)) {
|
||||
$title = $this->extractPageTitle($path);
|
||||
if ($title && !empty(trim($title))) {
|
||||
$pagePath = preg_replace('/\.[^.]+$/', '', $relativePath);
|
||||
$pages[$pagePath] = $title;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
private function extractPageTitle($filePath) {
|
||||
$content = file_get_contents($filePath);
|
||||
$extension = pathinfo($filePath, PATHINFO_EXTENSION);
|
||||
|
||||
if ($extension === 'md') {
|
||||
// Extract first H1 from Markdown
|
||||
if (preg_match('/^#\s+(.+)$/m', $content, $matches)) {
|
||||
return trim($matches[1]);
|
||||
}
|
||||
} elseif ($extension === 'php') {
|
||||
// Extract title from PHP file
|
||||
if (preg_match('/\$title\s*=\s*["\']([^"\']+)["\']/', $content, $matches)) {
|
||||
return trim($matches[1]);
|
||||
}
|
||||
} elseif ($extension === 'html') {
|
||||
// Extract title from HTML file
|
||||
if (preg_match('/<title>(.*?)<\/title>/i', $content, $matches)) {
|
||||
return trim(strip_tags($matches[1]));
|
||||
}
|
||||
if (preg_match('/<h1[^>]*>(.*?)<\/h1>/i', $content, $matches)) {
|
||||
return trim(strip_tags($matches[1]));
|
||||
}
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
|
||||
private function parsePHP($filePath) {
|
||||
ob_start();
|
||||
$title = 'Untitled';
|
||||
include $filePath;
|
||||
$content = ob_get_clean();
|
||||
|
||||
return [
|
||||
'title' => $title,
|
||||
'content' => $content
|
||||
];
|
||||
}
|
||||
|
||||
private function parseHTML($content) {
|
||||
$title = 'Untitled';
|
||||
|
||||
if (preg_match('/<title>(.*?)<\/title>/i', $content, $matches)) {
|
||||
$title = strip_tags($matches[1]);
|
||||
} elseif (preg_match('/<h1[^>]*>(.*?)<\/h1>/i', $content, $matches)) {
|
||||
$title = strip_tags($matches[1]);
|
||||
}
|
||||
|
||||
return [
|
||||
'title' => $title,
|
||||
'content' => $content
|
||||
];
|
||||
}
|
||||
|
||||
private function getError404() {
|
||||
return [
|
||||
'title' => 'Page Not Found',
|
||||
'content' => '<h1>404 - Page Not Found</h1><p>The page you are looking for does not exist.</p>'
|
||||
];
|
||||
}
|
||||
|
||||
public function getMenu() {
|
||||
return $this->menu;
|
||||
}
|
||||
|
||||
public function render() {
|
||||
$page = $this->getPage();
|
||||
$menu = $this->getMenu();
|
||||
$breadcrumb = $this->getBreadcrumb();
|
||||
|
||||
$template = file_get_contents($this->config['templates_dir'] . '/layout.html');
|
||||
|
||||
$template = str_replace('{{site_title}}', $this->config['site_title'], $template);
|
||||
$template = str_replace('{{page_title}}', $page['title'], $template);
|
||||
$template = str_replace('{{content}}', $page['content'], $template);
|
||||
$template = str_replace('{{search_query}}', isset($_GET['search']) ? htmlspecialchars($_GET['search']) : '', $template);
|
||||
$template = str_replace('{{breadcrumb}}', $breadcrumb, $template);
|
||||
|
||||
// File info for footer
|
||||
$fileInfo = '';
|
||||
if (isset($page['file_info'])) {
|
||||
$fileInfo = '<i class="bi bi-file-text"></i> Created: ' . htmlspecialchars($page['file_info']['created']) .
|
||||
' | Modified: ' . htmlspecialchars($page['file_info']['modified']);
|
||||
}
|
||||
$template = str_replace('{{file_info}}', $fileInfo, $template);
|
||||
|
||||
$menuHtml = $this->renderMenu($menu);
|
||||
|
||||
$template = str_replace('{{menu}}', $menuHtml, $template);
|
||||
|
||||
echo $template;
|
||||
}
|
||||
|
||||
private function getBreadcrumb() {
|
||||
if (isset($_GET['search'])) {
|
||||
return '<nav aria-label="breadcrumb"><ol class="breadcrumb"><li class="breadcrumb-item"><a href="?page=' . $this->config['default_page'] . '">Home</a></li><li class="breadcrumb-item active">Search</li></ol></nav>';
|
||||
}
|
||||
|
||||
$page = $_GET['page'] ?? $this->config['default_page'];
|
||||
$page = preg_replace('/\.[^.]+$/', '', $page);
|
||||
|
||||
if ($page === $this->config['default_page']) {
|
||||
return '<nav aria-label="breadcrumb"><ol class="breadcrumb"><li class="breadcrumb-item active">Home</li></ol></nav>';
|
||||
}
|
||||
|
||||
$parts = explode('/', $page);
|
||||
$breadcrumb = '<nav aria-label="breadcrumb"><ol class="breadcrumb"><li class="breadcrumb-item"><a href="?page=' . $this->config['default_page'] . '">Home</a></li>';
|
||||
|
||||
$path = '';
|
||||
foreach ($parts as $i => $part) {
|
||||
$path .= ($path ? '/' : '') . $part;
|
||||
$title = ucfirst($part);
|
||||
|
||||
if ($i === count($parts) - 1) {
|
||||
$breadcrumb .= '<li class="breadcrumb-item active">' . $title . '</li>';
|
||||
} else {
|
||||
$breadcrumb .= '<li class="breadcrumb-item"><a href="?page=' . $path . '">' . $title . '</a></li>';
|
||||
}
|
||||
}
|
||||
|
||||
$breadcrumb .= '</ol></nav>';
|
||||
return $breadcrumb;
|
||||
}
|
||||
|
||||
private function renderMenu($items, $level = 0) {
|
||||
$html = '';
|
||||
foreach ($items as $item) {
|
||||
if ($item['type'] === 'folder') {
|
||||
$hasChildren = !empty($item['children']);
|
||||
$html .= '<li class="nav-item">';
|
||||
|
||||
if ($hasChildren) {
|
||||
$folderId = 'folder-' . str_replace('/', '-', $item['path']);
|
||||
$html .= '<span class="nav-link folder-toggle" data-bs-toggle="collapse" data-bs-target="#' . $folderId . '" aria-expanded="false">';
|
||||
$html .= '<i class="arrow bi bi-chevron-right"></i> ' . htmlspecialchars($item['title']);
|
||||
$html .= '</span>';
|
||||
$html .= '<ul class="nav flex-column ms-2 collapse" id="' . $folderId . '">';
|
||||
$html .= $this->renderMenu($item['children'], $level + 1);
|
||||
$html .= '</ul>';
|
||||
} else {
|
||||
$html .= '<span class="nav-link folder-disabled" disabled>';
|
||||
$html .= '<i class="arrow bi bi-chevron-right"></i> ' . htmlspecialchars($item['title']);
|
||||
$html .= '</span>';
|
||||
}
|
||||
|
||||
$html .= '</li>';
|
||||
} else {
|
||||
$active = (isset($_GET['page']) && $_GET['page'] === $item['path']) ? 'active' : '';
|
||||
$html .= '<li class="nav-item">';
|
||||
$html .= '<a class="nav-link page-link ' . $active . '" href="' . htmlspecialchars($item['url']) . '">' . htmlspecialchars($item['title']) . '</a>';
|
||||
$html .= '</li>';
|
||||
}
|
||||
}
|
||||
return $html;
|
||||
}
|
||||
}
|
||||
|
||||
$cms = new CodePressCMS($config);
|
||||
$cms->render();
|
||||
@@ -0,0 +1,381 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>{{page_title}} - {{site_title}}</title>
|
||||
<link rel="icon" type="image/svg+xml" href="../engine/assets/favicon.svg">
|
||||
<link href="../engine/assets/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link href="../engine/assets/css/bootstrap-icons.css" rel="stylesheet">
|
||||
<style>
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
html, body {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
body {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
.main-wrapper {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.content-wrapper {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.sidebar {
|
||||
width: 250px;
|
||||
background-color: #f8f9fa;
|
||||
border-right: 1px solid #dee2e6;
|
||||
overflow-y: auto;
|
||||
flex-shrink: 0;
|
||||
transition: transform 0.3s ease;
|
||||
position: relative;
|
||||
z-index: 1000;
|
||||
}
|
||||
.sidebar.collapsed {
|
||||
transform: translateX(-250px);
|
||||
}
|
||||
.sidebar-toggle {
|
||||
position: fixed;
|
||||
top: 80px;
|
||||
left: 10px;
|
||||
z-index: 1001;
|
||||
background-color: #0d6efd;
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 5px;
|
||||
padding: 8px 12px;
|
||||
cursor: pointer;
|
||||
box-shadow: 0 2px 5px rgba(0,0,0,0.2);
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
.sidebar-toggle:hover {
|
||||
background-color: #0a58ca;
|
||||
transform: scale(1.05);
|
||||
}
|
||||
.sidebar-toggle.shifted {
|
||||
left: 270px;
|
||||
}
|
||||
.main-content.shifted {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.main-content {
|
||||
flex: 1;
|
||||
overflow-y: auto;
|
||||
padding: 20px;
|
||||
transition: margin-left 0.3s ease;
|
||||
}
|
||||
|
||||
.folder-toggle {
|
||||
font-weight: bold;
|
||||
color: #212529 !important;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0.5rem 0.75rem;
|
||||
background-color: #f8f9fa !important;
|
||||
margin: 0.125rem 0;
|
||||
transition: background-color 0.2s ease;
|
||||
}
|
||||
.folder-toggle:hover {
|
||||
background-color: #e9ecef !important;
|
||||
}
|
||||
.folder-toggle[aria-expanded="true"] {
|
||||
background-color: #dee2e6 !important;
|
||||
color: #212529 !important;
|
||||
font-weight: 600;
|
||||
}
|
||||
/* Progressive background colors for nested folders */
|
||||
.nav .nav .folder-toggle {
|
||||
background-color: #f1f3f4 !important;
|
||||
}
|
||||
.nav .nav .nav .folder-toggle {
|
||||
background-color: #eaedee !important;
|
||||
}
|
||||
.nav .nav .nav .nav .folder-toggle {
|
||||
background-color: #e3e7e8 !important;
|
||||
}
|
||||
.nav .nav .nav .nav .nav .folder-toggle {
|
||||
background-color: #dce1e2 !important;
|
||||
}
|
||||
.nav .nav .nav .nav .nav .nav .folder-toggle {
|
||||
background-color: #d5dbdd !important;
|
||||
}
|
||||
.nav .nav .nav .nav .nav .nav .nav .folder-toggle {
|
||||
background-color: #ced5d8 !important;
|
||||
}
|
||||
.nav .nav .nav .nav .nav .nav .nav .nav .folder-toggle {
|
||||
background-color: #c7cfd3 !important;
|
||||
}
|
||||
.nav .nav .nav .nav .nav .nav .nav .nav .nav .folder-toggle {
|
||||
background-color: #c0c9ce !important;
|
||||
}
|
||||
.nav .nav .nav .nav .nav .nav .nav .nav .nav .nav .folder-toggle {
|
||||
background-color: #b9c3c9 !important;
|
||||
}
|
||||
.folder-toggle .arrow {
|
||||
margin-right: 8px;
|
||||
transition: transform 0.2s;
|
||||
font-size: 0.8em;
|
||||
}
|
||||
.folder-toggle[aria-expanded="true"] .arrow {
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
.page-link {
|
||||
color: #495057 !important;
|
||||
font-weight: 500;
|
||||
padding: 0.5rem 0.75rem;
|
||||
padding-left: 2rem;
|
||||
background-color: #ffffff !important;
|
||||
margin: 0.125rem 0;
|
||||
transition: background-color 0.2s ease;
|
||||
}
|
||||
/* Progressive background colors for nested pages */
|
||||
.nav .nav .page-link {
|
||||
background-color: #fafbfc !important;
|
||||
}
|
||||
.nav .nav .nav .page-link {
|
||||
background-color: #f5f7f8 !important;
|
||||
}
|
||||
.nav .nav .nav .nav .page-link {
|
||||
background-color: #f0f3f4 !important;
|
||||
}
|
||||
.nav .nav .nav .nav .nav .page-link {
|
||||
background-color: #ebefef !important;
|
||||
}
|
||||
.nav .nav .nav .nav .nav .nav .page-link {
|
||||
background-color: #e6eaea !important;
|
||||
}
|
||||
.nav .nav .nav .nav .nav .nav .nav .page-link {
|
||||
background-color: #e1e5e5 !important;
|
||||
}
|
||||
.nav .nav .nav .nav .nav .nav .nav .nav .page-link {
|
||||
background-color: #dce0e0 !important;
|
||||
}
|
||||
.nav .nav .nav .nav .nav .nav .nav .nav .nav .page-link {
|
||||
background-color: #d7dbdb !important;
|
||||
}
|
||||
.nav .nav .nav .nav .nav .nav .nav .nav .nav .nav .page-link {
|
||||
background-color: #d2d6d6 !important;
|
||||
}
|
||||
.page-link:hover {
|
||||
color: #212529 !important;
|
||||
background-color: #f8f9fa !important;
|
||||
}
|
||||
.nav-link.active {
|
||||
background-color: #0d6efd !important;
|
||||
color: #212529 !important;
|
||||
font-weight: 600;
|
||||
}
|
||||
.file-info {
|
||||
font-size: 0.9rem;
|
||||
color: #6c757d;
|
||||
}
|
||||
.site-info a {
|
||||
color: #0d6efd;
|
||||
text-decoration: none;
|
||||
}
|
||||
.site-info a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
.auto-link {
|
||||
color: #0d6efd;
|
||||
text-decoration: none;
|
||||
border-bottom: 2px dashed #0d6efd;
|
||||
font-weight: 500;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
.auto-link:hover {
|
||||
color: #0a58ca;
|
||||
text-decoration: none;
|
||||
border-bottom-style: solid;
|
||||
border-bottom-color: #0a58ca;
|
||||
}
|
||||
.search-form {
|
||||
max-width: 300px;
|
||||
}
|
||||
.card-title a {
|
||||
text-decoration: none;
|
||||
color: inherit;
|
||||
}
|
||||
.card-title a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
.folder-disabled {
|
||||
font-weight: 500;
|
||||
color: #6c757d !important;
|
||||
cursor: not-allowed;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0.5rem 0.75rem;
|
||||
background-color: #f8f9fa !important;
|
||||
margin: 0.125rem 0;
|
||||
opacity: 0.7;
|
||||
}
|
||||
.folder-disabled .arrow {
|
||||
margin-right: 8px;
|
||||
font-size: 0.8em;
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.sidebar {
|
||||
width: 200px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<header class="bg-primary text-white py-3">
|
||||
<div class="container-fluid">
|
||||
<div class="row align-items-center">
|
||||
<div class="col">
|
||||
<div class="d-flex align-items-center">
|
||||
<img src="../engine/assets/icon.svg" alt="CodePress Logo" width="32" height="32" class="me-2">
|
||||
<h1 class="h3 mb-0">{{site_title}}</h1>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<form class="d-flex" method="GET" action="">
|
||||
<input class="form-control me-2" type="search" name="search" placeholder="Search..." value="{{search_query}}">
|
||||
<button class="btn btn-outline-light" type="submit">Search</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="main-wrapper">
|
||||
<div class="content-wrapper">
|
||||
<button class="sidebar-toggle" id="sidebarToggle">
|
||||
<i class="bi bi-list"></i>
|
||||
</button>
|
||||
<nav class="sidebar" id="sidebar">
|
||||
<div class="pt-3">
|
||||
<ul class="nav flex-column">
|
||||
{{menu}}
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<main class="main-content">
|
||||
<div>
|
||||
{{breadcrumb}}
|
||||
</div>
|
||||
<div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom">
|
||||
<h2>{{page_title}}</h2>
|
||||
</div>
|
||||
<div class="content">
|
||||
{{content}}
|
||||
</div>
|
||||
</main>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<footer class="bg-light border-top py-3">
|
||||
<div class="container-fluid">
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="d-flex justify-content-between align-items-center">
|
||||
<div class="file-info">
|
||||
{{file_info}}
|
||||
</div>
|
||||
<div class="site-info">
|
||||
<small class="text-muted">Powered by <a href="https://git.noorlander.info/E.Noorlander/CodePress.git" target="_blank" rel="noopener">CodePress CMS</a></small>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<script src="../engine/assets/js/bootstrap.bundle.min.js"></script>
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
// Sidebar toggle functionality
|
||||
const sidebarToggle = document.getElementById('sidebarToggle');
|
||||
const sidebar = document.getElementById('sidebar');
|
||||
const mainContent = document.querySelector('.main-content');
|
||||
|
||||
sidebarToggle.addEventListener('click', function() {
|
||||
sidebar.classList.toggle('collapsed');
|
||||
mainContent.classList.toggle('shifted');
|
||||
sidebarToggle.classList.toggle('shifted');
|
||||
|
||||
// Change icon
|
||||
const icon = this.querySelector('i');
|
||||
if (sidebar.classList.contains('collapsed')) {
|
||||
icon.classList.remove('bi-list');
|
||||
icon.classList.add('bi-chevron-right');
|
||||
} else {
|
||||
icon.classList.remove('bi-chevron-right');
|
||||
icon.classList.add('bi-list');
|
||||
}
|
||||
});
|
||||
|
||||
// Open folders that contain the current active page
|
||||
const activeLink = document.querySelector('.nav-link.active');
|
||||
if (activeLink) {
|
||||
let parent = activeLink.closest('.collapse');
|
||||
while (parent) {
|
||||
const toggle = document.querySelector('[data-bs-target="#' + parent.id + '"]');
|
||||
if (toggle) {
|
||||
const collapse = new bootstrap.Collapse(parent, {
|
||||
show: true
|
||||
});
|
||||
toggle.setAttribute('aria-expanded', 'true');
|
||||
}
|
||||
parent = parent.parentElement.closest('.collapse');
|
||||
}
|
||||
}
|
||||
|
||||
// Close other folders when opening a new one
|
||||
const folderToggles = document.querySelectorAll('.folder-toggle');
|
||||
folderToggles.forEach(toggle => {
|
||||
toggle.addEventListener('click', function(e) {
|
||||
const targetId = this.getAttribute('data-bs-target');
|
||||
const isExpanded = this.getAttribute('aria-expanded') === 'true';
|
||||
|
||||
if (!isExpanded) {
|
||||
// Close all other folders
|
||||
folderToggles.forEach(otherToggle => {
|
||||
if (otherToggle !== this) {
|
||||
const otherTargetId = otherToggle.getAttribute('data-bs-target');
|
||||
if (otherTargetId) {
|
||||
const otherCollapse = document.querySelector(otherTargetId);
|
||||
if (otherCollapse) {
|
||||
const bsCollapse = bootstrap.Collapse.getInstance(otherCollapse);
|
||||
if (bsCollapse) {
|
||||
bsCollapse.hide();
|
||||
} else {
|
||||
new bootstrap.Collapse(otherCollapse, {
|
||||
hide: true
|
||||
});
|
||||
}
|
||||
otherToggle.setAttribute('aria-expanded', 'false');
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user