You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@jena.apache.org by ki...@apache.org on 2023/04/11 14:26:33 UTC
[jena-site] 02/06: Handle layout with search menu in different window sizes
This is an automated email from the ASF dual-hosted git repository.
kinow pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/jena-site.git
commit 1311938f3abafd52d063cc96ed4197e218bff247
Author: Bruno P. Kinoshita <ki...@users.noreply.github.com>
AuthorDate: Sun Apr 9 15:11:43 2023 +0200
Handle layout with search menu in different window sizes
---
assets/sass/jena.scss | 4 +++-
layouts/_default/baseof.html | 10 +++++-----
layouts/_default/single.html | 2 +-
3 files changed, 9 insertions(+), 7 deletions(-)
diff --git a/assets/sass/jena.scss b/assets/sass/jena.scss
index 8d87d7a48..d597e24ca 100644
--- a/assets/sass/jena.scss
+++ b/assets/sass/jena.scss
@@ -89,9 +89,11 @@ main {
}
}
&.d-xl-none {
+ border-left: 1px solid var(--bs-secondary-bg);
+ width: 100%;
nav {
ul {
- padding: 0;
+ padding: 0 1rem;
li {
ul {
padding: 0 0 0 1rem;
diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html
index df7a90076..882e66660 100644
--- a/layouts/_default/baseof.html
+++ b/layouts/_default/baseof.html
@@ -103,17 +103,17 @@
</ul>
<form class="d-flex" role="search" action="/search" method="GET">
<div class="input-group">
- <input class="form-control border-end-0 border m-0" type="search" name="q" id="search-query" placeholder="Search...." aria-label="Search">
+ <input class="form-control border-end-0 border m-0" type="search" name="q" id="search-query" placeholder="Search...." aria-label="Search" style="width: 10rem;">
<button class="btn btn-outline-secondary border-start-0 border" type="submit">
<i class="bi-search"></i>
</button>
</div>
</form>
- <ul class="navbar-nav ms-auto">
- <li id="ask" class="nav-item"><a class="nav-link" href="/help_and_support/index.html"><span class="bi-patch-question"></span> Ask</a></li>
+ <ul class="navbar-nav">
+ <li id="ask" class="nav-item"><a class="nav-link" href="/help_and_support/index.html" title="Ask"><span class="bi-patch-question"></span><span class="text-body d-none d-xxl-inline"> Ask</span></a></li>
<li class="nav-item dropdown">
- <a href="#" class="nav-link dropdown-toggle" role="button" data-bs-toggle="dropdown" aria-expanded="false"><span class="bi-megaphone"></span> Get involved <b class="caret"></b></a>
+ <a href="#" title="Get involved" class="nav-link dropdown-toggle" role="button" data-bs-toggle="dropdown" aria-expanded="false"><span class="bi-megaphone"></span><span class="text-body d-none d-xxl-inline"> Get involved </span><b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="/getting_involved/index.html">Contribute</a></li>
<li><a class="dropdown-item" href="/help_and_support/bugs_and_suggestions.html">Report a bug</a></li>
@@ -142,7 +142,7 @@
{{ else }}
{{ $path = .Path }}
{{ end }}
- <li class="nav-item" id="edit"><a class="nav-link" href="{{ .Site.Params.siteRepositoryUrl }}/edit/{{ .Site.Params.siteRepositorySourceBranch }}/source/{{ $path }}" title="Edit this page on GitHub"><span class="bi-pencil-square"></span> Edit this page</a></li>
+ <li class="nav-item" id="edit"><a class="nav-link" href="{{ .Site.Params.siteRepositoryUrl }}/edit/{{ .Site.Params.siteRepositorySourceBranch }}/source/{{ $path }}" title="Edit this page on GitHub"><span class="bi-pencil-square"></span><span class="text-body d-none d-xxl-inline"> Edit this page</span></a></li>
</ul>
</div>
</div>
diff --git a/layouts/_default/single.html b/layouts/_default/single.html
index df9233fce..24a455355 100644
--- a/layouts/_default/single.html
+++ b/layouts/_default/single.html
@@ -2,7 +2,7 @@
<main class="d-flex flex-xl-row flex-column">
<!-- This one is for mobile and small viewport. -->
<aside class="text-muted align-self-start mb-3 p-0 d-xl-none d-block">
- <h2 class="h6 my-2">On this page</h2>
+ <h2 class="h6 sticky-top m-0 p-2 bg-body-tertiary">On this page</h2>
{{ .TableOfContents }}
</aside>
<article class="flex-column me-lg-4">