ivabus/www
1
0
Fork 0
mirror of https://github.com/ivabus/www synced 2024-11-23 00:35:07 +03:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge pull request #117 from teaxyz/feature/dynamic-package-list

Browse source 
dynamic package list and details pages
This commit is contained in:
Neil 2022-10-14 20:49:48 +08:00 committed by GitHub
commit 044c0a5fe7
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
21 changed files with 282 additions and 51 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

17
.github/build-package-pages.sh vendored Executable file
View file

@ -0,0 +1,17 @@
#!/bin/bash
# cmd: $ ./build-package-pages.sh srcJson targetPath
# sample: $ .github/build-package-pages.sh src/data/packages.json src/content/packages'
for row in $(cat $1 | jq -r '.[] | @base64'); do
_jq() {
echo ${row} | base64 --decode | jq -r ${1}
}
touch $2/$(_jq '.name').md
content="---
type: page
title: \"$(_jq '.name')\"
Description: \"$(_jq '.desc')\"
layout: \"package-detail\"
---"
echo "$content" > $2/$(_jq '.name').md
done

9
.github/workflows/cd.yml vendored
View file

@ -25,6 +25,15 @@ jobs:
- uses: actions/checkout@v3
# TODO:
# add action here to download updates packages.json into src/data/packages.json
- name: Create Package Detail Pages from packages.json
uses: getneil/jq-action@v1
id: version
with:
cmd: '.github/build-package-pages.sh src/data/packages.json src/content/packages'
- run: .github/mk-pantry-accessible.sh ${{ secrets.TEMP_JACOBS_GITHUB_PAT }}
- uses: teaxyz/setup@v0
with:

10
.github/workflows/staging.yml vendored
View file

@ -33,7 +33,17 @@ jobs:
echo "relativeurls = true" >>config.toml
working-directory: src
# TODO:
# add action here to download updates packages.json into src/data/packages.json
- name: Create Package Detail Pages from packages.json
uses: getneil/jq-action@v1
id: version
with:
cmd: '.github/build-package-pages.sh src/data/packages.json src/content/packages'
- run: .github/mk-pantry-accessible.sh ${{ secrets.TEMP_JACOBS_GITHUB_PAT }}
- uses: teaxyz/setup@v0
with:
target: build

5
.gitignore vendored
View file

