bug: Body post still artificially shifted to the left even if there is no 'Table of contents' or 'Related contents' blocks

[ramiro]

Expected Behavior

Current Behavior

If there is no Table of contents or Related content blocks defined the post page layout still leaves horizontal room for them to the right of the main content block.

This, along "measure" (readable body copy line length) results in the post body to be artificially shifted to the left.

Possible Solution

Will open PR with a proposed fix.

Steps to Reproduce

1. Head over https://ananke-theme.netlify.app/post/chapter-6/ (blog post in official example site)
2. Observe how horizontal alignment of the post body puts it toward the left and there is a big blank space to the right (see screenshot below, taken on a 1792 x 1120 desktop display)

The bigger picture (we need context)

uname -a output:

Linux amd2 5.15.0-1059-oracle #65~20.04.1-Ubuntu SMP Fri Apr 19 14:17:36 UTC 2024 x86_64 x86_64 x86_64 GNU/Linux

• hugo version: hugo v0.131.0-bfbee17932ff24009008aa94cdd75c0c41f59279+extended linux/amd64 BuildDate=2024-08-02T09:03:48Z VendorInfo=gohugoio
• go version: go version go1.22.3 linux/amd64 (not relevant as I am not compiling hugo myself nor using go-based installation method)
• git submodule status:

  9a3577540ce71b6d3f4ff5e2ed4cecb7a211eb90 themes/ananke (heads/ramiro2)
  

Hugo Config

archetypedir = 'archetypes'
assetdir = 'assets'
baseurl = 'https://example.com/'
cachedir = '/home/ramiro/.cache/hugo_cache'
capitalizelisttitles = true
cleandestinationdir = true
contentdir = 'content'
datadir = 'data'
defaultcontentlanguage = 'es'
disablehugogeneratorinject = true
enablerobotstxt = true
environment = 'production'
i18ndir = 'i18n'
languagecode = 'es'
layoutdir = 'layouts'
paginate = 12
pluralizelisttitles = true
publishdir = 'public'
resourcedir = 'resources'
staticdir = ['static']
summarylength = 70
theme = ['ananke']
themesdir = 'themes'
timeout = '30s'
title = 'Un blog sobre inversiones'
titlecasestyle = 'AP'
workingdir = '/home/ramiro/src/blog'
[build]

useresourcecachewhen = 'fallback'
[build.buildstats]
[[build.cachebusters]]

source = '(postcss|tailwind).config.js'

target = '(css|styles|scss|sass)'
[caches]

[caches.assets]

dir = ':resourceDir/_gen'

maxage = -1
[caches.getcsv]

dir = ':cacheDir/:project'

maxage = -1
[caches.getjson]

dir = ':cacheDir/:project'

maxage = -1
[caches.getresource]

dir = ':cacheDir/:project'

maxage = -1
[caches.images]

dir = ':resourceDir/_gen'

maxage = -1
[caches.modules]

dir = ':cacheDir/modules'

maxage = -1
[deployment]

invalidatecdn = true

maxdeletes = 256

workers = 10
[frontmatter]

date = ['date', 'publishdate', 'pubdate', 'published', 'lastmod', 'modified']

expirydate = ['expirydate', 'unpublishdate']

lastmod = [':git', 'lastmod', 'modified', 'date', 'publishdate', 'pubdate', 'published']

publishdate = ['publishdate', 'pubdate', 'published', 'date']
[httpcache]

[httpcache.cache]

[httpcache.cache.for]

excludes = ['**']
[[httpcache.polls]]

disable = true

high = '0s'

low = '0s'
[httpcache.polls.for]
  includes = ['**']

[imaging]

bgcolor = '#ffffff'

hint = 'photo'

quality = 75

resamplefilter = 'box'
[languages]

[languages.es]

languagecode = 'es'
[markup]

defaultmarkdownhandler = 'goldmark'
[markup.asciidocext]

backend = 'html5'

failurelevel = 'fatal'

noheaderorfooter = true

safemode = 'unsafe'
[markup.goldmark]

[markup.goldmark.extensions]

definitionlist = true

footnote = true

linkify = true

linkifyprotocol = 'https'

strikethrough = true

table = true

