253 lines
11 KiB
HTML
253 lines
11 KiB
HTML
<!--
|
|
{$isCalledFromBookmarklet=isset($_GET['source']) && $_GET['source'] == 'bookmarklet'}
|
|
-->
|
|
{if="$isCalledFromBookmarklet"}
|
|
{ignore} When called as a popup from bookmarklet, do not display menu. {/ignore}
|
|
{else}
|
|
|
|
<!-- Sidebar -->
|
|
<aside class="sidebar" id="sidebar">
|
|
<div class="sidebar-header">
|
|
<div class="sidebar-logo">
|
|
<i class="mdi mdi-bookmark-multiple"></i>
|
|
</div>
|
|
<a href="{$titleLink}" class="sidebar-brand">{$shaarlititle}</a>
|
|
</div>
|
|
|
|
<nav class="sidebar-nav">
|
|
<div class="sidebar-section">
|
|
<div class="sidebar-section-title">Navigation</div>
|
|
<a href="{$base_path}/" class="sidebar-link{if=" $pageName=='linklist'"} active{/if}">
|
|
<i class="mdi mdi-bookmark-multiple-outline"></i>
|
|
<span>All Bookmarks</span>
|
|
</a>
|
|
<a href="{$base_path}/tags/cloud" class="sidebar-link{if=" $pageName=='tagcloud'"} active{/if}">
|
|
<i class="mdi mdi-tag-multiple-outline"></i>
|
|
<span>Tag Cloud</span>
|
|
</a>
|
|
<a href="{$base_path}/picture-wall?{function=" ltrim($searchcrits, '&' )"}" class="sidebar-link{if="
|
|
$pageName=='picwall'"} active{/if}">
|
|
<i class="mdi mdi-image-multiple-outline"></i>
|
|
<span>Picture Wall</span>
|
|
</a>
|
|
<a href="{$base_path}/daily" class="sidebar-link{if=" $pageName=='daily'"} active{/if}">
|
|
<i class="mdi mdi-calendar-today"></i>
|
|
<span>Daily</span>
|
|
</a>
|
|
</div>
|
|
|
|
{if="$is_logged_in"}
|
|
<div class="sidebar-section">
|
|
<div class="sidebar-section-title">Admin</div>
|
|
<a href="{$base_path}/admin/tools" class="sidebar-link">
|
|
<i class="mdi mdi-tools"></i>
|
|
<span>Tools</span>
|
|
</a>
|
|
<a href="{$base_path}/admin/configure" class="sidebar-link">
|
|
<i class="mdi mdi-cog-outline"></i>
|
|
<span>Settings</span>
|
|
</a>
|
|
</div>
|
|
{/if}
|
|
</nav>
|
|
|
|
<div class="sidebar-footer">
|
|
{if="$is_logged_in"}
|
|
<a href="{$base_path}/admin/add-shaare" class="sidebar-add-btn">
|
|
<i class="mdi mdi-plus"></i>
|
|
<span>New Bookmark</span>
|
|
</a>
|
|
{/if}
|
|
|
|
<div class="theme-toggle-wrapper">
|
|
<span class="theme-toggle-label">
|
|
<i class="mdi mdi-weather-sunny" id="theme-icon-light"></i>
|
|
<span>Light Mode</span>
|
|
</span>
|
|
<label class="theme-switch">
|
|
<input type="checkbox" id="theme-toggle-checkbox">
|
|
<span class="theme-slider"></span>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
</aside>
|
|
|
|
<!-- Sidebar Overlay for Mobile -->
|
|
<div class="sidebar-overlay" id="sidebar-overlay"></div>
|
|
|
|
<!-- Main Content Wrapper -->
|
|
<div class="main-content">
|
|
<!-- Top Header Bar -->
|
|
<header class="header-main">
|
|
<div class="header-inner">
|
|
<div class="header-left">
|
|
<button class="mobile-menu-btn" id="mobile-menu-btn" title="Toggle Menu">
|
|
<i class="mdi mdi-menu"></i>
|
|
</button>
|
|
<a href="{$titleLink}" class="header-brand">{$shaarlititle}</a>
|
|
</div>
|
|
|
|
<!-- Main Navigation -->
|
|
<nav class="header-nav">
|
|
<a href="{$base_path}/" class="header-nav-link{if=" $pageName=='linklist'"} active{/if}">
|
|
<i class="mdi mdi-home-outline"></i>
|
|
<span>HOME</span>
|
|
</a>
|
|
<a href="{$base_path}/tags/cloud" class="header-nav-link{if=" $pageName=='tagcloud'"} active{/if}">
|
|
<i class="mdi mdi-tag-multiple"></i>
|
|
<span>TAG CLOUD</span>
|
|
</a>
|
|
<a href="{$base_path}/picture-wall?{function=" ltrim($searchcrits, '&' )"}" class="header-nav-link{if="
|
|
$pageName=='picwall'"} active{/if}">
|
|
<i class="mdi mdi-image-multiple"></i>
|
|
<span>PICTURE WALL</span>
|
|
</a>
|
|
<a href="{$base_path}/daily" class="header-nav-link{if=" $pageName=='daily'"} active{/if}">
|
|
<i class="mdi mdi-calendar"></i>
|
|
<span>DAILY</span>
|
|
</a>
|
|
<button class="header-nav-link" id="search-toggle-btn" title="Search (Press S)">
|
|
<i class="mdi mdi-magnify"></i>
|
|
<span>SEARCH</span>
|
|
</button>
|
|
</nav>
|
|
|
|
<!-- Header Actions -->
|
|
<div class="header-actions">
|
|
<!-- Filter Button -->
|
|
<div class="filter-dropdown" id="filter-dropdown">
|
|
<button class="header-action-btn" id="filter-toggle-btn" title="Filters">
|
|
<i class="mdi mdi-filter-variant"></i>
|
|
</button>
|
|
|
|
<!-- Filter Panel -->
|
|
<div class="filter-panel" id="filter-panel">
|
|
<div class="filter-header">
|
|
<span class="filter-title">Filters</span>
|
|
<button class="filter-close" id="filter-close-btn">
|
|
<i class="mdi mdi-close"></i>
|
|
</button>
|
|
</div>
|
|
<div class="filter-body">
|
|
<div class="filter-section">
|
|
<div class="filter-section-title">Links Per Page</div>
|
|
<a href="{$base_path}/?nb=20" class="filter-option">20 links</a>
|
|
<a href="{$base_path}/?nb=50" class="filter-option">50 links</a>
|
|
<a href="{$base_path}/?nb=100" class="filter-option">100 links</a>
|
|
</div>
|
|
<div class="filter-section">
|
|
<div class="filter-section-title">Custom value</div>
|
|
<form method="GET" action="{$base_path}/">
|
|
<input type="number" name="nb" class="filter-input" placeholder="20" min="1"
|
|
max="500">
|
|
</form>
|
|
</div>
|
|
{if="$is_logged_in"}
|
|
<div class="filter-section">
|
|
<div class="filter-section-title">Filters</div>
|
|
<div class="filter-toggle-row">
|
|
<span class="filter-toggle-label">Only private links</span>
|
|
<label class="toggle-switch">
|
|
<input type="checkbox" id="filter-private">
|
|
<span class="toggle-slider"></span>
|
|
</label>
|
|
</div>
|
|
<div class="filter-toggle-row">
|
|
<span class="filter-toggle-label">Only public links</span>
|
|
<label class="toggle-switch">
|
|
<input type="checkbox" id="filter-public">
|
|
<span class="toggle-slider"></span>
|
|
</label>
|
|
</div>
|
|
<div class="filter-toggle-row">
|
|
<span class="filter-toggle-label">Untagged links</span>
|
|
<label class="toggle-switch">
|
|
<input type="checkbox" id="filter-untagged">
|
|
<span class="toggle-slider"></span>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
{/if}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{if="$is_logged_in"}
|
|
<!-- Multi-select Toggle -->
|
|
<button class="header-action-btn" id="select-mode-btn" title="Multi-select">
|
|
<i class="mdi mdi-checkbox-multiple-marked-outline"></i>
|
|
</button>
|
|
{/if}
|
|
|
|
<!-- RSS Feed -->
|
|
<a href="{$base_path}/feed/rss" class="header-action-btn" title="RSS Feed">
|
|
<i class="mdi mdi-rss"></i>
|
|
</a>
|
|
|
|
<!-- Plugins Support -->
|
|
{if="isset($plugins_header.buttons_toolbar)"}
|
|
{loop="$plugins_header.buttons_toolbar"}
|
|
{$value.html}
|
|
{/loop}
|
|
{/if}
|
|
|
|
{if="$is_logged_in"}
|
|
<a href="{$base_path}/admin/tools" class="header-action-btn" title="Tools">
|
|
<i class="mdi mdi-cog-outline"></i>
|
|
</a>
|
|
<a href="{$base_path}/admin/logout" class="header-action-btn" title="Logout">
|
|
<i class="mdi mdi-logout-variant"></i>
|
|
</a>
|
|
{else}
|
|
<a href="{$base_path}/login" class="header-action-btn" title="Login">
|
|
<i class="mdi mdi-login-variant"></i>
|
|
</a>
|
|
{/if}
|
|
</div>
|
|
</div>
|
|
</header>
|
|
|
|
<!-- Search Overlay -->
|
|
<div class="search-overlay" id="search-overlay">
|
|
<div class="search-modal">
|
|
<form method="GET" action="{$base_path}/" id="search-form">
|
|
<div class="search-modal-header">
|
|
<i class="mdi mdi-magnify search-modal-icon"></i>
|
|
<input type="text" name="searchterm" class="search-modal-input" id="search-modal-input"
|
|
placeholder="Search..." autocomplete="off" value="{if="
|
|
isset($search_term)"}{$search_term}{/if}">
|
|
<div class="search-modal-actions">
|
|
<button type="submit" name="searchtags" class="search-type-btn" id="search-tags-btn">
|
|
<i class="mdi mdi-tag"></i> tags
|
|
</button>
|
|
<button type="submit" class="search-type-btn active" id="search-all-btn">
|
|
<i class="mdi mdi-magnify"></i> search
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
<div class="search-hint">
|
|
Press <kbd class="search-kbd">ESC</kbd> to close or <kbd class="search-kbd">Enter</kbd> to search
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Content Container -->
|
|
<div class="content-container">
|
|
<!-- Feedback Messages -->
|
|
{if="!empty($plugin_errors) && $is_logged_in"}
|
|
{loop="plugin_errors"}
|
|
<div class="alert alert-danger">{$value}</div>
|
|
{/loop}
|
|
{/if}
|
|
{if="!empty($global_errors)"}
|
|
{loop="global_errors"}
|
|
<div class="alert alert-danger">{$value}</div>
|
|
{/loop}
|
|
{/if}
|
|
{if="!empty($global_successes)"}
|
|
{loop="global_successes"}
|
|
<div class="alert alert-success">{$value}</div>
|
|
{/loop}
|
|
{/if}
|
|
{/if} |