@ -22,3 +22,8 @@ hugo.linux
node_modules
.envrc
cdk.out
.ideas
# initially committed _sample.md only the rest will be ignored
src/content/packages/*

6
README.md
View file

@ -16,6 +16,11 @@ The tea logo and wordmark are registered trademarks of tea.inc.
* Repeated components are in [`./src/layouts/partials/`].
## Getting Started
Just once assuming there are no updates in `/src/data/packages.json`. This will create the package detail pages.
```sh
.github/build-package-pages.sh src/data/packages.json src/content/packages
```
hugo can render your edits while you work:
@ -31,7 +36,6 @@ Install hugo yourself or use tea: `sh <(curl tea.xyz) hugo`.
|------------|---------|
| gohugo.io | >=0.99 |
# Build
Builds a static, deployable version of the website.

5
src/content/package-detail.md
View file

@ -1,5 +0,0 @@
---
title: "Package Details"
Description: "package.details"
layout: "package-detail"
---

15
src/content/packages/_sample.md Normal file
View file

@ -0,0 +1,15 @@
<!--
this page will be automatically duplicated/populated
by .github/build-package-pages.sh
before build & deploy probably in Github Actions
values to be replaced are title and Description
WARN: anything else added to this folder will be git ignored
-->
---
type: page
title: "mpdecimal"
Description: "mpdecimal"
layout: "package-detail"
---

122
src/data/packages.json Normal file
View file

@ -0,0 +1,122 @@
[
{
"name": "mpdecimal",
"full_name": "mpdecimal",
"desc": "Library for decimal floating point arithmetic",
"homepage": "https://www.bytereef.org/mpdecimal/",
"version": "2.5.1",
"installs": 3986221,
"maintainer": "",
"thumb_image_url": "/Images/package-thumb-nolabel.jpg"
},
{
"name": "svg2png",
"full_name": "svg2png",
"desc": "SVG to PNG converter",
"homepage": "https://cairographics.org/",
"version": "0.1.3",
"installs": 1233,
"maintainer": "pascal",
"thumb_image_url": "/Images/package-thumb-nolabel4.jpg"
},
{
"name": "cmake",
"full_name": "cmake",
"desc": "Cross-platform make",
"homepage": "https://www.cmake.org/",
"version": "3.24.2",
"installs": 1729267,
"maintainer": "pascal",
"thumb_image_url": "/Images/package-thumb-nolabel3.jpg"
},
{
"name": "h2c",
"full_name": "h2c",
"desc": "Headers 2 curl",
"homepage": "https://curl.se/h2c/",
"version": "1.0",
"installs": 96,
"maintainer": "h2o",
"thumb_image_url": "/Images/package-thumb-nolabel.jpg"
},
{
"name": "libmagic",
"full_name": "libmagic",
"desc": "Implementation of the file(1) command",
"homepage": "https://www.darwinsys.com/file/",
"version": "5.43",
"installs": 162436,
"maintainer": "",
"thumb_image_url": "/Images/package-thumb-nolabel3.jpg"
},
{
"name": "deno",
"full_name": "deno",
"desc": "Secure runtime for JavaScript and TypeScript",
"homepage": "https://deno.land/",
"version": "1.26.1",
"installs": 204033,
"maintainer": "Ryan Dahl",
"thumb_image_url": "/Images/package-thumb-nolabel2.jpg"
},
{
"name": "fontconfig",
"full_name": "fontconfig",
"desc": "XML-based font configuration API for X Windows",
"homepage": "https://wiki.freedesktop.org/www/Software/fontconfig/",
"version": "2.14.0",
"installs": 2485083,
"maintainer": "Max Miedinger",
"thumb_image_url": "/Images/package-thumb-nolabel.jpg"
},
{
"name": "pkg-config",
"full_name": "pkg-config",
"desc": "Manage compile and link flags for libraries",
"homepage": "https://freedesktop.org/wiki/Software/pkg-config/",
"version": "0.29.2",
"installs": 2634164,
"maintainer": "pascal",
"thumb_image_url": "/Images/package-thumb-nolabel4.jpg"
},
{
"name": "shared-mime-info",
"full_name": "shared-mime-info",
"desc": "Database of common MIME types",
"homepage": "https://wiki.freedesktop.org/www/Software/shared-mime-info",
"version": "2.2",
"installs": 642619,
"maintainer": "Mr.Mime",
"thumb_image_url": "/Images/package-thumb-nolabel3.jpg"
},
{
"name": "ttfautohint",
"full_name": "ttfautohint",
"desc": "Auto-hinter for TrueType fonts",
"homepage": "https://www.freetype.org/ttfautohint/",
"version": "1.8.4",
"installs": 4696,
"maintainer": "pascal",
"thumb_image_url": "/Images/package-thumb-nolabel.jpg"
},
{
"name": "numactl",
"full_name": "numactl",
"desc": "NUMA support for Linux",
"homepage": "https://github.com/numactl/numactl",
"version": "2.0.16",
"installs": 1120,
"maintainer": "FSS",
"thumb_image_url": "/Images/package-thumb-nolabel2.jpg"
},
{
"name": "flex",
"full_name": "flex",
"desc": "Fast Lexical Analyzer, generates Scanners (tokenizers)",
"homepage": "https://github.com/westes/flex",
"version": "2.6.4",
"installs": 35001,
"maintainer": "",
"thumb_image_url": "/Images/package-thumb-nolabel4.jpg"
}
]

4
src/layouts/index.html
View file

@ -164,7 +164,7 @@
align-items: center;
}
.swiper-slide img {
.swiper-slide figure > img {
display: block;
width: 100%;
height: 100%;
@ -208,7 +208,7 @@
<h2>sta'tea'stics</h2>
<p class="lead">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p><br>
{{- partial "detail-btn-large.html" . -}}
{{- partial "detail-btn-large.html" "#" -}}
</div>
</div>
<div class="row">

11
src/layouts/page/package-detail.html
View file

@ -9,10 +9,13 @@
</div>
</div>
<div class="col">
<h3>Package Title</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
{{- partial "detail-btn-large.html" -}}
<h3>{{- .Title -}}</h3>
{{ range where $.Site.Data.packages "name" .Title }}
<p>{{- .desc -}}</p>
{{ if not (eq .homepage "") }}
{{- partial "detail-btn-large.html" .homepage -}}
{{end}}
{{ end }}
</div>
</div>
</div>

4
src/layouts/partials/detail-btn-large.html
View file

@ -1 +1,3 @@
<button href="#" class="detail-btn-large"><i class="icon-enter-arrow"></i>VIEW ALL DETAILS</button>
<a target="_blank" href="{{- . -}}">
<button class="detail-btn-large"><i class="icon-enter-arrow"></i>VIEW ALL DETAILS</button>
</a>

8
src/layouts/partials/detail-btn.html
View file

@ -8,8 +8,9 @@
padding-top: 0.279vw;
text-decoration: none;
text-transform: uppercase;
width: 48%;
width: 134px;
height: 2.232vw;
min-height: 34px;
transition: 0.1s linear;
}
@ -34,4 +35,7 @@
</style>
<button href="#" class="detail-btn"><i class="icon-enter-arrow"></i>details</button>
<a href="/packages/{{- .name -}}/">
<button class="detail-btn"><i class="icon-enter-arrow"></i>details</button>
</a>

2
src/layouts/partials/navbar.html
View file

@ -1,6 +1,6 @@
<nav class="navbar bg-dark navbar-expand-lg navbar-dark sticky-top my-auto main-nav">
<div class="container-fluid top-nav">
<a class="navbar-brand" href="#"><img class="nav-logo" src="/Images/tea-logo-2.svg"></a>
<a class="navbar-brand" href="/"><img class="nav-logo" src="/Images/tea-logo-2.svg"></a>
<button class="navbar-toggler" type="button" data-bs-toggle="offcanvas" data-bs-target="#offcanvasRight"
aria-controls="offcanvasRight" aria-expanded="false" aria-label="Toggle navigation">
MENU

48
src/layouts/partials/package-grid.html
View file

@ -13,30 +13,32 @@
<!-- Start Package Grid -->
<div class="row package-row black-bg g-0">
<div class="col-xxl-3 col-xl-4 col-lg-4 col-md-4 col-sm-12 col-12">
{{- partial "package-thumbnail.html" . -}}
{{- partial "package-thumbnail.html" . -}}
{{- partial "package-thumbnail.html" . -}}
{{- partial "package-thumbnail.html" . -}}
</div>
<div class="col-xxl-3 col-xl-4 col-lg-4 col-md-4 col-sm-12 col-12">
{{- partial "package-thumbnail.html" . -}}
{{- partial "package-thumbnail.html" . -}}
{{- partial "package-thumbnail.html" . -}}
{{- partial "package-thumbnail.html" . -}}
</div>
<div class="col-xxl-3 col-xl-4 col-lg-4 col-md-4 col-sm-12 col-12">
{{- partial "package-thumbnail.html" . -}}
{{- partial "package-thumbnail.html" . -}}
{{- partial "package-thumbnail.html" . -}}
{{- partial "package-thumbnail.html" . -}}
</div>
<div class="col-xxl-3 col-xl-4 col-lg-4 col-md-4 col-sm-12 col-12">
{{- partial "package-thumbnail.html" . -}}
{{- partial "package-thumbnail.html" . -}}
{{- partial "package-thumbnail.html" . -}}
{{- partial "package-thumbnail.html" . -}}
<div class="package-grid">
{{ range $.Site.Data.packages }}
{{- partial "package-thumbnail.html" .}}
{{ end }}
</div>
</div>
</div>
</section>
<style>
.package-grid {
display: grid;
grid-template-columns: auto auto;
}
@media only screen and (min-width: 576px) {
.package-grid {
/* changes to 3 column thumbs */
grid-template-columns: auto auto auto;
}
}
@media only screen and (min-width: 992px) {
.package-grid {
/* changes to 4 column thumbs */
grid-template-columns: auto auto auto auto;
}
}
</style>