tasklist = true
  [markup.goldmark.extensions.cjk]
    eastasianlinebreaksstyle = 'simple'

  [markup.goldmark.extensions.extras]
    [markup.goldmark.extensions.extras.delete]

    [markup.goldmark.extensions.extras.insert]

    [markup.goldmark.extensions.extras.mark]

    [markup.goldmark.extensions.extras.subscript]

    [markup.goldmark.extensions.extras.superscript]

  [markup.goldmark.extensions.passthrough]
    enable = true

    [markup.goldmark.extensions.passthrough.delimiters]
      block = [['\[', '\]'], ['$$', '$$']]
      inline = [['\(', '\)']]

  [markup.goldmark.extensions.typographer]
    apostrophe = '’'
    ellipsis = '…'
    emdash = '—'
    endash = '–'
    leftanglequote = '«'
    leftdoublequote = '“'
    leftsinglequote = '‘'
    rightanglequote = '»'
    rightdoublequote = '”'
    rightsinglequote = '’'

[markup.goldmark.parser]
  autoheadingid = true
  autoheadingidtype = 'github'
  wrapstandaloneimagewithinparagraph = true

  [markup.goldmark.parser.attribute]
    block = true
    title = true

[markup.goldmark.renderer]

[markup.goldmark.renderhooks]
  [markup.goldmark.renderhooks.image]

  [markup.goldmark.renderhooks.link]

[markup.highlight]

codefences = true

linenostart = 1

linenumbersintable = true

noclasses = true

style = 'monokai'

tabwidth = 4
[markup.tableofcontents]

endlevel = 3

startlevel = 2
[mediatypes]

[mediatypes.'application/json']

delimiter = '.'

suffixes = ['json']
[mediatypes.'application/manifest+json']

delimiter = '.'

suffixes = ['webmanifest']
[mediatypes.'application/octet-stream']

delimiter = '.'
[mediatypes.'application/pdf']

delimiter = '.'

suffixes = ['pdf']
[mediatypes.'application/rss+xml']

delimiter = '.'

suffixes = ['xml', 'rss']
[mediatypes.'application/toml']

delimiter = '.'

suffixes = ['toml']
[mediatypes.'application/wasm']

delimiter = '.'

suffixes = ['wasm']
[mediatypes.'application/xml']

delimiter = '.'

suffixes = ['xml']
[mediatypes.'application/yaml']

delimiter = '.'

suffixes = ['yaml', 'yml']
[mediatypes.'font/otf']

delimiter = '.'

suffixes = ['otf']
[mediatypes.'font/ttf']

delimiter = '.'

suffixes = ['ttf']
[mediatypes.'image/bmp']

delimiter = '.'

suffixes = ['bmp']
[mediatypes.'image/gif']

delimiter = '.'

suffixes = ['gif']
[mediatypes.'image/jpeg']

delimiter = '.'

suffixes = ['jpg', 'jpeg', 'jpe', 'jif', 'jfif']
[mediatypes.'image/png']

delimiter = '.'

suffixes = ['png']
[mediatypes.'image/svg+xml']

delimiter = '.'

suffixes = ['svg']
[mediatypes.'image/tiff']

delimiter = '.'

suffixes = ['tif', 'tiff']
[mediatypes.'image/webp']

delimiter = '.'

suffixes = ['webp']
[mediatypes.'text/asciidoc']

delimiter = '.'

suffixes = ['adoc', 'asciidoc', 'ad']
[mediatypes.'text/calendar']

delimiter = '.'

suffixes = ['ics']
[mediatypes.'text/css']

delimiter = '.'

suffixes = ['css']
[mediatypes.'text/csv']

delimiter = '.'

suffixes = ['csv']
[mediatypes.'text/html']

delimiter = '.'

suffixes = ['html', 'htm']
[mediatypes.'text/javascript']

delimiter = '.'

suffixes = ['js', 'jsm', 'mjs']
[mediatypes.'text/jsx']

delimiter = '.'

suffixes = ['jsx']
[mediatypes.'text/markdown']

delimiter = '.'

suffixes = ['md', 'mdown', 'markdown']
[mediatypes.'text/org']

delimiter = '.'

suffixes = ['org']
[mediatypes.'text/pandoc']

delimiter = '.'

suffixes = ['pandoc', 'pdc']
[mediatypes.'text/plain']

delimiter = '.'

suffixes = ['txt']
[mediatypes.'text/rst']

delimiter = '.'

