FunctionalHacker/hugo-toha
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix rendering in https://themes.gohugo.io/

Browse source
This commit is contained in:
Emruz Hossain 2021-01-01 02:36:53 +06:00
parent 7317ba53de
commit 8184658c19
14 changed files with 61 additions and 43 deletions
Download patch file Download diff file Expand all files Collapse all files

18
layouts/partials/sections/achievements/entry.html
View file

@ -1,16 +1,18 @@
{{ $achievementImage:= resources.Get .image}}
{{ $achievementImage := resources.Get .image }}
{{ $achievementImageLg := ""}}
{{ $achievementImageSm := ""}}
{{/* resize the images. don't resize svg image because its not supported */}}
{{ if $achievementImage }}
{{ $achievementImageSm = $achievementImage.Resize "x300" }}
{{ $achievementImageSm = $achievementImageSm.RelPermalink }}
{{ $achievementImageLg = $achievementImage.Resize "x1500" }}
{{ $achievementImageLg = $achievementImageLg.RelPermalink }}
{{ $achievementImageSm = $achievementImage.Resize "x300" }}
{{ $achievementImageSm = $achievementImageSm.RelPermalink }}
{{ $achievementImageLg = $achievementImage.Resize "x1500" }}
{{ $achievementImageLg = $achievementImageLg.RelPermalink }}
{{ end }}
{{/* don't use "background-image: url('{{ $achievementImageSm }}');" Otherwise the images won't show in https://themes.gohugo.io/ */}}
<div
class="achievement-entry text-center"
style="background-image: url('{{ $achievementImageSm }}');"
style="background-image: url('{{ strings.TrimSuffix "/" site.BaseURL }}{{ $achievementImageSm }}');"
>
<i class="fas fa-search-plus" id="enlarge-icon"></i>
<h4 class="title" id="achievement-title">{{ .title }}</h4>
@ -18,6 +20,6 @@
<h4>{{ .title }}</h4>
<p>{{ .summary | markdownify }}</p>
</div>
<span style="background-image: url('{{ $achievementImageSm }}');" class="d-none" id="SmallImage" active="true"></span>
<span style="background-image: url('{{ $achievementImageLg }}');" class="d-none" id="LargeImage"></span>
<span style="background-image: url('{{ strings.TrimSuffix "/" site.BaseURL }}{{ $achievementImageSm }}');" class="d-none" id="SmallImage" active="true"></span>
<span style="background-image: url('{{ strings.TrimSuffix "/" site.BaseURL }}{{ $achievementImageLg }}');" class="d-none" id="LargeImage"></span>
</div>

35
layouts/partials/sections/home.html
View file

@ -49,50 +49,53 @@
{{/* set the sizes attribute to (min-width: 35em) 1200px, 100vw unless overridden in shortcode */}}
{{ if lt $src.Width "500" }}
{{ $tiny := $src}}
{{ $small := $src}}
{{ $medium := $src}}
{{ $large := $src}}
{{ $tiny := $src}}
{{ $small := $src}}
{{ $medium := $src}}
{{ $large := $src}}
{{ end }}
{{ end }}
{{ if lt $src.Width "800" }}
{{ $small := $src}}
{{ $medium := $src}}
{{ $large := $src}}
{{ $small := $src}}
{{ $medium := $src}}
{{ $large := $src}}
{{ end }}
{{ if lt $src.Width "1200" }}
{{ $medium := $src}}
{{ $large := $src}}
{{ $medium := $src}}
{{ $large := $src}}
{{ end }}
{{ if lt $src.Width "1500" }}
{{ $large := $src}}
{{ $large := $src}}
{{ end }}
<div class="container-fluid home" id="home">
<style>
/* 0 to 299 */
#homePageBackgroundImageDivStyled {
background-image: url('{{ $tiny.RelPermalink }}');
/*background-image: url('{{ $tiny.RelPermalink }}'); This does not work on https://themes.gohugo.io/ */
background-image: url('{{ strings.TrimSuffix "/" site.BaseURL }}{{ $tiny.RelPermalink }}');
}
/* 300 to X */
@media (min-width: 500px) and (max-width: 800px) { /* or 301 if you want really the same as previously. */
#homePageBackgroundImageDivStyled {
background-image: url('{{ $small.RelPermalink }}');
background-image: url('{{ strings.TrimSuffix "/" site.BaseURL }}{{ $small.RelPermalink }}');
}
}
@media (min-width: 801px) and (max-width: 1200px) { /* or 301 if you want really the same as previously. */
#homePageBackgroundImageDivStyled {
background-image: url('{{ $medium.RelPermalink }}');
background-image: url('{{ strings.TrimSuffix "/" site.BaseURL }}{{ $medium.RelPermalink }}');
}
}
@media (min-width: 1201px) and (max-width: 1500px) { /* or 301 if you want really the same as previously. */
#homePageBackgroundImageDivStyled {
background-image: url('{{ $large.RelPermalink }}');
background-image: url('{{ strings.TrimSuffix "/" site.BaseURL }}{{ $large.RelPermalink }}');
}
}
@media (min-width: 1501px) { /* or 301 if you want really the same as previously. */
#homePageBackgroundImageDivStyled {
background-image: url('{{ $src.RelPermalink }}');
background-image: url('{{ strings.TrimSuffix "/" site.BaseURL }}{{ $src.RelPermalink }}');
}
}
</style>