sudacode/metrics
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Add config_display option to support regular and large renders (#310)

Browse Source
This commit is contained in:
Simon Lecoq
2021-05-18 22:31:53 +02:00
committed by GitHub
parent 04bf1f0316
commit ed0da41973
36 changed files with 586 additions and 402 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
source/app/metrics/index.mjs
View File

@@ -26,7 +26,7 @@ export default async function metrics({login, q}, {graphql, rest, plugins, conf,
//Initialization
const pending = []
const {queries} = conf
const data = {animated:true, base:{}, config:{}, errors:[], plugins:{}, computed:{}}
const data = {animated:true, large:false, base:{}, config:{}, errors:[], plugins:{}, computed:{}}
const imports = {
plugins:Plugins,
templates:Templates,

4
source/app/web/statics/app.placeholder.js
View File

@@ -51,9 +51,11 @@
return await ejs.render(partial, data, { async: true, rmWhitespace: true })
},
//Meta-data
meta: { version: set.version, author: "lowlighter" },
meta: { version: set.version, author: "lowlighter", generated:new Date().toGMTString().replace(/GMT$/g, "").trim() },
//Animated
animated: false,
//Display size
large: set.config.display === "large",
//Config
config: set.config,
//Base elements

2
source/plugins/contributors/index.mjs
View File

@@ -33,7 +33,7 @@ export default async function({login, q, imports, data, rest, graphql, queries,
console.debug(`metrics/compute/${login}/plugins > contributors > no more page to load`)
break
}
commits.push(...loaded)
commits.push(...loaded.filter(commit => commit?.author?.login))
}
catch (error) {
if (/Git Repository is empty/.test(error))

15
source/plugins/core/README.md
View File

@@ -140,6 +140,21 @@ It may increase filesize since it replace unicode characters by SVG images.
config_twemoji: yes
```
### ↔️ Controlling display size
Some templates like `classic` and `repositories` support different output display size:
- `regular` (default) will render a medium-sized image, which is suitable for both desktop and mobile displays and is preferable when using data-intensive metrics (since text may be scaled down on small devices)
- `large` will render a large-sized image, which may be more suitable for some plugins (like displaying topics icons, repository contributors, etc.)
#### ℹ️ Examples workflows
```yaml
- uses: lowlighter/metrics@latest
with:
# ... other options
config_display: large
```
### 🎞️ SVG CSS Animations
As rendered metrics use HTML and CSS, some templates have animations.

5
source/plugins/core/index.mjs
View File

@@ -6,7 +6,7 @@
//Setup
export default async function({login, q}, {conf, data, rest, graphql, plugins, queries, account, convert, template}, {pending, imports}) {
//Load inputs
const {"config.animations":animations, "config.timezone":_timezone, "debug.flags":dflags} = imports.metadata.plugins.core.inputs({data, account, q})
const {"config.animations":animations, "config.display":display, "config.timezone":_timezone, "debug.flags":dflags} = imports.metadata.plugins.core.inputs({data, account, q})
imports.metadata.templates[template].check({q, account, format:convert})
//Init
@@ -29,6 +29,9 @@ export default async function({login, q}, {conf, data, rest, graphql, plugins, q
}
}
//Display
data.large = display === "large"
//Animations
data.animated = animations
console.debug(`metrics/compute/${login} > animations ${data.animated ? "enabled" : "disabled"}`)

9
source/plugins/core/metadata.yml
View File

@@ -167,6 +167,15 @@ inputs:
type: boolean
default: yes
# Render display width
config_display:
description: Render display width
type: string
default: regular
values:
- regular # 480px width
- large # 960px width (may not be supported by all templates)
# Enable SVG CSS animations
config_animations:
description: SVG CSS animations

2
source/plugins/licenses/index.mjs
View File

@@ -57,7 +57,7 @@ export default async function({login, q, imports, data, graphql, queries, accoun
//Spawn licensed process
console.debug(`metrics/compute/${login}/plugins > licenses > running licensed`)
JSON.parse(await imports.run("licensed list --format=json --licenses", {cwd:path})).apps
.map(({sources}) => sources?.flatMap(source => source.dependencies.map(({dependency, license}) => {
.map(({sources}) => sources?.flatMap(source => source.dependencies?.map(({dependency, license}) => {
used[license] = (used[license] ?? 0) + 1
result.dependencies.push(dependency)
result.known += (license in licenses)

2
source/plugins/screenshot/index.mjs
View File

@@ -28,7 +28,7 @@ export default async function({login, q, imports, data, account}, {enabled = fal
}, selector)
console.debug(`metrics/compute/${login}/plugins > screenshot > coordinates ${JSON.stringify(clip)}`)
const [buffer] = await imports.record({page, ...clip, frames:1, background})
const screenshot = await (await imports.jimp.read(Buffer.from(buffer.split(",").pop(), "base64"))).resize(Math.min(454, clip.width), imports.jimp.AUTO)
const screenshot = await (await imports.jimp.read(Buffer.from(buffer.split(",").pop(), "base64"))).resize(Math.min(454 * (1 + data.large), clip.width), imports.jimp.AUTO)
await browser.close()
//Results

2
source/plugins/skyline/index.mjs
View File

@@ -12,7 +12,7 @@ export default async function({login, q, imports, data, account}, {enabled = fal
year = new Date().getFullYear()
console.debug(`metrics/compute/${login}/plugins > skyline > year set to ${year}`)
}
const width = 454
const width = 454 * (1 + data.large)
const height = 284
//Start puppeteer and navigate to skyline.github.com

2
source/plugins/stargazers/index.mjs
View File

@@ -31,7 +31,7 @@ export default async function({login, graphql, data, imports, q, queries, accoun
console.debug(`metrics/compute/${login}/plugins > stargazers > loaded ${dates.length} stargazers in total`)
//Compute stargazers increments
const days = 14
const days = 14 * (1 + data.large/2)
const increments = {dates:Object.fromEntries([...new Array(days).fill(null).map((_, i) => [new Date(Date.now() - i * 24 * 60 * 60 * 1000).toISOString().slice(0, 10), 0]).reverse()]), max:NaN, min:NaN}
dates
.map(date => date.toISOString().slice(0, 10))

2
source/plugins/stock/index.mjs
View File

@@ -32,7 +32,7 @@ export default async function({login, q, imports, data, account}, {enabled = fal
//Generating chart
console.debug(`metrics/compute/${login}/plugins > stock > generating chart`)
const chart = await imports.chartist("line", {
width:480,
width:480 * (1 + data.large),
height:160,
showPoint:false,
axisX:{showGrid:false, labelInterpolationFnc:(value, index) => index % Math.floor(close.length / 4) === 0 ? value : null},

2
source/templates/classic/image.svg
View File

@@ -1,4 +1,4 @@
<svg xmlns="http://www.w3.org/2000/svg" width="480" height="99999" class="<%= !animated ? 'no-animations' : '' %>">
<svg xmlns="http://www.w3.org/2000/svg" width="<%= large ? 960 : 480 %>" height="99999" class="<%= large ? 'large' : '' %> <%= !animated ? 'no-animations' : '' %>">
<defs><style><%= fonts %></style></defs>
<style><%= style %></style>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.0 KiB

After

Width:  |  Height:  |  Size: 1.1 KiB

4
source/templates/classic/partials/achievements.ejs
View File

@@ -5,7 +5,7 @@
Achievements
</h2>
<div class="row">
<section>
<section class="largeable-flex-wrap">
<% if (plugins.achievements.error) { %>
<div class="field error">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M2.343 13.657A8 8 0 1113.657 2.343 8 8 0 012.343 13.657zM6.03 4.97a.75.75 0 00-1.06 1.06L6.94 8 4.97 9.97a.75.75 0 101.06 1.06L8 9.06l1.97 1.97a.75.75 0 101.06-1.06L9.06 8l1.97-1.97a.75.75 0 10-1.06-1.06L8 6.94 6.03 4.97z"></path></svg>
@@ -13,7 +13,7 @@
</div>
<% } else { %>
<% for (const {title, text, icon, rank, leaderboard = null, progress = 0, unlock = null} of plugins.achievements.list) { %>
<div class="achievement <%= rank === "$" ? "secret" : rank.charAt(0).toLocaleLowerCase() %>">
<div class="achievement <%= rank === "$" ? "secret" : rank.charAt(0).toLocaleLowerCase() %> largeable-width-half">
<div class="icon">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 60 60" height="44" width="44">
<defs>

4
source/templates/classic/partials/anilist.ejs
View File

@@ -46,8 +46,9 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M2 4a1 1 0 100-2 1 1 0 000 2zm3.75-1.5a.75.75 0 000 1.5h8.5a.75.75 0 000-1.5h-8.5zm0 5a.75.75 0 000 1.5h8.5a.75.75 0 000-1.5h-8.5zm0 5a.75.75 0 000 1.5h8.5a.75.75 0 000-1.5h-8.5zM3 8a1 1 0 11-2 0 1 1 0 012 0zm-1 6a1 1 0 100-2 1 1 0 000 2z"></path></svg>
<%= {favorites:`Favorites ${media}s`, watching:"Currently watching", reading:"Currently reading"}[list] %>
</h2>
<div class="medias largeable-flex-wrap">
<% for (const {name, type, description, release, status, genres, scores, progress, released, artwork} of plugins.anilist.lists[media][list]) { %>
<div class="media">
<div class="media largeable-width-half">
<img src="<%= artwork %>" width="48" height="72" alt=""/>
<div class="about">
<div class="name">
@@ -105,6 +106,7 @@
</div>
<% } %>
</div>
</div>
<% } %>
<% } %>
<% } %>

2
source/templates/classic/partials/base.activity+community.ejs
View File

@@ -1,5 +1,5 @@
<% if ((account === "user")&&((base.activity)||(base.community))) { %>
<section>
<section class="largeable largeable-inline-flex">
<div class="row">
<% if (base.activity) { %>
<section>

4
source/templates/classic/partials/base.repositories.ejs
View File

@@ -1,4 +1,6 @@
<% if (base.repositories) { %>
<section class="largeable largeable-inline-flex">
<div class="row">
<section>
<h2 class="field">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M2 2.5A2.5 2.5 0 014.5 0h8.75a.75.75 0 01.75.75v12.5a.75.75 0 01-.75.75h-2.5a.75.75 0 110-1.5h1.75v-2h-8a1 1 0 00-.714 1.7.75.75 0 01-1.072 1.05A2.495 2.495 0 012 11.5v-9zm10.5-1V9h-8c-.356 0-.694.074-1 .208V2.5a1 1 0 011-1h8zM5 12.25v3.25a.25.25 0 00.4.2l1.45-1.087a.25.25 0 01.3 0L8.6 15.7a.25.25 0 00.4-.2v-3.25a.25.25 0 00-.25-.25h-3.5a.25.25 0 00-.25.25z"></path></svg>
@@ -67,4 +69,6 @@
</section>
</div>
</section>
</div>
</section>
<% } %>

2
source/templates/classic/partials/followup.ejs
View File

@@ -14,7 +14,7 @@
</section>
<% } else { %>
<% for (const name of plugins.followup.sections) { const section = {repositories:plugins.followup, user:plugins.followup?.user}[name] %>
<div class="column">
<div class="column largeable">
<h3>
<%= {repositories:`On ${user.login}'${[...user.login].pop() === "s" ? "" : "s"} repositories`, user:`Created by ${user.login}`}[name] %>
</h3>

4
source/templates/classic/partials/gists.ejs
View File

@@ -13,7 +13,7 @@
</div>
</section>
<% } else { %>
<section>
<section class="largeable-column-fields">
<div class="field">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M4 1.75C4 .784 4.784 0 5.75 0h5.586c.464 0 .909.184 1.237.513l2.914 2.914c.329.328.513.773.513 1.237v8.586A1.75 1.75 0 0114.25 15h-9a.75.75 0 010-1.5h9a.25.25 0 00.25-.25V6h-2.75A1.75 1.75 0 0110 4.25V1.5H5.75a.25.25 0 00-.25.25v2.5a.75.75 0 01-1.5 0v-2.5zm7.5-.188V4.25c0 .138.112.25.25.25h2.688a.252.252 0 00-.011-.013l-2.914-2.914a.272.272 0 00-.013-.011zM5.72 6.72a.75.75 0 000 1.06l1.47 1.47-1.47 1.47a.75.75 0 101.06 1.06l2-2a.75.75 0 000-1.06l-2-2a.75.75 0 00-1.06 0zM3.28 7.78a.75.75 0 00-1.06-1.06l-2 2a.75.75 0 000 1.06l2 2a.75.75 0 001.06-1.06L1.81 9.25l1.47-1.47z"></path></svg>
<%= plugins.gists.files %> File<%= s(plugins.gists.files) %>
@@ -23,7 +23,7 @@
<%= plugins.gists.comments %> Comment<%= s(plugins.gists.comments) %>
</div>
</section>
<section>
<section class="largeable-column-fields">
<div class="field">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M8 .25a.75.75 0 01.673.418l1.882 3.815 4.21.612a.75.75 0 01.416 1.279l-3.046 2.97.719 4.192a.75.75 0 01-1.088.791L8 12.347l-3.766 1.98a.75.75 0 01-1.088-.79l.72-4.194L.818 6.374a.75.75 0 01.416-1.28l4.21-.611L7.327.668A.75.75 0 018 .25zm0 2.445L6.615 5.5a.75.75 0 01-.564.41l-3.097.45 2.24 2.184a.75.75 0 01.216.664l-.528 3.084 2.769-1.456a.75.75 0 01.698 0l2.77 1.456-.53-3.084a.75.75 0 01.216-.664l2.24-2.183-3.096-.45a.75.75 0 01-.564-.41L8 2.694v.001z"></path></svg>
<%= plugins.gists.stargazers %> Stargazer<%= s(plugins.gists.stargazers) %>

4
source/templates/classic/partials/habits.ejs
View File

@@ -32,7 +32,7 @@
<% if (plugins.habits.charts) { %>
<% if (!Number.isNaN(plugins.habits.commits.hour)) { %>
<section class="column chart">
<section class="column chart largeable">
<h3>Commit activity per time of the day</h3>
<div class="chart-bars">
<% for (let h = 0; h < 24; h++) { const p = (plugins.habits.commits.hours[h]??0)/(plugins.habits.commits.hours.max??1); %>
@@ -46,7 +46,7 @@
</section>
<% } %>
<div class="row">
<div class="row largeable">
<% if (!Number.isNaN(plugins.habits.commits.day)) { %>
<section class="column chart">
<h3>Commit activity per day</h3>

16
source/templates/classic/partials/languages.ejs
View File

@@ -11,21 +11,21 @@
<%= plugins.languages.error.message %>
</div>
</section>
<% } else { %>
<svg class="bar" xmlns="http://www.w3.org/2000/svg" width="460" height="8">
<% } else { const width = 460 * (1 + large) %>
<svg class="bar" xmlns="http://www.w3.org/2000/svg" width="<%= width %>" height="8">
<mask id="languages-bar">
<rect x="0" y="0" width="460" height="8" fill="white" rx="5"/>
<rect x="0" y="0" width="<%= width %>" height="8" fill="white" rx="5"/>
</mask>
<rect mask="url(#languages-bar)" x="0" y="0" width="<%= plugins.languages.favorites.length ? 0 : 460 %>" height="8" fill="#d1d5da"/>
<rect mask="url(#languages-bar)" x="0" y="0" width="<%= plugins.languages.favorites.length ? 0 : width %>" height="8" fill="#d1d5da"/>
<% for (const {name, value, color, x} of plugins.languages.favorites) { %>
<rect mask="url(#languages-bar)" x="<%= x*460 %>" y="0" width="<%= value*460 %>" height="8" fill="<%= color %>"/>
<rect mask="url(#languages-bar)" x="<%= x*width %>" y="0" width="<%= value*width %>" height="8" fill="<%= color %>"/>
<% } %>
</svg>
<% if (plugins.languages.details?.length) { %>
<% if (plugins.languages.details?.length) { const rows = large ? [0, 1, 2, 3] : [0, 1] %>
<div class="row fill-width">
<% for (const row of [0, 1]) { %>
<% for (const row of rows) { %>
<section>
<% for (const {name, value, color, size} of plugins.languages.favorites.filter((_, i) => i%2 === row)) { %>
<% for (const {name, value, color, size} of plugins.languages.favorites.filter((_, i) => i%rows.length === row)) { %>
<div class="field language details">
<div class="field">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill="<%= color %>" fill-rule="evenodd" d="M8 4a4 4 0 100 8 4 4 0 000-8z"></path></svg>

35
source/templates/classic/partials/pagespeed.ejs
View File

@@ -56,6 +56,36 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M1.643 3.143L.427 1.927A.25.25 0 000 2.104V5.75c0 .138.112.25.25.25h3.646a.25.25 0 00.177-.427L2.715 4.215a6.5 6.5 0 11-1.18 4.458.75.75 0 10-1.493.154 8.001 8.001 0 101.6-5.684zM7.75 4a.75.75 0 01.75.75v2.992l2.028.812a.75.75 0 01-.557 1.392l-2.5-1A.75.75 0 017 8.25v-3.5A.75.75 0 017.75 4z"></path></svg>
Total Blocking Time
</div>
</section>
<section>
<% for (const {score, suffix = "", threshold} of [
{score:plugins.pagespeed.metrics.firstContentfulPaint/1000, suffix:"s", threshold:[2.336, 4]},
{score:plugins.pagespeed.metrics.largestContentfulPaint/1000, suffix:"s", threshold:[2.5, 4]},
{score:+plugins.pagespeed.metrics.cumulativeLayoutShift, threshold:[.1, .25]}
]) { %>
<div class="field">
<div class="audit text">
<% if (!Number.isNaN(score)) { %>
<%= score.toFixed(2).replace(/[.]0+$/, "") %> <%= suffix %>
<% } else { %>
N/A
<% } %>
</div>
<% if (Number.isNaN(score)) { %>
<svg xmlns="http://www.w3.org/2000/svg" class="audit" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M1.5 8a6.5 6.5 0 1113 0 6.5 6.5 0 01-13 0zM8 0a8 8 0 100 16A8 8 0 008 0zm3.28 5.78a.75.75 0 00-1.06-1.06l-5.5 5.5a.75.75 0 101.06 1.06l5.5-5.5z"></path></svg>
<% } else if (score <= threshold[0]) { %>
<svg xmlns="http://www.w3.org/2000/svg" class="audit high" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M1.5 8a6.5 6.5 0 1113 0 6.5 6.5 0 01-13 0zM0 8a8 8 0 1116 0A8 8 0 010 8zm11.78-1.72a.75.75 0 00-1.06-1.06L6.75 9.19 5.28 7.72a.75.75 0 00-1.06 1.06l2 2a.75.75 0 001.06 0l4.5-4.5z"></path></svg>
<% } else if (score <= threshold[1]) { %>
<svg xmlns="http://www.w3.org/2000/svg" class="audit average" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM0 8a8 8 0 1116 0A8 8 0 010 8zm9 3a1 1 0 11-2 0 1 1 0 012 0zm-.25-6.25a.75.75 0 00-1.5 0v3.5a.75.75 0 001.5 0v-3.5z"></path></svg>
<% } else { %>
<svg xmlns="http://www.w3.org/2000/svg" class="audit low" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M4.47.22A.75.75 0 015 0h6a.75.75 0 01.53.22l4.25 4.25c.141.14.22.331.22.53v6a.75.75 0 01-.22.53l-4.25 4.25A.75.75 0 0111 16H5a.75.75 0 01-.53-.22L.22 11.53A.75.75 0 010 11V5a.75.75 0 01.22-.53L4.47.22zm.84 1.28L1.5 5.31v5.38l3.81 3.81h5.38l3.81-3.81V5.31L10.69 1.5H5.31zM8 4a.75.75 0 01.75.75v3.5a.75.75 0 01-1.5 0v-3.5A.75.75 0 018 4zm0 8a1 1 0 100-2 1 1 0 000 2z"></path></svg>
<% } %>
</div>
<% } %>
</section>
</div>
<div class="audits row">
<section>
<div class="field">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M11.134 1.535C9.722 2.562 8.16 4.057 6.889 5.312 5.8 6.387 5.041 7.401 4.575 8.294a3.745 3.745 0 00-3.227 1.054c-.43.431-.69 1.066-.86 1.657a11.982 11.982 0 00-.358 1.914A21.263 21.263 0 000 15.203v.054l.75-.007-.007.75h.054a14.404 14.404 0 00.654-.012 21.243 21.243 0 001.63-.118c.62-.07 1.3-.18 1.914-.357.592-.17 1.226-.43 1.657-.861a3.745 3.745 0 001.055-3.217c.908-.461 1.942-1.216 3.04-2.3 1.279-1.262 2.764-2.825 3.775-4.249.501-.706.923-1.428 1.125-2.096.2-.659.235-1.469-.368-2.07-.606-.607-1.42-.55-2.069-.34-.66.213-1.376.646-2.076 1.155zm-3.95 8.48a3.76 3.76 0 00-1.19-1.192 9.758 9.758 0 011.161-1.607l1.658 1.658a9.853 9.853 0 01-1.63 1.142zM.742 16l.007-.75-.75.008A.75.75 0 00.743 16zM12.016 2.749c-1.224.89-2.605 2.189-3.822 3.384l1.718 1.718c1.21-1.205 2.51-2.597 3.387-3.833.47-.662.78-1.227.912-1.662.134-.444.032-.551.009-.575h-.001V1.78c-.014-.014-.112-.113-.548.027-.432.14-.995.462-1.655.942zM1.62 13.089a19.56 19.56 0 00-.104 1.395 19.55 19.55 0 001.396-.104 10.528 10.528 0 001.668-.309c.526-.151.856-.325 1.011-.48a2.25 2.25 0 00-3.182-3.182c-.155.155-.329.485-.48 1.01a10.515 10.515 0 00-.309 1.67z"></path></svg>
First Contentful Paint
@@ -71,9 +101,6 @@
</section>
<section>
<% for (const {score, suffix = "", threshold} of [
{score:plugins.pagespeed.metrics.interactive/1000, suffix:"s", threshold:[3.785, 7.3]},
{score:plugins.pagespeed.metrics.speedIndex/1000, suffix:"s", threshold:[3.387, 5.8]},
{score:plugins.pagespeed.metrics.totalBlockingTime/1000, suffix:"s", threshold:[.287, .6]},
{score:plugins.pagespeed.metrics.firstContentfulPaint/1000, suffix:"s", threshold:[2.336, 4]},
{score:plugins.pagespeed.metrics.largestContentfulPaint/1000, suffix:"s", threshold:[2.5, 4]},
{score:+plugins.pagespeed.metrics.cumulativeLayoutShift, threshold:[.1, .25]}
@@ -103,7 +130,7 @@
<% if (plugins.pagespeed.screenshot) { %>
<div class="row">
<section>
<img class="screenshot" src="<%= plugins.pagespeed.screenshot %>" width="452" height="315"/>
<img class="screenshot" src="<%= plugins.pagespeed.screenshot %>" width="<%= 452 * (1 + large) %>" height="<%= 315 * (1 + large) %>"/>
</section>
</div>
<% } %>

4
source/templates/classic/partials/posts.ejs
View File

@@ -16,9 +16,10 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M2.002 2.725a.75.75 0 01.797-.699C8.79 2.42 13.58 7.21 13.974 13.201a.75.75 0 11-1.497.098 10.502 10.502 0 00-9.776-9.776.75.75 0 01-.7-.798zM2 13a1 1 0 112 0 1 1 0 01-2 0zm.84-5.95a.75.75 0 00-.179 1.489c2.509.3 4.5 2.291 4.8 4.8a.75.75 0 101.49-.178A7.003 7.003 0 002.838 7.05z"></path></svg>
From <%= plugins.posts.source %>
</div>
<div class="posts largeable-flex-wrap">
<% if (plugins.posts.list.length) { %>
<% for (const {title, description, image, date} of plugins.posts.list) { %>
<div class="field post">
<div class="field post largeable-width-half">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M4.75 0a.75.75 0 01.75.75V2h5V.75a.75.75 0 011.5 0V2h1.25c.966 0 1.75.784 1.75 1.75v10.5A1.75 1.75 0 0113.25 16H2.75A1.75 1.75 0 011 14.25V3.75C1 2.784 1.784 2 2.75 2H4V.75A.75.75 0 014.75 0zm0 3.5h8.5a.25.25 0 01.25.25V6h-11V3.75a.25.25 0 01.25-.25h2zm-2.25 4v6.75c0 .138.112.25.25.25h10.5a.25.25 0 00.25-.25V7.5h-11z"></path></svg>
<div class="infos">
<div class="left">
@@ -42,6 +43,7 @@
No recent posts
</div>
<% } %>
</div>
<% } %>
</section>
</div>

12
source/templates/classic/partials/projects.ejs
View File

@@ -48,15 +48,15 @@
</section>
<% } %>
</div>
<% if (progress.enabled) { %>
<% if (progress.enabled) { const width = 460 * (1 + large) %>
<div class="field center horizontal-wrap ">
<svg class="bar" xmlns="http://www.w3.org/2000/svg" width="460" height="8">
<svg class="bar" xmlns="http://www.w3.org/2000/svg" width="<%= width %>" height="8">
<mask id="project-bar">
<rect x="0" y="0" width="460" height="8" fill="white" rx="5"/>
<rect x="0" y="0" width="<%= width %>" height="8" fill="white" rx="5"/>
</mask>
<rect mask="url(#project-bar)" x="0" y="0" width="<%= (progress.done/progress.total)*460 %>" height="8" fill="#28A745"/>
<rect mask="url(#project-bar)" x="<%= (progress.done/progress.total)*460 %>" y="0" width="<%= (progress.doing/progress.total)*460 %>" height="8" fill="#6F42C1"/>
<rect mask="url(#project-bar)" x="<%= ((progress.done+progress.doing)/progress.total)*460 %>" y="0" width="<%= (progress.todo/progress.total)*460 %>" height="8" fill="#d1d5da"/>
<rect mask="url(#project-bar)" x="0" y="0" width="<%= (progress.done/progress.total)*width %>" height="8" fill="#28A745"/>
<rect mask="url(#project-bar)" x="<%= (progress.done/progress.total)*width %>" y="0" width="<%= (progress.doing/progress.total)*width %>" height="8" fill="#6F42C1"/>
<rect mask="url(#project-bar)" x="<%= ((progress.done+progress.doing)/progress.total)*width %>" y="0" width="<%= (progress.todo/progress.total)*width %>" height="8" fill="#d1d5da"/>
</svg>
</div>
<% } %>

10
source/templates/classic/partials/stackoverflow.ejs
View File

@@ -14,8 +14,8 @@
</section>
</div>
<% } else { %>
<div class="row">
<section>
<div class="row largeable-align-start">
<section class="largeable-column-fields">
<div class="field">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path d="M8.5.75a.75.75 0 00-1.5 0v5.19L4.391 3.33a.75.75 0 10-1.06 1.061L5.939 7H.75a.75.75 0 000 1.5h5.19l-2.61 2.609a.75.75 0 101.061 1.06L7 9.561v5.189a.75.75 0 001.5 0V9.56l2.609 2.61a.75.75 0 101.06-1.061L9.561 8.5h5.189a.75.75 0 000-1.5H9.56l2.61-2.609a.75.75 0 00-1.061-1.06L8.5 5.939V.75z"></path></svg>
<%= plugins.stackoverflow.user.reputation %> reputation point<%= s(plugins.stackoverflow.user.reputation) %>
@@ -29,7 +29,7 @@
<%= plugins.stackoverflow.user.comments %> comment<%= s(plugins.stackoverflow.user.comments) %>
</div>
</section>
<section>
<section class="largeable-column-fields">
<div class="field">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M3.637 2.291A.75.75 0 014.23 2h7.54a.75.75 0 01.593.291l3.48 4.5a.75.75 0 01-.072.999l-7.25 7a.75.75 0 01-1.042 0l-7.25-7a.75.75 0 01-.072-.999l3.48-4.5zM4.598 3.5L1.754 7.177 8 13.207l6.246-6.03L11.402 3.5H4.598z"></path></svg>
<%= plugins.stackoverflow.user.badges %> badge<%= s(plugins.stackoverflow.user.badges) %>
@@ -57,8 +57,9 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M2 4a1 1 0 100-2 1 1 0 000 2zm3.75-1.5a.75.75 0 000 1.5h8.5a.75.75 0 000-1.5h-8.5zm0 5a.75.75 0 000 1.5h8.5a.75.75 0 000-1.5h-8.5zm0 5a.75.75 0 000 1.5h8.5a.75.75 0 000-1.5h-8.5zM3 8a1 1 0 11-2 0 1 1 0 012 0zm-1 6a1 1 0 100-2 1 1 0 000 2z"></path></svg>
<%= {"questions-recent":"Recent questions", "questions-top":"Top questions", "answers-recent":"Recent answers", "answers-top":"Top answers"}[section] %>
</h2>
<div class="entries largeable-flex-wrap">
<% for (const {type, ...entry} of plugins.stackoverflow[section]) { %>
<div class="entry">
<div class="entry largeable-width-half">
<% if (type === "question") { %>
<div class="field title">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M2.75 2.5a.25.25 0 00-.25.25v7.5c0 .138.112.25.25.25h2a.75.75 0 01.75.75v2.19l2.72-2.72a.75.75 0 01.53-.22h4.5a.25.25 0 00.25-.25v-7.5a.25.25 0 00-.25-.25H2.75zM1 2.75C1 1.784 1.784 1 2.75 1h10.5c.966 0 1.75.784 1.75 1.75v7.5A1.75 1.75 0 0113.25 12H9.06l-2.573 2.573A1.457 1.457 0 014 13.543V12H2.75A1.75 1.75 0 011 10.25v-7.5z"></path></svg>
@@ -153,6 +154,7 @@
</div>
<% } %>
</div>
</div>
</section>
</div>
<% } %>

4
source/templates/classic/partials/stars.ejs
View File

@@ -5,7 +5,7 @@
Recently starred repositories
</h2>
<div class="row">
<section>
<section class="largeable-flex-wrap">
<% if (plugins.stars.error) { %>
<div class="field error">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M2.343 13.657A8 8 0 1113.657 2.343 8 8 0 012.343 13.657zM6.03 4.97a.75.75 0 00-1.06 1.06L6.94 8 4.97 9.97a.75.75 0 101.06 1.06L8 9.06l1.97 1.97a.75.75 0 101.06-1.06L9.06 8l1.97-1.97a.75.75 0 10-1.06-1.06L8 6.94 6.03 4.97z"></path></svg>
@@ -13,7 +13,7 @@
</div>
<% } else { %>
<% for (const {starred, node:repository} of plugins.stars.repositories) { %>
<div class="row fill-width">
<div class="row fill-width largeable-width-half">
<section class="repository">
<div class="field">
<% if (repository.isFork) { %>

6
source/templates/classic/partials/support.ejs
View File

@@ -14,8 +14,8 @@
</section>
</div>
<% } else { %>
<div class="row">
<section>
<div class="row largeable-align-start">
<section class="largeable-column-fields">
<div class="field">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M4.25 2.5c-1.336 0-2.75 1.164-2.75 3 0 2.15 1.58 4.144 3.365 5.682A20.565 20.565 0 008 13.393a20.561 20.561 0 003.135-2.211C12.92 9.644 14.5 7.65 14.5 5.5c0-1.836-1.414-3-2.75-3-1.373 0-2.609.986-3.029 2.456a.75.75 0 01-1.442 0C6.859 3.486 5.623 2.5 4.25 2.5zM8 14.25l-.345.666-.002-.001-.006-.003-.018-.01a7.643 7.643 0 01-.31-.17 22.075 22.075 0 01-3.434-2.414C2.045 10.731 0 8.35 0 5.5 0 2.836 2.086 1 4.25 1 5.797 1 7.153 1.802 8 3.02 8.847 1.802 10.203 1 11.75 1 13.914 1 16 2.836 16 5.5c0 2.85-2.045 5.231-3.885 6.818a22.08 22.08 0 01-3.744 2.584l-.018.01-.006.003h-.002L8 14.25zm0 0l.345.666a.752.752 0 01-.69 0L8 14.25z"></path></svg>
<%= plugins.support.stats.hearts %> heart<%= s(plugins.support.stats.hearts) %> received
@@ -29,7 +29,7 @@
<%= plugins.support.stats.posts %> post<%= s(plugins.support.stats.posts) %>
</div>
</section>
<section>
<section class="largeable-column-fields">
<div class="field">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M3.637 2.291A.75.75 0 014.23 2h7.54a.75.75 0 01.593.291l3.48 4.5a.75.75 0 01-.072.999l-7.25 7a.75.75 0 01-1.042 0l-7.25-7a.75.75 0 01-.072-.999l3.48-4.5zM4.598 3.5L1.754 7.177 8 13.207l6.246-6.03L11.402 3.5H4.598z"></path></svg>
<%= plugins.support.badges.count %> badge<%= s(plugins.support.badges.count) %>

2
source/templates/classic/partials/tweets.ejs
View File

@@ -29,7 +29,7 @@
<div class="tweet">
<%- text %>
<% if (attachments?.length) { %>
<div class="attachments">
<div class="attachments largeable largeable-width-auto">
<% for (const {image, title, description, website} of attachments) { %>
<div style="background-image: url('<%= image %>');">
<span style="display: none;">

10
source/templates/classic/partials/wakatime.ejs
View File

@@ -14,7 +14,7 @@
</div>
<% } else { %>
<div class="row">
<section>
<section class="largeable-column-fields">
<% if (plugins.wakatime.sections.includes("time")) { %>
<div class="field">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M1.643 3.143L.427 1.927A.25.25 0 000 2.104V5.75c0 .138.112.25.25.25h3.646a.25.25 0 00.177-.427L2.715 4.215a6.5 6.5 0 11-1.18 4.458.75.75 0 10-1.493.154 8.001 8.001 0 101.6-5.684zM7.75 4a.75.75 0 01.75.75v2.992l2.028.812a.75.75 0 01-.557 1.392l-2.5-1A.75.75 0 017 8.25v-3.5A.75.75 0 017.75 4z"></path></svg>
@@ -34,7 +34,7 @@
</div>
<% } %>
</section>
<section>
<section class="largeable-column-fields">
<% if (plugins.wakatime.sections.includes("time")) { %>
<div class="field">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M6 2a.75.75 0 01.696.471L10 10.731l1.304-3.26A.75.75 0 0112 7h3.25a.75.75 0 010 1.5h-2.742l-1.812 4.528a.75.75 0 01-1.392 0L6 4.77 4.696 8.03A.75.75 0 014 8.5H.75a.75.75 0 010-1.5h2.742l1.812-4.529A.75.75 0 016 2z"></path></svg>
@@ -56,10 +56,10 @@
</section>
</div>
<% { const sections = plugins.wakatime.sections.filter(x => /-graphs$/.test(x)).map(x => x.replace(/-graphs$/, "")) %>
<% for (let i = 0; i < sections.length; i+=2) { %>
<% { const sections = plugins.wakatime.sections.filter(x => /-graphs$/.test(x)).map(x => x.replace(/-graphs$/, "")), slots = 2 + large %>
<% for (let i = 0; i < sections.length; i+=slots) { %>
<div class="row">
<% for (let j = 0; j < 2; j++) { const key = sections[i+j] ; const section = plugins.wakatime[key] ; if (!key) continue %>
<% for (let j = 0; j < slots; j++) { const key = sections[i+j] ; const section = plugins.wakatime[key] ; if (!key) continue %>
<section class="column chart">
<h3><%= {languages:"Language activity", projects:"Projects activity", editors:"Code editors", os:"Operating systems"}[key] %></h3>
<div class="chart-bars horizontal">

58
source/templates/classic/style.css
View File

@@ -5,6 +5,36 @@
color: #777777;
}
/* Large SVG context */
svg.large .largeable {
width: 474px;
}
svg.large .largeable > .row {
width: 100%;
}
svg.large .largeable-align-start {
align-items: flex-start;
}
svg.large .column.largeable, svg.large .row.largeable, svg.large .largeable-inline-flex {
display: inline-flex;
}
svg.large .largeable-flex-wrap, svg.large .largeable-column-fields {
display: flex;
flex-wrap: wrap;
}
svg.large .largeable-column-fields > .field {
width: 230px;
}
svg.large .chart.largeable {
width: 458px;
}
svg.large .largeable-width-auto {
width: auto;
}
svg.large .largeable-width-half {
width: 50%;
}
/* Headers */
h1, h2, h3 {
margin: 8px 0 2px;
@@ -292,6 +322,18 @@
border-radius: 5px;
}
svg.large .audits {
display: inline-flex;
width: 474px;
}
svg.large .audits section:last-child > .field {
justify-content: right;
}
svg.large .screenshot {
width: 904px;
height: 630px;
}
/* Music plugin */
.tracklist {
display: flex;
@@ -310,6 +352,7 @@
.track img {
margin: 0 10px;
border-radius: 7px;
flex-shrink: 0;
}
.track .name {
font-size: 14px;
@@ -320,6 +363,16 @@
font-size: 12px;
color: #666666;
}
.track .infos {
flex-grow: 1;
}
svg.large .tracklist {
flex-direction: row;
flex-wrap: wrap;
}
svg.large .track {
width: 25%;
}
/* Posts plugin */
.post {
@@ -599,7 +652,6 @@
.activity .bold, .activity .user {
font-weight: 600;
margin: 0 4px;
}
.activity .details, .activity .timestamp {
@@ -640,6 +692,10 @@
-webkit-box-orient: vertical;
}
svg.large .activity .field {
max-width: 900px;
}
/* People */
.people {
padding: 0 10px;

2
source/templates/repository/image.svg
View File

@@ -1,4 +1,4 @@
<svg xmlns="http://www.w3.org/2000/svg" width="480" height="99999" class="<%= !animated ? 'no-animations' : '' %>">
<svg xmlns="http://www.w3.org/2000/svg" width="<%= large ? 960 : 480 %>" height="99999" class="<%= large ? 'large' : '' %> <%= !animated ? 'no-animations' : '' %>">
<defs><style><%= fonts %></style></defs>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.3 KiB

After

Width:  |  Height:  |  Size: 1.4 KiB

72
source/templates/repository/partials/activity.ejs
View File

@@ -18,18 +18,22 @@
No recent activity
</div>
<% } %>
<% for (const {actor, type, repo, timestamp, ...event} of plugins.activity.events) { const _ = letter => `<div class="user">${actor}</div> ${letter.toLocaleLowerCase()}` %>
<% for (const {actor, type, repo, timestamp, ...event} of plugins.activity.events) { const _ = letter => `<span class="user">${actor}</span> ${letter.toLocaleLowerCase()}` %>
<div class="row fill-width">
<section class="activity">
<% if (/^ref/.test(type)) { %>
<div class="field">
<% if (event.ref.type === "branch") { %>
<% if (event.ref.type === "repository") { %>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M2 2.5A2.5 2.5 0 014.5 0h8.75a.75.75 0 01.75.75v12.5a.75.75 0 01-.75.75h-2.5a.75.75 0 110-1.5h1.75v-2h-8a1 1 0 00-.714 1.7.75.75 0 01-1.072 1.05A2.495 2.495 0 012 11.5v-9zm10.5-1V9h-8c-.356 0-.694.074-1 .208V2.5a1 1 0 011-1h8zM5 12.25v3.25a.25.25 0 00.4.2l1.45-1.087a.25.25 0 01.3 0L8.6 15.7a.25.25 0 00.4-.2v-3.25a.25.25 0 00-.25-.25h-3.5a.25.25 0 00-.25.25z"></path></svg>
<% } else if (event.ref.type === "branch") { %>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M11.75 2.5a.75.75 0 100 1.5.75.75 0 000-1.5zm-2.25.75a2.25 2.25 0 113 2.122V6A2.5 2.5 0 0110 8.5H6a1 1 0 00-1 1v1.128a2.251 2.251 0 11-1.5 0V5.372a2.25 2.25 0 111.5 0v1.836A2.492 2.492 0 016 7h4a1 1 0 001-1v-.628A2.25 2.25 0 019.5 3.25zM4.25 12a.75.75 0 100 1.5.75.75 0 000-1.5zM3.5 3.25a.75.75 0 111.5 0 .75.75 0 01-1.5 0z"></path></svg>
<% } else { %>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M2.5 7.775V2.75a.25.25 0 01.25-.25h5.025a.25.25 0 01.177.073l6.25 6.25a.25.25 0 010 .354l-5.025 5.025a.25.25 0 01-.354 0l-6.25-6.25a.25.25 0 01-.073-.177zm-1.5 0V2.75C1 1.784 1.784 1 2.75 1h5.025c.464 0 .91.184 1.238.513l6.25 6.25a1.75 1.75 0 010 2.474l-5.026 5.026a1.75 1.75 0 01-2.474 0l-6.25-6.25A1.75 1.75 0 011 7.775zM6 5a1 1 0 100 2 1 1 0 000-2z"></path></svg>
<% } %>
<div class="content">
<%- /create/.test(type) ? `${_("C")}reated new` : `${_("D")}eleted` %>
<%= event.ref.type %> <div class="code"><%= event.ref.name %></div> in <div class="repo"><%= repo %></div>
<%= event.ref.type %> <% if (event.ref.type !== "repository") { %> <span class="code"><%= event.ref.name %></span> in <% } %> <span class="repo"><%= repo %></span>
</div>
</div>
<% } %>
<% if (type === "comment") { %>
@@ -39,17 +43,21 @@
<% } else if ((event.on === "issue")||(event.on === "commit")) { %>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M2.75 2.5a.25.25 0 00-.25.25v7.5c0 .138.112.25.25.25h2a.75.75 0 01.75.75v2.19l2.72-2.72a.75.75 0 01.53-.22h4.5a.25.25 0 00.25-.25v-7.5a.25.25 0 00-.25-.25H2.75zM1 2.75C1 1.784 1.784 1 2.75 1h10.5c.966 0 1.75.784 1.75 1.75v7.5A1.75 1.75 0 0113.25 12H9.06l-2.573 2.573A1.457 1.457 0 014 13.543V12H2.75A1.75 1.75 0 011 10.25v-7.5z"></path></svg>
<% } %>
<%- _("C") %>ommented on <div class="issue">#<%= event.number %> <%= event.title %></div>
<div class="content">
<%- _("C") %>ommented on <span class="issue">#<%= event.number %> <%= event.title %></span>
</div>
</div>
<div class="details">
<div><%= event.on === "commit" ? "committed" : "opened" %> by <%= event.user %> in <div class="repo"><%= repo %></div></div>
<div class="comment"><%= event.content %></div>
<div><%= event.on === "commit" ? "committed" : "opened" %> by <%= event.user %> in <span class="repo"><%= repo %></span></div>
<div class="comment"><%- event.content %></div>
</div>
<% } %>
<% if (type === "wiki") { %>
<div class="field">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M0 1.75A.75.75 0 01.75 1h4.253c1.227 0 2.317.59 3 1.501A3.744 3.744 0 0111.006 1h4.245a.75.75 0 01.75.75v10.5a.75.75 0 01-.75.75h-4.507a2.25 2.25 0 00-1.591.659l-.622.621a.75.75 0 01-1.06 0l-.622-.621A2.25 2.25 0 005.258 13H.75a.75.75 0 01-.75-.75V1.75zm8.755 3a2.25 2.25 0 012.25-2.25H14.5v9h-3.757c-.71 0-1.4.201-1.992.572l.004-7.322zm-1.504 7.324l.004-5.073-.002-2.253A2.25 2.25 0 005.003 2.5H1.5v9h3.757a3.75 3.75 0 011.994.574z"></path></svg>
<%- _("U") %>pdated <%= event.pages.length %> wiki page<%= s(event.pages.length) %> in <div class="repo"><%= repo %></div>
<div class="content">
<%- _("U") %>pdated <%= event.pages.length %> wiki page<%= s(event.pages.length) %> in <span class="repo"><%= repo %></span>
</div>
</div>
<div class="details">
<% for (const page of event.pages) { %>
@@ -62,56 +70,68 @@
<% if (type === "pr") { %>
<div class="field">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M7.177 3.073L9.573.677A.25.25 0 0110 .854v4.792a.25.25 0 01-.427.177L7.177 3.427a.25.25 0 010-.354zM3.75 2.5a.75.75 0 100 1.5.75.75 0 000-1.5zm-2.25.75a2.25 2.25 0 113 2.122v5.256a2.251 2.251 0 11-1.5 0V5.372A2.25 2.25 0 011.5 3.25zM11 2.5h-1V4h1a1 1 0 011 1v5.628a2.251 2.251 0 101.5 0V5A2.5 2.5 0 0011 2.5zm1 10.25a.75.75 0 111.5 0 .75.75 0 01-1.5 0zM3.75 12a.75.75 0 100 1.5.75.75 0 000-1.5z"></path></svg>
<%- event.action === "opened" ? `${_("O")}pened` : `${_("M")}erged` %> <div class="issue">#<%= event.number %> <%= event.title %></div>
<div class="content">
<%- event.action === "opened" ? `${_("O")}pened` : event.action === "merged" ? `${_("M")}erged` : `${_("C")}losed` %> <span class="issue">#<%= event.number %> <%= event.title %></span>
</div>
</div>
<div class="details">
<div>opened <%= user.login !== event.user ? `by ${event.user}` : "" %> in <div class="repo"><%= repo %></div></div>
<div><%= event.files.changed %> file<%= s(event.files.changed) %> changed <div class="code">++<%= event.lines.added %> --<%= event.lines.deleted%></div></div>
<div><%= user.login !== event.user ? `opened by ${event.user}` : "" %> in <span class="repo"><%= repo %></span></div>
<div><%= event.files.changed %> file<%= s(event.files.changed) %> changed <span class="code">++<%= event.lines.added %> --<%= event.lines.deleted%></span></div>
</div>
<% } %>
<% if (type === "issue") { %>
<div class="field">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM0 8a8 8 0 1116 0A8 8 0 010 8zm9 3a1 1 0 11-2 0 1 1 0 012 0zm-.25-6.25a.75.75 0 00-1.5 0v3.5a.75.75 0 001.5 0v-3.5z"></path></svg>
<%- event.action === "opened" ? `${_("O")}pened` : event.action === "reopened" ? `${_("R")}eopened` : `${_("C")}losed` %> <div class="issue">#<%= event.number %> <%= event.title %></div>
<div class="content">
<%- event.action === "opened" ? `${_("O")}pened` : event.action === "reopened" ? `${_("R")}eopened` : `${_("C")}losed` %> <span class="issue">#<%= event.number %> <%= event.title %></span>
</div>
</div>
<div class="details">
<div>opened <%= user.login !== event.user ? `by ${event.user}` : "" %> in <div class="repo"><%= repo %></div></div>
<div>opened <%= user.login !== event.user ? `by ${event.user}` : "" %> in <span class="repo"><%= repo %></span></div>
</div>
<% } %>
<% if (type === "fork") { %>
<div class="field">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M5 3.25a.75.75 0 11-1.5 0 .75.75 0 011.5 0zm0 2.122a2.25 2.25 0 10-1.5 0v.878A2.25 2.25 0 005.75 8.5h1.5v2.128a2.251 2.251 0 101.5 0V8.5h1.5a2.25 2.25 0 002.25-2.25v-.878a2.25 2.25 0 10-1.5 0v.878a.75.75 0 01-.75.75h-4.5A.75.75 0 015 6.25v-.878zm3.75 7.378a.75.75 0 11-1.5 0 .75.75 0 011.5 0zm3-8.75a.75.75 0 100-1.5.75.75 0 000 1.5z"></path></svg>
<%- _("F") %>orked <div class="repo"><%= repo %></div>
<div class="content">
<%- _("F") %>orked <span class="repo"><%= repo %></span> to <span class="repo"><%= event.forked %></span>
</div>
</div>
<% } %>
<% if (type === "public") { %>
<div class="field">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M2 2.5A2.5 2.5 0 014.5 0h8.75a.75.75 0 01.75.75v12.5a.75.75 0 01-.75.75h-2.5a.75.75 0 110-1.5h1.75v-2h-8a1 1 0 00-.714 1.7.75.75 0 01-1.072 1.05A2.495 2.495 0 012 11.5v-9zm10.5-1V9h-8c-.356 0-.694.074-1 .208V2.5a1 1 0 011-1h8zM5 12.25v3.25a.25.25 0 00.4.2l1.45-1.087a.25.25 0 01.3 0L8.6 15.7a.25.25 0 00.4-.2v-3.25a.25.25 0 00-.25-.25h-3.5a.25.25 0 00-.25.25z"></path></svg>
<%- _("M") %>ade <div class="repo"><%= repo %></div> public
<div class="content">
<%- _("M") %>ade <span class="repo"><%= repo %></span> public
</div>
</div>
<% } %>
<% if (type === "review") { %>
<div class="field">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M2.5 1.75a.25.25 0 01.25-.25h8.5a.25.25 0 01.25.25v7.736a.75.75 0 101.5 0V1.75A1.75 1.75 0 0011.25 0h-8.5A1.75 1.75 0 001 1.75v11.5c0 .966.784 1.75 1.75 1.75h3.17a.75.75 0 000-1.5H2.75a.25.25 0 01-.25-.25V1.75zM4.75 4a.75.75 0 000 1.5h4.5a.75.75 0 000-1.5h-4.5zM4 7.75A.75.75 0 014.75 7h2a.75.75 0 010 1.5h-2A.75.75 0 014 7.75zm11.774 3.537a.75.75 0 00-1.048-1.074L10.7 14.145 9.281 12.72a.75.75 0 00-1.062 1.058l1.943 1.95a.75.75 0 001.055.008l4.557-4.45z"></path></svg>
<%- _("R") %>eviewed <div class="issue">#<%= event.number %> <%= event.title %></div>
<div class="content">
<%- _("R") %>eviewed <span class="issue">#<%= event.number %> <%= event.title %></span>
</div>
</div>
<div class="details">
<div>opened <%= user.login !== event.user ? `by ${event.user}` : "" %> in <div class="repo"><%= repo %></div></div>
<div>opened <%= user.login !== event.user ? `by ${event.user}` : "" %> in <span class="repo"><%= repo %></span></div>
</div>
<% } %>
<% if (type === "push") { %>
<div class="field">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M10.5 7.75a2.5 2.5 0 11-5 0 2.5 2.5 0 015 0zm1.43.75a4.002 4.002 0 01-7.86 0H.75a.75.75 0 110-1.5h3.32a4.001 4.001 0 017.86 0h3.32a.75.75 0 110 1.5h-3.32z"></path></svg>
<%- _("P") %>ushed <%= event.size %> commit<%= s(event.size) %> in <div class="repo"><%= repo %></div>
<div class="content">
<%- _("P") %>ushed <%= event.size %> commit<%= s(event.size) %> in <span class="repo"><%= repo %></span>
</div>
</div>
<div class="details">
<% if (event.branch) { %>
<div>on branch <div class="code"><%= event.branch %></div></div>
<div>on branch <span class="code"><%= event.branch %></span></div>
<% } %>
<% for (const commit of event.commits) { %>
<div class="commit">
<div class="sha">#<%= commit.sha %></div>
<div class="message"><%= commit.message %></div>
<span class="sha">#<%= commit.sha %></span>
<span class="message"><%= commit.message %></span>
</div>
<% } %>
</div>
@@ -119,20 +139,26 @@
<% if (type === "release") { %>
<div class="field">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M8.878.392a1.75 1.75 0 00-1.756 0l-5.25 3.045A1.75 1.75 0 001 4.951v6.098c0 .624.332 1.2.872 1.514l5.25 3.045a1.75 1.75 0 001.756 0l5.25-3.045c.54-.313.872-.89.872-1.514V4.951c0-.624-.332-1.2-.872-1.514L8.878.392zM7.875 1.69a.25.25 0 01.25 0l4.63 2.685L8 7.133 3.245 4.375l4.63-2.685zM2.5 5.677v5.372c0 .09.047.171.125.216l4.625 2.683V8.432L2.5 5.677zm6.25 8.271l4.625-2.683a.25.25 0 00.125-.216V5.677L8.75 8.432v5.516z"></path></svg>
<div class="content">
<%- event.draft ? `${_("D")}rafted release` : event.prerelease ? `${_("P")}re-released` : `${_("R")}eleased` %>
<div class="bold"><%= event.name %></div> of <div class="repo"><%= repo %></div>
<span class="bold"><%= event.name %></span> of <span class="repo"><%= repo %></span>
</div>
</div>
<% } %>
<% if (type === "star") { %>
<div class="field">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M8 .25a.75.75 0 01.673.418l1.882 3.815 4.21.612a.75.75 0 01.416 1.279l-3.046 2.97.719 4.192a.75.75 0 01-1.088.791L8 12.347l-3.766 1.98a.75.75 0 01-1.088-.79l.72-4.194L.818 6.374a.75.75 0 01.416-1.28l4.21-.611L7.327.668A.75.75 0 018 .25zm0 2.445L6.615 5.5a.75.75 0 01-.564.41l-3.097.45 2.24 2.184a.75.75 0 01.216.664l-.528 3.084 2.769-1.456a.75.75 0 01.698 0l2.77 1.456-.53-3.084a.75.75 0 01.216-.664l2.24-2.183-3.096-.45a.75.75 0 01-.564-.41L8 2.694v.001z"></path></svg>
<%- _("S") %>tarred <div class="repo"><%= repo %></div>
<div class="content">
<%- _("S") %>tarred <span class="repo"><%= repo %></span>
</div>
</div>
<% } %>
<% if (type === "member") { %>
<div class="field">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M10.5 5a2.5 2.5 0 11-5 0 2.5 2.5 0 015 0zm.061 3.073a4 4 0 10-5.123 0 6.004 6.004 0 00-3.431 5.142.75.75 0 001.498.07 4.5 4.5 0 018.99 0 .75.75 0 101.498-.07 6.005 6.005 0 00-3.432-5.142z"></path></svg>
<%- _("A") %>dded <%= event.user %> as collaborator in <div class="repo"><%= repo %></div>
<div class="content">
<%- _("A") %>dded <%= event.user %> as collaborator in <span class="repo"><%= repo %></span>
</div>
</div>
<% } %>
<% if (plugins.activity.timestamps) { %>

57
source/templates/repository/partials/followup.ejs
View File

@@ -10,25 +10,27 @@
<%= plugins.followup.error.message %>
</div>
</section>
<% } else { %>
<svg class="bar" xmlns="http://www.w3.org/2000/svg" width="220" height="8">
<% } else { const section = plugins.followup, width = 220*(1+large) %>
<section class="column">
<svg class="bar" xmlns="http://www.w3.org/2000/svg" width="<%= width %>" height="8">
<mask id="issues-bar">
<rect x="0" y="0" width="220" height="8" fill="white" rx="5"/>
<rect x="0" y="0" width="<%= width %>" height="8" fill="white" rx="5"/>
</mask>
<rect mask="url(#issues-bar)" x="0" y="0" width="<%= plugins.followup.issues.count ? 0 : 220 %>" height="8" fill="#d1d5da"/>
<rect mask="url(#issues-bar)" x="0" y="0" width="<%= (plugins.followup.issues.closed/plugins.followup.issues.count)*220 || 0 %>" height="8" fill="#d73a49"/>
<rect mask="url(#issues-bar)" x="<%= (plugins.followup.issues.closed/plugins.followup.issues.count)*220 || 0 %>" y="0" width="<%= (1-plugins.followup.issues.closed/plugins.followup.issues.count)*220 || 0 %>" height="8" fill="#28a745"/>
<rect mask="url(#issues-bar)" x="0" y="0" width="<%= section.issues.count ? 0 : width %>" height="8" fill="#d1d5da"/>
<rect mask="url(#issues-bar)" x="0" y="0" width="<%= (section.issues.open/section.issues.count)*width || 0 %>" height="8" fill="#28a745"/>
<rect mask="url(#issues-bar)" x="<%= (section.issues.open/section.issues.count)*width || 0 %>" y="0" width="<%= (1-section.issues.open/section.issues.count)*width || 0 %>" height="8" fill="#d73a49"/>
</svg>
<div class="field horizontal fill-width">
<div class="field center">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill="#d73a49" fill-rule="evenodd" d="M1.5 8a6.5 6.5 0 0110.65-5.003.75.75 0 00.959-1.153 8 8 0 102.592 8.33.75.75 0 10-1.444-.407A6.5 6.5 0 011.5 8zM8 12a1 1 0 100-2 1 1 0 000 2zm0-8a.75.75 0 01.75.75v3.5a.75.75 0 11-1.5 0v-3.5A.75.75 0 018 4zm4.78 4.28l3-3a.75.75 0 00-1.06-1.06l-2.47 2.47-.97-.97a.749.749 0 10-1.06 1.06l1.5 1.5a.75.75 0 001.06 0z"></path></svg>
<span class="no-wrap"><%= plugins.followup.issues.closed %> Closed</span>
</div>
<div class="followup legend field horizontal fill-width">
<div class="field center">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill="#28a745" fill-rule="evenodd" d="M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM0 8a8 8 0 1116 0A8 8 0 010 8zm9 3a1 1 0 11-2 0 1 1 0 012 0zm-.25-6.25a.75.75 0 00-1.5 0v3.5a.75.75 0 001.5 0v-3.5z"></path></svg>
<span class="no-wrap"><%= plugins.followup.issues.open %> Open</span>
<span class="no-wrap"><%= section.issues.open %> <small>open</small></span>
</div>
<div class="field center">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill="#d73a49" fill-rule="evenodd" d="M1.5 8a6.5 6.5 0 0110.65-5.003.75.75 0 00.959-1.153 8 8 0 102.592 8.33.75.75 0 10-1.444-.407A6.5 6.5 0 011.5 8zM8 12a1 1 0 100-2 1 1 0 000 2zm0-8a.75.75 0 01.75.75v3.5a.75.75 0 11-1.5 0v-3.5A.75.75 0 018 4zm4.78 4.28l3-3a.75.75 0 00-1.06-1.06l-2.47 2.47-.97-.97a.749.749 0 10-1.06 1.06l1.5 1.5a.75.75 0 001.06 0z"></path></svg>
<span class="no-wrap"><%= section.issues.closed %> <small>closed</small></span>
</div>
</div>
</section>
<% } %>
</section>
@@ -41,25 +43,32 @@
<%= plugins.followup.error.message %>
</div>
</section>
<% } else { %>
<svg class="bar" xmlns="http://www.w3.org/2000/svg" width="220" height="8">
<% } else { const section = plugins.followup, width = 220*(1+large) %>
<section class="column">
<svg class="bar" xmlns="http://www.w3.org/2000/svg" width="<%= width %>" height="8">
<mask id="pr-bar">
<rect x="0" y="0" width="220" height="8" fill="white" rx="5"/>
<rect x="0" y="0" width="<%= width %>" height="8" fill="white" rx="5"/>
</mask>
<rect mask="url(#pr-bar)" x="0" y="0" width="<%= plugins.followup.pr.count ? 0 : 220 %>" height="8" fill="#d1d5da"/>
<rect mask="url(#pr-bar)" x="0" y="0" width="<%= (plugins.followup.pr.merged/plugins.followup.pr.count)*220 || 0 %>" height="8" fill="#6f42c1"/>
<rect mask="url(#pr-bar)" x="<%= (plugins.followup.pr.merged/plugins.followup.pr.count)*220 || 0 %>" y="0" width="<%= (1-plugins.followup.pr.merged/plugins.followup.pr.count)*220 || 0 %>" height="8" fill="#28a745"/>
<rect mask="url(#pr-bar)" x="0" y="0" width="<%= section.pr.count ? 0 : width %>" height="8" fill="#d1d5da"/>
<rect mask="url(#pr-bar)" x="0" y="0" width="<%= (section.pr.open/section.pr.count)*width || 0 %>" height="8" fill="#28a745"/>
<rect mask="url(#pr-bar)" x="<%= (section.pr.open/section.pr.count)*width || 0 %>" y="0" width="<%= (section.pr.closed/section.pr.count)*width || 0 %>" height="8" fill="#d73a49"/>
<rect mask="url(#pr-bar)" x="<%= ((section.pr.open+section.pr.closed)/section.pr.count)*width || 0 %>" y="0" width="<%= (1-(section.pr.open+section.pr.closed)/section.pr.count)*width || 0 %>" height="8" fill="#6f42c1"/>
</svg>
<div class="field horizontal fill-width">
<div class="field center">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill="#6f42c1" fill-rule="evenodd" d="M5 3.254V3.25v.005a.75.75 0 110-.005v.004zm.45 1.9a2.25 2.25 0 10-1.95.218v5.256a2.25 2.25 0 101.5 0V7.123A5.735 5.735 0 009.25 9h1.378a2.251 2.251 0 100-1.5H9.25a4.25 4.25 0 01-3.8-2.346zM12.75 9a.75.75 0 100-1.5.75.75 0 000 1.5zm-8.5 4.5a.75.75 0 100-1.5.75.75 0 000 1.5z"></path></svg>
<span class="no-wrap"><%= plugins.followup.pr.merged %> Merged</span>
</div>
<div class="followup legend field horizontal fill-width">
<div class="field center">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill="#28a745" fill-rule="evenodd" d="M7.177 3.073L9.573.677A.25.25 0 0110 .854v4.792a.25.25 0 01-.427.177L7.177 3.427a.25.25 0 010-.354zM3.75 2.5a.75.75 0 100 1.5.75.75 0 000-1.5zm-2.25.75a2.25 2.25 0 113 2.122v5.256a2.251 2.251 0 11-1.5 0V5.372A2.25 2.25 0 011.5 3.25zM11 2.5h-1V4h1a1 1 0 011 1v5.628a2.251 2.251 0 101.5 0V5A2.5 2.5 0 0011 2.5zm1 10.25a.75.75 0 111.5 0 .75.75 0 01-1.5 0zM3.75 12a.75.75 0 100 1.5.75.75 0 000-1.5z"></path></svg>
<span class="no-wrap"><%= plugins.followup.pr.open %> Open</span>
<span class="no-wrap"><%= section.pr.open %> <small>open</small></span>
</div>
<div class="field center">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill="#d73a49" fill-rule="evenodd" d="M7.177 3.073L9.573.677A.25.25 0 0110 .854v4.792a.25.25 0 01-.427.177L7.177 3.427a.25.25 0 010-.354zM3.75 2.5a.75.75 0 100 1.5.75.75 0 000-1.5zm-2.25.75a2.25 2.25 0 113 2.122v5.256a2.251 2.251 0 11-1.5 0V5.372A2.25 2.25 0 011.5 3.25zM11 2.5h-1V4h1a1 1 0 011 1v5.628a2.251 2.251 0 101.5 0V5A2.5 2.5 0 0011 2.5zm1 10.25a.75.75 0 111.5 0 .75.75 0 01-1.5 0zM3.75 12a.75.75 0 100 1.5.75.75 0 000-1.5z"></path></svg>
<span class="no-wrap"><%= section.pr.closed %> <small>closed</small></span>
</div>
<div class="field center">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill="#6f42c1" fill-rule="evenodd" d="M5 3.254V3.25v.005a.75.75 0 110-.005v.004zm.45 1.9a2.25 2.25 0 10-1.95.218v5.256a2.25 2.25 0 101.5 0V7.123A5.735 5.735 0 009.25 9h1.378a2.251 2.251 0 100-1.5H9.25a4.25 4.25 0 01-3.8-2.346zM12.75 9a.75.75 0 100-1.5.75.75 0 000 1.5zm-8.5 4.5a.75.75 0 100-1.5.75.75 0 000 1.5z"></path></svg>
<span class="no-wrap"><%= section.pr.merged %> <small>merged</small></span>
</div>
</div>
</section>
<% } %>
</section>

16
source/templates/repository/partials/languages.ejs
View File

@@ -11,21 +11,21 @@
<%= plugins.languages.error.message %>
</div>
</section>
<% } else { %>
<svg class="bar" xmlns="http://www.w3.org/2000/svg" width="460" height="8">
<% } else { const width = 460 * (1 + large) %>
<svg class="bar" xmlns="http://www.w3.org/2000/svg" width="<%= width %>" height="8">
<mask id="languages-bar">
<rect x="0" y="0" width="460" height="8" fill="white" rx="5"/>
<rect x="0" y="0" width="<%= width %>" height="8" fill="white" rx="5"/>
</mask>
<rect mask="url(#languages-bar)" x="0" y="0" width="<%= plugins.languages.favorites.length ? 0 : 460 %>" height="8" fill="#d1d5da"/>
<rect mask="url(#languages-bar)" x="0" y="0" width="<%= plugins.languages.favorites.length ? 0 : width %>" height="8" fill="#d1d5da"/>
<% for (const {name, value, color, x} of plugins.languages.favorites) { %>
<rect mask="url(#languages-bar)" x="<%= x*460 %>" y="0" width="<%= value*460 %>" height="8" fill="<%= color %>"/>
<rect mask="url(#languages-bar)" x="<%= x*width %>" y="0" width="<%= value*width %>" height="8" fill="<%= color %>"/>
<% } %>
</svg>
<% if (plugins.languages.details?.length) { %>
<% if (plugins.languages.details?.length) { const rows = large ? [0, 1, 2, 3] : [0, 1] %>
<div class="row fill-width">
<% for (const row of [0, 1]) { %>
<% for (const row of rows) { %>
<section>
<% for (const {name, value, color, size} of plugins.languages.favorites.filter((_, i) => i%2 === row)) { %>
<% for (const {name, value, color, size} of plugins.languages.favorites.filter((_, i) => i%rows.length === row)) { %>
<div class="field language details">
<div class="field">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill="<%= color %>" fill-rule="evenodd" d="M8 4a4 4 0 100 8 4 4 0 000-8z"></path></svg>

18
source/templates/repository/partials/licenses.ejs
View File

@@ -13,7 +13,7 @@
</section>
<% } else { %>
<div class="row">
<section>
<section class="largeable-column-fields">
<div class="field">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path d="M2.75 1.5a.25.25 0 00-.25.25v11.5c0 .138.112.25.25.25h3.5a.75.75 0 010 1.5h-3.5A1.75 1.75 0 011 13.25V1.75C1 .784 1.784 0 2.75 0h8a1.75 1.75 0 011.508.862.75.75 0 11-1.289.768.25.25 0 00-.219-.13h-8z"></path><path fill-rule="evenodd" d="M8 7a4 4 0 116.49 3.13l.995 4.973a.75.75 0 01-.991.852l-2.409-.876a.25.25 0 00-.17 0l-2.409.876a.75.75 0 01-.991-.852l.994-4.973A3.993 3.993 0 018 7zm4-2.5a2.5 2.5 0 100 5 2.5 2.5 0 000-5zm0 6.5a4 4 0 001.104-.154l.649 3.243-1.155-.42c-.386-.14-.81-.14-1.196 0l-1.155.42.649-3.243A4 4 0 0012 11z"></path></svg>
<%= plugins.licenses.default?.spdxId ?? "No license provided" %>
@@ -23,7 +23,7 @@
<%= plugins.licenses.dependencies.length %> dependenc<%= s(plugins.licenses.dependencies.length, "y") %>
</div>
</section>
<section>
<section class="largeable-column-fields">
<div class="field">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M9.585.52a2.678 2.678 0 00-3.17 0l-.928.68a1.178 1.178 0 01-.518.215L3.83 1.59a2.678 2.678 0 00-2.24 2.24l-.175 1.14a1.178 1.178 0 01-.215.518l-.68.928a2.678 2.678 0 000 3.17l.68.928c.113.153.186.33.215.518l.175 1.138a2.678 2.678 0 002.24 2.24l1.138.175c.187.029.365.102.518.215l.928.68a2.678 2.678 0 003.17 0l.928-.68a1.17 1.17 0 01.518-.215l1.138-.175a2.678 2.678 0 002.241-2.241l.175-1.138c.029-.187.102-.365.215-.518l.68-.928a2.678 2.678 0 000-3.17l-.68-.928a1.179 1.179 0 01-.215-.518L14.41 3.83a2.678 2.678 0 00-2.24-2.24l-1.138-.175a1.179 1.179 0 01-.518-.215L9.585.52zM7.303 1.728c.415-.305.98-.305 1.394 0l.928.68c.348.256.752.423 1.18.489l1.136.174c.51.078.909.478.987.987l.174 1.137c.066.427.233.831.489 1.18l.68.927c.305.415.305.98 0 1.394l-.68.928a2.678 2.678 0 00-.489 1.18l-.174 1.136a1.178 1.178 0 01-.987.987l-1.137.174a2.678 2.678 0 00-1.18.489l-.927.68c-.415.305-.98.305-1.394 0l-.928-.68a2.678 2.678 0 00-1.18-.489l-1.136-.174a1.178 1.178 0 01-.987-.987l-.174-1.137a2.678 2.678 0 00-.489-1.18l-.68-.927a1.178 1.178 0 010-1.394l.68-.928c.256-.348.423-.752.489-1.18l.174-1.136c.078-.51.478-.909.987-.987l1.137-.174a2.678 2.678 0 001.18-.489l.927-.68zM11.28 6.78a.75.75 0 00-1.06-1.06L7 8.94 5.78 7.72a.75.75 0 00-1.06 1.06l1.75 1.75a.75.75 0 001.06 0l3.75-3.75z"></path></svg>
<%= plugins.licenses.known %> known license<%= s(plugins.licenses.known) %> used
@@ -34,23 +34,23 @@
</div>
</section>
</div>
<% if (plugins.licenses.ratio) { %>
<% if (plugins.licenses.ratio) { const width = 460 * (1 + large), rows = large ? [0, 1, 2, 3] : [0, 1] %> %>
<div class="licenses-details">
<section class="column">
<svg class="bar" xmlns="http://www.w3.org/2000/svg" width="460" height="8">
<svg class="bar" xmlns="http://www.w3.org/2000/svg" width="<%= width %>" height="8">
<mask id="licenses-bar">
<rect x="0" y="0" width="460" height="8" fill="white" rx="5"/>
<rect x="0" y="0" width="<%= width %>" height="8" fill="white" rx="5"/>
</mask>
<rect mask="url(#licenses-bar)" x="0" y="0" width="<%= plugins.licenses.list.length ? 0 : 460 %>" height="8" fill="#d1d5da"/>
<rect mask="url(#licenses-bar)" x="0" y="0" width="<%= plugins.licenses.list.length ? 0 : width %>" height="8" fill="#d1d5da"/>
<% for (const {name, value, color, x} of plugins.licenses.list) { %>
<rect mask="url(#licenses-bar)" x="<%= x*460 %>" y="0" width="<%= value*460 %>" height="8" fill="<%= color %>"/>
<rect mask="url(#licenses-bar)" x="<%= x*width %>" y="0" width="<%= value*width %>" height="8" fill="<%= color %>"/>
<% } %>
</svg>
</section>
<div class="row fill-width">
<% for (const row of [0, 1]) { %>
<% for (const row of rows) { %>
<section>
<% for (const {name, value, color, count} of plugins.licenses.list.filter((_, i) => i%2 === row)) { %>
<% for (const {name, value, color, count} of plugins.licenses.list.filter((_, i) => i%rows.length === row)) { %>
<div class="field license details">
<div class="field">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill="<%= color %>" fill-rule="evenodd" d="M8 4a4 4 0 100 8 4 4 0 000-8z"></path></svg>

35
source/templates/repository/partials/pagespeed.ejs
View File

@@ -56,6 +56,36 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M1.643 3.143L.427 1.927A.25.25 0 000 2.104V5.75c0 .138.112.25.25.25h3.646a.25.25 0 00.177-.427L2.715 4.215a6.5 6.5 0 11-1.18 4.458.75.75 0 10-1.493.154 8.001 8.001 0 101.6-5.684zM7.75 4a.75.75 0 01.75.75v2.992l2.028.812a.75.75 0 01-.557 1.392l-2.5-1A.75.75 0 017 8.25v-3.5A.75.75 0 017.75 4z"></path></svg>
Total Blocking Time
</div>
</section>
<section>
<% for (const {score, suffix = "", threshold} of [
{score:plugins.pagespeed.metrics.firstContentfulPaint/1000, suffix:"s", threshold:[2.336, 4]},
{score:plugins.pagespeed.metrics.largestContentfulPaint/1000, suffix:"s", threshold:[2.5, 4]},
{score:+plugins.pagespeed.metrics.cumulativeLayoutShift, threshold:[.1, .25]}
]) { %>
<div class="field">
<div class="audit text">
<% if (!Number.isNaN(score)) { %>
<%= score.toFixed(2).replace(/[.]0+$/, "") %> <%= suffix %>
<% } else { %>
N/A
<% } %>
</div>
<% if (Number.isNaN(score)) { %>
<svg xmlns="http://www.w3.org/2000/svg" class="audit" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M1.5 8a6.5 6.5 0 1113 0 6.5 6.5 0 01-13 0zM8 0a8 8 0 100 16A8 8 0 008 0zm3.28 5.78a.75.75 0 00-1.06-1.06l-5.5 5.5a.75.75 0 101.06 1.06l5.5-5.5z"></path></svg>
<% } else if (score <= threshold[0]) { %>
<svg xmlns="http://www.w3.org/2000/svg" class="audit high" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M1.5 8a6.5 6.5 0 1113 0 6.5 6.5 0 01-13 0zM0 8a8 8 0 1116 0A8 8 0 010 8zm11.78-1.72a.75.75 0 00-1.06-1.06L6.75 9.19 5.28 7.72a.75.75 0 00-1.06 1.06l2 2a.75.75 0 001.06 0l4.5-4.5z"></path></svg>
<% } else if (score <= threshold[1]) { %>
<svg xmlns="http://www.w3.org/2000/svg" class="audit average" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM0 8a8 8 0 1116 0A8 8 0 010 8zm9 3a1 1 0 11-2 0 1 1 0 012 0zm-.25-6.25a.75.75 0 00-1.5 0v3.5a.75.75 0 001.5 0v-3.5z"></path></svg>
<% } else { %>
<svg xmlns="http://www.w3.org/2000/svg" class="audit low" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M4.47.22A.75.75 0 015 0h6a.75.75 0 01.53.22l4.25 4.25c.141.14.22.331.22.53v6a.75.75 0 01-.22.53l-4.25 4.25A.75.75 0 0111 16H5a.75.75 0 01-.53-.22L.22 11.53A.75.75 0 010 11V5a.75.75 0 01.22-.53L4.47.22zm.84 1.28L1.5 5.31v5.38l3.81 3.81h5.38l3.81-3.81V5.31L10.69 1.5H5.31zM8 4a.75.75 0 01.75.75v3.5a.75.75 0 01-1.5 0v-3.5A.75.75 0 018 4zm0 8a1 1 0 100-2 1 1 0 000 2z"></path></svg>
<% } %>
</div>
<% } %>
</section>
</div>
<div class="audits row">
<section>
<div class="field">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M11.134 1.535C9.722 2.562 8.16 4.057 6.889 5.312 5.8 6.387 5.041 7.401 4.575 8.294a3.745 3.745 0 00-3.227 1.054c-.43.431-.69 1.066-.86 1.657a11.982 11.982 0 00-.358 1.914A21.263 21.263 0 000 15.203v.054l.75-.007-.007.75h.054a14.404 14.404 0 00.654-.012 21.243 21.243 0 001.63-.118c.62-.07 1.3-.18 1.914-.357.592-.17 1.226-.43 1.657-.861a3.745 3.745 0 001.055-3.217c.908-.461 1.942-1.216 3.04-2.3 1.279-1.262 2.764-2.825 3.775-4.249.501-.706.923-1.428 1.125-2.096.2-.659.235-1.469-.368-2.07-.606-.607-1.42-.55-2.069-.34-.66.213-1.376.646-2.076 1.155zm-3.95 8.48a3.76 3.76 0 00-1.19-1.192 9.758 9.758 0 011.161-1.607l1.658 1.658a9.853 9.853 0 01-1.63 1.142zM.742 16l.007-.75-.75.008A.75.75 0 00.743 16zM12.016 2.749c-1.224.89-2.605 2.189-3.822 3.384l1.718 1.718c1.21-1.205 2.51-2.597 3.387-3.833.47-.662.78-1.227.912-1.662.134-.444.032-.551.009-.575h-.001V1.78c-.014-.014-.112-.113-.548.027-.432.14-.995.462-1.655.942zM1.62 13.089a19.56 19.56 0 00-.104 1.395 19.55 19.55 0 001.396-.104 10.528 10.528 0 001.668-.309c.526-.151.856-.325 1.011-.48a2.25 2.25 0 00-3.182-3.182c-.155.155-.329.485-.48 1.01a10.515 10.515 0 00-.309 1.67z"></path></svg>
First Contentful Paint
@@ -71,9 +101,6 @@
</section>
<section>
<% for (const {score, suffix = "", threshold} of [
{score:plugins.pagespeed.metrics.interactive/1000, suffix:"s", threshold:[3.785, 7.3]},
{score:plugins.pagespeed.metrics.speedIndex/1000, suffix:"s", threshold:[3.387, 5.8]},
{score:plugins.pagespeed.metrics.totalBlockingTime/1000, suffix:"s", threshold:[.287, .6]},
{score:plugins.pagespeed.metrics.firstContentfulPaint/1000, suffix:"s", threshold:[2.336, 4]},
{score:plugins.pagespeed.metrics.largestContentfulPaint/1000, suffix:"s", threshold:[2.5, 4]},
{score:+plugins.pagespeed.metrics.cumulativeLayoutShift, threshold:[.1, .25]}
@@ -103,7 +130,7 @@
<% if (plugins.pagespeed.screenshot) { %>
<div class="row">
<section>
<img class="screenshot" src="<%= plugins.pagespeed.screenshot %>" width="452" height="315"/>
<img class="screenshot" src="<%= plugins.pagespeed.screenshot %>" width="<%= 452 * (1 + large) %>" height="<%= 315 * (1 + large) %>"/>
</section>
</div>
<% } %>

12
source/templates/repository/partials/projects.ejs
View File

@@ -39,15 +39,15 @@
</section>
<% } %>
</div>
<% if (progress.enabled) { %>
<% if (progress.enabled) { const width = 460 * (1 + large) %>
<div class="field center horizontal-wrap ">
<svg class="bar" xmlns="http://www.w3.org/2000/svg" width="460" height="8">
<svg class="bar" xmlns="http://www.w3.org/2000/svg" width="<%= width %>" height="8">
<mask id="project-bar">
<rect x="0" y="0" width="460" height="8" fill="white" rx="5"/>
<rect x="0" y="0" width="<%= width %>" height="8" fill="white" rx="5"/>
</mask>
<rect mask="url(#project-bar)" x="0" y="0" width="<%= (progress.done/progress.total)*460 %>" height="8" fill="#28A745"/>
<rect mask="url(#project-bar)" x="<%= (progress.done/progress.total)*460 %>" y="0" width="<%= (progress.doing/progress.total)*460 %>" height="8" fill="#6F42C1"/>
<rect mask="url(#project-bar)" x="<%= ((progress.done+progress.doing)/progress.total)*460 %>" y="0" width="<%= (progress.todo/progress.total)*460 %>" height="8" fill="#d1d5da"/>
<rect mask="url(#project-bar)" x="0" y="0" width="<%= (progress.done/progress.total)*width %>" height="8" fill="#28A745"/>
<rect mask="url(#project-bar)" x="<%= (progress.done/progress.total)*width %>" y="0" width="<%= (progress.doing/progress.total)*width %>" height="8" fill="#6F42C1"/>
<rect mask="url(#project-bar)" x="<%= ((progress.done+progress.doing)/progress.total)*width %>" y="0" width="<%= (progress.todo/progress.total)*width %>" height="8" fill="#d1d5da"/>
</svg>
</div>
<% } %>