Public/blowfish
1
0 Fork 0
mirror of https://github.com/nunocoracao/blowfish.git synced 2026-10-20 02:35:22 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #1306 from nunocoracao/1174--global-site-background-image

Browse Source 
🎨 backgrounds and feature images support svg
This commit is contained in:
Nuno Coração authored and GitHub committed 2024-03-09 23:45:21 +00:00
2 parents b490f97b8b 8bbd8b8626
commit 3ec8dbc5cb
11 files changed
+91 -15
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

assets/img/background.svg
+1
View File
@@ -0,0 +1 @@
<svg id='patternId' width='100%' height='100%' xmlns='http://www.w3.org/2000/svg'><defs><pattern id='a' patternUnits='userSpaceOnUse' width='20' height='20' patternTransform='scale(5) rotate(0)'><rect x='0' y='0' width='100%' height='100%' fill='hsla(0,0%,100%,1)'/><path d='M0-10C-.011-4.49-4.485.03-10 .03-4.485.03-.011 4.49 0 10 .011 4.498 4.493.001 10-.01 4.493-.02.012-4.498 0-10zm0 20c-.011 5.51-4.485 10.03-10 10.03 5.515 0 9.989 4.46 10 9.97.011-5.502 4.493-9.999 10-10.01C4.493 19.98.012 15.502 0 10zm20-20C19.989-4.49 15.515.03 10 .03c5.515 0 9.989 4.46 10 9.97.011-5.502 4.493-9.999 10-10.01-5.507-.01-9.988-4.488-10-9.99zm0 20c-.011 5.51-4.485 10.03-10 10.03 5.515 0 9.989 4.46 10 9.97.011-5.502 4.493-9.999 10-10.01-5.507-.01-9.988-4.488-10-9.99z' stroke-width='1' stroke='hsla(258.5,59.4%,59.4%,1)' fill='none'/><path d='M10 0C9.989 5.51 5.515 10.03 0 10.03c5.515 0 9.989 4.46 10 9.97.011-5.502 4.493-9.998 10-10.01-5.507-.01-9.988-4.488-10-9.99z' stroke-width='1' stroke='hsla(339.6,82.2%,51.6%,1)' fill='none'/></pattern></defs><rect width='800%' height='800%' transform='translate(0,0)' fill='url(#a)'/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.1 KiB

