Skip to content

Commit

Permalink
update layout: add go to top-2
Browse files Browse the repository at this point in the history
  • Loading branch information
kaifei committed Jun 21, 2024
1 parent ef9765d commit 00e6b0b
Show file tree
Hide file tree
Showing 2 changed files with 94 additions and 58 deletions.
142 changes: 85 additions & 57 deletions _layouts/default.html
Original file line number Diff line number Diff line change
@@ -1,70 +1,98 @@
<!DOCTYPE html>
<html lang="{{ site.lang | default: "en-US" }}">
<head>
<meta charset="UTF-8">

{% seo %}
<link rel="icon" href="{{site.github.owner_gravatar_url}}" type="image/x-icon">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link rel="preload" href="https://fonts.googleapis.com/css?family=Open+Sans:400,700&display=swap" as="style" type="text/css" crossorigin>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="theme-color" content="#157878">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<link rel="stylesheet" href="{{ '/assets/css/style.css?v=' | append: site.github.build_revision | relative_url }}">
{% include head-custom.html %}

<link rel="stylesheet" type="text/css" href="./go-to-top.css">


</head>
<body>
<a id="skip-to-content" href="#content">Skip to the content.</a>

<header class="page-header" role="banner">
<h1 class="project-name">{{ page.title | default: site.title | default: site.github.repository_name }}</h1>
<h2 class="project-tagline">{{ page.description | default: site.description | default: site.github.project_tagline }}</h2>
<html lang="{{ site.lang | default: " en-US" }}">

<head>
<meta charset="UTF-8">

{% seo %}
<link rel="icon" href="{{site.github.owner_gravatar_url}}" type="image/x-icon">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link rel="preload" href="https://fonts.googleapis.com/css?family=Open+Sans:400,700&display=swap" as="style"
type="text/css" crossorigin>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="theme-color" content="#157878">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<link rel="stylesheet" href="{{ '/assets/css/style.css?v=' | append: site.github.build_revision | relative_url }}">
{% include head-custom.html %}

<link rel="stylesheet" type="text/css" href="./go-to-top.css">


</head>

<body>
<a id="skip-to-content" href="#content">Skip to the content.</a>

<header class="page-header" role="banner">
<h1 class="project-name">{{ page.title | default: site.title | default: site.github.repository_name }}</h1>
<h2 class="project-tagline">{{ page.description | default: site.description | default: site.github.project_tagline
}}</h2>
{% if site.github.is_project_page %}
<a href="{{ site.github.url }}" class="btn">Back To HomePage</a>
{% endif %}
{% if site.show_downloads %}
<a href="{{ site.github.zip_url }}" class="btn">Download .zip</a>
<a href="{{ site.github.tar_url }}" class="btn">Download .tar.gz</a>
{% endif %}
</header>

<main id="content" class="main-content" role="main">
<div class="goTop">
<a href="#" class="goTopBtn jq-goTop">
<i class="fas fa-arrow-alt-circle-up fa-3x"></i>
</a>
</div>

{{ content }}

<footer class="site-footer">
{% if site.github.is_project_page %}
<a href="{{ site.github.url }}" class="btn">Back To HomePage</a>
{% endif %}
{% if site.show_downloads %}
<a href="{{ site.github.zip_url }}" class="btn">Download .zip</a>
<a href="{{ site.github.tar_url }}" class="btn">Download .tar.gz</a>
<span class="site-footer-owner"><a href="{{ site.github.repository_url }}">{{ site.github.repository_name }}</a>
is maintained by <a href="{{ site.github.owner_url }}">{{ site.github.owner_name }}</a>.</span>
{% endif %}
</header>

<main id="content" class="main-content" role="main">
<div class="goTop">
<a href="#" class="goTopBtn jq-goTop">
<i class="fas fa-arrow-alt-circle-up fa-3x"></i>
</a>
</div>

{{ content }}

<footer class="site-footer">
{% if site.github.is_project_page %}
<span class="site-footer-owner"><a href="{{ site.github.repository_url }}">{{ site.github.repository_name }}</a> is maintained by <a href="{{ site.github.owner_url }}">{{ site.github.owner_name }}</a>.</span>
{% endif %}
<span class="site-footer-credits">This page was generated by <a href="https://pages.github.com">GitHub Pages</a>.</span>
</footer>
</main>
</body>

<script type="module">
import mermaid from 'https://cdn.jsdelivr.net/npm/mermaid@10.0.2/+esm';
mermaid.initialize({ startOnLoad: false });
await mermaid.run({
querySelector: '.language-mermaid',
<span class="site-footer-credits">This page was generated by <a href="https://pages.github.com">GitHub
Pages</a>.</span>
</footer>
</main>
</body>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script type="module">
import mermaid from 'https://cdn.jsdelivr.net/npm/mermaid@10.0.2/+esm';
mermaid.initialize({ startOnLoad: false });
await mermaid.run({
querySelector: '.language-mermaid',
});

$(function () {
// close效果
$(".jq-adClose").click(function (event) {
/* Act on the event */
event.preventDefault();
$(".adBox").fadeOut();
});

$(window).scroll(function () {
if ($(window).scrollTop() > 200) {
if ($(".goTop").hasClass("hide")) {
$(".goTop").toggleClass("hide");
}
} else {
$(".goTop").addClass("hide");
}
});

$(".jq-goTop").click(function (e) {
e.preventDefault();
$("html,body").animate(
{
scrollTop: 0,
{
scrollTop: 0
},
600
);
});
</script>
});

</script>

</html>
10 changes: 9 additions & 1 deletion _layouts/go-to-top.css
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,13 @@
position: fixed;
right: 10px;
bottom: 10px;
/* 圖示水平移動位置 */
transform: translateX(0);
transition: transform 0.2s;
/* 圖示隱藏 */
&.hide {
transform: translateX(120%);
}
.goTopBtn {
background-color: transparent;
border: none;
Expand All @@ -11,4 +18,5 @@
color: #3d82ad;
}
}
}
}

0 comments on commit 00e6b0b

Please sign in to comment.