52
src/layouts/partials/package-thumbnail.html
View file

@ -1,17 +1,62 @@
<div class="card card-thumbnail" style="width: 100%">
<img src="/Images/package-thumb-1.jpg" class="card-img-top" alt="..." style="width:100%; height:100%;">
<figure class="card-img-top" >
<img src="{{- .thumb_image_url -}}" alt="{{- .name -}}" style="width:100%; height:100%;">
<article class="card-thumb-label">
<img src="/Images/tea-logo-no-bg.svg" width="26" alt="tea"/>
<h3>{{- .name -}}</h3>
{{ if not (eq .maintainer "") }}
<h4>&#x2022;&nbsp;{{- .maintainer -}}</h4>
{{end}}
</article>
</figure>
<div class="card-body thumbnail-body">
<div class="card-text-container">
<p class="card-text"><span class="package-version-no">V2.35</span><br><span class="package-install-no">>45 installs</span></p>
<p class="card-text">
<span class="package-version-no">V&NonBreakingSpace;{{- .version -}}</span>
<!--
TODO: uncomment once install counts are not disappointing anymore
<br>
<span class="package-install-no">>{{- .installs -}}&nbsp;installs</span> -->
</p>
</div>
{{- partial "detail-btn.html" . -}}
</div>
<div class="card-body thumbnail-body-mobile">
<button href="#" class="detail-btn-mobile"><i class="icon-enter-arrow"></i>details</button>
<a href="/packages/{{- .name -}}/">
<button class="detail-btn-mobile"><i class="icon-enter-arrow"></i>details</button>
</a>
</div>
</div>
<style>
.card-img-top {
position: relative;
}
.card-thumb-label {
position: absolute;
background: rgba(255,255,255,0.9);
left: 0;
bottom: 10px;
padding: 10px;
text-align: left;
}
.card-thumb-label h3 {
color: black;
font-size: 1.1em;
line-height: 1.1em;
margin: 0px;
padding: 0px;
}
.card-thumb-label h4 {
color: black;
font-size: 0.9em;
line-height: 0.9em;
margin: 0px;
padding: 0px;
}
@media only screen and (min-width: 576px) {
@ -23,6 +68,7 @@
}
.thumbnail-body{
display: flex;
border-radius: 0px !important;
padding: 0vw;
}

