fix relative link styling, change graph and backlinks to refer to name rather than path

This commit is contained in:
Jacky Zhao 2021-12-23 14:05:27 -08:00
parent e332d5f9a6
commit cca56fbd2b
4 changed files with 15 additions and 15 deletions

View File

@ -128,9 +128,6 @@ td, th {
article a { article a {
font-family: Source Sans Pro; font-family: Source Sans Pro;
font-weight: 600; font-weight: 600;
text-decoration: underline;
text-decoration-color: var(--tertiary);
text-decoration-thickness: .15em;
} }
sup > a { sup > a {
@ -191,10 +188,11 @@ hr {
} }
// internal link // internal link
a[href^="/"] { a[href^="./"] {
text-decoration: none; text-decoration: none;
background-color: #afbfc922; background-color: #afbfc933;
padding: 0 0.2em; padding: 0 0.2em;
font-weight: 600;
border-radius: 3px; border-radius: 3px;
} }

View File

@ -4,13 +4,14 @@
{{$host := strings.TrimRight "/" $url.Path }} {{$host := strings.TrimRight "/" $url.Path }}
{{$curPage := strings.TrimPrefix $host (strings.TrimRight "/" .Page.RelPermalink) }} {{$curPage := strings.TrimPrefix $host (strings.TrimRight "/" .Page.RelPermalink) }}
{{$inbound := index $.Site.Data.linkIndex.index.backlinks $curPage}} {{$inbound := index $.Site.Data.linkIndex.index.backlinks $curPage}}
{{$contentTable := $.Site.Data.contentIndex}}
{{if $inbound}} {{if $inbound}}
{{- range $inbound -}} {{- range $inbound -}}
{{$src := index . "source"}} {{$src := index . "source"}}
{{$src = replace $src " " "-"}} {{$src = replace $src " " "-"}}
<li> <li>
<a href="{{$src}}">{{index . "source"}}</a> <a href="{{$src}}">{{index (index $contentTable $src) "title"}}</a>
</li> </li>
{{- end -}} {{- end -}}
{{else}} {{else}}

View File

@ -13,6 +13,7 @@
<script> <script>
const index = {{$.Site.Data.linkIndex.index}} const index = {{$.Site.Data.linkIndex.index}}
const links = {{$.Site.Data.linkIndex.links}} const links = {{$.Site.Data.linkIndex.links}}
const content = {{$.Site.Data.contentIndex}}
const curPage = {{ strings.TrimRight "/" .Page.RelPermalink }} const curPage = {{ strings.TrimRight "/" .Page.RelPermalink }}
const pathColors = {{$.Site.Data.graphConfig.paths}} const pathColors = {{$.Site.Data.graphConfig.paths}}
@ -137,7 +138,7 @@
const neighbours = parseIdsFromLinks([...(index.links[d.id] || []), ...(index.backlinks[d.id] || [])]) const neighbours = parseIdsFromLinks([...(index.links[d.id] || []), ...(index.backlinks[d.id] || [])])
const neighbourNodes = d3.selectAll(".node").filter(d => neighbours.includes(d.id)) const neighbourNodes = d3.selectAll(".node").filter(d => neighbours.includes(d.id))
const currentId = d.id const currentId = d.id
const links = d3.selectAll(".link").filter(d => d.source.id === currentId || d.target.id === currentId) const linkNodes = d3.selectAll(".link").filter(d => d.source.id === currentId || d.target.id === currentId)
// highlight neighbour nodes // highlight neighbour nodes
neighbourNodes neighbourNodes
@ -146,7 +147,7 @@
.attr("fill", color) .attr("fill", color)
// highlight links // highlight links
links linkNodes
.transition() .transition()
.duration(200) .duration(200)
.attr("stroke", "var(--g-link-active)") .attr("stroke", "var(--g-link-active)")
@ -165,9 +166,9 @@
.attr("fill", color) .attr("fill", color)
const currentId = d.id const currentId = d.id
const links = d3.selectAll(".link").filter(d => d.source.id === currentId || d.target.id === currentId) const linkNodes = d3.selectAll(".link").filter(d => d.source.id === currentId || d.target.id === currentId)
links linkNodes
.transition() .transition()
.duration(200) .duration(200)
.attr("stroke", "var(--g-link)") .attr("stroke", "var(--g-link)")
@ -184,7 +185,7 @@
const labels = graphNode.append("text") const labels = graphNode.append("text")
.attr("dx", 12) .attr("dx", 12)
.attr("dy", ".35em") .attr("dy", ".35em")
.text((d) => d.id.replace("%20", "-")) .text((d) => content[d.id.replace("%20", "-")].title)
.style("opacity", 0) .style("opacity", 0)
.style("pointer-events", "none") .style("pointer-events", "none")
.call(drag(simulation)); .call(drag(simulation));