grpc
/
grpc.io
mirror of https://github.com/grpc/grpc.io.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Add anchor bookmarks (#154) 

* Add header links

Signed-off-by: lucperkins <lucperkins@gmail.com>

* CSS partial housekeeping

Signed-off-by: lucperkins <lucperkins@gmail.com>

* Add scroll offset

Signed-off-by: lucperkins <lucperkins@gmail.com>
This commit is contained in:
Luc Perkins 2020-03-20 05:15:03 -07:00 committed by GitHub
parent 0ce986ed93
commit cf9efbe10d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 42 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
assets/sass/style.sass
View File

@ -285,3 +285,17 @@ $colors: mergeColorMaps(("secondary": ($secondary, $white), "twitter-blue": ($tw
& + li & + li
margin-top: 0.75rem margin-top: 0.75rem
.hashlink
@extend .icon
height: 1rem
width: 1rem
margin-left: 0.25rem
.headline-hash
display: none
@for $i from 1 through 6
h#{$i}
&:hover > .headline-hash
display: inline

2
layouts/partials/content.html
View File

@ -1,5 +1,5 @@
{{ $size := .size | default "normal" }} {{ $size := .size | default "normal" }}
{{ $constrained := .constrained | default false }} {{ $constrained := .constrained | default false }}
<div class="content is-{{ $size }} has-bottom-padding{{ if $constrained }} is-constrained{{ end }}"> <div class="content is-{{ $size }} has-bottom-padding{{ if $constrained }} is-constrained{{ end }}">
{{ .content }} {{ partial "headline-hash.html" .content }}
</div> </div>

24
layouts/partials/css.html
View File

@ -1,15 +1,15 @@
{{- $inServerMode := site.IsServer }} {{ $inServerMode := site.IsServer }}
{{- $includePaths := (slice "node_modules") }} {{ $includePaths := (slice "node_modules") }}
{{- $sass := "sass/style.sass" }} {{ $sass := "sass/style.sass" }}
{{- $cssOutput := "css/style.css" }} {{ $cssOutput := "css/style.css" }}
{{- $devOpts := (dict "targetPath" $cssOutput "includePaths" $includePaths "enableSourceMap" true) }} {{ $devOpts := (dict "targetPath" $cssOutput "includePaths" $includePaths "enableSourceMap" true) }}
{{- $prodOpts := (dict "targetPath" $cssOutput "includePaths" $includePaths "outputStyle" "compressed") }} {{ $prodOpts := (dict "targetPath" $cssOutput "includePaths" $includePaths "outputStyle" "compressed") }}
{{- $cssOpts := cond $inServerMode $devOpts $prodOpts }} {{ $cssOpts := cond $inServerMode $devOpts $prodOpts }}
{{- $css := resources.Get $sass | resources.ExecuteAsTemplate $sass . | toCSS $cssOpts }} {{ $css := resources.Get $sass | resources.ExecuteAsTemplate $sass . | toCSS $cssOpts }}
{{- if $inServerMode }} {{ if $inServerMode }}
<link rel="stylesheet" href="{{ $css.RelPermalink }}"> <link rel="stylesheet" href="{{ $css.RelPermalink }}">
{{- else }} {{ else }}
{{- $prodCss := $css | fingerprint }} {{ $prodCss := $css | fingerprint }}
<link rel="stylesheet" href="{{ $prodCss.RelPermalink }}" integrity="{{ $prodCss.Data.Integrity }}"> <link rel="stylesheet" href="{{ $prodCss.RelPermalink }}" integrity="{{ $prodCss.Data.Integrity }}">
{{- end }} {{ end }}
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.css" /> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.css" />

2
layouts/partials/headline-hash.html Normal file
View File

@ -0,0 +1,2 @@
{{ . | replaceRE "(<h[2-9] id=\"([^\"]+)\".+)(</h[2-9]+>)" `${1} <a class="headline-hash" href="#${2}">
<span class="icon hashlink"><i class="fas fa-hashtag"></i></span></a>${3}` | safeHTML }}

11
layouts/partials/javascript.html
View File

@ -10,3 +10,14 @@
debug: false debug: false
}); });
</script> </script>
{{/* Anchor link scroll offset */}}
<script>
const navbarHeight = document.getElementsByClassName('navbar')[0].offsetHeight;
const extraPadding = 15;
const navbarOffset = -1 * (navbarHeight + extraPadding);
var shiftWindow = function() { scrollBy(0, navbarOffset) };
window.addEventListener("hashchange", shiftWindow);
window.addEventListener("pageshow", shiftWindow);
function load() { if (window.location.hash) shiftWindow(); }
</script>