experience.html 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475
  1. {{ $ := .root }}
  2. {{ $page := .page }}
  3. {{ $columns := $page.Params.design.columns | default "2" }}
  4. <!-- Experience widget -->
  5. <div class="col-12 {{if eq $columns "2"}}col-lg-8{{end}}">
  6. {{ with $page.Content }}{{ . }}{{ end }}
  7. {{ if $page.Params.experience }}
  8. {{ $exp_len := len $page.Params.experience }}
  9. {{/* Default to user's custom order (as requested in #1761) as Hugo doesn't support multiple sorts on params. */}}
  10. {{ range $idx, $key := $page.Params.experience }}
  11. <div class="row experience">
  12. <!-- Timeline -->
  13. <div class="col-auto text-center flex-column d-none d-sm-flex">
  14. <div class="row h-50">
  15. <div class="col {{if gt $idx 0}}border-right{{end}}">&nbsp;</div>
  16. <div class="col">&nbsp;</div>
  17. </div>
  18. <div class="m-2">
  19. <span class="badge badge-pill border {{if not .date_end}}exp-fill{{end}}">&nbsp;</span>
  20. </div>
  21. <div class="row h-50">
  22. <div class="col {{if lt $idx (sub $exp_len 1)}}border-right{{end}}">&nbsp;</div>
  23. <div class="col">&nbsp;</div>
  24. </div>
  25. </div>
  26. <!-- Content -->
  27. <div class="col py-2">
  28. <div class="card">
  29. <div class="card-body">
  30. {{- if .company_logo}}
  31. {{- $svg_icon := resources.Get (printf "media/icons/brands/%s.svg" .company_logo) -}}
  32. {{ if not $svg_icon }}{{ errorf "Brand logo not found at `assets/media/icons/brands/%s.svg`" .company_logo }}{{end}}
  33. <div class="d-flex align-content-start">
  34. <div class="mr-2 mb-2">
  35. {{- with .company_url}}<a href="{{.}}" target="_blank" rel="noopener">{{end -}}
  36. <img src="{{ $svg_icon.RelPermalink }}" width="56px" height="56px" alt="{{.company | plainify}}" loading="lazy">
  37. {{- with .company_url}}</a>{{end -}}
  38. </div>
  39. <div>
  40. {{ end }}
  41. <div class="section-subheading card-title exp-title text-muted my-0">{{.title | markdownify | emojify}}</div>
  42. <div class="section-subheading card-title exp-company text-muted my-0">
  43. {{- with .company_url}}<a href="{{.}}" target="_blank" rel="noopener">{{end}}{{.company | markdownify | emojify}}{{with .company_url}}</a>{{end -}}
  44. </div>
  45. <div class="text-muted exp-meta">
  46. {{ (time .date_start) | time.Format ($page.Params.date_format | default "January 2006") }} –
  47. {{ if .date_end}}
  48. {{ (time .date_end) | time.Format ($page.Params.date_format | default "January 2006") }}
  49. {{else}}
  50. {{ i18n "present" | default "Present" }}
  51. {{end}}
  52. {{with .location}}
  53. <span class="middot-divider"></span>
  54. <span>{{.}}</span>
  55. {{end}}
  56. </div>
  57. {{- if .company_logo}}
  58. </div>
  59. </div>
  60. {{end}}
  61. {{with .description}}<div class="card-text">{{. | markdownify | emojify}}</div>{{end}}
  62. </div>
  63. </div>
  64. </div>
  65. </div>
  66. {{end}}
  67. {{end}}
  68. </div>