suffixes = ['rst']
[mediatypes.'text/tsx']

delimiter = '.'

suffixes = ['tsx']
[mediatypes.'text/typescript']

delimiter = '.'

suffixes = ['ts']
[mediatypes.'text/x-sass']

delimiter = '.'

suffixes = ['sass']
[mediatypes.'text/x-scss']

delimiter = '.'

suffixes = ['scss']
[mediatypes.'video/3gpp']

delimiter = '.'

suffixes = ['3gpp', '3gp']
[mediatypes.'video/mp4']

delimiter = '.'

suffixes = ['mp4']
[mediatypes.'video/mpeg']

delimiter = '.'

suffixes = ['mpg', 'mpeg']
[mediatypes.'video/ogg']

delimiter = '.'

suffixes = ['ogv']
[mediatypes.'video/webm']

delimiter = '.'

suffixes = ['webm']
[mediatypes.'video/x-msvideo']

delimiter = '.'

suffixes = ['avi']
[minify]

[minify.tdewolff]

[minify.tdewolff.css]

keepcss2 = true
[minify.tdewolff.html]
  keepdefaultattrvals = true
  keepdocumenttags = true
  keependtags = true
  keepspecialcomments = true
  templatedelims = ['', '']

[minify.tdewolff.js]
  version = 2022

[minify.tdewolff.json]

[minify.tdewolff.svg]

[minify.tdewolff.xml]

[module]

noproxy = 'none'

private = '.'

proxy = 'direct'

workspace = 'off'
[module.hugoversion]
[[module.imports]]

path = 'ananke'
[[module.mounts]]

source = 'content'

target = 'content'
[[module.mounts]]

source = 'data'

target = 'data'
[[module.mounts]]

source = 'layouts'

target = 'layouts'
[[module.mounts]]

source = 'i18n'

target = 'i18n'
[[module.mounts]]

source = 'archetypes'

target = 'archetypes'
[[module.mounts]]

source = 'assets'

target = 'assets'
[[module.mounts]]

source = 'static'

target = 'static'
[outputformats]

[outputformats.amp]

basename = 'index'

ishtml = true

mediatype = 'text/html'

path = 'amp'

permalinkable = true

rel = 'amphtml'
[outputformats.calendar]

basename = 'index'

isplaintext = true

mediatype = 'text/calendar'

protocol = 'webcal://'

rel = 'alternate'
[outputformats.css]

basename = 'styles'

isplaintext = true

mediatype = 'text/css'

notalternative = true

rel = 'stylesheet'
[outputformats.csv]

basename = 'index'

isplaintext = true

mediatype = 'text/csv'

rel = 'alternate'
[outputformats.html]

basename = 'index'

ishtml = true

mediatype = 'text/html'

permalinkable = true

rel = 'canonical'

weight = 10
[outputformats.json]

basename = 'index'

isplaintext = true

mediatype = 'application/json'

rel = 'alternate'
[outputformats.markdown]

basename = 'index'

isplaintext = true

mediatype = 'text/markdown'

rel = 'alternate'
[outputformats.robots]

basename = 'robots'

isplaintext = true

mediatype = 'text/plain'

rel = 'alternate'

root = true
[outputformats.rss]

basename = 'index'

mediatype = 'application/rss+xml'

nougly = true

rel = 'alternate'
[outputformats.sitemap]

basename = 'sitemap'

mediatype = 'application/xml'

rel = 'sitemap'

ugly = true
[outputformats.webappmanifest]

basename = 'manifest'

isplaintext = true

mediatype = 'application/manifest+json'

notalternative = true

rel = 'manifest'
[outputs]

home = ['html', 'rss']

page = ['html']

rss = ['rss']

section = ['html', 'rss']

taxonomy = ['html', 'rss']

term = ['html', 'rss']
[pagination]

pagersize = 12

path = 'page'
[params]

author = 'Autjor Name'

background_color_class = 'bg-black'

body_classes = 'avenir bg-white'

cover_dimming_class = 'bg-black-30'

custom_css = ['style.css']

date_format = ':date_medium'

description = 'Theme description placeholder'

favicon = '/favicon.ico'

featured_image_class = 'cover bg-center'

post_content_classes = 'athelas bg-white nested-copy-hyphens-auto'

recent_posts_number = 6

show_reading_time = true
[params.ananke]

