新版首页样式
This commit is contained in:
@@ -1,29 +1,35 @@
|
||||
<?php get_header(); ?>
|
||||
|
||||
<main class="site-main">
|
||||
<canvas class="hero-waves" aria-hidden="true"></canvas>
|
||||
<section class="hero-section">
|
||||
<main class="site-main home-landing">
|
||||
<?php
|
||||
$announcement_archive_url = get_post_type_archive_link('announcement');
|
||||
if (!$announcement_archive_url) {
|
||||
$announcement_archive_url = home_url('/announcements');
|
||||
}
|
||||
$posts_page_id = (int) get_option('page_for_posts');
|
||||
$blog_archive_url = $posts_page_id ? get_permalink($posts_page_id) : '';
|
||||
if (!$blog_archive_url) {
|
||||
$blog_archive_url = home_url('/blog');
|
||||
}
|
||||
?>
|
||||
|
||||
<section class="landing-hero">
|
||||
<canvas class="landing-hero-canvas" aria-hidden="true"></canvas>
|
||||
<div class="container">
|
||||
<div class="hero-content">
|
||||
<h1 class="hero-title">
|
||||
<span class="hero-title-svg" aria-hidden="true"></span>
|
||||
<span class="hero-title-text" data-cn="爱特工作室" data-en="IT STUDIO"></span>
|
||||
</h1>
|
||||
<div class="landing-hero-content">
|
||||
<h1 class="landing-hero-title" data-cn="爱特工作室" data-en="IT STUDIO"></h1>
|
||||
<p class="landing-hero-subtitle" data-cn="中国海洋大学信息技术与工程实践团队" data-en="Technology and Engineering Practice Team at OUC"></p>
|
||||
<a class="landing-hero-btn" href="<?php echo esc_url(home_url('/about')); ?>" data-cn="了解更多" data-en="Learn More"></a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="hero-scroll-indicator" aria-hidden="true">
|
||||
<span class="scroll-arrow"></span>
|
||||
<span class="scroll-text" data-cn="向下滑动开始" data-en="Scroll to begin"></span>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="services-section">
|
||||
<div class="container">
|
||||
<!-- 服务提供模块 -->
|
||||
<div class="services-provided">
|
||||
<h2 data-cn="# 服务提供" data-en="# Our Services"></h2>
|
||||
<h2 data-cn="@ 服务提供" data-en="@ Services"></h2>
|
||||
<div class="services-grid-box">
|
||||
<a href="#" class="service-item">
|
||||
<div class="service-item">
|
||||
<div class="service-icon">
|
||||
<svg width="64" height="64" viewBox="0 0 64 64" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||||
<path d="M10 14L24 14L28 20H54C56.2091 20 58 21.7909 58 24V50C58 52.2091 56.2091 54 54 54H10C7.79086 54 6 52.2091 6 50V18C6 15.7909 7.79086 14 10 14Z" stroke="#ccd6f6"/>
|
||||
@@ -33,9 +39,8 @@
|
||||
</svg>
|
||||
</div>
|
||||
<span data-cn="资源站" data-en="Resources"></span>
|
||||
</a>
|
||||
|
||||
<a href="#" class="service-item">
|
||||
</div>
|
||||
<div class="service-item">
|
||||
<div class="service-icon">
|
||||
<svg width="64" height="64" viewBox="0 0 64 64" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||||
<circle cx="32" cy="32" r="24" stroke="#ccd6f6"/>
|
||||
@@ -48,9 +53,8 @@
|
||||
</svg>
|
||||
</div>
|
||||
<span data-cn="校内镜像站" data-en="Mirror Site"></span>
|
||||
</a>
|
||||
|
||||
<a href="#" class="service-item">
|
||||
</div>
|
||||
<div class="service-item">
|
||||
<div class="service-icon">
|
||||
<svg width="64" height="64" viewBox="0 0 64 64" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||||
<line x1="16" y1="12" x2="16" y2="52" stroke="#ccd6f6"/>
|
||||
@@ -62,9 +66,8 @@
|
||||
</svg>
|
||||
</div>
|
||||
<span data-cn="代码托管" data-en="Git Hosting"></span>
|
||||
</a>
|
||||
|
||||
<a href="#" class="service-item">
|
||||
</div>
|
||||
<div class="service-item">
|
||||
<div class="service-icon">
|
||||
<svg width="64" height="64" viewBox="0 0 64 64" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||||
<path d="M32 8L54 20V44L32 56L10 44V20L32 8Z" stroke="#ccd6f6"/>
|
||||
@@ -75,9 +78,8 @@
|
||||
</svg>
|
||||
</div>
|
||||
<span data-cn="Minecraft服务器" data-en="Minecraft Server"></span>
|
||||
</a>
|
||||
|
||||
<a href="#" class="service-item">
|
||||
</div>
|
||||
<div class="service-item">
|
||||
<div class="service-icon">
|
||||
<svg width="64" height="64" viewBox="0 0 64 64" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||||
<path d="M12 16H42V40H20L12 48V16Z" stroke="#ccd6f6"/>
|
||||
@@ -87,9 +89,8 @@
|
||||
</svg>
|
||||
</div>
|
||||
<span data-cn="OUC论坛" data-en="OUC Forum"></span>
|
||||
</a>
|
||||
|
||||
<a href="#" class="service-item">
|
||||
</div>
|
||||
<div class="service-item">
|
||||
<div class="service-icon">
|
||||
<svg width="64" height="64" viewBox="0 0 64 64" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||||
<path d="M46 14L50 18L26 42L22 38L46 14Z" stroke="#ccd6f6"/>
|
||||
@@ -101,9 +102,8 @@
|
||||
</svg>
|
||||
</div>
|
||||
<span data-cn="电脑维修" data-en="PC Repair"></span>
|
||||
</a>
|
||||
|
||||
<a href="#" class="service-item">
|
||||
</div>
|
||||
<div class="service-item">
|
||||
<div class="service-icon">
|
||||
<svg width="64" height="64" viewBox="0 0 64 64" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||||
<rect x="10" y="12" width="44" height="40" rx="4" stroke="#ccd6f6"/>
|
||||
@@ -116,9 +116,8 @@
|
||||
</svg>
|
||||
</div>
|
||||
<span data-cn="五八工坊预约" data-en="Workshop Booking"></span>
|
||||
</a>
|
||||
|
||||
<a href="#" class="service-item">
|
||||
</div>
|
||||
<div class="service-item">
|
||||
<div class="service-icon">
|
||||
<svg width="64" height="64" viewBox="0 0 64 64" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||||
<path d="M32 56C32 56 56 44 56 26C56 16 46 10 38 16C35 18 32 22 32 22C32 22 29 18 26 16C18 10 8 16 8 26C8 44 32 56 32 56Z" stroke="#ccd6f6"/>
|
||||
@@ -129,86 +128,100 @@
|
||||
</svg>
|
||||
</div>
|
||||
<span data-cn="OUC便民服务" data-en="OUC Services"></span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="content-section">
|
||||
<section class="landing-updates">
|
||||
<div class="container">
|
||||
<div class="content-grid">
|
||||
<div class="announcements-column">
|
||||
<h2 data-cn="# 公告通知" data-en="# Announcements"></h2>
|
||||
<div class="post-list">
|
||||
<div class="landing-updates-grid">
|
||||
<article class="landing-feed-box">
|
||||
<header class="landing-feed-head">
|
||||
<h2 data-cn="@ 公告通知" data-en="@ Announcements"></h2>
|
||||
<a href="<?php echo esc_url($announcement_archive_url); ?>" data-cn="更多" data-en="More"></a>
|
||||
</header>
|
||||
<ul class="landing-feed">
|
||||
<?php
|
||||
$announcements = new WP_Query(array(
|
||||
'post_type' => 'announcement',
|
||||
'post_status' => 'publish',
|
||||
'posts_per_page' => 5,
|
||||
'orderby' => 'date',
|
||||
'order' => 'DESC'
|
||||
'order' => 'DESC',
|
||||
'ignore_sticky_posts' => true,
|
||||
'no_found_rows' => true
|
||||
));
|
||||
|
||||
if ($announcements->have_posts()) :
|
||||
while ($announcements->have_posts()) : $announcements->the_post();
|
||||
$announcement_excerpt = get_the_excerpt();
|
||||
if ('' === trim($announcement_excerpt)) {
|
||||
$announcement_excerpt = wp_trim_words(wp_strip_all_tags(get_the_content()), 40, '...');
|
||||
}
|
||||
?>
|
||||
<article class="post-item">
|
||||
<div class="post-content-wrapper">
|
||||
<h3 class="post-title"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h3>
|
||||
<div class="post-excerpt">
|
||||
<?php the_excerpt(); ?>
|
||||
</div>
|
||||
<div class="post-meta">
|
||||
<span class="post-author"><?php echo get_the_author(); ?></span>
|
||||
<time datetime="<?php echo get_the_date('c'); ?>"><?php echo get_the_date('Y年m月d日'); ?></time>
|
||||
</div>
|
||||
<li class="landing-feed-item">
|
||||
<h3 class="landing-feed-title">
|
||||
<a class="landing-feed-link" href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
|
||||
</h3>
|
||||
<div class="landing-feed-meta">
|
||||
<span class="landing-feed-author"><?php echo esc_html(get_the_author()); ?></span>
|
||||
<time datetime="<?php echo get_the_date('c'); ?>"><?php echo get_the_date('Y-m-d'); ?></time>
|
||||
</div>
|
||||
</article>
|
||||
<p class="landing-feed-excerpt"><?php echo esc_html($announcement_excerpt); ?></p>
|
||||
</li>
|
||||
<?php
|
||||
endwhile;
|
||||
wp_reset_postdata();
|
||||
else :
|
||||
?>
|
||||
<p data-cn="暂无公告" data-en="No announcements found."></p>
|
||||
<li class="landing-feed-empty" data-cn="暂无公告" data-en="No announcements found."></li>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
</ul>
|
||||
</article>
|
||||
|
||||
<div class="blog-column">
|
||||
<h2 data-cn="# 技术博客" data-en="# Blog"></h2>
|
||||
<div class="post-list">
|
||||
<article class="landing-feed-box">
|
||||
<header class="landing-feed-head">
|
||||
<h2 data-cn="@ 技术博客" data-en="@ Blog"></h2>
|
||||
<a href="<?php echo esc_url($blog_archive_url); ?>" data-cn="更多" data-en="More"></a>
|
||||
</header>
|
||||
<ul class="landing-feed">
|
||||
<?php
|
||||
$blogs = new WP_Query(array(
|
||||
'post_type' => 'post',
|
||||
'post_status' => 'publish',
|
||||
'posts_per_page' => 5,
|
||||
'orderby' => 'date',
|
||||
'order' => 'DESC'
|
||||
'order' => 'DESC',
|
||||
'ignore_sticky_posts' => true,
|
||||
'no_found_rows' => true
|
||||
));
|
||||
|
||||
if ($blogs->have_posts()) :
|
||||
while ($blogs->have_posts()) : $blogs->the_post();
|
||||
$blog_excerpt = get_the_excerpt();
|
||||
if ('' === trim($blog_excerpt)) {
|
||||
$blog_excerpt = wp_trim_words(wp_strip_all_tags(get_the_content()), 40, '...');
|
||||
}
|
||||
?>
|
||||
<article class="post-item">
|
||||
<div class="post-content-wrapper">
|
||||
<h3 class="post-title"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h3>
|
||||
<div class="post-excerpt">
|
||||
<?php the_excerpt(); ?>
|
||||
</div>
|
||||
<div class="post-meta">
|
||||
<span class="post-author"><?php echo get_the_author(); ?></span>
|
||||
<time datetime="<?php echo get_the_date('c'); ?>"><?php echo get_the_date('Y年m月d日'); ?></time>
|
||||
</div>
|
||||
<li class="landing-feed-item">
|
||||
<h3 class="landing-feed-title">
|
||||
<a class="landing-feed-link" href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
|
||||
</h3>
|
||||
<div class="landing-feed-meta">
|
||||
<span class="landing-feed-author"><?php echo esc_html(get_the_author()); ?></span>
|
||||
<time datetime="<?php echo get_the_date('c'); ?>"><?php echo get_the_date('Y-m-d'); ?></time>
|
||||
</div>
|
||||
</article>
|
||||
<p class="landing-feed-excerpt"><?php echo esc_html($blog_excerpt); ?></p>
|
||||
</li>
|
||||
<?php
|
||||
endwhile;
|
||||
wp_reset_postdata();
|
||||
else :
|
||||
?>
|
||||
<p data-cn="暂无博客文章" data-en="No blog posts found."></p>
|
||||
<li class="landing-feed-empty" data-cn="暂无博客文章" data-en="No blog posts found."></li>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
</ul>
|
||||
</article>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
Reference in New Issue
Block a user