fuc-new/resources/views/tabler/front/index.tpl
hellcat 1fe8673f62 1
2025-10-01 13:34:29 +08:00

429 lines
24 KiB
Smarty
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="icon" type="image/png" href="/favicon.png">
<link rel="stylesheet" href="assets/cool/bootstrap.min.css">
<link rel="stylesheet" href="assets/cool/all.min.css">
<link rel="stylesheet" href="assets/cool/swiper.min.css">
<link rel="stylesheet" href="assets/cool/style.css">
<link rel="stylesheet" href="assets/cool/bootstrap.min_002.css">
<title>福云</title>
</head>
<body>
<!--Navbar Start-->
<nav class="navbar navbar-expand-lg fixed-top" id="navbar">
<div class="container">
<!-- LOGO -->
<a class="navbar-brand logo" href="/">
<h2 class="logo-dark"><i class="fa fa-globe"></i>&nbsp;福云</h2>
<h2 class="logo-light" style="color:#dee2e6;font-weight: 400;"><i class="fa fa-globe"></i>&nbsp;福云</h2>
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-menu">
<line x1="3" y1="12" x2="21" y2="12"></line>
<line x1="3" y1="6" x2="21" y2="6"></line>
<line x1="3" y1="18" x2="21" y2="18"></line>
</svg>
</button>
<div class="collapse navbar-collapse" id="navbarCollapse">
<ul class="navbar-nav ms-auto navbar-center" id="navbar-navlist">
<li class="nav-item"><a href="#home" class="nav-link active">首页</a></li>
<li class="nav-item"><a href="#services" class="nav-link">服务</a></li>
<li class="nav-item"><a href="#features" class="nav-link">特性</a></li>
<li class="nav-item"><a href="#pricing" class="nav-link">价格</a></li>
<li class="nav-item"><a href="{$url_doc_base}" class="nav-link">文档</a></li>
</ul>
<a href="/auth/login" class="btn btn-sm rounded-pill nav-btn ms-lg-3"><i class="fas fa-sign-in-alt"></i>
{if $is_login}
用户中心
{else}
登陆
{/if}
</a>
</div>
</div>
<!-- end container -->
</nav>
<!-- Navbar End -->
<!-- Hero Start -->
<section class="hero-1 bg-center bg-primary position-relative" style="background-image: url(/theme/cool/index/img/hero-g-bg.png);" id="home">
<div class="container">
<div class="row align-items-center hero-content">
<div class="col-lg-5">
<h1 class="text-white display-4 font-weight-bold mb-4 hero-1-title">全球网络中继服务,随时随处尽情使用</h1>
<p class="text-white-70 mb-4"> 智能分流系统,国内网站直连,增强用户体验;Apple服务加速;
国外常用网站加速 (Google/Youtube/Twitter/Instgram/Github等);
在传输过程中使用最强的加密方式,保护用户数据和隐私;
与诸多平台上的优秀应用程序兼容;</p>
<a class="btn btn-lg btn-light rounded-pill mb-2" href="/auth/register"><strong>开始使用</strong> <i class="fa fa-plane" aria-hidden="true"></i></a>
</div>
<div id="carouselExampleIndicators" class="col-lg-6 col-sm-12 mx-auto ms-lg-auto me-lg-0 carousel slide" data-ride="carousel">
<div class="swiper-container swiper-container-initialized swiper-container-horizontal">
<div class="swiper-wrapper" style="transform: translate3d(-1272px, 0px, 0px); transition-duration: 0ms;"><div class="swiper-slide swiper-slide-duplicate swiper-slide-duplicate-next" data-swiper-slide-index="2" style="width: 636px;"><img src="assets/cool/banner-hulu-3.png" class="d-block w-100"></div>
<div class="swiper-slide swiper-slide-prev" data-swiper-slide-index="0" style="width: 636px;"><img src="assets/cool/banner-hbo-1.png" class="d-block w-100">
<p></p>
</div>
<div class="swiper-slide swiper-slide-active" data-swiper-slide-index="1" style="width: 636px;"><img src="assets/cool/banner-netflix-1.png" class="d-block w-100">
<p></p>
</div>
<div class="swiper-slide swiper-slide-next" data-swiper-slide-index="2" style="width: 636px;"><img src="assets/cool/banner-hulu-3.png" class="d-block w-100"></div>
<div class="swiper-slide swiper-slide-duplicate swiper-slide-duplicate-prev" data-swiper-slide-index="0" style="width: 636px;"><img src="assets/cool/banner-hbo-1.png" class="d-block w-100">
<p></p>
</div></div>
<div class="swiper-pagination"></div>
<span class="swiper-notification" aria-live="assertive" aria-atomic="true"></span>
<span class="swiper-notification" aria-live="assertive" aria-atomic="true"></span></div>
</div>
</div>
<!-- end row -->
</div>
<!-- end container -->
<div class="hero-bottom-shape">
<img src="assets/cool/hero-1-bottom-shape.png" alt="" class="img-fluid d-block mx-auto">
</div>
<!-- end hero shape -->
</section>
<!-- Hero End -->
<!-- Services start -->
<section class="section" id="services">
<div class="container">
<div class="row justify-content-center mb-5">
<div class="col-lg-7 text-center">
<h2 class="fw-bold">海外追剧,跨境电商的利器</h2>
<p class="text-muted">专为您有海外需求而设计的服务,随时随地,全平台高速访问。可靠的基础设施,提供便捷的诸多功能</p>
</div>
</div>
<div class="row">
<div class="col-lg-4">
<div class="service-box text-center px-4 py-5 position-relative mb-4">
<div class="service-box-content p-4">
<div class="icon-mono service-icon avatar-md mx-auto mb-4">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-box text-primary">
<path d="M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z"></path>
<polyline points="3.27 6.96 12 12.01 20.73 6.96"></polyline>
<line x1="12" y1="22.08" x2="12" y2="12"></line>
</svg>
</div>
<h4 class="mb-3 font-size-22">高速稳定</h4>
<p class="text-muted mb-0">体验宛若身在海外的访问速度,适用于您的固网与移动网络。</p>
</div>
</div>
</div>
<!-- end col -->
<div class="col-lg-4">
<div class="service-box text-center px-4 py-5 position-relative mb-4 active">
<div class="service-box-content p-4">
<div class="icon-mono service-icon avatar-md mx-auto mb-4">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-layers text-primary">
<polygon points="12 2 2 7 12 12 22 7 12 2"></polygon>
<polyline points="2 17 12 22 22 17"></polyline>
<polyline points="2 12 12 17 22 12"></polyline>
</svg>
</div>
<h4 class="mb-3 font-size-22 text-white-90">跨平台兼容</h4>
<p class="text-white mb-0 text-white-90">我们的服务适用于 macOS、iOS、Android、Windows。</p>
</div>
</div>
</div>
<!-- end col -->
<div class="col-lg-4">
<div class="service-box text-center px-4 py-5 position-relative mb-4">
<div class="service-box-content p-4">
<div class="icon-mono service-icon avatar-md mx-auto mb-4">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-server text-primary">
<rect x="2" y="2" width="20" height="8" rx="2" ry="2"></rect>
<rect x="2" y="14" width="20" height="8" rx="2" ry="2"></rect>
<line x1="6" y1="6" x2="6.01" y2="6"></line>
<line x1="6" y1="18" x2="6.01" y2="18"></line>
</svg>
</div>
<h4 class="mb-3 font-size-22">全球互联</h4>
<p class="text-muted mb-0">通过 IXP 连接至全球内容提供商,更加快速。</p>
</div>
</div>
</div>
<!-- end col -->
</div>
<!-- end row -->
</div>
<!-- end container -->
</section>
<!-- Services end -->
<!-- Features start -->
<section class="section bg-light" id="features">
<div class="container">
<div class="row align-items-center mb-5">
<div class="col-md-5 order-2 order-md-1 mt-md-0 mt-5">
<span class="badge badge-pill badge-primary mb-4">CROSS DEVICES &amp; PLATFORMS</span>
<h2 class="mb-4">在你心爱的电子设备中使用,无论是手机还是电脑,随时随处可用。</h2>
<p class="text-muted mb-5">Gopass我们的服务适用于 macOS、iOS、Android、Windows 和
Linux,借助第三方客户端,可在手机、电脑、路由器、游戏机、电视盒子中使用。</p>
<a href="/auth/register" class="btn btn-primary">Find out more <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-arrow-right icon-xs ms-2">
<line x1="5" y1="12" x2="19" y2="12"></line>
<polyline points="12 5 19 12 12 19"></polyline>
</svg></a>
</div>
<div class="col-md-6 ms-md-auto order-1 order-md-2">
<div class="position-relative">
<div class="ms-5 features-img">
<img src="assets/cool/top-hbo-movies.jpg" alt="" class="img-fluid d-block mx-auto">
</div>
<img src="assets/cool/dot-img.png" alt="" class="dot-img-left">
</div>
</div>
</div>
<!-- end row -->
<div class="row align-items-center section pb-0">
<div class="col-md-6">
<div class="position-relative mb-md-0 mb-5">
<div class="me-5 features-img">
<img src="assets/cool/halloween-movies.jpg" alt="" class="img-fluid d-block mx-auto rounded shadow">
</div>
<img src="assets/cool/dot-img.png" alt="" class="dot-img-right">
</div>
</div>
<div class="col-md-5 ms-md-auto">
<span class="badge badge-pill badge-primary mb-4">UNBLOCK STREAMING MEDIA</span>
<h2 class="mb-4">解锁流媒体,观赏和聆听优质的内容</h2>
<p class="text-muted mb-5">通过 Gopass 的服务,可以观看包括 Netflix、Hulu、HBO、TVB、Happyon、AbemaTV
等在内的多种流媒体视频,聆听包括 Spotify、Pandora 等在内的流媒体音乐。</p>
<a href="/auth/register" class="btn btn-primary">Find out more <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-arrow-right icon-xs ms-2">
<line x1="5" y1="12" x2="19" y2="12"></line>
<polyline points="12 5 19 12 12 19"></polyline>
</svg></a>
</div>
</div>
<!-- end row -->
</div>
<!-- end container -->
</section>
<!-- Features end -->
<!-- Ticket start -->
<section class="section bg-gradient-primary">
<div class="bg-overlay-img" style="background-image: url(/theme/cool/index/img/demos.png);"></div>
<div class="container">
<div class="row justify-content-center">
<div class="col-lg-8">
<div class="text-center">
<h1 class="text-white mb-4">客户支持</h1>
<p class="text-white mb-5 font-size-16">
有任何关于会员计划的疑问?联系我们的售前咨询小组,马上为您解答。我们将在您的订阅周期内为您提供一定程度上的技术支持。</p>
<a href="/user" class="btn btn-lg btn-light fw-bold">联系我们</a>
</div>
</div>
<!-- end col -->
</div>
<!-- end row -->
</div>
<!-- end container -->
</section>
<!-- Ticket end -->
<!-- Pricing start -->
<section class="section" id="pricing">
<div class="container">
<div class="row justify-content-center mb-5">
<div class="col-lg-7 text-center">
<h2 class="fw-bold">出色的体验,意想不到的价格</h2>
<p class="text-muted">
不要把宝贵的时间,浪费在等待上。即刻开启全球网络中继服务,在任何时间任何地点访问全球互联网。
</p>
</div>
</div>
<div class="row">
<div class="col-lg-12">
<div class="text-center mb-4 pricing-tab">
<ul class="nav nav-pills rounded-pill justify-content-center d-inline-block shadow-sm" id="pricingpills-tab" role="tablist">
<li class="nav-item d-inline-block">
<a class="nav-link rounded-pill active" id="pills-monthly-tab" data-bs-toggle="pill" href="#pills-monthly" role="tab" aria-controls="pills-monthly" aria-selected="true">月付</a>
</li>
</ul>
</div>
<div class="tab-content" id="pricingpills-tabContent">
<div class="tab-pane fade show active" id="pills-monthly" role="tabpanel" aria-labelledby="pills-monthly-tab">
<div class="row mt-5">
{foreach $taocan as $oTaocanRow}
<div class="col-12 col-md-4 col-lg-4">
<div class="pricing shadow rounded-lg">
<div class="pricing-title">
{$oTaocanRow->name}
</div>
<div class="pricing-padding">
<div class="pricing-price">
<div>{$oTaocanRow->price}</div>
<div>每月</div>
</div>
<div class="pricing-details">
<div class="pricing-item">
<div style="width:25px; height:25px;line-height: 20px;color:#3c2299;"><i class="fas fa-check-circle"></i></div>
<div class="pricing-item-label">{$oTaocanRow->content->bandwidth}GB 使用流量</div>
</div>
<div class="pricing-item">
<div style="width:25px; height:25px;line-height: 20px;color:#3c2299;"><i class="fas fa-check-circle"></i></div>
<div class="pricing-item-label">无限在线客户端</div>
</div>
<div class="pricing-item">
<div style="width:25px; height:25px;line-height: 20px;color:#3c2299;"><i class="fas fa-check-circle"></i></div>
<div class="pricing-item-label">在线技术支持</div>
</div>
<div class="pricing-item">
<div style="width:25px; height:25px;line-height: 20px;color:#3c2299;"><i class="fas fa-check-circle"></i></div>
<div class="pricing-item-label">国际标准节点</div>
</div>
<div class="pricing-item">
<div style="width:25px; height:25px;line-height: 20px;color:#3c2299;"><i class="fas fa-check-circle"></i></div>
<div class="pricing-item-label">国内中转节点</div>
</div>
<div class="pricing-item">
<div style="width:25px; height:25px;line-height: 20px;color:#3c2299;"><i class="fas fa-check-circle"></i></div>
<div class="pricing-item-label">IEPL专线节点</div>
</div>
</div>
</div>
<div class="pricing-cta go-to-buy-page">
<a class="btn btn-primary" style="border-radius:0 0 14px 14px;" href="/user/shop">订阅</a>
</div>
</div>
</div>
{/foreach}
</div>
<!-- end monthly tab pane -->
</div>
</div>
<!-- end yearly tab pane -->
</div>
<!-- end tab content -->
</div>
<!-- end col -->
<!-- end row -->
<!-- end container -->
</section>
<!-- Pricing end -->
<!-- Footer Start -->
<footer class="footer">
<div class="container">
<div class="row">
<div class="bg-overlay-img" style="background-image: url(/theme/cool/index/img/footer-bg.png);">
</div>
<div class="col-lg-5">
<div class="mb-4">
<a href="#"><h2 class="logo-dark"><i class="fa fa-globe"></i>&nbsp;福云</h2></a>
<p class="text-white-50 mt-4 mb-1" style="font-size: 1rem;line-height: 1.6rem;">
致力于为用户提供高速稳定的高性价比网络中继服务; 体验宛若身在海外的访问速度,适用于您的任何设备及网络。</p>
<p style="font-size: 0.8rem;line-height: 1.2rem;">We dedicate to providing the finest network
proxy
service, Make you never feel a thing of the existence of the GFW again; We made easy for any
internet service subscriber to use our service.</p>
<!--
<p class="text-white-50 mb-0" style="font-size: 0.8rem!important;">
Powered by SSPanel
</p>
-->
</div>
</div>
<!-- end col -->
<div class="col-lg-7 d-none d-sm-none d-md-none d-lg-block">
<div class="row">
<div class="col-lg-3 col-6"></div>
<div class="col-lg-3 col-6"></div>
<div class="col-lg-3 col-6">
<div class="mt-4 mt-lg-0">
<h4 class="text-white font-size-18 mb-3 text-end">首页</h4>
<ul class="list-unstyled footer-sub-menu">
<li class="text-end">
<a href="#services" class="footer-link">服务</a></li>
<li class="text-end">
<a href="#features" class="footer-link">特性</a>
</li>
<li class="text-end">
<a href="#pricing" class="footer-link">价格</a>
</li>
</ul>
</div>
</div>
<div class="col-lg-3 col-6">
<div class="mt-4 mt-lg-0">
<h4 class="text-white font-size-18 mb-3 text-end">支持</h4>
<ul class="list-unstyled footer-sub-menu">
<li class="text-end">
<a href="/user" class="footer-link">联系我们</a>
</li>
<li class="text-end">
<a href="/user/ticket" class="footer-link">工单系统</a>
</li>
<li class="text-end">
<a href="/user/faq/1" class="footer-link">常见问题</a>
</li>
<li class="text-end">
<a href="{$url_doc_base}" class="footer-link">帮助文档</a>
</li>
</ul>
</div>
</div>
</div>
</div>
<!-- end col -->
</div>
<!-- end row -->
</div>
<!-- end container -->
</footer>
<!-- Footer End -->
<!-- javascript -->
<script src="assets/cool/bootstrap.bundle.min.js"></script>
<script src="assets/cool/smooth-scroll.polyfills.min.js"></script>
<!-- App Js -->
<script src="assets/cool/feather-icons"></script>
<script src="assets/cool/app.js"></script>
<!--End mc_embed_signup-->
<script src="assets/cool/swiper.min.js"></script>
<script>
var mySwiper = new Swiper('.swiper-container', {
direction: 'horizontal',
loop: true,
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev',
},
autoplay: {
delay: 5000,
disableOnInteraction: true,
},
})
</script>
{include file='live_chat.tpl'}
</body>
</html>