Showcase page added

#92
Showcase page added,
nowAllowedTypesInArchive param added,
archive, talks page title wrap option added
This commit is contained in:
zzossig 2020-01-20 15:14:36 +09:00
parent 57e8ac5bf1
commit a9f162d126
41 changed files with 657 additions and 66 deletions

View File

@ -19,6 +19,8 @@ Zzo theme을 이용할 시 가장 매력적인 포인트 한가지는, 한글로
* [레이아웃](#layout)
* [갤러리](#gallery)
* [컨택 페이지](#contact-page)
* [토크 페이지](#talks-page)
* [쇼케이스 페이지](#showcase-page)
* [다국어](#multi-language)
* [저자](#author)
* [Favicon](#favicon)
@ -227,8 +229,9 @@ custom_js = [] # custom_js = ["js/custom.js"] and then make file at root/assets/
useFaviconGenerator = false # https://www.favicon-generator.org/
themeOptions = ["dark", "light", "hacker", "solarized", "kimbie"] # select options for site color theme
notAllowedTypesInHome = ["contact", "talks", "about"] # not allowed page types in home page. type can be set in front matter or default to folder name.
notAllowedTypesInHomeSidebar = ["about", "archive"] # not allowed page types in home page sidebar(recent post titles).
notAllowedTypesInHome = ["contact", "talks", "about", "showcase"] # not allowed page types in home page. type can be set in front matter or default to folder name.
notAllowedTypesInHomeSidebar = ["about", "archive", "showcase"] # not allowed page types in home page sidebar(recent post titles).
notAllowedTypesInArchive = ["about", "talks", "showcase"] # not allowed page types in archive page
# header
homeHeaderType = "text" # text, img, slide
@ -518,6 +521,7 @@ Talks 페이지는 아카이브 페이지와 유사한 UI의 페이지입니다.
title: "Talks"
date: 2019-12-30T11:14:14+09:00
description: Talks Page
titleWrap: wrap # wrap, nowrap
---
```
@ -574,6 +578,50 @@ root/config/_default/menus.en.toml file
...
```
## Showcase Page
Showcase 페이지는 프로젝트를 전시하는 페이지 입니다. 페이지를 만드시려면 아래 단계를 진행해주세요.
1. 다음 경로에 파일을 만듭니다. `root/content/showcase/_index.md`.
```yaml
---
title: "Showcase overview" # For SEO
date: 2020-01-19T15:43:38+09:00
description: My portfolio, repos, works overview page # For SEO
enableBio: true # Set to false if you want to hide the bio component.
---
```
2. 다음 경로에 카테고리 폴더와 파일을 만듭니다. `root/content/showcase/javascript/_index.md` file. (저의 경우, javascript가 카테고리 폴더입니다.)
```yaml
---
title: "Javascript" # category name
date: 2020-01-19T21:04:11+09:00
description: Hugo theme collection # For SEO
category: theme # meta info appeared on a card bottom side.
enableBio: true
---
```
3. 마지막으로, 프로젝트당 한개의 md파일을 만드시면 됩니다.
`root/content/showcase/javascript/my-awesome-project.md`.
```yaml
---
title: "My Awesome Project" # apperared on a card component
date: 2020-01-19T21:13:42+09:00
description: Hello world! This is my awesome project! # apperared on a card component
weight: 1 # card ordering
link: https://github.com/zzossig/hugo-theme-zzo
repo: https://github.com/zzossig/hugo-theme-zzo
pinned: true # appreared on a overview page.
thumb: feature3/css3.png # relative path in static/images
---
```
## Multi Language
Zzo theme의 기본 언어는 영어입니다. 한국어로 바꾸시려면 다음과 같이 해주세요.

View File

@ -19,6 +19,7 @@ Thank you for click me!. Zzo theme is a blog theme powered by Hugo with free(alw
* [Gallery](#gallery)
* [Contact Page](#contact-page)
* [Talks Page](#talks-page)
* [Showcase Page](#showcase-page)
* [Multi Language](#multi-language)
* [Author](#author)
* [Favicon](#favicon)
@ -221,8 +222,9 @@ custom_js = [] # custom_js = ["js/custom.js"] and then make file at root/assets/
useFaviconGenerator = false # https://www.favicon-generator.org/
themeOptions = ["dark", "light", "hacker", "solarized", "kimbie"] # select options for site color theme
notAllowedTypesInHome = ["contact", "talks", "about"] # not allowed page types in home page. type can be set in front matter or default to folder name.
notAllowedTypesInHomeSidebar = ["about", "archive"] # not allowed page types in home page sidebar(recent post titles).
notAllowedTypesInHome = ["contact", "talks", "about", "showcase"] # not allowed page types in home page. type can be set in front matter or default to folder name.
notAllowedTypesInHomeSidebar = ["about", "archive", "showcase"] # not allowed page types in home page sidebar(recent post titles).
notAllowedTypesInArchive = ["about", "talks", "showcase"] # not allowed page types in archive page
# header
homeHeaderType = "text" # text, img, slide
@ -512,6 +514,7 @@ Talks page is a listing page of links(video, ppt, event, ...). UI is similar to
title: "Talks"
date: 2019-12-30T11:14:14+09:00
description: Talks Page
titleWrap: wrap # wrap, nowrap
---
```
@ -568,6 +571,50 @@ And we are good to go.
...
```
## Showcase Page
Showcase page is a listing page of project showcase. Follow the below steps to make it.
1. Make a file at `root/content/showcase/_index.md`.
```yaml
---
title: "Showcase overview" # For SEO
date: 2020-01-19T15:43:38+09:00
description: My portfolio, repos, works overview page # For SEO
enableBio: true # Set to false if you want to hide the bio component.
---
```
2. Make a category folder and a file at `root/content/showcase/javascript/_index.md` file. (In my case, category is a javascript)
```yaml
---
title: "Javascript" # category name
date: 2020-01-19T21:04:11+09:00
description: Hugo theme collection # For SEO
category: theme # meta info appeared on a card bottom side.
enableBio: true
---
```
3. Finally, Make a file per project.
`root/content/showcase/javascript/my-awesome-project.md`.
```yaml
---
title: "My Awesome Project" # apperared on a card component
date: 2020-01-19T21:13:42+09:00
description: Hello world! This is my awesome project! # apperared on a card component
weight: 1 # card ordering
link: https://github.com/zzossig/hugo-theme-zzo
repo: https://github.com/zzossig/hugo-theme-zzo
pinned: true # appreared on a overview page.
thumb: feature3/css3.png # relative path in static/images
---
```
## Multi Language
The default language of this theme is English. If you want to use another language, follow these steps

View File

@ -2,5 +2,6 @@
title: "{{ replace .Name "-" " " | title }}"
date: {{ .Date }}
type: archive
description:
description:
titleWrap: wrap # wrap, noWrap
---

10
archetypes/showcase.md Normal file
View File

@ -0,0 +1,10 @@
---
title: "{{ replace .Name "-" " " | title }}"
date: {{ .Date }}
description:
link:
repo:
pinned: true
thumb:
weight:
---

View File

@ -9,8 +9,5 @@ series:
-
categories:
-
links:
- link: ""
title: ""
type: ""
titleWrap: wrap # wrap, noWrap
---

8
assets/js/shave.min.js vendored Normal file
View File

@ -0,0 +1,8 @@
/**
shave - Shave is a javascript plugin that truncates multi-line text within a html element based on set max height
@version v2.5.7
@link https://github.com/dollarshaveclub/shave#readme
@author Jeff Wainwright <yowainwright@gmail.com> (jeffry.in)
@license MIT
**/
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e=e||self).shave=t()}(this,function(){"use strict";return function(e,t){var n=2<arguments.length&&void 0!==arguments[2]?arguments[2]:{};if(void 0===t||isNaN(t))throw Error("maxHeight is required");var i="string"==typeof e?document.querySelectorAll(e):e;if(i){var o=n.character||"…",a=n.classname||"js-shave",s="boolean"!=typeof n.spaces||n.spaces,r='<span class="js-shave-char">'.concat(o,"</span>");"length"in i||(i=[i]);for(var c=0;c<i.length;c+=1){var l=i[c],h=l.style,d=l.querySelector(".".concat(a)),f=void 0===l.textContent?"innerText":"textContent";d&&(l.removeChild(l.querySelector(".js-shave-char")),l[f]=l[f]);var v=l[f],g=s?v.split(" "):v;if(!(g.length<2)){var u=h.height;h.height="auto";var p=h.maxHeight;if(h.maxHeight="none",l.offsetHeight<=t)h.height=u,h.maxHeight=p;else{for(var m=g.length-1,x=0,y=void 0;x<m;)y=x+m+1>>1,l[f]=s?g.slice(0,y).join(" "):g.slice(0,y),l.insertAdjacentHTML("beforeend",r),l.offsetHeight>t?m=y-1:x=y;l[f]=s?g.slice(0,m).join(" "):g.slice(0,m),l.insertAdjacentHTML("beforeend",r);var j=s?" ".concat(g.slice(m).join(" ")):g.slice(m),H=document.createTextNode(j),b=document.createElement("span");b.classList.add(a),b.style.display="none",b.appendChild(H),l.insertAdjacentElement("beforeend",b),h.height=u,h.maxHeight=p}}}}}});

View File

@ -36,7 +36,7 @@
@include keyframes(slide-in-down-little) {
0% {
transform: translate(0,-1%);
transform: translate(0,-3%);
opacity: 0;
}

View File

@ -12,7 +12,7 @@
width: 100%;
height: auto;
@include box-shadow(0, 2px, 4px, 0, rgba(0, 0, 0, 0.25));
@include animation('slide-in-down .25s .6s 1 ease-in both');
@include animation('slide-in-down-little .2s .6s 1 ease-in both');
&-wrapper {
width: 90%;

View File

@ -10,7 +10,8 @@
@include flex-direction(column);
}
&__contents {
&__contents {
width: 100%;
margin-top: 0.5rem;
@media only screen and (max-width: 769px) {

View File

@ -71,4 +71,21 @@ $grid_column_gap: $grid_column_gap_width + $grid_column_gap_unit;
.navbar {
grid-area: 1 / 1 / 2 / 3;
}
}
.inner {
display: grid;
grid-template-columns: 250px 1fr 1fr;
grid-template-rows: 1fr;
grid-column-gap: 16px;
grid-row-gap: 0px;
}
.l { grid-area: 1 / 1 / 2 / 2; } // left
.m { grid-area: 1 / 2 / 2 / 3; } // middle
.r { grid-area: 1 / 3 / 2 / 4; } // right
.lm { grid-area: 1 / 1 / 2 / 3; } // left + middle
.mr { grid-area: 1 / 2 / 2 / 4; } // middle + right
.lmr { grid-area: 1 / 1 / 2 / 4; } // left + middle + right

View File

@ -77,4 +77,5 @@ $cursive-font: {{ .Site.Data.font.cursive_font }};
@import 'pages/single';
@import 'pages/terms';
@import 'pages/contact';
@import 'pages/talk';
@import 'pages/talk';
@import 'pages/showcase';

View File

@ -2,6 +2,7 @@
position: relative;
padding: 2rem 2rem 0;
width: 100%;
@include flexbox();
@include flex-direction(column);
@include justify-content(flex-start);
@ -35,16 +36,20 @@
&__li {
margin-bottom: 0.5rem;
margin-left: 4rem;
z-index: 0;
z-index: 0;
@include transition(margin-left, 0.1s, ease);
@include flexbox();
@include align-items(center);
@include align-items(flex-start);
@media only screen and (max-width: 769px) {
margin-left: 0;
position: relative;
}
}
@media only screen and (max-width: 600px) {
@include flex-direction(column);
}
}
&__key {
@ -125,8 +130,17 @@
&__title {
margin-right: 0.5rem;
margin-left: 1rem;
width: 100%;
@include truncate($grid-max-width);
&[data-title-wrap^="no"] {
@include truncate($grid-max-width);
}
@media only screen and (max-width: 600px) {
margin-top: 1rem;
margin-bottom: 0.5rem;
}
@include on-event {
&::before {
content: '';
@ -137,6 +151,11 @@
@include themify($themes) {
background-color: themed('archive-hover-line-color');
@media only screen and (max-width:768px) {
top: 13px;
height: 24px;
}
}
@media only screen and (max-width: 769px) {

View File

@ -0,0 +1,183 @@
.showcase {
padding: 0.75rem 1.5rem;
&__bio {
position: -webkit-sticky;
position: sticky;
top: $grid_navbar_height * 1.25;
display: block;
margin-top: 2rem;
@media only screen and (max-width: 600px) {
display: none;
}
}
&__section {
}
&__nav {
margin: 1rem 0.5rem;
padding: 0.5rem 0;
@include themify($themes) {
border-bottom: 1px solid themed('hr-color');
}
}
&__button {
border: none;
outline: none;
font-family: $title-font;
font-size: 0.95rem;
border-top-left-radius: 0.125rem;
border-top-right-radius: 0.125rem;
padding: 0.5rem 0;
margin-right: 1rem;
position: relative;
text-decoration: none !important;
display: inline-block;
cursor: pointer;
@include themify($themes) {
color: themed('navbar-title-color');
@include on-event {
color: themed('navbar-title-hover-color');
}
}
&[data-meta]:after {
content: attr(data-meta);
width: 100%;
padding: 0.125rem 0.25rem;
border-radius: 50%;
margin: auto;
font-size: 12px;
@include themify($themes) {
color: themed('taxo-num-color');
background-color: themed('taxo-num-background-color');
}
}
&.active {
@include themify($themes) {
color: themed('navbar-title-active-color');
}
}
}
&__title {
margin: 2rem 0.5rem 0.25rem 0.5rem;
font-size: 1.125rem;
}
&__box {
width: 47.5%;
height: auto;
border-radius: 0.2rem;
margin: 0.5rem;
padding: 1rem;
position: relative;
@include flexbox();
@include flex-grow(1);
@include flex-direction(column);
@include justify-content(flex-start);
@include themify($themes) {
border: 1px solid themed('content-box-border-color');
}
@include on-event {
@include on-event {
@include box-shadow(1px, 1px, 3px, 0px, rgba(0, 0, 0, 0.25));
background-color: rgba(125, 125, 125, 0.1);
}
}
@media only screen and (max-width: 960px) {
width: 245px;
}
&--wrapper {
z-index: 2;
@include flexbox();
@include flex-wrap(wrap);
@include animation('slide-in-left-little .2s .25s 1 ease-in both');
}
&--dummy {
width: 47.5%;
margin: 0.5rem;
@include flex-grow(1);
@media only screen and (max-width: 960px) {
width: 245px;
}
@media only screen and (max-width: 600px) {
display: none;
}
}
&--title {
word-break: break-word;
font-family: $title-font;
font-size: 1rem;
margin-bottom: 0.5rem;
}
&--desc {
font-family: $content-font;
font-size: 0.9rem;
margin: 0.25rem 0;
height: 60px;
overflow: hidden;
}
&--img {
width: auto;
height: 100%;
max-height: 225px;
object-fit: cover;
img {
border-radius: 0.2rem;
display: block;
margin: auto;
max-height: 225px;
}
@include flexbox();
@include justify-content(center);
@include align-items(center);
}
&--meta {
margin-top: 0.25rem;
@include flexbox();
.type {
font-size: 12px;
text-transform: capitalize;
@include flexbox();
@include themify($themes) {
color: themed('meta-color');
}
svg {
display: block;
margin: auto 0.35rem auto 0;
}
}
a.type {
text-decoration: none;
@include themify($themes) {
@include on-event {
color: themed('link-hover');
}
}
}
}
}
}

View File

@ -19,48 +19,43 @@
}
&__title {
&--margin {
margin-right: 0.5rem;
margin-left: 0.75rem;
margin-right: 0.5rem;
margin-left: 0.75rem;
width: 100%;
&[data-title-wrap^="no"] {
@include truncate($grid-max-width);
}
@include truncate2($grid-max-width);
@media only screen and (max-width: 600px) {
margin-top: 1rem;
margin-bottom: 0.5rem;
}
@include on-event {
&::before {
content: '';
position: absolute;
left: 100px;
width: 0.2rem;
height: 24px;
left: 3rem;
width: 0.25rem;
height: 30px;
@include themify($themes) {
background-color: themed('archive-hover-line-color');
@media only screen and (max-width:768px) {
top: 13px;
left: 0;
height: 24px;
}
}
@media only screen and (max-width: 769px) {
height: 24px;
top: 50%;
@include translateY(-50%);
}
}
@media only screen and (min-width: 769px) {
&::before {
content: '';
position: absolute;
left: 3rem;
width: 0.25rem;
height: 30px;
@include themify($themes) {
background-color: themed('archive-hover-line-color');
}
@media only screen and (max-width: 769px) {
top: 50%;
@include translateY(-50%);
}
}
}
}
}
}

View File

@ -22,7 +22,7 @@ $hacker: (
navbar-title-hover-color: #1FFF2A,
navbar-title-active-color: #f3ff6e,
navbar-menu-hover-background-color: lighten(#151715, 20%),
navbar-dropdown-item-hover-color: #1FFF2A,
navbar-dropdown-item-hover-color: #E08C48,
sidebar-title-color: #E3CD26,
sidebar-li-color: #A1AD64,
taxo-title-color: #996287,
@ -47,7 +47,7 @@ $hacker: (
single-contents-subtitle-color: #FCFCFA,
related-header-title-color: #FCFCFA,
related-link-color: #C7BA00,
content-box-border-color: #dbdbdb,
content-box-border-color: #6B6B6B,
content-box-background-color: #252526,
burger-menu-color: #dbdbdb,
social-icon-color: #9e9e9e,

View File

@ -1,39 +1,45 @@
[[main]]
identifier = "about"
name = "about"
name = "About"
url = "about"
weight = 1
[[main]]
identifier = "archive"
name = "archive"
name = "Archive"
url = "archive"
weight = 2
[[main]]
identifier = "pt"
name = "pt"
name = "Pt"
url = "pt"
weight = 3
[[main]]
identifier = "gallery"
name = "gallery"
name = "Gallery"
url = "gallery"
weight = 4
[[main]]
parent = "gallery"
name = "cartoon"
name = "Cartoon"
url = "gallery/cartoon"
[[main]]
parent = "gallery"
name = "photo"
name = "Photo"
url = "gallery/photo"
[[main]]
identifier = "posts"
name = "posts"
name = "Posts"
url = "posts"
weight = 5
weight = 5
[[main]]
identifier = "showcase"
name = "Showcase"
url = "showcase"
weight = 6

View File

@ -8,6 +8,7 @@ useFaviconGenerator = true # https://www.favicon-generator.org/
themeOptions = ["dark", "light", "hacker", "solarized", "kimbie"]
notAllowedTypesInHome = ["contact", "talks", "about", "showcase"]
notAllowedTypesInHomeSidebar = ["about", "archive", "showcase"]
notAllowedTypesInArchive = ["about", "talks", "showcase"]
# header
homeHeaderType = "text" # text, img, slide

View File

@ -3,6 +3,7 @@ title: "Archive"
date: 2019-10-19T11:44:14+09:00
type: "archive"
description: Archive Page
titleWrap: wrap
---
archive page

View File

@ -3,6 +3,7 @@ title: "Archive"
date: 2019-10-19T11:44:14+09:00
type: "archive"
description: Archive Page
titleWrap: wrap
---
archive page

View File

@ -0,0 +1,6 @@
---
title: "Showcase overview"
date: 2020-01-19T15:43:38+09:00
description: My portfolio, repos, works overview page
enableBio: true
---

View File

@ -0,0 +1,7 @@
---
title: "Hugo"
date: 2020-01-19T21:04:11+09:00
description: Hugo theme collection
category: theme
enableBio: true
---

View File

@ -0,0 +1,10 @@
---
title: "Hugo zDoc Theme"
date: 2020-01-19T21:13:42+09:00
description: Make a documentation with hugo zdoc theme!
weight: 2
link: https://github.com/zzossig/hugo-theme-zdoc
repo: https://github.com/zzossig/hugo-theme-zdoc
pinned: true
thumb: feature3/css3-bare.png
---

View File

@ -0,0 +1,10 @@
---
title: "Hugo Zzo Theme"
date: 2020-01-19T21:13:42+09:00
description: Make a blog with hugo zzo theme!
weight: 1
link: https://github.com/zzossig/hugo-theme-zzo
repo: https://github.com/zzossig/hugo-theme-zzo
pinned: true
thumb: feature3/css3.png
---

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.2 KiB

View File

@ -68,4 +68,10 @@ other = "Written At"
other = "Modified At"
[tooltip-reading-time]
other = "Reading Time"
other = "Reading Time"
[showcase-overview]
other = "Overview"
[showcase-pinned]
other = "Pinned"

View File

@ -68,4 +68,10 @@ other = "작성일"
other = "수정일"
[tooltip-reading-time]
other = "읽는 시간"
other = "읽는 시간"
[showcase-overview]
other = "개요"
[showcase-pinned]
other = "고정"

View File

@ -68,4 +68,10 @@ other = "创建日期"
other = "更新日期"
[tooltip-reading-time]
other = "阅读时长"
other = "阅读时长"
[showcase-overview]
other = "总览"
[showcase-pinned]
other = "固定"

View File

@ -1,4 +1,6 @@
{{ define "main" }}
{{ $titleWrap := .Params.titleWrap }}
<header class="header">
<h3 class="h3 terms__title">
{{ .Title }}
@ -7,11 +9,14 @@
{{ .Content }}
</div>
</header>
</span>
<main class="main archive">
<div class="archive__container">
{{ $pages := (where (where .Site.RegularPages "Type" "!=" "about") "Section" "!=" "talks") }}
{{ $paginator := .Paginate ($pages.GroupByDate (.Site.Params.archiveGroupByDate | default "2006")) .Site.Params.archivePaginate }}
{{ $filteredPages := .Site.RegularPages }}
{{ range .Site.Params.notAllowedTypesInArchive }}
{{ $filteredPages = (where $filteredPages "Type" "!=" (lower .)) }}
{{ end }}
{{ $paginator := .Paginate ($filteredPages.GroupByDate (.Site.Params.archiveGroupByDate | default "2006")) .Site.Params.archivePaginate }}
{{ range ($paginator).PageGroups }}
<span class="archive__key">{{ .Key }}</span>
@ -21,8 +26,8 @@
<span class="archive__meta">
<span class="archive__type">{{ .Type }}</span>
<span class="archive__date">{{ .Date.Format (i18n "archive-dateformat") }}</span>
</span>
<a href="{{ .Permalink }}" class="archive__title">{{ .Title }}</a>
</span>
<a href="{{ .Permalink }}" class="archive__title" data-title-wrap="{{ $titleWrap | default "wrap"}}">{{ .Title }}</a>
</li>
{{ end }}
</ul>

View File

@ -0,0 +1,63 @@
{{ $enquire := resources.Get "js/enquire.min.js" | resources.Fingerprint }}
<script defer src="{{ $enquire.RelPermalink }}"></script>
{{ $lazysizes := resources.Get "js/lazysizes.min.js" | resources.Fingerprint }}
<script defer src="{{ $lazysizes.RelPermalink }}"></script>
{{ $shave := resources.Get "js/shave.min.js" | resources.Fingerprint }}
<script defer src="{{ $shave.RelPermalink }}"></script>
<script>
{{ $enableBio:= .Params.enableBio }}
var enableBio = JSON.parse({{ $enableBio | jsonify }});
document.addEventListener('DOMContentLoaded', function () {
var bioElem = document.querySelector('.showcase__bio');
var sectionElem = document.querySelector('.showcase__section');
var bioMobileElem = document.querySelector('.showcase__bio--mobile');
enquire.register("screen and (max-width: 600px)", {
match: function () {
if (enableBio) {
if (bioElem) {
bioElem.classList.remove('l');
}
if (sectionElem) {
sectionElem.classList.remove('mr');
sectionElem.classList.add('lmr');
}
if (bioMobileElem) {
bioMobileElem.classList.remove('hide');
}
} else {
if (sectionElem) {
sectionElem.classList.remove('mr');
sectionElem.classList.remove('lmr');
sectionElem.classList.add('lmr');
}
}
},
unmatch: function () {
if (enableBio) {
if (bioElem) {
bioElem.classList.add('l');
}
if (sectionElem) {
sectionElem.classList.remove('lmr');
sectionElem.classList.add('mr');
}
if (bioMobileElem) {
bioMobileElem.classList.add('hide');
}
} else {
sectionElem.classList.remove('mr');
sectionElem.classList.remove('lmr');
sectionElem.classList.add('lmr');
}
},
setup: function () { },
deferSetup: true,
destroy: function () { },
});
shave('.showcase__box--desc', 70);
});
</script>

View File

@ -0,0 +1,15 @@
{{ $current := . }}
<nav class="showcase__nav">
<a href="{{ .FirstSection.Permalink }}" class="showcase__button {{ if eq .Permalink .FirstSection.Permalink }}active{{ end }}">
{{ i18n "showcase-overview" }}
</a>
{{ range (.Site.GetPage "section" .Type).Pages }}
{{ $active := false }}
{{ $active = or $active (eq .Name $current.Title) }}
{{ $active = or $active (eq (lower .URL) (lower $current.Title)) }}
{{ $active = or $active (eq (lower .URL) (lower $current.Type)) }}
<a href="{{ .Permalink }}" class="showcase__button {{ if $active }}active{{ end }}" data-meta="{{ len .Pages }}">
{{ i18n (lower .Title) | default .Title }}
</a>
{{ end }}
</nav>

View File

@ -0,0 +1,49 @@
<div>
{{ $pinnedNum := 0 }}
{{ $isOdd := false}}
{{ range .Pages }}
{{ $pinnedNum = add $pinnedNum (len (where .Pages "Params.pinned" true)) }}
{{ end }}
{{ if eq (mod $pinnedNum 2) 1 }}
{{ $isOdd = true }}
{{ end }}
{{ if gt $pinnedNum 0 }}
<div class="showcase__title">
{{ i18n "showcase-pinned" }}
</div>
<div class="showcase__box--wrapper">
{{ range .Pages }}
{{ $category := .Params.category }}
{{ range where .Pages "Params.pinned" true }}
<div class="showcase__box">
<a href="{{ .Params.Link }}" class="showcase__box--title" target="_blank" rel="noreferrer">
{{ .Title }}
</a>
<div class="showcase__box--desc">
{{ .Description }}
</div>
<div class="grow"></div>
<div class="showcase__box--meta">
<span class="type">
{{ partial "svgs/etc/code.svg" (dict "width" 14 "height" 14) }}
{{ $category }}
</span>
<div class="grow"></div>
<a href="{{ .Params.Repo }}" class="type" target="_blank" rel="noreferrer">
{{ partial "svgs/social/github.svg" (dict "width" 14 "height" 14) }}
Repository
</a>
</div>
</div>
{{ end }}
{{ end }}
{{ if $isOdd }}
<div class="showcase__box--dummy"></div>
{{ end }}
</div>
{{ end }}
</div>

View File

@ -0,0 +1,42 @@
<div>
{{ $sectionNum := (len .Pages) }}
{{ $isOdd := false}}
{{ if eq (mod $sectionNum 2) 1}}
{{ $isOdd = true }}
{{ end }}
{{ if gt $sectionNum 0 }}
<div class="showcase__box--wrapper">
{{ $category := .Params.category }}
{{ range .Pages }}
<div class="showcase__box">
<a href="{{ .Params.Link }}" class="showcase__box--title" target="_blank" rel="noreferrer">
{{ .Title }}
</a>
<a href="{{ .Params.Link }}" class="showcase__box--img" target="_blank" rel="noreferrer">
<img src="{{ (print "images/" .Params.thumb) | relURL }}" alt="{{ .Title }}">
</a>
<div class="showcase__box--desc">
{{ .Description }}
</div>
<div class="showcase__box--meta">
<span class="type">
{{ partial "svgs/etc/code.svg" (dict "width" 14 "height" 14) }}
{{ $category }}
</span>
<div class="grow"></div>
<a href="{{ .Params.Repo }}" class="type" target="_blank" rel="noreferrer">
{{ partial "svgs/social/github.svg" (dict "width" 14 "height" 14) }}
Repository
</a>
</div>
</div>
{{ end }}
{{ if $isOdd }}
<div class="showcase__box--dummy"></div>
{{ end }}
</div>
{{ end }}
</div>

View File

@ -1,5 +1,5 @@
{{ if $.Param "enableSidebar" }}
<div class="sidebar">
<div class="sidebar">
{{ partial "search/site-search" . }}
{{ partial "sidebar/site-bio" . }}
{{ partial "sidebar/custom-home" . }}

View File

@ -0,0 +1 @@
<svg fill="#000000" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 26 26" width="{{ .width }}" height="{{ .height }}"><path fill="currentColor" d="M 15.3125 4 C 15.011719 4 14.695313 4.199219 14.59375 4.5 L 9 21.3125 C 8.898438 21.710938 9.199219 22 9.5 22 L 10.40625 22 C 10.707031 22 10.992188 21.800781 11.09375 21.5 L 16.6875 4.6875 C 16.789063 4.289063 16.488281 4 16.1875 4 Z M 5.0625 7 C 4.925781 7.023438 4.789063 7.085938 4.6875 7.1875 L 0.09375 12.6875 C -0.0078125 12.886719 -0.0078125 13.113281 0.09375 13.3125 L 4.6875 18.8125 C 4.886719 19.011719 5.199219 19.105469 5.5 18.90625 L 6.09375 18.40625 C 6.292969 18.207031 6.386719 17.792969 6.1875 17.59375 L 2.3125 13 L 6.09375 8.40625 C 6.292969 8.207031 6.300781 7.792969 6 7.59375 L 5.5 7.09375 C 5.351563 6.992188 5.199219 6.976563 5.0625 7 Z M 20.71875 7 C 20.644531 7.015625 20.574219 7.042969 20.5 7.09375 L 19.90625 7.59375 C 19.707031 7.792969 19.613281 8.207031 19.8125 8.40625 L 23.59375 13 L 19.8125 17.59375 C 19.613281 17.792969 19.605469 18.207031 19.90625 18.40625 L 20.5 18.90625 C 20.699219 19.105469 21.113281 19.113281 21.3125 18.8125 L 25.90625 13.3125 C 26.007813 13.113281 26.007813 12.886719 25.90625 12.6875 L 21.3125 7.1875 C 21.164063 7.039063 20.9375 6.953125 20.71875 7 Z"/></svg>

After

Width:  |  Height:  |  Size: 1.2 KiB

View File

@ -0,0 +1,28 @@
{{ define "main" }}
<main class="main showcase inner">
{{ if .Params.enableBio }}
<aside class="l">
<div class="showcase__bio">
{{ partial "sidebar/site-bio" . }}
</div>
</aside>
{{ end }}
<section class="showcase__section {{ if .Params.enableBio }}mr{{ else }}lmr{{ end }}">
{{ if .Params.enableBio }}
<div class="showcase__bio--mobile hide">
{{ partial "body/whoami" . }}
</div>
{{ end }}
{{ partial "showcase/show-nav" . }}
{{ if eq .Permalink .FirstSection.Permalink }}
{{ partial "showcase/show-pinned" . }}
{{ else }}
{{ partial "showcase/show-section" . }}
{{ end }}
</section>
<div class="hide">
{{ partial "search/site-search" . }}
</div>
{{ partial "script/showcase-script" . }}
</main>
{{ end }}

View File

@ -1,4 +1,6 @@
{{ define "main" }}
{{ $titleWrap := .Params.titleWrap }}
<header class="header">
<h3 class="h3 terms__title">
{{ .Title }}
@ -21,7 +23,7 @@
<span class="talk__date">
{{ .PublishDate.Format (i18n "talks-dateformat") }}
</span>
<a href="{{ .Permalink }}" class="talk__title">{{ .Title }}</a>
<a href="{{ .Permalink }}" class="talk__title" data-title-wrap="{{ $titleWrap | default "wrap"}}">{{ .Title }}</a>
</li>
{{ end }}
</ul>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 547 B

View File

@ -1 +0,0 @@
<svg width="264" height="88" viewBox="0 0 264 88" xmlns="http://www.w3.org/2000/svg"><title>default-skin 2</title><g fill="none" fill-rule="evenodd"><g><path d="M67.002 59.5v3.768c-6.307.84-9.184 5.75-10.002 9.732 2.22-2.83 5.564-5.098 10.002-5.098V71.5L73 65.585 67.002 59.5z" id="Shape" fill="#fff"/><g fill="#fff"><path d="M13 29v-5h2v3h3v2h-5zM13 15h5v2h-3v3h-2v-5zM31 15v5h-2v-3h-3v-2h5zM31 29h-5v-2h3v-3h2v5z" id="Shape"/></g><g fill="#fff"><path d="M62 24v5h-2v-3h-3v-2h5zM62 20h-5v-2h3v-3h2v5zM70 20v-5h2v3h3v2h-5zM70 24h5v2h-3v3h-2v-5z"/></g><path d="M20.586 66l-5.656-5.656 1.414-1.414L22 64.586l5.656-5.656 1.414 1.414L23.414 66l5.656 5.656-1.414 1.414L22 67.414l-5.656 5.656-1.414-1.414L20.586 66z" fill="#fff"/><path d="M111.785 65.03L110 63.5l3-3.5h-10v-2h10l-3-3.5 1.785-1.468L117 59l-5.215 6.03z" fill="#fff"/><path d="M152.215 65.03L154 63.5l-3-3.5h10v-2h-10l3-3.5-1.785-1.468L147 59l5.215 6.03z" fill="#fff"/><g><path id="Rectangle-11" fill="#fff" d="M160.957 28.543l-3.25-3.25-1.413 1.414 3.25 3.25z"/><path d="M152.5 27c3.038 0 5.5-2.462 5.5-5.5s-2.462-5.5-5.5-5.5-5.5 2.462-5.5 5.5 2.462 5.5 5.5 5.5z" id="Oval-1" stroke="#fff" stroke-width="1.5"/><path fill="#fff" d="M150 21h5v1h-5z"/></g><g><path d="M116.957 28.543l-1.414 1.414-3.25-3.25 1.414-1.414 3.25 3.25z" fill="#fff"/><path d="M108.5 27c3.038 0 5.5-2.462 5.5-5.5s-2.462-5.5-5.5-5.5-5.5 2.462-5.5 5.5 2.462 5.5 5.5 5.5z" stroke="#fff" stroke-width="1.5"/><path fill="#fff" d="M106 21h5v1h-5z"/><path fill="#fff" d="M109.043 19.008l-.085 5-1-.017.085-5z"/></g></g></g></svg>

Before

Width:  |  Height:  |  Size: 1.5 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 866 B