mirror of
https://github.com/stedolan/jq.git
synced 2024-05-11 05:55:39 +00:00
Redesign website (#2628)
* Bump up Bootstrap to v5.3.1, Bootstrap Icon to v1.10.5. * Use autoComplete.js to drop dependency on jQuery and typeahead.js. * Support dark mode. * New svg logo and icon with responsive color mode support. * Normalize section ids to lower kebab-case for easiness of linking. * Use relative paths for links for local development (--root /output). * Various markup cleanups and accessibility improvements.
This commit is contained in:
itchyny
GitHub
20
docs/templates/shared/_footer.html.j2
vendored
20
docs/templates/shared/_footer.html.j2
vendored
@@ -1,10 +1,14 @@
|
||||
<footer>
|
||||
<div class="container">
|
||||
<p>This website is made with <a href="http://getbootstrap.com">Bootstrap</a>, themed with <a href="https://bootswatch.com">Bootswatch</a>.</p>
|
||||
<p>jq is licensed under the MIT license (code) and the <a href="https://creativecommons.org/licenses/by/3.0/">CC-BY-3.0</a> license (docs).</p>
|
||||
<footer class="bd-footer bg-body-tertiary">
|
||||
<div class="py-3 text-center">
|
||||
<p>
|
||||
This website is made with <a href="https://getbootstrap.com" target="_blank" rel="noopener">Bootstrap</a>,
|
||||
themed with <a href="https://bootswatch.com" target="_blank" rel="noopener">Bootswatch</a>.
|
||||
</p>
|
||||
<p>
|
||||
jq is licensed under the MIT license (code) and the
|
||||
<a href="https://creativecommons.org/licenses/by/3.0/" target="_blank" rel="noopener">CC-BY-3.0</a> license (docs).
|
||||
</p>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
|
||||
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js" integrity="sha256-Sk3nkD6mLTMOF0EOpNtsIry+s1CsaqQC1rVLTAy+0yc= sha512-K1qjQ+NcF2TYO/eI3M6v8EiNYZfA95pQumfvcVrTHtwQVDG+aHRqLi/ETn2uB+1JqwYqVG3LIvdm9lj6imS/pQ==" crossorigin="anonymous"></script>
|
||||
<script src="https://twitter.github.io/typeahead.js/releases/0.11.1/typeahead.bundle.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.1/dist/js/bootstrap.bundle.min.js"
|
||||
integrity="sha384-HwwvtgBNo3bZJJLYd8oVXjrBZt8cqVSpeBNS5n7C8IVInixGAoxmnlMuBnhbgrkm" crossorigin="anonymous"></script>
|
||||
|
||||
32
docs/templates/shared/_head.html.j2
vendored
32
docs/templates/shared/_head.html.j2
vendored
@@ -1,17 +1,23 @@
|
||||
<head>
|
||||
<script>
|
||||
if ((window.location.host == "jqlang.github.io") && (window.location.protocol != "https:"))
|
||||
window.location.protocol = "https";
|
||||
</script>
|
||||
<meta charset="utf-8">
|
||||
<title>{{headline}}</title>
|
||||
<title>{{ headline }}</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||||
<link rel="canonical" href="{{ url }}/{{ permalink }}" />
|
||||
<link href="https://maxcdn.bootstrapcdn.com/bootswatch/3.3.5/spacelab/bootstrap.min.css" rel="stylesheet" integrity="sha256-j7Dtnd7ZjexEiPNbscbopFn9+Cs0b3TLipKsWAPHZIM= sha512-RFhfi6P8zWMAJrEGU+CPjuxPh3r/UUBGqQ+/o6WKPIVZmQqeOipGotH2ihRULuQ8wsMBoK15TSZqc/7VYWyuIw==" crossorigin="anonymous">
|
||||
<link rel="stylesheet" href="{{ root }}/css/base.css" type="text/css">
|
||||
<!--[if lt IE 9]>
|
||||
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
|
||||
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
|
||||
<![endif]-->
|
||||
<link rel="icon" href="{{ root }}/icon.svg" type="image/svg+xml">
|
||||
<link rel="apple-touch-icon" href="{{ root }}/icon.png" type="image/png">
|
||||
<link rel="canonical" href="{{ url }}/{{ permalink }}">
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootswatch@5.3.1/dist/cosmo/bootstrap.min.css"
|
||||
integrity="sha384-dulfW0vmzZ638jigSgZXvDxMmd70GCnIv6oa+riKq6Kk4E0MKf7qmBfwP02wltv5" crossorigin="anonymous">
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css"
|
||||
integrity="sha384-Ay26V7L8bsJTsX9Sxclnvsn+hkdiwRnrjZJXqKmkIDobPgIIWBOVguEcQQLDuhfN" crossorigin="anonymous">
|
||||
<link rel="stylesheet" href="{{ root }}/css/style.css" type="text/css">
|
||||
<script>
|
||||
(function() {
|
||||
function setTheme(mediaQuery) {
|
||||
document.documentElement.setAttribute('data-bs-theme',
|
||||
document.documentElement.style.colorScheme = mediaQuery.matches ? 'dark' : 'light');
|
||||
}
|
||||
const mediaQuery = window.matchMedia('(prefers-color-scheme: dark)');
|
||||
setTheme(mediaQuery); mediaQuery.addEventListener('change', setTheme);
|
||||
})();
|
||||
</script>
|
||||
</head>
|
||||
|
||||
63
docs/templates/shared/_navbar.html.j2
vendored
63
docs/templates/shared/_navbar.html.j2
vendored
@@ -1,27 +1,40 @@
|
||||
<div class="navbar navbar-default navbar-fixed-top" role="navigation">
|
||||
<div class="container">
|
||||
<div class="navbar-header">
|
||||
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#nav-collapse">
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</button>
|
||||
<a class="navbar-brand" href="{{root}}/">jq</a>
|
||||
</div>
|
||||
|
||||
<div class="navbar-collapse collapse" id="nav-collapse">
|
||||
<ul class="nav navbar-nav">
|
||||
{% for item in navigation %}
|
||||
<li {% if item == navitem %} class="active" {% endif %}>
|
||||
<a href="{{root}}/{{item}}/">{{item | capitalize}}</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
<li><a href="https://github.com/jqlang/jq/issues">Issues</a></li>
|
||||
<li><a href="https://github.com/jqlang/jq">Source</a></li>
|
||||
<li><a href="https://jqplay.org">Try online!</a></li>
|
||||
<li><a href="https://raw.githubusercontent.com/jqlang/jq/master/NEWS.md">News</a></li>
|
||||
<div class="container visually-hidden-focusable">
|
||||
<a class="d-inline-flex p-2" href="#main">Skip to main content</a>
|
||||
{%- if navitem.startswith('manual') %}
|
||||
<a class="d-inline-flex p-2 m-1" href="#contents">Skip to table of contents</a>
|
||||
{%- endif %}
|
||||
</div>
|
||||
<header class="navbar navbar-expand-md sticky-top bg-body-tertiary d-print-none">
|
||||
<nav class="container-lg" aria-label="Page navigation">
|
||||
<button type="button" class="navbar-toggler" data-bs-toggle="offcanvas" data-bs-target="#navbar-collapse"
|
||||
aria-controls="navbar-collapse" aria-expanded="false" aria-label="Toggle page navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<a class="navbar-brand" href="{{ root }}/" aria-label="Top page"><img src="{{ root }}/jq.svg" alt="jq logo" style="height:1.5rem"></a>
|
||||
<div id="navbar-collapse" class="offcanvas offcanvas-start navbar-collapse w-auto" aria-labelledby="navbar-title">
|
||||
<div class="offcanvas-header">
|
||||
<h3 id="navbar-title" class="me-3">jq</h3>
|
||||
<button type="button" class="d-md-none btn-close" data-bs-dismiss="offcanvas" aria-label="Close page navigation"></button>
|
||||
</div>
|
||||
<ul class="offcanvas-body navbar-nav me-auto text-nowrap">
|
||||
<li class="nav-item d-md-none"><a class="nav-link{% if not navitem %} active{% endif %}"{% if not navitem %} aria-current="page"{% endif %} href="{{ root }}/">Top page</a></li>
|
||||
{%- for item in ['tutorial', 'download', 'manual'] %}
|
||||
<li class="nav-item"><a class="nav-link{% if item == navitem %} active{% endif %}"{% if item == navitem %} aria-current="page"{% endif %} href="{{ root }}/{{ item }}/">{{ item | capitalize }}</a></li>
|
||||
{%- endfor %}
|
||||
<li class="nav-item"><a class="nav-link" href="https://github.com/jqlang/jq" target="_blank" rel="noopener">GitHub</a></li>
|
||||
<li class="nav-item"><a class="nav-link" href="https://github.com/jqlang/jq/issues" target="_blank" rel="noopener">Issues</a></li>
|
||||
<li class="nav-item"><a class="nav-link" href="https://jqplay.org" target="_blank" rel="noopener">Try online!</a></li>
|
||||
<li class="nav-item"><a class="nav-link" href="https://raw.githubusercontent.com/jqlang/jq/master/NEWS.md" target="_blank" rel="noopener">News</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{%- if navitem.startswith('manual') %}
|
||||
<div class="container-searchbox form-control p-0 d-none d-md-flex d-print-none border" style="width:16rem">
|
||||
<span class="bi bi-search my-auto ms-2 me-1" aria-hidden="true"></span>
|
||||
<input type="text" id="searchbox" class="form-control border-0 px-1" placeholder="Search manual" role="combobox"
|
||||
aria-label="Search manual" aria-keyshortcuts="/" aria-expanded="false" autocomplete="off" spellcheck="false">
|
||||
<kbd class="mx-1 my-auto text-body bg-body rounded border" style="padding:.1rem .2rem" aria-hidden="true">/</kbd>
|
||||
</div>
|
||||
{%- endif %}
|
||||
<a class="d-md-none bi bi-github fs-4 text-body" href="https://github.com/jqlang/jq" target="_blank" rel="noopener" aria-label="GitHub"></a>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
Reference in New Issue
Block a user