浏览代码

Add jpg's as webp fallback for Safari

Replaced webp backgrounds with jpg's because couldn't figure out
how to use Modernizr (detect webp support for CSS fallback) for Hugo.

Also added back testimonial section with leader testimonials.
master
Kevin Mok 4 年前
父节点
当前提交
61d77fc738
签署人:: Kevin-Mok GPG 密钥 ID: 6E920656BBAD3E6C
  1. 3
      assets/css/style.css
  2. 7
      assets/sass/custom.scss
  3. 5
      config.toml
  4. 17
      data/team.yml
  5. 33
      data/testimonial.yml
  6. 19
      layouts/partials/counter.html
  7. 18
      layouts/partials/hero-area.html
  8. 8
      layouts/partials/team.html
  9. 2
      static/images/.gitattributes
  10. 二进制
      static/images/backgrounds/codm-reddit-banner.jpg
  11. 二进制
      static/images/backgrounds/codm-reddit-banner.webp
  12. 二进制
      static/images/backgrounds/halloween-loading-screen.jpg
  13. 二进制
      static/images/backgrounds/halloween-loading-screen.webp
  14. 二进制
      static/images/slider/hero-area.jpg
  15. 二进制
      static/images/slider/hero-area.webp
  16. 9
      static/images/team/.gitattributes
  17. 二进制
      static/images/team/bakkuteh.jpg
  18. 二进制
      static/images/team/bakkuteh.png
  19. 二进制
      static/images/team/bakkuteh.webp
  20. 二进制
      static/images/team/duck.jpg
  21. 二进制
      static/images/team/duck.webp
  22. 二进制
      static/images/team/helen.jpg
  23. 二进制
      static/images/team/helen.webp
  24. 二进制
      static/images/team/hunter-2.webp
  25. 二进制
      static/images/team/hunter.jpg
  26. 二进制
      static/images/team/hunter.webp
  27. 二进制
      static/images/team/josh.jpg
  28. 二进制
      static/images/team/josh.webp
  29. 二进制
      static/images/team/pistolfist.jpg
  30. 二进制
      static/images/team/pistolfist.webp
  31. 二进制
      static/images/team/slade.jpg
  32. 二进制
      static/images/team/slade.webp
  33. 10
      static/images/team/webp.fish

3
assets/css/style.css

