page_header.html 2.9 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192
  1. {{ $page := . }}
  2. {{ $featured := (.Resources.ByType "image").GetMatch "*featured*" }}
  3. {{ $anchor := $page.Params.image.focal_point | default "Smart" }}
  4. {{/* Set default titles for node pages */}}
  5. {{ $title := .Title }}
  6. {{ if and (not $title) .IsNode }}
  7. {{ if eq .Type "post" }}
  8. {{ $title = i18n "posts" }}
  9. {{ else if eq .Type "talk" }}
  10. {{ $title = i18n "talks" }}
  11. {{ else if eq .Type "publication" }}
  12. {{ $title = i18n "publications" }}
  13. {{end}}
  14. {{end}}
  15. {{/* Header image */}}
  16. {{ if and .Params.header.image (not $featured) }}
  17. <div class="article-header">
  18. {{ $img_src := urls.Parse .Params.header.image }}
  19. {{ if $img_src.Scheme }}
  20. <img src="{{ .Params.header.image }}" class="article-banner" itemprop="image" alt="">
  21. {{ else }}
  22. <img src="{{ (printf "/img/%s" .Params.header.image) | relURL }}" class="article-banner" itemprop="image" alt="">
  23. {{ end }}
  24. {{ with .Params.header.caption }}<span class="article-header-caption">{{ . | markdownify | emojify }}</span>{{ end }}
  25. </div>
  26. {{end}}
  27. {{/* Featured image */}}
  28. {{ with $featured }}
  29. {{ $image := .Fill (printf "1600x400 q90 %s" $anchor) }}
  30. <div class="article-header d-xl-none">
  31. <img src="{{ $image.RelPermalink }}" class="article-banner" itemprop="image" alt="">
  32. {{ with $.Params.image.caption }}<span class="article-header-caption">{{ . | markdownify | emojify }}</span>{{ end }}
  33. </div>
  34. {{ $image := .Fill (printf "680x500 q90 %s" $anchor) }}
  35. <div class="container-fluid split-header d-none d-xl-block">
  36. <div class="row">
  37. <div class="col-6">
  38. <div class="split-header-content">
  39. <h1 itemprop="name">{{ $title }}</h1>
  40. {{ with $page.Params.subtitle }}
  41. <p class="page-subtitle">{{ . | markdownify | emojify }}</p>
  42. {{end}}
  43. {{ partial "page_metadata" (dict "content" $page "is_list" 1) }}
  44. {{ partial "share.html" $page }}
  45. </div>
  46. </div>
  47. <div class="col-6">
  48. <div class="split-header-image">
  49. <img src="{{ $image.RelPermalink }}" itemprop="image" alt="">
  50. {{ with $.Params.image.caption }}<span class="article-header-caption">{{ . | markdownify | emojify }}</span>{{ end }}
  51. </div>
  52. </div>
  53. </div>
  54. </div>
  55. <div class="article-container d-xl-none">
  56. <h1 itemprop="name">{{ $title }}</h1>
  57. {{ with $page.Params.subtitle }}
  58. <p class="page-subtitle">{{ . | markdownify | emojify }}</p>
  59. {{end}}
  60. {{ partial "page_metadata" (dict "content" $page "is_list" 0) }}
  61. </div>
  62. {{else}}
  63. {{/* Case when page has no image */}}
  64. {{/* Wider container for nodes */}}
  65. {{ $ctnr := "article-container" }}
  66. {{ if $page.IsNode }}
  67. {{ $ctnr = "universal-wrapper" }}
  68. {{end}}
  69. <div class="{{$ctnr}} pt-3">
  70. <h1 itemprop="name">{{ $title }}</h1>
  71. {{ with $page.Params.subtitle }}
  72. <p class="page-subtitle">{{ . | markdownify | emojify }}</p>
  73. {{end}}
  74. {{ if not .IsNode }}
  75. {{ partial "page_metadata" (dict "content" $page "is_list" 0) }}
  76. {{end}}
  77. </div>
  78. {{end}}