perf(repo-card): only generate used CSS class

This commit is contained in:
ZhenShuo Leo
2025-09-12 11:11:52 +08:00
parent f94f60aef6
commit af221fbf3b
6 changed files with 49 additions and 16 deletions

View File

@@ -119,7 +119,7 @@
{{ end }}
{{/* Repo cards */}}
{{ $repoCards := slice "github" "gitea" "hugging-face" "codeberg" "forgejo" }}
{{ $repoCards := slice "codeberg" "forgejo" "gitea" "github" "hugging-face" }}
{{ $hasRepoCards := false }}
{{ range $repoCards }}
{{ if $.Page.HasShortcode . }}
@@ -131,18 +131,26 @@
{{ $repoColors := site.Data.repoColors }}
{{ $cssRules := slice }}
{{/* default color */}}
{{ $cssRules = $cssRules | append ".language-dot[data-language=\"default\"] { background-color: #0077b6; }" }}
{{/* Hugging Face model color */}}
{{ $cssRules = $cssRules | append ".language-dot[data-language=\"model\"] { background-color: #ff6b35; }" }}
{{ range $lang, $color := $repoColors }}
{{ $cssRules = $cssRules | append (printf ".language-dot[data-language=\"%s\"] { background-color: %s; }" $lang $color) }}
{{ $usedLanguages := $.Page.Store.Get "repoCardLanguages" }}
{{ if not $usedLanguages }}
{{ $usedLanguages = slice "default" }}
{{ else }}
{{ $usedLanguages = $usedLanguages | append "default" }}
{{ end }}
{{ $repoCardCss := resources.FromString "css/repo-cards.css" (delimit $cssRules "\n")
{{ range $usedLanguages }}
{{ if eq . "default" }}
{{ $cssRules = $cssRules | append ".language-dot[data-language=\"default\"] { background-color: #0077b6; }" }}
{{ else if eq . "model" }}
{{ $cssRules = $cssRules | append ".language-dot[data-language=\"model\"] { background-color: #ff6b35; }" }}
{{ else if index $repoColors . }}
{{ $color := index $repoColors . }}
{{ $cssRules = $cssRules | append (printf ".language-dot[data-language=\"%s\"] { background-color: %s; }" . $color) }}
{{ end }}
{{ end }}
{{ $repoCardCSS := resources.FromString "css/repo-cards.css" (delimit $cssRules "\n")
| minify | resources.Fingerprint (.Site.Params.fingerprintAlgorithm | default "sha512")
}}
<link rel="stylesheet" href="{{ $repoCardCss.RelPermalink }}" integrity="{{ $repoCardCss.Data.Integrity }}">
<link rel="stylesheet" href="{{ $repoCardCSS.RelPermalink }}" integrity="{{ $repoCardCSS.Data.Integrity }}">
{{ end }}

View File

@@ -33,7 +33,12 @@
</p>
<div class="m-0 mt-2 flex items-center">
<span class="mr-1 inline-block h-3 w-3 rounded-full language-dot" data-language="{{ .language | default "default" }}"></span>
{{ $language := cond .language .language "default" }}
{{ $currentLangs := $.Page.Store.Get "repoCardLanguages" | default slice }}
{{ $.Page.Store.Set "repoCardLanguages" ($currentLangs | append $language) }}
<span
class="mr-1 inline-block h-3 w-3 rounded-full language-dot"
data-language="{{ $language }}"></span>
<div class="m-0 mr-5 text-md text-neutral-800 dark:text-neutral">
{{ if .language }}{{ .language }}{{ else }}null{{ end }}
</div>

View File

@@ -33,7 +33,12 @@
</p>
<div class="m-0 mt-2 flex items-center">
<span class="mr-1 inline-block h-3 w-3 rounded-full language-dot" data-language="{{ .language | default "default" }}"></span>
{{ $language := cond .language .language "default" }}
{{ $currentLangs := $.Page.Store.Get "repoCardLanguages" | default slice }}
{{ $.Page.Store.Set "repoCardLanguages" ($currentLangs | append $language) }}
<span
class="mr-1 inline-block h-3 w-3 rounded-full language-dot"
data-language="{{ $language }}"></span>
<div class="m-0 mr-5 text-md text-neutral-800 dark:text-neutral">
{{ if .language }}{{ .language }}{{ else }}null{{ end }}
</div>

View File

@@ -33,7 +33,12 @@
</p>
<div class="m-0 mt-2 flex items-center">
<span class="mr-1 inline-block h-3 w-3 rounded-full language-dot" data-language="{{ .language | default "default" }}"></span>
{{ $language := cond .language .language "default" }}
{{ $currentLangs := $.Page.Store.Get "repoCardLanguages" | default slice }}
{{ $.Page.Store.Set "repoCardLanguages" ($currentLangs | append $language) }}
<span
class="mr-1 inline-block h-3 w-3 rounded-full language-dot"
data-language="{{ $language }}"></span>
<div class="m-0 mr-5 text-md text-neutral-800 dark:text-neutral">
{{ if .language }}{{ .language }}{{ else }}null{{ end }}
</div>

View File

@@ -46,7 +46,12 @@
</p>
<div class="m-0 mt-2 flex items-center">
<span class="mr-1 inline-block h-3 w-3 rounded-full language-dot" data-language="{{ .language | default "default" }}"></span>
{{ $language := cond .language .language "default" }}
{{ $currentLangs := $.Page.Store.Get "repoCardLanguages" | default slice }}
{{ $.Page.Store.Set "repoCardLanguages" ($currentLangs | append $language) }}
<span
class="mr-1 inline-block h-3 w-3 rounded-full language-dot"
data-language="{{ $language }}"></span>
<div class="m-0 mr-5 text-md text-neutral-800 dark:text-neutral">
{{ if .language }}{{ .language }}{{ else }}null{{ end }}
</div>

View File

@@ -53,7 +53,12 @@
<div class="m-0 mt-2 flex items-center">
<span class="mr-1 inline-block h-3 w-3 rounded-full language-dot" data-language="{{ cond (eq $type "model") "model" "default" }}"></span>
{{ $language := cond (eq $type "model") "model" "default" }}
{{ $currentLangs := $.Page.Store.Get "repoCardLanguages" | default slice }}
{{ $.Page.Store.Set "repoCardLanguages" ($currentLangs | append $language) }}
<span
class="mr-1 inline-block h-3 w-3 rounded-full language-dot"
data-language="{{ $language }}"></span>
<div class="m-0 mr-5 text-md text-neutral-800 dark:text-neutral">
{{ if eq $type "model" }}
{{ if .pipeline_tag }}{{ .pipeline_tag }}{{ else }}model{{ end }}