@ -568,7 +568,8 @@ a:hover {
.bg-2 {
background-repeat: no-repeat;
background-size: cover;
background-attachment: fixed;
/* background-attachment: fixed; */
background-position: center;
}
.hero-area {

7
assets/sass/custom.scss

@ -77,3 +77,10 @@ p, h3, h4 {
// width: auto;
// height: auto;
}
#counter {
background-position: center;
background-repeat: no-repeat;
// background-size: auto;
// background-size: contain;
}

5
config.toml

@ -48,7 +48,8 @@ custom_css = ["css/custom.css"]
# Banner Section
[params.banner]
enable = true
bgImage = "images/slider/hero-area.webp"
# bgImage = "images/slider/hero-area.webp"
bgImage = "images/slider/hero-area.jpg"
# bgImage = "images/slider/eagle.png"
heading = "Ataraxy"
content= "NA, MP-focused clan that is currently looking for friendly and active clan members to play together with."
@ -59,7 +60,7 @@ custom_css = ["css/custom.css"]
# counter
[params.counter]
enable = true
bgImage = "images/backgrounds/codm-reddit-banner.webp"
bgImage = "images/backgrounds/codm-reddit-banner.jpg"
[[params.counter.counterItem]]
title = "Season 2 Ranking"
icon = "tf-ion-trophy"

17
data/team.yml

@ -2,17 +2,17 @@ enable : true
heading : Our
headingSpan : Team
teamMember :
- image : images/team/josh.webp
- imageName : josh
name : JoshuaAustin07
designation : Clan Master
description : Oversees entire clan's operations. Has final say on all major clan decisions.
- image : images/team/bakkuteh.webp
- imageName : bakkuteh
name : bakkuteh
designation : Vice Master
description : In charge of player management. Created spreadsheet to help keep track of player performance metrics.
- image : images/team/pistolfist.webp
- imageName : pistolfist
name : PistolFist
designation : Vice Master
description : In charge of recruiting and assists with player management. Created this site and co-designed clan logo. Founder of clan.
@ -20,23 +20,24 @@ teamMember :
# - icon : tf-ion-social-facebook
# url : "#"
# - image : images/team/hunter.webp
- image : images/team/hunter-2.webp
- imageName : hunter
# - imageName : hunter-rs
name : Hunter
designation : MP Leader
description : Runs MP lobbies and go-to person for MP strategy.
- image : images/team/duck.webp
- imageName : duck
name : Duckmaster
designation : BR Leader
description : Runs BR lobbies and go-to person for BR strategy.
- image : images/team/slade.webp
- imageName : slade
# - imageName : slade-rs
name : Slade
designation : BR Leader
description : Runs BR lobbies and go-to person for BR strategy.
- image : images/team/helen.webp
- imageName : helen
name : Heleners
designation : Discord Administrator
description : Manages Discord server. Co-founder of clan.

33
data/testimonial.yml

@ -1,15 +1,26 @@
heading: Our
headingSpan: Members
# bgImage : "images/backgrounds/halloween-loading-screen.jpg"
bgImage : "images/backgrounds/halloween-loading-screen.webp"
enable : false
bgImage : "images/backgrounds/halloween-loading-screen.jpg"
# enable : false
enable : true
testimonialItem :
- name : bakkuteh
image : images/team/bakkuteh.webp
date : Nov 24, 2019
content : Pigs go oink.
- name : PistolFist
image : images/team/pistolfist.webp
date : Nov 24, 2019
content : Bang.
image : images/team/pistolfist.jpg
date : Oct 21, 2019
content : Hip-hop/trap EDM fan.
- name : Heleners
image : images/team/helen.jpg
date : Oct 22, 2019
content : Loves Frozen.
- name : JoshuaAustin07
image : images/team/josh.jpg
date : Nov 10, 2019
content : Likes to use dogs that aren't his as his profile picture.
- name : bakkutteh
image : images/team/bakkuteh.png
date : Nov 15, 2019
content : Name means pork bone tea.

19
layouts/partials/counter.html

@ -0,0 +1,19 @@
{{ if .Site.Params.counter.enable }}
{{"<!-- Start Counter Section -->" | safeHTML}}
<section id="counter" class="bg-1 section overly" style='background-image: url("{{ .Site.Params.counter.bgImage | absURL }}")'>
<div class="container">
<div class="row">
{{ range .Site.Params.counter.counterItem }}
<div class="col-lg-3 col-md-6 col-12 text-center wow fadeInDown" data-wow-duration="500ms">
<div class="counters-item">
<i class="{{ .icon }}"></i>
<span data-speed="3000" data-to="{{ .count }}">{{ .count }}</span>
<h3>{{ .title }}</h3>
</div>
</div>
{{ end }}
</div>
</div>
</section>
{{"<!-- /Counter Section -->" | safeHTML}}
{{ end }}

18
layouts/partials/hero-area.html

@ -0,0 +1,18 @@
{{ if .Site.Params.banner.enable }}
{{"<!-- Welcome Slider-->" | safeHTML}}
<section class="hero-area" style='background-image: url("{{ .Site.Params.banner.bgImage | absURL }}");'>
<div class="block">
{{with .Site.Params.banner.icon}}
<div class="video-button">
<i class="{{ . }}"></i>
</div>
{{ end }}
{{with .Site.Params.banner.heading}} <h1>{{ . }}</h1>{{ end }}
{{with .Site.Params.banner.content}} <p>{{ . }}</p> {{ end }}
{{ if .Site.Params.banner.btn}}
<a data-scroll href="{{ .Site.Params.banner.btnURL}}" class="btn btn-transparent">{{ .Site.Params.banner.btnText}}</a>
{{ end }}
</div>
</section>
{{"<!-- /Welcome Slider-->" | safeHTML}}
{{end}}

8
layouts/partials/team.html

@ -18,7 +18,13 @@
<div class="team-member">
<div class="member-photo">
{{"<!-- member photo -->" | safeHTML}}
<img class="img-fluid" src="{{ .image | absURL }}" alt="">
<picture>
<source class="img-fluid"
srcset="images/team/{{ .imageName }}.webp" type="image/webp">
<source class="img-fluid"
srcset="images/team/{{ .imageName }}.jpg" type="image/jpeg">
<img class="img-fluid" src="images/team/{{ .imageName }}.jpg" alt="{{ .name }}-profile-picture">
</picture>
{{"<!-- member social profile -->" | safeHTML}}
<!-- <div class="mask"> -->

2
static/images/.gitattributes

@ -40,3 +40,5 @@ team/hunter.webp filter=lfs diff=lfs merge=lfs -text
clan-logo.png filter=lfs diff=lfs merge=lfs -text
mee6-icon.png filter=lfs diff=lfs merge=lfs -text
clan-logo-christmas.png filter=lfs diff=lfs merge=lfs -text
backgrounds/codm-reddit-banner.jpg filter=lfs diff=lfs merge=lfs -text
backgrounds/halloween-loading-screen.jpg filter=lfs diff=lfs merge=lfs -text

二进制
static/images/backgrounds/codm-reddit-banner.jpg

之后

宽度: 1200  |  高度: 764  |  大小: 189 KiB

二进制
static/images/backgrounds/codm-reddit-banner.webp (存储到Git LFS)

size 68324

二进制
static/images/backgrounds/halloween-loading-screen.jpg

之后

宽度: 2160  |  高度: 800  |  大小: 234 KiB

二进制
static/images/backgrounds/halloween-loading-screen.webp (存储到Git LFS)

size 167104

二进制
static/images/slider/hero-area.jpg

之后

宽度: 1920  |  高度: 932  |  大小: 313 KiB

二进制
static/images/slider/hero-area.webp (存储到Git LFS)

size 157022

9
static/images/team/.gitattributes

@ -4,3 +4,12 @@ slade.webp filter=lfs diff=lfs merge=lfs -text
bakkuteh.webp filter=lfs diff=lfs merge=lfs -text
duck.webp filter=lfs diff=lfs merge=lfs -text
helen.webp filter=lfs diff=lfs merge=lfs -text
hunter.jpg filter=lfs diff=lfs merge=lfs -text
slade.jpg filter=lfs diff=lfs merge=lfs -text
bakkuteh.jpg filter=lfs diff=lfs merge=lfs -text
bakkuteh.png filter=lfs diff=lfs merge=lfs -text
duck.jpg filter=lfs diff=lfs merge=lfs -text
helen.jpg filter=lfs diff=lfs merge=lfs -text
josh.jpg filter=lfs diff=lfs merge=lfs -text
pistolfist.jpg filter=lfs diff=lfs merge=lfs -text
webp.fish filter=lfs diff=lfs merge=lfs -text

二进制
static/images/team/bakkuteh.jpg

之后

宽度: 500  |  高度: 500  |  大小: 32 KiB

二进制
static/images/team/bakkuteh.png

之后

宽度: 500  |  高度: 500  |  大小: 88 KiB

二进制
static/images/team/bakkuteh.webp

二进制
static/images/team/duck.jpg

之后

宽度: 500  |  高度: 500  |  大小: 40 KiB

二进制
static/images/team/duck.webp

二进制
static/images/team/helen.jpg

之后

宽度: 464  |  高度: 464  |  大小: 150 KiB

二进制
static/images/team/helen.webp

二进制
static/images/team/hunter-2.webp

二进制
static/images/team/hunter.jpg

之后

宽度: 500  |  高度: 500  |  大小: 64 KiB

二进制
static/images/team/hunter.webp

二进制
static/images/team/josh.jpg

之后

宽度: 500  |  高度: 500  |  大小: 51 KiB

二进制
static/images/team/josh.webp

二进制
static/images/team/pistolfist.jpg

之后

宽度: 500  |  高度: 500  |  大小: 48 KiB

二进制
static/images/team/pistolfist.webp

二进制
static/images/team/slade.jpg

之后

宽度: 500  |  高度: 500  |  大小: 92 KiB

二进制
static/images/team/slade.webp

10
static/images/team/webp.fish

@ -0,0 +1,10 @@
# regular
# convert $argv[1].$argv[2] -resize 500x500 $argv[1]-rs.jpg
# cwebp -q 80 $argv[1]-rs.jpg -o $argv[1].webp
# mv $argv[1]-rs.jpg $argv[1].jpg
# rm $argv[1].$argv[2]
# png
convert $argv[1].$argv[2] -resize 500x500 $argv[1]-rs.$argv[2]
cwebp -q 80 $argv[1]-rs.$argv[2] -o $argv[1].webp
mv $argv[1]-rs.$argv[2] $argv[1].$argv[2]
正在加载...
取消
保存