[params.ananke.social]

icon_path = 'ananke/socials/%s.svg'
  [params.ananke.social.follow]
    networks = ['x-twitter', 'linkedin']

  [params.ananke.social.linkedin]
    rel = 'me'
    username = 'username'

  [[params.ananke.social.networks]]
    color = '#1185fe'
    icon = 'bluesky'
    label = 'Bluesky'
    link = 'https://bsky.app/intent/compose'
    profile = 'https://bsky.app/profile/%s'
    slug = 'bluesky'

    [params.ananke.social.networks.particles]
      text = 'permalink'

  [[params.ananke.social.networks]]
    icon = 'envelope'
    label = 'Email'
    link = 'mailto:'
    slug = 'email'

    [params.ananke.social.networks.particles]
      body = 'permalink'
      subject = 'title'

  [[params.ananke.social.networks]]
    color = '#3b5998'
    icon = 'facebook'
    label = 'Facebook'
    link = 'https://facebook.com/sharer/sharer.php'
    profile = 'https://www.facebook.com/%s'
    slug = 'facebook'

    [params.ananke.social.networks.particles]
      u = 'permalink'

  [[params.ananke.social.networks]]
    color = '#6cc644'
    icon = 'github'
    label = 'GitHub'
    profile = 'https://github.com/%s/'
    slug = 'github'

  [[params.ananke.social.networks]]
    color = '#FC6D26'
    icon = 'gitlab'
    label = 'GitLab'
    profile = 'https://gitlab.com/%s/'
    slug = 'gitlab'

  [[params.ananke.social.networks]]
    color = '#ff4000'
    icon = 'hacker-news'
    label = 'Hacker News'
    link = 'https://news.ycombinator.com/submitlink'
    profile = 'https://news.ycombinator.com/user?id=%s'
    slug = 'hackernews'

    [params.ananke.social.networks.particles]
      t = 'description'
      u = 'permalink'

  [[params.ananke.social.networks]]
    color = '#e1306c'
    icon = 'instagram'
    label = 'Instagram'
    profile = 'https://www.instagram.com/%s/'
    slug = 'instagram'

  [[params.ananke.social.networks]]
    color = '#3d76ff'
    icon = 'keybase'
    label = 'Keybase'
    profile = 'https://keybase.io/%s'
    slug = 'keybase'

  [[params.ananke.social.networks]]
    color = '#0077b5'
    icon = 'linkedin'
    label = 'LinkedIn'
    link = 'https://www.linkedin.com/shareArticle'
    profile = 'http://linkedin.com/in/%s'
    slug = 'linkedin'

    [params.ananke.social.networks.particles]
      params = 'mini=true'
      source = 'permalink'
      summary = 'description'
      title = 'title'
      url = 'permalink'

  [[params.ananke.social.networks]]
    color = '#0077b5'
    icon = 'medium'
    label = 'Medium'
    profile = 'https://medium.com/@%s/'
    slug = 'medium'

  [[params.ananke.social.networks]]
    color = '#6364FF'
    icon = 'mastodon'
    label = 'Mastodon'
    slug = 'mastodon'

  [[params.ananke.social.networks]]
    color = '#e60023'
    icon = 'pinterest'
    label = 'Pinterest'
    link = 'https://pinterest.com/pin/create/button/'
    profile = 'https://www.pinterest.com/%s/'
    slug = 'pinterest'

    [params.ananke.social.networks.particles]
      description = 'description'
      media = 'permalink'
      url = 'permalink'

  [[params.ananke.social.networks]]
    color = '#ff4500'
    icon = 'reddit'
    label = 'Reddit'
    link = 'https://reddit.com/submit/'
    profile = 'https://www.reddit.com/user/%s/'
    slug = 'reddit'

    [params.ananke.social.networks.particles]
      params = 'resubmit=true'
      title = 'title'
      url = 'permalink'

  [[params.ananke.social.networks]]
    color = '#ff6f1a'
    icon = 'rss'
    label = 'RSS'
    slug = 'rss'

  [[params.ananke.social.networks]]
    color = '#E01E5A'
    icon = 'slack'
    label = 'Slack'
    slug = 'slack'

  [[params.ananke.social.networks]]
    color = '#f48024'
    icon = 'stack-overflow'
    label = 'Stack Overflow'
    profile = 'https://stackoverflow.com/users/%s'
    slug = 'stackoverflow'

  [[params.ananke.social.networks]]
    color = '#0088cc'
    icon = 'telegram'
    label = 'Telegram'
    link = 'https://telegram.me/share/url'
    profile = 'https://t.me/%s'
    slug = 'telegram'

    [params.ananke.social.networks.particles]
      text = 'description'
      url = 'permalink'

  [[params.ananke.social.networks]]
    color = '#fe2c55'
    icon = 'tiktok'
    label = 'TikTok'
    profile = 'https://www.tiktok.com/@%s'
    slug = 'tiktok'

  [[params.ananke.social.networks]]
    color = '#35465c'
    icon = 'tumblr'
    label = 'Tumblr'
    link = 'https://www.tumblr.com/widgets/share/tool'
    profile = 'https://www.tumblr.com/blog/%s'
    slug = 'tumblr'

    [params.ananke.social.networks.particles]
      canonicalurl = 'permalink'
      caption = 'description'
      content = 'description'
      params = 'posttype=link'
      sharesource = 'source'
      title = 'title'

  [[params.ananke.social.networks]]
    color = '#1da1f2'
    icon = 'twitter'
    label = 'Twitter'
    link = 'https://twitter.com/intent/tweet/'
    profile = 'https://twitter.com/%s'
    slug = 'twitter'

    [params.ananke.social.networks.particles]
      text = 'description'
      url = 'permalink'

  [[params.ananke.social.networks]]
    color = '#25d366'
    icon = 'whatsapp'
    label = 'WhatsApp'
    link = 'whatsapp://send'
    linkintext = true
    slug = 'whatsapp'

    [params.ananke.social.networks.particles]
      text = 'description'

  [[params.ananke.social.networks]]
    color = '#026466'
    icon = 'xing'
    label = 'Xing'
    link = 'https://www.xing.com/app/user'
    profile = 'https://www.xing.com/profile/%s'
    separator = ';'
    slug = 'xing'

    [params.ananke.social.networks.particles]
      params = 'op=share'
      title = 'title'
      url = 'permalink'

  [[params.ananke.social.networks]]
    color = '#000000'
    icon = 'x-twitter'
    label = 'X'
    link = 'https://twitter.com/intent/tweet/'
    profile = 'https://x.com/%s'
    slug = 'x-twitter'

    [params.ananke.social.networks.particles]
      text = 'description'
      url = 'permalink'

  [[params.ananke.social.networks]]
    color = '#cd201f'
    icon = 'youtube'
    label = 'YouTube'
    profile = 'https://www.youtube.com/@%s'
    slug = 'youtube'

  [params.ananke.social.share]
    icons = true
    networks = ['x-twitter', 'facebook', 'linkedin']
    sharetext = true

  [params.ananke.social.x-twitter]
    rel = 'me'
    username = 'username'