14
src/layouts/partials/swiper.html
View file

@ -11,15 +11,11 @@
<div class="col">
<div class="swiper mySwiper">
<div class="swiper-wrapper">
<div class="swiper-slide">{{- partial "package-thumbnail.html" . -}}</div>
<div class="swiper-slide">{{- partial "package-thumbnail.html" . -}}</div>
<div class="swiper-slide">{{- partial "package-thumbnail.html" . -}}</div>
<div class="swiper-slide">{{- partial "package-thumbnail.html" . -}}</div>
<div class="swiper-slide">{{- partial "package-thumbnail.html" . -}}</div>
<div class="swiper-slide">{{- partial "package-thumbnail.html" . -}}</div>
<div class="swiper-slide">{{- partial "package-thumbnail.html" . -}}</div>
<div class="swiper-slide">{{- partial "package-thumbnail.html" . -}}</div>
<div class="swiper-slide">{{- partial "package-thumbnail.html" . -}}</div>
{{ range $.Site.Data.packages }}
<div class="swiper-slide">
{{- partial "package-thumbnail.html" .}}
</div>
{{ end }}
</div>
<!--<div class="swiper-pagination"></div>-->
</div>

BIN
src/static/Images/package-thumb-nolabel.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 78 KiB

BIN
src/static/Images/package-thumb-nolabel2.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 102 KiB

BIN
src/static/Images/package-thumb-nolabel3.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 56 KiB

BIN
src/static/Images/package-thumb-nolabel4.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 162 KiB

1
src/static/Images/tea-logo-no-bg.svg Normal file
View file

File diff suppressed because one or more lines are too long
Side by side

After

Width:  |  Height:  |  Size: 5 KiB