feat: Show tags, adjust structure
- gmi: Show last mod along with post date in post meta - both: Show simple list of tags at the end of a post - for web: This makes tags look like "tags" rather than "word-links", with removed text underline and added background color to the links. Small opacity/brightness change applied on hover for both dark and light modes. - web: Adjust content structuring - hr before footnotes is removed. The footnotes is now borderless (hr is still visible on browsers without CSS) - Add upper border on footer (implemented by using bottom border on after content, which is now visible regardless of whether content exists) - Boldify footnotes heading - creates a visual separation in place of removed hr - web: Adjust color of light text - it's now lighter and bluer to fit the background.
This commit is contained in:
parent
51c2835821
commit
6b6aded2d7
|
@ -52,7 +52,7 @@
|
|||
--accent-bg-light: #303035;
|
||||
--code-bg: #3e3e4b;
|
||||
--text: #eee;
|
||||
--text-light: #cecece;
|
||||
--text-light: #b8b8c6;
|
||||
--non-text-light: #999fbf;
|
||||
|
||||
--border: #aaa;
|
||||
|
@ -436,25 +436,6 @@ nav .pfp-text {
|
|||
/*******************************************************************
|
||||
* Page sections
|
||||
*/
|
||||
/* Differentiating between normal content links and meta content links */
|
||||
.meta a, .post-meta :not(.tags) a, footer a, #after-content a {
|
||||
text-decoration: none;
|
||||
@media (prefers-color-scheme: dark) {
|
||||
color: var(--link-alt);
|
||||
}
|
||||
}
|
||||
.meta a:hover, .post-meta :not(.tags) a:hover, footer a:hover, #after-content a:hover {
|
||||
color: var(--accent-light);
|
||||
text-decoration: underline;
|
||||
@media (prefers-color-scheme: dark) {
|
||||
opacity: .75;
|
||||
}
|
||||
}
|
||||
.post-meta .tags a, .post-meta .tags a:visited {
|
||||
text-decoration: underline;
|
||||
color: var(--text-light);
|
||||
}
|
||||
|
||||
main, #after-content {
|
||||
/* For better reading experience.
|
||||
* I don't want paragraphs to be too narrow, it looks ugly; Though I don't
|
||||
|
@ -465,17 +446,40 @@ main, #after-content {
|
|||
margin: auto;
|
||||
padding: 0 5%;
|
||||
}
|
||||
#after-content {
|
||||
margin-bottom: 4rem;
|
||||
|
||||
/* Differentiating between normal content links and meta content links */
|
||||
.meta a, footer a, #after-content a {
|
||||
text-decoration: none;
|
||||
@media (prefers-color-scheme: dark) {
|
||||
color: var(--link-alt);
|
||||
}
|
||||
}
|
||||
#after-content:empty {
|
||||
display: none;
|
||||
.meta a:hover, footer a:hover, #after-content a:hover {
|
||||
color: var(--accent-light);
|
||||
text-decoration: underline;
|
||||
@media (prefers-color-scheme: dark) {
|
||||
opacity: .75;
|
||||
}
|
||||
}
|
||||
|
||||
/* Tags */
|
||||
#after-content .tags a, #after-content .tags a:visited {
|
||||
padding: .2rem .5rem;
|
||||
color: var(--text-light);
|
||||
background-color: var(--accent-bg);
|
||||
}
|
||||
#after-content .tags a:hover {
|
||||
text-decoration: none;
|
||||
@media (prefers-color-scheme: light) {
|
||||
filter: brightness(95%);
|
||||
}
|
||||
}
|
||||
|
||||
footer {
|
||||
text-align: center;
|
||||
font-size: .9rem;
|
||||
color: var(--text-light);
|
||||
padding: 1rem 0 1rem 0;
|
||||
padding: .5rem 0 1rem 0;
|
||||
margin: 0 5%;
|
||||
}
|
||||
footer a {
|
||||
|
@ -553,8 +557,8 @@ a.anchor:hover {
|
|||
}
|
||||
|
||||
#content div#main {
|
||||
border-bottom: 2px solid var(--border-light);
|
||||
padding-bottom: 1rem;
|
||||
margin-bottom: 5rem;
|
||||
}
|
||||
|
||||
.footnotes {
|
||||
|
@ -562,9 +566,6 @@ a.anchor:hover {
|
|||
font-size: .9rem;
|
||||
color: var(--text-light);
|
||||
}
|
||||
.footnotes #footnotes-heading {
|
||||
margin-top: 1.5rem;
|
||||
}
|
||||
.footnotes ol {
|
||||
margin-top: none;
|
||||
}
|
||||
|
|
|
@ -2,13 +2,13 @@
|
|||
date = '2024-04-10T05:22:46Z'
|
||||
description = 'The visual block mode in Vim/Neovim is quite powerful. You can use it for "column" editing and vertically pasting blocks of text similar to paste(1).'
|
||||
draft = false
|
||||
footnotes_heading = 'Footnotes'
|
||||
|
||||
hasFootnotes = true
|
||||
|
||||
outputs = ['html', 'gemtext']
|
||||
slug = 'vim-column-editing'
|
||||
tags = ['howto', 'terminal']
|
||||
title = 'Vim visual block mode for column editing'
|
||||
EOF = false
|
||||
|
||||
publicReplyTo = "mailto:~hedy/posts@lists.sr.ht?cc=hedy%20%3Chedy.dev%40protonmail.com%3E&in-reply-to=%3Cn7UVukOUgCClct4d56HGVviI9Ig0QFF1dp0XIjC1EHZkOq9kBq4oHhA_CpVUa1LKxD73wJAZn4kUaTBoIQtENvNDF6RiSUsMfbN8fT4y2fI%3D%40protonmail.com%3E&subject=Re%3A%20Vim%20visual%20block%20mode%20for%20column%20editing"
|
||||
+++
|
||||
|
|
|
@ -12,8 +12,10 @@
|
|||
{{ block "main" . }}{{ end }}
|
||||
</div>
|
||||
</main>
|
||||
<!-- Don't use line breaks here, we want to hide this section if 'after' is empty. -->
|
||||
<section id="after-content">{{- block "after" . }}{{ end }}</section>
|
||||
<section id="after-content">
|
||||
{{- block "after" . }}{{ end }}
|
||||
<hr style="margin-top: 4rem; margin-bottom: 0;"/>
|
||||
</section>
|
||||
<footer>
|
||||
{{ partial "footer.html" . }}
|
||||
</footer>
|
||||
|
|
|
@ -1,4 +1,3 @@
|
|||
<hr style="display: none;">
|
||||
<p>
|
||||
Copyright © {{ with .Site.Params.CopyrightYearStart }}{{ . }}-{{ end -}}
|
||||
{{ now.Format "2006" }}
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
{{ $footnotes := `(<div class="footnotes" role="doc-endnotes">
|
||||
<hr>)` -}}
|
||||
{{ $footnotesWithHeading := printf `<div class="footnotes" role="doc-endnotes">
|
||||
<hr><p id="footnotes-heading">%s</p>` "Footnotes" -}}
|
||||
{{ $footnotesWithHeading := printf `<hr style="display: none;"><div class="footnotes" role="doc-endnotes">
|
||||
<p id="footnotes-heading"><strong>%s</strong></p>` "Footnotes" -}}
|
||||
{{ .Content | replaceRE $footnotes $footnotesWithHeading | safeHTML -}}
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
{{ $taxonomy := "tags" -}}
|
||||
{{ with .Page.Param $taxonomy -}}{{ with $.Prefix }}{{ . | safeHTML }}{{ end }}
|
||||
{{- range $index, $tag := . -}}{{- with $.Page.Site.GetPage (printf "/%s/%s" $taxonomy $tag) -}}
|
||||
{{- if $index -}}, {{ end -}}#{{ $tag | urlize }}{{ end }}{{ end }}{{ with $.Postfix }}{{ . | safeHTML }}{{ end }}{{ end }}
|
||||
{{- if $index -}}, {{ end -}}#{{ $tag | urlize }}{{ end }}{{ end }}{{ with $.Postfix }}{{ . | safeHTML }}{{ end }}{{ end -}}
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
<span class="tags">
|
||||
{{- range $index, $tag := $tags -}}
|
||||
{{- $taglink := $.Page.Site.GetPage (printf "/%s/%s" $taxonomy $tag) -}}
|
||||
{{- if $index -}}, {{ end -}}<a href="{{ $taglink.RelPermalink }}">{{ $tag | urlize }}</a>
|
||||
{{- if $index -}} {{ end -}}<a class="tag" href="{{ $taglink.RelPermalink }}">#{{ $tag | urlize }}</a>
|
||||
{{- end }}
|
||||
</span>
|
||||
{{- end }}
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
{{ define "content" -}}
|
||||
# {{ $.Title }}
|
||||
|
||||
{{ .Date.UTC.Format "Jan 02, 2006" }}
|
||||
{{ .Date.UTC.Format "Jan 02, 2006" }}{{ partial "lastmod.gmi" (dict "Page" . "Prefix" " (updated on " "Postfix" ")") }}
|
||||
|
||||
{{ partial "processed-content.gmi" . }}
|
||||
|
||||
|
@ -12,8 +12,7 @@ EOF
|
|||
=> {{ with .Params.publicReplyTo }}{{ . |safeHTML }}{{ else }}mailto:~hedy/posts@lists.sr.ht?subject={{ $subject }}{{ end }} Reply via email publicly (plain-text only)
|
||||
=> mailto:{{ .Site.Author.email }}?subject={{ $subject }} Reply via email privately
|
||||
|
||||
{{ .WordCount }} words
|
||||
{{ partial "lastmod.gmi" (dict "Page" . "Prefix" "This post was last updated on " "Postfix" ".") }}
|
||||
{{ .WordCount }} words{{ partial "tags.gmi" (dict "Page" . "Prefix" " · ") }}
|
||||
|
||||
=> . ← Gemlog
|
||||
=> / ← Capsule home
|
||||
|
|
|
@ -19,7 +19,7 @@
|
|||
</div>
|
||||
{{- end }}
|
||||
{{- define "after" }}
|
||||
{{ if (eq .Params.EOF false) }}{{ else }}<p id="#EOF">EOF</p>{{ end }}
|
||||
<p>{{ partial "tags.html" (dict "Page" .) }}</p>
|
||||
<section class="comments">
|
||||
<p>
|
||||
Questions, comments? Send an email to my{{ $subject := printf "Re: %s" .Title }}
|
||||
|
|
Loading…
Reference in New Issue