[params.contact]

email = '[email protected]'
[permalinks]
[privacy]

[privacy.disqus]
[privacy.googleanalytics]
[privacy.instagram]
[privacy.twitter]
[privacy.vimeo]
[privacy.youtube]
[related]

threshold = 80
[[related.indices]]

name = 'keywords'

type = 'basic'

weight = 100
[[related.indices]]

name = 'date'

type = 'basic'

weight = 10
[[related.indices]]

name = 'tags'

type = 'basic'

weight = 80
[security]

[security.exec]

allow = ['^(dart-)?sass(-embedded)?$', '^go$', '^git$', '^npx$', '^postcss$', '^tailwindcss$']

osenv = ['(?i)^((HTTPS?|NO)PROXY|PATH(EXT)?|APPDATA|TE?MP|TERM|GO\w+|(XDG_CONFIG)?HOME|USERPROFILE|SSH_AUTH_SOCK|DISPLAY|LANG|SYSTEMDRIVE)$']
[security.funcs]

getenv = ['^HUGO_', '^CI$']
[security.http]

methods = ['(?i)GET|POST']

urls = ['.*']
[server]

[[server.redirects]]

from = '**'

status = 404

to = '/404.html'
[services]

[services.disqus]
[services.googleanalytics]
[services.instagram]
[services.rss]

limit = -1
[services.twitter]
[sitemap]

filename = 'sitemap.xml'

priority = -1
[taxonomies]

tag = 'tags'