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

Add project image (#987)

Browse source 
Co-authored-by: Emruz Hossain <hossainemruz@gmail.com>
This commit is contained in:
JY Hsu 2024-10-19 01:51:40 +09:00 • committed by GitHub
parent 22531ce9a8
commit bc67ca1187
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 50 additions and 27 deletions
Download patch file Download diff file Expand all files Collapse all files

9
assets/styles/components/cards.scss
View file

@ -9,6 +9,11 @@
box-shadow: $box-shadow;
border: 1px solid get-light-color('bg-primary');
@include transition();
.card-img-top {
transform: scale(1.2);
object-fit: cover;
@include transition();
}
}
.card-head {
@ -17,6 +22,10 @@
overflow: hidden;
}
.card-title {
font-size: large;
}
.card-body {
text-align: left;
}

66
layouts/partials/cards/project.html
View file

@ -4,34 +4,48 @@
>
<div class="card mt-1">
<div class="card">
<a class="card-header" href="{{ if .repo }}{{ .repo }}{{ else if .url }}{{ .url }}{{ else }}javascript:void(0){{ end }}" {{ if or .repo .url }}target="_blank" rel="noopener"{{ end }}>
<div>
<div class="d-flex">
{{ if .logo }}
{{ if eq (len (findRE ".*/.*" .logo) ) 0 }}
<i style="padding-right: 0.25em" class="{{.logo}} h4"></i>
{{ else }}
{{ $logoImage:= resources.Get .logo}}
{{ if $logoImage }}
{{/* svg don't support "Fit" operation */}}
{{ if ne $logoImage.MediaType.SubType "svg" }}
{{ $logoImage = $logoImage.Fit "24x24" }}
{{ end }}
<img class="card-img-xs" src="{{ $logoImage.RelPermalink }}" alt="{{ .name }}" />
{{ end }}
{{ end }}
<a href="{{ if .repo }}{{ .repo }}{{ else if .url }}{{ .url }}{{ else }}javascript:void(0){{ end }}" {{ if or .repo .url }}target="_blank" rel="noopener"{{ end }}>
{{ if .image }}
<div class="card-head">
{{ $imageImage:= resources.Get .image}}
{{ if $imageImage }}
{{/* svg don't support "Fit" operation */}}
{{ if ne $imageImage.MediaType.SubType "svg" }}
{{ $imageImage = $imageImage.Fit "1000x1000" }}
{{ end }}
<img class="card-img-top" src="{{ $imageImage.RelPermalink }}" alt="{{ .name }}" />
{{ end }}
</div>
{{ end }}
<div class="card-header">
<div>
<div class="d-flex">
{{ if .logo }}
<h5 class="card-title mb-0">{{ .name }}</h5>
</div>
<div class="sub-title">
<span>{{ .role }}</span>
<span>{{ .timeline }}</span>
{{ if eq (len (findRE ".*/.*" .logo) ) 0 }}
<i style="padding-right: 0.25em" class="{{.logo}} h4"></i>
{{ else }}
{{ $logoImage:= resources.Get .logo}}
{{ if $logoImage }}
{{/* svg don't support "Fit" operation */}}
{{ if ne $logoImage.MediaType.SubType "svg" }}
{{ $logoImage = $logoImage.Fit "24x24" }}
{{ end }}
<img class="card-img-xs" src="{{ $logoImage.RelPermalink }}" alt="{{ .name }}" />
{{ end }}
{{ end }}
{{ end }}
<h5 class="card-title mb-0">{{ .name }}</h5>
</div>
<div class="sub-title">
<span>{{ .role }}</span>
<span>{{ .timeline }}</span>
</div>
</div>
</div>
</a>