259 lines
15 KiB
HTML
259 lines
15 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="zh-CN">
|
||
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>{$seo.title|default='网址导航 - 首页'}</title>
|
||
<meta name="keywords" content="{$seo.keywords|default='网址导航,常用网址,上网导航'}">
|
||
<meta name="description" content="{$seo.description|default='简洁实用的网址导航，支持分类管理、搜索聚合、我的导航与暗黑模式'}">
|
||
<link rel="canonical" href="{$siteUrl|default=''}/haonav/index.html">
|
||
{notempty name="jsonld"}<script type="application/ld+json">{$jsonld|raw}</script>{/notempty}
|
||
<link rel="stylesheet" href="/static/haonav/css/nav.css">
|
||
<link rel="manifest" href="/static/haonav/manifest.json">
|
||
<meta name="theme-color" content="#667eea">
|
||
<style>
|
||
.widget-row{display:flex;gap:16px;margin-bottom:18px;flex-wrap:wrap;}
|
||
.weather-widget{background:var(--nav-card-bg,#fff);color:var(--nav-card-text,#333);border-radius:12px;padding:14px 18px;display:flex;align-items:center;gap:12px;box-shadow:0 2px 10px rgba(0,0,0,.06);min-width:220px;flex-wrap:wrap;}
|
||
.weather-widget .w-city{font-weight:700;font-size:16px;}
|
||
.weather-widget .w-temp{color:#f76b1c;font-weight:700;}
|
||
.weather-widget .w-tips{color:var(--nav-muted,#999);font-size:12px;width:100%;}
|
||
.hotsearch-widget{flex:1;min-width:280px;background:var(--nav-card-bg,#fff);border-radius:12px;padding:12px 16px;box-shadow:0 2px 10px rgba(0,0,0,.06);}
|
||
.hotsearch-widget .hs-head{display:flex;justify-content:space-between;align-items:center;font-weight:700;color:var(--nav-card-text,#333);margin-bottom:8px;}
|
||
.hotsearch-widget .hs-tabs a{font-weight:400;font-size:13px;color:var(--nav-muted,#999);cursor:pointer;margin-left:10px;}
|
||
.hotsearch-widget .hs-tabs a.active{color:#1E9FFF;font-weight:700;}
|
||
.hotsearch-widget .hs-list{list-style:none;margin:0;padding:0;columns:2;column-gap:24px;}
|
||
.hotsearch-widget .hs-list li{display:flex;align-items:center;gap:8px;padding:4px 0;font-size:14px;break-inside:avoid;}
|
||
.hotsearch-widget .hs-list li .rk{width:18px;text-align:center;color:#bbb;font-weight:700;font-style:normal;}
|
||
.hotsearch-widget .hs-list li:nth-child(1) .rk,.hotsearch-widget .hs-list li:nth-child(2) .rk,.hotsearch-widget .hs-list li:nth-child(3) .rk{color:#f76b1c;}
|
||
.hotsearch-widget .hs-list li a{color:var(--nav-card-text,#333);text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
|
||
.hotsearch-widget .hs-list li a:hover{color:#1E9FFF;}
|
||
@media (max-width:640px){.hotsearch-widget .hs-list{columns:1;}}
|
||
</style>
|
||
</head>
|
||
|
||
<body>
|
||
<!-- 顶部导航栏 -->
|
||
<div class="navbar">
|
||
<div class="navbar-content">
|
||
<a href="/haonav/index.html" class="logo">🚀 网址导航</a>
|
||
<form class="search-box" id="searchForm">
|
||
<select id="searchEngine">
|
||
<option value="baidu" {$config.default_engine == 'baidu' ? 'selected' : ''}>百度</option>
|
||
<option value="bing" {$config.default_engine == 'bing' ? 'selected' : ''}>必应</option>
|
||
<option value="google" {$config.default_engine == 'google' ? 'selected' : ''}>Google</option>
|
||
<option value="sogou" {$config.default_engine == 'sogou' ? 'selected' : ''}>搜狗</option>
|
||
<option value="site" {$config.default_engine == 'site' ? 'selected' : ''}>站内</option>
|
||
</select>
|
||
<input type="text" id="searchInput" autocomplete="off" placeholder="搜索网站 / 关键词，或按 / 聚焦">
|
||
<button type="submit">🔍 搜索</button>
|
||
</form>
|
||
<div class="nav-actions">
|
||
<div class="nav-links">
|
||
<a href="/haonav/index.html" class="active">首页</a>
|
||
<a href="/haonav/rank.html">排行榜</a>
|
||
<a href="/haonav/submit.html">投稿</a>
|
||
<a href="/haonav/search.html">全站搜索</a>
|
||
</div>
|
||
<button class="icon-btn" id="themeToggle" title="切换暗黑模式">🌙</button>
|
||
<button class="icon-btn" id="pwaInstallBtn" title="安装为桌面应用" style="display:none;">📲</button>
|
||
<button class="icon-btn" id="setHomeBtn" title="设为首页 / 收藏本站">📌</button>
|
||
<select id="bgPicker" title="切换背景" style="border:none;border-radius:20px;padding:6px 8px;background:var(--nav-tag-bg);color:var(--nav-card-text);cursor:pointer;">
|
||
<option value="default">默认背景</option>
|
||
<option value="linear-gradient(135deg,#11998e 0%,#38ef7d 100%)">清新绿</option>
|
||
<option value="linear-gradient(135deg,#2193b0 0%,#6dd5ed 100%)">天空蓝</option>
|
||
<option value="linear-gradient(135deg,#ee9ca7 0%,#ffdde1 100%)">樱花粉</option>
|
||
<option value="linear-gradient(135deg,#232526 0%,#414345 100%)">暗夜灰</option>
|
||
</select>
|
||
<!-- 会员区：未登录显示登录/注册，已登录显示头像下拉 -->
|
||
<div class="user-area" id="userArea">
|
||
<button class="nav-btn" id="btnLogin">登录</button>
|
||
<button class="nav-btn nav-btn-primary" id="btnRegister">注册</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="main-content">
|
||
<!-- 广告位：首页顶部 -->
|
||
{notempty name="ads.home_top"}
|
||
<div class="ad-box ad-home-top">
|
||
<span class="ad-label">广告</span>
|
||
{volist name="ads.home_top" id="ad"}
|
||
{if $ad.type == 1}
|
||
<a class="ad-item" href="/haonav/ad/click?id={$ad.id}" target="_blank" rel="nofollow">
|
||
<img src="{$ad.image}" alt="{$ad.title}" loading="lazy">
|
||
</a>
|
||
{else/}
|
||
{$ad.code|raw}
|
||
{/if}
|
||
{/volist}
|
||
</div>
|
||
{/notempty}
|
||
|
||
<!-- 顶部小组件：天气 + 实时热搜 -->
|
||
<div class="widget-row">
|
||
<div class="weather-widget" id="weatherWidget" style="display:none;">
|
||
<span class="w-city" id="wCity"></span>
|
||
<span class="w-type" id="wType"></span>
|
||
<span class="w-temp" id="wTemp"></span>
|
||
<span class="w-tips" id="wTips"></span>
|
||
</div>
|
||
<div class="hotsearch-widget" id="hotSearchWidget" style="display:none;">
|
||
<div class="hs-head"><span>🔥 实时热搜</span> <span class="hs-tabs" id="hsTabs">
|
||
<a data-src="baidu" class="active">百度</a>
|
||
<a data-src="weibo">微博</a>
|
||
<a data-src="zhihu">知乎</a>
|
||
</span></div>
|
||
<ol class="hs-list" id="hotSearchList"></ol>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 我的导航（收藏） -->
|
||
<div class="mynav">
|
||
<div class="mynav-head">
|
||
<h3>⭐ 我的导航 <span class="tip" id="myNavTip">（点击卡片上的 ★ 收藏，可拖拽排序）</span></h3>
|
||
<button class="nav-btn" id="favShareBtn" title="生成分享链接，把收藏夹分享给好友">🔗 分享收藏夹</button>
|
||
</div>
|
||
<div class="mynav-list" id="myNavList"></div>
|
||
<div class="mynav-empty" id="myNavEmpty">还没有收藏，点击任意网址卡片右上角的 ★ 添加到这里～</div>
|
||
</div>
|
||
|
||
<!-- 热门推荐 -->
|
||
<div class="hot-recommend">
|
||
<h3>🔥 热门推荐</h3>
|
||
<div class="hot-grid">
|
||
{volist name='hotspot' id='vo'}
|
||
<div class="hot-item">
|
||
<a href="/haonav/site/{$vo.id}.html" target="_blank" style="display:flex;align-items:center;gap:10px;text-decoration:none;color:inherit;flex:1;min-width:0;">
|
||
<span class="hot-icon"><img src="{$vo.show_icon}" loading="lazy" alt="{$vo.title}"></span>
|
||
<span class="hot-info">
|
||
<h4>{$vo.title}</h4>
|
||
<p>{$vo.description |default='暂无描述'}</p>
|
||
{if $vo.rating_count > 0}<span class="website-rating">⭐ {$vo.rating} ({$vo.rating_count})</span>{/if}
|
||
</span>
|
||
</a>
|
||
<span class="qr-btn js-qr" data-url="{$vo.url}" title="二维码">▦</span>
|
||
</div>
|
||
{/volist}
|
||
</div>
|
||
</div>
|
||
|
||
{volist name="data" id="vo" key="k"}
|
||
<!-- 分类区块 -->
|
||
<div class="category-block" id="cat-{$k}">
|
||
<div class="section-title">
|
||
<h2>📋 <a href="/haonav/category/{$vo.id}.html" target="_blank"> {$vo.title} </a></h2>
|
||
</div>
|
||
<div class="website-grid">
|
||
{volist name="vo.links" id="site"}
|
||
<div class="website-card" data-sid="{$site.id}">
|
||
<span class="fav-btn js-fav" data-id="{$site.id}" data-title="{$site.title}" data-url="{$site.url}" data-icon="{$site.show_icon}" title="收藏">★</span>
|
||
<span class="qr-btn js-qr" data-url="{$site.url}" title="二维码">▦</span>
|
||
<a href="/haonav/site/{$site.id}.html" target="_blank" title="{$site.title}" style="text-decoration:none;color:inherit;display:block;">
|
||
<div class="website-icon"><img src="{$site.show_icon}" loading="lazy" alt="{$site.title}"></div>
|
||
<div class="website-name">{$site.title}</div>
|
||
{if $site.rating_count > 0}<div class="website-rating">⭐ {$site.rating}<span class="rc">({$site.rating_count})</span></div>{/if}
|
||
</a>
|
||
</div>
|
||
{/volist}
|
||
</div>
|
||
</div>
|
||
{/volist}
|
||
|
||
<!-- 友情链接 / 推荐 -->
|
||
<div class="hot-recommend">
|
||
<div class="section-title"><h2>🤝 友情链接</h2></div>
|
||
<div class="hot-grid">
|
||
{volist name='links' id='vo'}
|
||
<div class="hot-item">
|
||
<a href="{$vo.url}" target="_blank" style="display:flex;align-items:center;gap:10px;text-decoration:none;color:inherit;flex:1;min-width:0;">
|
||
<span class="hot-icon"><img src="{$vo.show_icon}" loading="lazy" alt="{$vo.title}"></span>
|
||
<span class="hot-info">
|
||
<h4>{$vo.title}</h4>
|
||
<p>{$vo.description |default='暂无描述'}</p>
|
||
{if $vo.rating_count > 0}<span class="website-rating">⭐ {$vo.rating} ({$vo.rating_count})</span>{/if}
|
||
</span>
|
||
</a>
|
||
<span class="qr-btn js-qr" data-url="{$vo.url}" title="二维码">▦</span>
|
||
</div>
|
||
{/volist}
|
||
</div>
|
||
</div>
|
||
<!-- 广告位：首页底部 -->
|
||
{notempty name="ads.home_bottom"}
|
||
<div class="ad-box ad-home-bottom">
|
||
<span class="ad-label">广告</span>
|
||
{volist name="ads.home_bottom" id="ad"}
|
||
{if $ad.type == 1}
|
||
<a class="ad-item" href="/haonav/ad/click?id={$ad.id}" target="_blank" rel="nofollow">
|
||
<img src="{$ad.image}" alt="{$ad.title}" loading="lazy">
|
||
</a>
|
||
{else/}
|
||
{$ad.code|raw}
|
||
{/if}
|
||
{/volist}
|
||
</div>
|
||
{/notempty}
|
||
</div>
|
||
|
||
<!-- 底部 -->
|
||
<div class="footer">
|
||
<p>© 2026 网址导航 - 让上网更简单 | <a href="/haonav/apply.html">申请收录</a> | <a href="/haonav/apply.html">广告合作</a> | <a href="#" rel="nofollow">关于我们</a></p>
|
||
<p><a target="_blank" rel="nofollow" href="http://beian.miit.gov.cn/">{$siteConf.beian |default='蜀ICP备2022005627号-3'}</a></p>
|
||
</div>
|
||
|
||
<!-- 二维码弹层 -->
|
||
<div class="qr-mask" id="qrMask">
|
||
<div class="qr-box">
|
||
<img id="qrImg" src="" alt="二维码">
|
||
<p id="qrText"></p>
|
||
<span class="close">关闭</span>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 收藏夹分享弹层 -->
|
||
<div class="qr-mask" id="favShareMask">
|
||
<div class="qr-box" style="max-width:460px;text-align:left;">
|
||
<h3 style="margin:0 0 14px;">🔗 分享我的收藏夹</h3>
|
||
<label style="display:flex;align-items:center;gap:8px;font-size:14px;margin-bottom:12px;cursor:pointer;">
|
||
<input type="checkbox" id="favShareToggle"> 开启分享（关闭后链接立即失效）
|
||
</label>
|
||
<input type="text" id="favShareTitle" placeholder="分享页标题，如：我的常用网址" maxlength="100"
|
||
style="width:100%;padding:9px 12px;border:1px solid var(--nav-border,#ddd);border-radius:8px;font-size:14px;margin-bottom:12px;box-sizing:border-box;">
|
||
<div id="favShareLinkBox" style="display:none;">
|
||
<div style="display:flex;gap:8px;">
|
||
<input type="text" id="favShareLink" readonly
|
||
style="flex:1;padding:9px 12px;border:1px solid var(--nav-border,#ddd);border-radius:8px;font-size:13px;box-sizing:border-box;">
|
||
<button class="nav-btn nav-btn-primary" id="favShareCopy">复制</button>
|
||
</div>
|
||
<p style="font-size:12px;color:var(--nav-muted);margin:8px 0 0;">被访问 <b id="favShareViews">0</b> 次 · <a href="#" id="favShareReset">重置链接</a>（旧链接失效）</p>
|
||
</div>
|
||
<p id="favShareMsg" style="font-size:13px;color:var(--nav-muted);margin:12px 0 0;"></p>
|
||
<div style="text-align:right;margin-top:16px;"><span class="close" style="cursor:pointer;color:var(--nav-primary);">关闭</span></div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 登录 / 注册 弹层由全局组件 auth.js 自动注入，无需在此书写 -->
|
||
|
||
<!-- 设为首页 / 收藏本站 提示弹层 -->
|
||
<div class="qr-mask" id="homeTipMask">
|
||
<div class="qr-box" style="max-width:440px;text-align:left;">
|
||
<h3 style="margin:0 0 12px;">📌 把导航带在身边</h3>
|
||
<p style="margin:0 0 8px;font-size:14px;"><b>收藏本站：</b>按 <kbd>Ctrl</kbd> + <kbd>D</kbd>（Mac：<kbd>⌘</kbd> + <kbd>D</kbd>）加入书签。</p>
|
||
<p style="margin:0 0 8px;font-size:14px;"><b>设为浏览器首页：</b></p>
|
||
<ol style="margin:0 0 8px;padding-left:20px;font-size:13px;line-height:1.8;color:var(--nav-muted,#666);">
|
||
<li>Chrome / Edge：设置 → 启动时 → 打开特定网页，填入本站地址</li>
|
||
<li>Firefox：设置 → 主页 → 自定义网址，填入本站地址</li>
|
||
</ol>
|
||
<p style="margin:0 0 4px;font-size:13px;color:var(--nav-muted,#666);">本站地址：<span id="homeTipUrl" style="user-select:all;"></span></p>
|
||
<span class="close">关闭</span>
|
||
</div>
|
||
</div>
|
||
|
||
<script src="/static/haonav/js/nav.js"></script>
|
||
<script src="/static/haonav/js/auth.js"></script>
|
||
</body>
|
||
|
||
</html>
|