assets/img/featured.svg
+17
View File
@@ -0,0 +1,17 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="margin:auto;background:#3b4368;display:block;z-index:1;position:relative" width="1582" height="1111" preserveAspectRatio="xMidYMid" viewBox="0 0 1582 1111">
<g transform="translate(791,555.5) scale(1,1) translate(-791,-555.5)"><style type="text/css">
@keyframes ld-speed-dash {
0% { transform: translate(0,-2464.6958125499095px); }
100% { transform: translate(0,2464.6958125499095px); }
}
.ld.ld-speed-dash {
animation: ld-speed-dash 7.142857142857142s linear infinite;
}
</style>
<g transform="translate(791,555.5)">
<g style="transform:rotate(43deg)">
<line x1="-676.6418026534932" x2="-676.6418026534932" y1="0" y2="-194.39540631204278" stroke="#93dbe9" stroke-width="0.6295285656579673" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -5.389502111141189s;animation-duration:7.142857142857142s"></line><line x1="43.51802855495919" x2="43.51802855495919" y1="0" y2="-479.7390564623147" stroke="#689cc5" stroke-width="9.295812828787726" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -4.877132071825148s;animation-duration:3.571428571428571s"></line><line x1="626.5923053314896" x2="626.5923053314896" y1="0" y2="-219.35083732211598" stroke="#93dbe9" stroke-width="5.934061429630836" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -4.802916019246382s;animation-duration:3.571428571428571s"></line><line x1="693.3887474602818" x2="693.3887474602818" y1="0" y2="-353.885017175175" stroke="#689cc5" stroke-width="1.5583327638463147" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -4.081751830546393s;animation-duration:3.571428571428571s"></line><line x1="-149.24401571712139" x2="-149.24401571712139" y1="0" y2="-501.46189003628007" stroke="#93dbe9" stroke-width="5.593648024254009" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -5.37301937730858s;animation-duration:7.142857142857142s"></line><line x1="-180.91803588468028" x2="-180.91803588468028" y1="0" y2="-387.92571359780965" stroke="#689cc5" stroke-width="6.655978640832191" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -5.5070117594809345s;animation-duration:3.571428571428571s"></line><line x1="-687.6191601478673" x2="-687.6191601478673" y1="0" y2="-187.8523342000605" stroke="#93dbe9" stroke-width="7.721637892706112" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -5.032287518246949s;animation-duration:3.571428571428571s"></line><line x1="775.1845302890896" x2="775.1845302890896" y1="0" y2="-322.29888221052033" stroke="#689cc5" stroke-width="3.5743946872648036" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -5.119777815086244s;animation-duration:3.571428571428571s"></line><line x1="-399.5718358470655" x2="-399.5718358470655" y1="0" y2="-436.95464507332787" stroke="#689cc5" stroke-width="9.523895265592476" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -6.759390587699631s;animation-duration:7.142857142857142s"></line><line x1="-321.34245367943464" x2="-321.34245367943464" y1="0" y2="-218.84668892843277" stroke="#93dbe9" stroke-width="7.939758452517274" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -4.769924882580759s;animation-duration:7.142857142857142s"></line><line x1="-409.3965203152943" x2="-409.3965203152943" y1="0" y2="-455.90206414934033" stroke="#689cc5" stroke-width="2.4661144958265786" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -4.737311627388115s;animation-duration:7.142857142857142s"></line><line x1="575.3953084259903" x2="575.3953084259903" y1="0" y2="-382.1379996245774" stroke="#93dbe9" stroke-width="3.7454059974933505" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -1.272291858293084s;animation-duration:3.571428571428571s"></line><line x1="758.12625813818" x2="758.12625813818" y1="0" y2="-216.46199481406128" stroke="#689cc5" stroke-width="6.458943945803399" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -5.288698802029718s;animation-duration:3.571428571428571s"></line><line x1="656.0718534685203" x2="656.0718534685203" y1="0" y2="-307.9598929199723" stroke="#689cc5" stroke-width="5.48210566809726" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -4.946043626672467s;animation-duration:3.571428571428571s"></line><line x1="-559.7478826337234" x2="-559.7478826337234" y1="0" y2="-241.52898616232395" stroke="#93dbe9" stroke-width="0.5905463289914558" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -2.0510103928085752s;animation-duration:3.571428571428571s"></line><line x1="642.1418391845447" x2="642.1418391845447" y1="0" y2="-177.2109608247487" stroke="#93dbe9" stroke-width="4.110729150021574" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -1.8691696862351168s;animation-duration:7.142857142857142s"></line><line x1="-616.8575036735665" x2="-616.8575036735665" y1="0" y2="-432.35227410997396" stroke="#689cc5" stroke-width="7.011129027079976" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -2.1068362774456575s;animation-duration:7.142857142857142s"></line><line x1="-70.2632544830263" x2="-70.2632544830263" y1="0" y2="-324.7323961941628" stroke="#689cc5" stroke-width="9.114233055075125" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -2.4703326641779286s;animation-duration:7.142857142857142s"></line><line x1="-176.8596432293476" x2="-176.8596432293476" y1="0" y2="-233.44418810Line truncated
</g>
</g>
</g>
</svg>
assets/img/gradient.svg
+17
View File
@@ -0,0 +1,17 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="margin:auto;background:rgba(NaN, NaN, NaN, 0);display:block;z-index:1;position:relative" width="1582" height="1111" preserveAspectRatio="xMidYMid" viewBox="0 0 1582 1111">
<g transform="translate(791,555.5) scale(1,1) translate(-791,-555.5)"><style type="text/css">
@keyframes ld-speed-dash {
0% { transform: translate(0,-2464.6958125499095px); }
100% { transform: translate(0,2464.6958125499095px); }
}
.ld.ld-speed-dash {
animation: ld-speed-dash 7.142857142857142s linear infinite;
}
</style>
<g transform="translate(791,555.5)">
<g style="transform:rotate(43deg)">
<line x1="257.5470693585687" x2="257.5470693585687" y1="0" y2="-466.00265205148384" stroke="#689cc5" stroke-width="0.13851424099622403" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -1.678072204374443s;animation-duration:7.142857142857142s"></line><line x1="-379.29581238232714" x2="-379.29581238232714" y1="0" y2="-403.1104808558905" stroke="#93dbe9" stroke-width="8.774605103307184" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -2.7402193813517286s;animation-duration:7.142857142857142s"></line><line x1="691.0288038403479" x2="691.0288038403479" y1="0" y2="-181.75501061996493" stroke="#93dbe9" stroke-width="9.153921055895587" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -2.8074687908257s;animation-duration:7.142857142857142s"></line><line x1="-463.1804970441312" x2="-463.1804970441312" y1="0" y2="-228.59736322364085" stroke="#689cc5" stroke-width="9.234275564789872" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -4.788229963010811s;animation-duration:3.571428571428571s"></line><line x1="-464.04538295320936" x2="-464.04538295320936" y1="0" y2="-519.9017794124818" stroke="#93dbe9" stroke-width="7.462034170716894" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -0.37207936677350334s;animation-duration:7.142857142857142s"></line><line x1="-487.593847951914" x2="-487.593847951914" y1="0" y2="-404.6563472681459" stroke="#689cc5" stroke-width="6.691909248099436" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -0.5656697681407783s;animation-duration:3.571428571428571s"></line><line x1="770.04343191477" x2="770.04343191477" y1="0" y2="-475.5238816860255" stroke="#689cc5" stroke-width="7.6374433539151285" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -6.807628686518848s;animation-duration:7.142857142857142s"></line><line x1="741.894772937468" x2="741.894772937468" y1="0" y2="-478.1736626778009" stroke="#93dbe9" stroke-width="1.6442643372630033" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -1.3812815750665934s;animation-duration:7.142857142857142s"></line><line x1="-355.8373723126413" x2="-355.8373723126413" y1="0" y2="-500.7374221621392" stroke="#689cc5" stroke-width="4.968370927286826" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -5.576249995556752s;animation-duration:7.142857142857142s"></line><line x1="650.5745774737413" x2="650.5745774737413" y1="0" y2="-249.2269408639838" stroke="#93dbe9" stroke-width="6.875128275392444" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -3.2987389353018766s;animation-duration:3.571428571428571s"></line><line x1="-447.38279325342063" x2="-447.38279325342063" y1="0" y2="-438.54757515486233" stroke="#93dbe9" stroke-width="0.32234732526751003" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -1.5873776828471255s;animation-duration:7.142857142857142s"></line><line x1="-773.1023969408594" x2="-773.1023969408594" y1="0" y2="-265.89694750164693" stroke="#93dbe9" stroke-width="2.028719891037894" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -5.2047623886485646s;animation-duration:7.142857142857142s"></line><line x1="609.2041654976148" x2="609.2041654976148" y1="0" y2="-245.65757561464068" stroke="#689cc5" stroke-width="3.5816433079046046" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -1.8137434167323923s;animation-duration:7.142857142857142s"></line><line x1="-666.3772521370174" x2="-666.3772521370174" y1="0" y2="-392.29504082671497" stroke="#689cc5" stroke-width="5.871298148124787" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -5.271461071819312s;animation-duration:7.142857142857142s"></line><line x1="192.43268395152504" x2="192.43268395152504" y1="0" y2="-414.1240069817346" stroke="#689cc5" stroke-width="4.846905698440716" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -2.6359555443076155s;animation-duration:7.142857142857142s"></line><line x1="464.00348454267845" x2="464.00348454267845" y1="0" y2="-209.20552478093458" stroke="#93dbe9" stroke-width="0.7741111459700352" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -1.5581082604518324s;animation-duration:3.571428571428571s"></line><line x1="126.33292424079058" x2="126.33292424079058" y1="0" y2="-314.7556419440714" stroke="#93dbe9" stroke-width="5.88704873215512" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -4.643995515676361s;animation-duration:3.571428571428571s"></line><line x1="-767.0931203837769" x2="-767.0931203837769" y1="0" y2="-191.8265145537367" stroke="#93dbe9" stroke-width="7.171909048483214" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -2.896526837915051s;animation-duration:3.571428571428571s"></line><line x1="-677.434057525354" x2="-677.434057525354" y1="0" y2="-174.830Line truncated
</g>
</g>
</g>
</svg>
exampleSite/config/_default/params.toml
+1 -1
View File
@@ -18,7 +18,7 @@ mainSections = ["docs"]
disableImageOptimization = false
disableTextInHeader = false
defaultBackgroundImage = "/img/ocean.jpg"
defaultBackgroundImage = "/img/gradient.svg"
defaultFeaturedImage = "/img/ocean.jpg"
highlightCurrentMenuArea = true
layouts/partials/article-link/card-related.html
+1 -1
View File
@@ -19,7 +19,7 @@
{{ end }}
{{- if not $featured }}{{ with .Site.Params.defaultFeaturedImage }}{{ $featured = resources.Get . }}{{ end }}{{ end -}}
{{- with $featured -}}
{{ if $disableImageOptimization }}
{{ if or $disableImageOptimization (strings.HasSuffix $featured ".svg")}}
{{ with . }}
<div class="w-full thumbnail_card_related nozoom" style="background-image:url({{ .RelPermalink }});"></div>
{{ end }}
layouts/partials/article-link/card.html
+1 -1
View File
@@ -20,7 +20,7 @@
{{- if not $featured }}{{ with .Site.Params.defaultFeaturedImage }}{{ $featured = resources.Get . }}{{ end }}{{ end -}}
{{ if .Params.hideFeatureImage }}{{ $featured = false }}{{ end }}
{{- with $featured -}}
{{ if $disableImageOptimization }}
{{ if or $disableImageOptimization (strings.HasSuffix $featured ".svg")}}
{{ with . }}
<div class="w-full thumbnail_card nozoom" style="background-image:url({{ .RelPermalink }});"></div>
{{ end }}
layouts/partials/article-link/simple.html
+1 -1
View File
@@ -47,7 +47,7 @@
{{- if not $featured }}{{ with .Site.Params.defaultFeaturedImage }}{{ $featured = resources.Get . }}{{ end }}{{ end -}}
{{ if .Params.hideFeatureImage }}{{ $featured = false }}{{ end }}
{{- with $featured -}}
{{ if $disableImageOptimization }}
{{ if or $disableImageOptimization (strings.HasSuffix $featured ".svg")}}
{{ with . }}
<div class="{{ $articleImageClasses }}" style="background-image:url({{ .RelPermalink }});"></div>
{{ end }}
layouts/partials/hero/background.html
+3 -1
View File
@@ -30,10 +30,12 @@
(and ($.Site.Params.list.layoutBackgroundHeaderSpace | default true) ($isParentList))
) }}
{{- with $featured -}}
{{ if $shouldAddHeaderSpace | default true}}
<div id="hero" class="h-[150px] md:h-[200px]"></div>
{{ end }}
{{ if $disableImageOptimization }}
{{ if or $disableImageOptimization (strings.HasSuffix $featured ".svg")}}
{{ with . }}
<div class="fixed inset-x-0 top-0 h-[800px] single_hero_background nozoom"
style="background-image:url({{ .RelPermalink }});">
layouts/partials/hero/basic.html
+17 -4
View File
@@ -1,14 +1,27 @@
{{ $disableImageOptimization := .Page.Site.Params.disableImageOptimization | default false }}
{{- $images := .Resources.ByType "image" -}}
{{- $featured := $images.GetMatch "*feature*" -}}
{{- $featured := $images.GetMatch "*background*" -}}
{{- if not $featured }}{{ $featured = $images.GetMatch "*feature*" }}{{ end -}}
{{- if not $featured }}{{ $featured = $images.GetMatch "{*cover*,*thumbnail*}" }}{{ end -}}
{{ if .Params.featureimage }}
{{ if and .Params.featureimage (not $featured) }}
{{- $url:= .Params.featureimage -}}
{{- if not $featured }}{{ $featured = resources.GetRemote $url }}{{ end -}}
{{ $featured = resources.GetRemote $url }}
{{ end }}
{{- if not $featured }}
{{ with .Site.Params.defaultBackgroundImage }}
{{ if or (strings.HasPrefix . "http:") (strings.HasPrefix . "https:") }}
{{ $featured = resources.GetRemote . }}
{{ else }}
{{ $featured = resources.Get . }}
{{ end }}
{{ end }}
{{ end -}}
{{- with $featured -}}
{{ if $disableImageOptimization }}
{{ if or $disableImageOptimization (strings.HasSuffix $featured ".svg")}}
{{ with . }}
<div class="w-full h-36 md:h-56 lg:h-72 single_hero_basic nozoom" style="background-image:url({{ .RelPermalink }});"></div>
{{ end }}
layouts/partials/hero/big.html
+30 -4
View File
@@ -1,18 +1,44 @@
{{ $disableImageOptimization := .Page.Site.Params.disableImageOptimization | default false }}
{{- $images := .Resources.ByType "image" -}}
{{- $featured := $images.GetMatch "*feature*" -}}
{{- $featured := $images.GetMatch "*background*" -}}
{{- if not $featured }}{{ $featured = $images.GetMatch "*feature*" }}{{ end -}}
{{- if not $featured }}{{ $featured = $images.GetMatch "{*cover*,*thumbnail*}" }}{{ end -}}
{{ $caption := "" }}
{{ if .Params.featureimage }}
{{- $url:= .Params.featureimage -}}
{{- $caption = .Params.featureimagecaption -}}
{{- if not $featured }}{{ $featured = resources.GetRemote $url }}{{ end -}}
{{ end }}
{{- if not $featured }}
{{ with .Site.Params.defaultBackgroundImage }}
{{ if or (strings.HasPrefix . "http:") (strings.HasPrefix . "https:") }}
{{ $featured = resources.GetRemote . }}
{{ else }}
{{ $featured = resources.Get . }}
{{ end }}
{{ end }}
{{ end -}}
{{ $caption := "" }}
{{ if .Params.featureimagecaption }}
{{- $caption = .Params.featureimagecaption -}}
{{ end }}
{{- $alt := .Page.Title -}}
{{- with .Page.Params.alt }}{{ $alt = . }}{{ end -}}
{{- with $featured -}}
{{ if $disableImageOptimization }}
{{ if strings.HasSuffix $featured ".svg" }}
{{ with . }}
<figure>
<img class="w-full rounded-lg single_hero_round nozoom" alt="{{ $alt }}" src="{{ .RelPermalink }}">
{{ if $caption }}
<figcaption class="text-sm text-neutral-700 dark:text-neutral-400 hover:underline" style="text-align: center;"> {{ $caption | markdownify }} </figcaption>
{{end}}
</figure>
{{ end }}
{{ else if $disableImageOptimization }}
{{ with . }}
<figure>
<img class="w-full rounded-lg single_hero_round nozoom" alt="{{ $alt }}" width="{{ .Width }}" height="{{ .Height }}" src="{{ .RelPermalink }}">
layouts/partials/hero/thumbAndBackground.html
+2 -2
View File
@@ -20,7 +20,7 @@
) }}
{{- with $featured -}}
{{ if $disableImageOptimization }}
{{ if or $disableImageOptimization (strings.HasSuffix . ".svg")}}
{{ with . }}
<div class="w-full rounded-md h-36 md:h-56 lg:h-72 single_hero_basic nozoom" style="background-image:url({{ .RelPermalink }});"></div>
{{ end }}
@@ -33,7 +33,7 @@
{{- with $background -}}
{{ if $disableImageOptimization }}
{{ if or $disableImageOptimization (strings.HasSuffix . ".svg")}}
{{ with . }}
<div class="fixed inset-x-0 top-0 h-[800px] single_hero_background nozoom"
style="background-image:url({{ .RelPermalink }});">