forked from mirrored/github-readme-stats
Compare commits
6
Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
33ad0f4ee8 | ||
|
|
26a8a23421 | ||
|
|
ba7c2f8b55 | ||
|
|
888663a477 | ||
|
|
112000667c | ||
|
|
7aa502d453 |
@@ -0,0 +1,44 @@
|
||||
name: Update supported languages
|
||||
on:
|
||||
schedule:
|
||||
- cron: "0 0 */30 * *"
|
||||
|
||||
jobs:
|
||||
updateLanguages:
|
||||
if: github.repository == 'anuraghazra/github-readme-stats'
|
||||
name: Update supported languages
|
||||
runs-on: ubuntu-latest
|
||||
strategy:
|
||||
matrix:
|
||||
node-version: [16.x]
|
||||
|
||||
steps:
|
||||
- uses: actions/checkout@v3
|
||||
|
||||
- name: Setup Node
|
||||
uses: actions/setup-node@v3
|
||||
with:
|
||||
node-version: ${{ matrix.node-version }}
|
||||
cache: npm
|
||||
|
||||
- name: Install dependencies
|
||||
run: npm ci
|
||||
env:
|
||||
CI: true
|
||||
|
||||
- name: Run update-languages-json.js script
|
||||
run: npm run generate-langs-json
|
||||
|
||||
- name: Create Pull Request if upstream language file is changed
|
||||
uses: peter-evans/create-pull-request@v4
|
||||
with:
|
||||
commit-message: "refactor: update languages JSON"
|
||||
branch: "update_langs/patch"
|
||||
delete-branch: true
|
||||
title: Update languages JSON
|
||||
body:
|
||||
"The
|
||||
[update-langs](https://github.com/anuraghazra/github-readme-stats/actions/workflows/update-langs.yaml)
|
||||
action found new/updated languages in the [upstream languages JSON
|
||||
file](https://raw.githubusercontent.com/github/linguist/master/lib/linguist/languages.yml)."
|
||||
labels: "ci, lang-card"
|
||||
@@ -30,6 +30,7 @@ export default async (req, res) => {
|
||||
border_radius,
|
||||
border_color,
|
||||
disable_animations,
|
||||
hide_progress,
|
||||
} = req.query;
|
||||
res.setHeader("Content-Type", "image/svg+xml");
|
||||
|
||||
@@ -77,6 +78,7 @@ export default async (req, res) => {
|
||||
border_color,
|
||||
locale: locale ? locale.toLowerCase() : null,
|
||||
disable_animations: parseBoolean(disable_animations),
|
||||
hide_progress: parseBoolean(hide_progress),
|
||||
}),
|
||||
);
|
||||
} catch (err) {
|
||||
|
||||
@@ -80,6 +80,9 @@ Visit <https://indiafightscorona.giveindia.org> and make a small donation to hel
|
||||
|
||||
# Features
|
||||
|
||||
- [Getting Started](#getting-started)
|
||||
- [GitHub Actions](#github-actions-recommended)
|
||||
- [Community Deployment](#community-deployment)
|
||||
- [GitHub Stats Card](#github-stats-card)
|
||||
- [GitHub Extra Pins](#github-extra-pins)
|
||||
- [Top Languages Card](#top-languages-card)
|
||||
@@ -94,17 +97,141 @@ Visit <https://indiafightscorona.giveindia.org> and make a small donation to hel
|
||||
- [Wakatime Card Exclusive Option](#wakatime-card-exclusive-options)
|
||||
- [Deploy Yourself](#deploy-on-your-own-vercel-instance)
|
||||
- [Keep your fork up to date](#keep-your-fork-up-to-date)
|
||||
|
||||
# Getting Started
|
||||
|
||||
# GitHub Stats Card
|
||||
## GitHub Actions (Recommended)
|
||||
|
||||
Copy-paste this into your markdown content, and that is it. Simple!
|
||||
Using GitHub Actions over the community deployment is recommended because it provides more accurate stats and 100% uptime. Simply copy-paste the following into the `/.github/workflows/grs.yml` file in your README repo (`USERNAME/USERNAME`).
|
||||
|
||||
Change the `?username=` value to your GitHub username.
|
||||
```yml
|
||||
name: GitHub Readme Stats
|
||||
on:
|
||||
workflow_dispatch:
|
||||
schedule:
|
||||
- cron: 0 * * * *
|
||||
|
||||
jobs:
|
||||
grs:
|
||||
permissions: write-all
|
||||
runs-on: ubuntu-latest
|
||||
name: Generate Stats
|
||||
steps:
|
||||
- name: Checkout
|
||||
uses: actions/checkout@v3
|
||||
- name: Generate Stats
|
||||
uses: Zo-Bro-23/grs-action@v1
|
||||
id: generate
|
||||
with:
|
||||
token: ${{ secrets.GITHUB_TOKEN }}
|
||||
options: 'username=${{ github.repository_owner }}'
|
||||
- name: Push
|
||||
uses: crazy-max/ghaction-github-pages@v3
|
||||
with:
|
||||
target_branch: grs
|
||||
build_dir: grs
|
||||
env:
|
||||
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
|
||||
```
|
||||
|
||||
If you want to generate multiple stats, such as top languages, wakatime, etc, you can use the following code.
|
||||
|
||||
```yml
|
||||
name: GitHub Readme Stats
|
||||
on:
|
||||
workflow_dispatch:
|
||||
schedule:
|
||||
- cron: 0 * * * *
|
||||
|
||||
jobs:
|
||||
stats:
|
||||
permissions: write-all
|
||||
runs-on: ubuntu-latest
|
||||
name: Stats Card
|
||||
steps:
|
||||
- name: Checkout
|
||||
uses: actions/checkout@v3
|
||||
- name: Generate Stats
|
||||
uses: Zo-Bro-23/grs-action@v1
|
||||
id: generate
|
||||
with:
|
||||
token: ${{ secrets.GITHUB_TOKEN }}
|
||||
options: 'username=${{ github.repository_owner }}'
|
||||
- uses: actions/upload-artifact@master
|
||||
with:
|
||||
name: stats
|
||||
path: grs
|
||||
top-langs:
|
||||
permissions: write-all
|
||||
runs-on: ubuntu-latest
|
||||
name: Top Languages Card
|
||||
steps:
|
||||
- name: Checkout
|
||||
uses: actions/checkout@v3
|
||||
- name: Generate Top Languages
|
||||
uses: Zo-Bro-23/grs-action@v1
|
||||
id: generate
|
||||
with:
|
||||
token: ${{ secrets.GITHUB_TOKEN }}
|
||||
options: 'username=${{ github.repository_owner }}'
|
||||
card: 'top-langs'
|
||||
- uses: actions/upload-artifact@master
|
||||
with:
|
||||
name: top-langs
|
||||
path: grs
|
||||
push:
|
||||
permissions: write-all
|
||||
runs-on: ubuntu-latest
|
||||
name: Push
|
||||
needs: [stats, top-langs]
|
||||
steps:
|
||||
- uses: actions/download-artifact@master
|
||||
with:
|
||||
name: stats
|
||||
path: grs
|
||||
- uses: actions/download-artifact@master
|
||||
with:
|
||||
name: top-langs
|
||||
path: grs
|
||||
- name: Push
|
||||
uses: crazy-max/ghaction-github-pages@v3
|
||||
with:
|
||||
target_branch: grs
|
||||
build_dir: grs
|
||||
env:
|
||||
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
|
||||
```
|
||||
|
||||
You can now include the stats in your README by using the following markdown code (replace `USERNAME` with your GitHub username).
|
||||
|
||||
```md
|
||||
[](https://github.com/anuraghazra/github-readme-stats)
|
||||
```
|
||||
|
||||
You can also enable GitHub Pages on the `grs` branch (root) and use that URL (replace `GH_PAGES_URL` with your GitHub Pages URL).
|
||||
|
||||
```md
|
||||
[](https://github.com/anuraghazra/github-readme-stats)
|
||||
```
|
||||
|
||||
The GitHub Action accepts the following inputs:
|
||||
- `token` - `REQUIRED` - Your GitHub Personal Access Token (PAT), or any other token that GitHub accepts.
|
||||
- `options` - `REQUIRED` - Any customization options. More below. (This is the same as the query string you would pass to the API if using the community deployment)
|
||||
- `card` - The type of card to generate. `repo`, `top-langs`, or `wakatime` (leave empty for stats card).
|
||||
- `path` - Output path for SVG file. Relative path; include filename with `.svg`.
|
||||
- `fetch_multipage` - Experimental feature that gives more accurate stats if you have >100 repos.
|
||||
|
||||
## Community Deployment
|
||||
Copy-paste the following markdown code. Change the `?username=` value to your GitHub username.
|
||||
|
||||
```md
|
||||
[](https://github.com/anuraghazra/github-readme-stats)
|
||||
```
|
||||
|
||||
Other cards can be included by using `/api/top-langs`, `/api/pin`, or `/api/wakatime`. More customization options can be added by using query parameters (`&option1=value1&option2=value2&...`).
|
||||
|
||||
# GitHub Stats Card
|
||||
|
||||
> **Note**
|
||||
> Available ranks are S+ (top 1%), S (top 25%), A++ (top 45%), A+ (top 60%), and B+ (everyone). The values are calculated by using the [cumulative distribution function](https://en.wikipedia.org/wiki/Cumulative_distribution_function) using commits, contributions, issues, stars, pull requests, followers, and owned repositories. The implementation can be investigated at [src/calculateRank.js](./src/calculateRank.js).
|
||||
|
||||
@@ -115,7 +242,7 @@ You can pass a query parameter `&hide=` to hide any specific stats with comma-se
|
||||
> Options: `&hide=stars,commits,prs,issues,contribs`
|
||||
|
||||
```md
|
||||

|
||||
?username=anuraghazra&hide=contribs,prs
|
||||
```
|
||||
|
||||
### Adding private contributions count to total commits count
|
||||
@@ -128,7 +255,7 @@ You can add the count of all your private contributions to the total commits cou
|
||||
> Options: `&count_private=true`
|
||||
|
||||
```md
|
||||

|
||||
?username=anuraghazra&count_private=true
|
||||
```
|
||||
|
||||
### Showing icons
|
||||
@@ -136,7 +263,7 @@ You can add the count of all your private contributions to the total commits cou
|
||||
To enable icons, you can pass `show_icons=true` in the query param, like so:
|
||||
|
||||
```md
|
||||

|
||||
?username=anuraghazra&show_icons=true
|
||||
```
|
||||
|
||||
### Themes
|
||||
@@ -146,7 +273,7 @@ With inbuilt themes, you can customize the look of the card without doing any [m
|
||||
Use `&theme=THEME_NAME` parameter like so :
|
||||
|
||||
```md
|
||||

|
||||
?username=anuraghazra&show_icons=true&theme=radical
|
||||
```
|
||||
|
||||
#### All inbuilt themes
|
||||
@@ -169,7 +296,7 @@ Since GitHub will re-upload the cards and serve them from their [CDN](https://do
|
||||
We have included a `transparent` theme that has a transparent background. This theme is optimized to look good on GitHub's dark and light default themes. You can enable this theme using the `&theme=transparent` parameter like so:
|
||||
|
||||
```md
|
||||

|
||||
?username=anuraghazra&show_icons=true&theme=transparent
|
||||
```
|
||||
|
||||
<details>
|
||||
@@ -184,7 +311,7 @@ We have included a `transparent` theme that has a transparent background. This t
|
||||
You can use the `bg_color` parameter to make any of [the available themes](./themes/README.md) transparent. This is done by setting the `bg_color` to a colour with a transparent alpha channel (i.e. `bg_color=00000000`):
|
||||
|
||||
```md
|
||||

|
||||
?username=anuraghazra&show_icons=true&bg_color=00000000
|
||||
```
|
||||
|
||||
<details>
|
||||
@@ -199,8 +326,8 @@ You can use the `bg_color` parameter to make any of [the available themes](./the
|
||||
You can use [GitHub's theme context](https://github.blog/changelog/2021-11-24-specify-theme-context-for-images-in-markdown/) tags to switch the theme based on the user GitHub theme automatically. This is done by appending `#gh-dark-mode-only` or `#gh-light-mode-only` to the end of an image URL. This tag will define whether the image specified in the markdown is only shown to viewers using a light or a dark GitHub theme:
|
||||
|
||||
```md
|
||||
[](https://github.com/anuraghazra/github-readme-stats#gh-dark-mode-only)
|
||||
[](https://github.com/anuraghazra/github-readme-stats#gh-light-mode-only)
|
||||
[](https://github.com/anuraghazra/github-readme-stats#gh-dark-mode-only)
|
||||
[](https://github.com/anuraghazra/github-readme-stats#gh-light-mode-only)
|
||||
```
|
||||
|
||||
<details>
|
||||
@@ -218,14 +345,14 @@ You can use [GitHub's new media feature](https://github.blog/changelog/2022-05-1
|
||||
```html
|
||||
<picture>
|
||||
<source
|
||||
srcset="https://github-readme-stats.vercel.app/api?username=anuraghazra&show_icons=true&theme=dark"
|
||||
srcset="https://DARK_SVG_URL/"
|
||||
media="(prefers-color-scheme: dark)"
|
||||
/>
|
||||
<source
|
||||
srcset="https://github-readme-stats.vercel.app/api?username=anuraghazra&show_icons=true"
|
||||
srcset="https://LIGHT_SVG_URL/"
|
||||
media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)"
|
||||
/>
|
||||
<img src="https://github-readme-stats.vercel.app/api?username=anuraghazra&show_icons=true" />
|
||||
<img src="https://DEFAULT_SVG_URL/" />
|
||||
</picture>
|
||||
```
|
||||
|
||||
@@ -248,7 +375,7 @@ You can use [GitHub's new media feature](https://github.blog/changelog/2022-05-1
|
||||
|
||||
### Customization
|
||||
|
||||
You can customize the appearance of your `Stats Card` or `Repo Card` however you wish with URL parameters.
|
||||
You can customize the appearance of your cards however you wish with these parameters.
|
||||
|
||||
#### Common Options
|
||||
|
||||
@@ -264,7 +391,7 @@ You can customize the appearance of your `Stats Card` or `Repo Card` however you
|
||||
- `border_radius` - Corner rounding on the card. Default: `4.5`.
|
||||
|
||||
> **Warning**
|
||||
> We use caching to decrease the load on our servers (see <https://github.com/anuraghazra/github-readme-stats/issues/1471#issuecomment-1271551425>). Our cards have a default cache of 4 hours (14400 seconds). Also, note that the cache is clamped to a minimum of 4 hours and a maximum of 24 hours.
|
||||
> We use caching to decrease the load on our servers (see <https://github.com/anuraghazra/github-readme-stats/issues/1471#issuecomment-1271551425>). Our cards have a default cache of 4 hours (14400 seconds). Also, note that the cache is clamped to a minimum of 4 hours and a maximum of 24 hours. This is why we recommend using our GitHub Action :)
|
||||
|
||||
##### Gradient in bg_color
|
||||
|
||||
@@ -305,6 +432,7 @@ You can provide multiple comma-separated values in the bg_color option to render
|
||||
- `exclude_repo` - Exclude specified repositories _(Comma-separated values)_. Default: `[] (blank array)`.
|
||||
- `custom_title` - Sets a custom title for the card _(string)_. Default `Most Used Languages`.
|
||||
- `disable_animations` - Disables all animations in the card _(boolean)_. Default: `false`.
|
||||
- `hide_progress` - It uses the compact layout option, hides percentages, and removes the bars. Default: `false`.
|
||||
|
||||
> **Warning**
|
||||
> Language names should be URI-escaped, as specified in [Percent Encoding](https://en.wikipedia.org/wiki/Percent-encoding)
|
||||
@@ -333,13 +461,7 @@ Yay! You are no longer limited to 6 pinned repositories.
|
||||
|
||||
### Usage
|
||||
|
||||
Copy-paste this code into your readme and change the links.
|
||||
|
||||
Endpoint: `api/pin?username=anuraghazra&repo=github-readme-stats`
|
||||
|
||||
```md
|
||||
[](https://github.com/anuraghazra/github-readme-stats)
|
||||
```
|
||||
Use the `api/pin` endpoint with the API or the `card: 'repo'` option with the GitHub Action.
|
||||
|
||||
### Demo
|
||||
|
||||
@@ -354,24 +476,18 @@ Use [show_owner](#customization) variable to include the repo's owner username
|
||||
The top languages card shows a GitHub user's most frequently used top language.
|
||||
|
||||
> **Note**
|
||||
> Top Languages does not indicate my skill level or anything like that; it's a GitHub metric to determine which languages have the most code on GitHub. It is a new feature of github-readme-stats.
|
||||
> Top Languages does not indicate skill level or anything like that; it's a GitHub metric to determine which languages have the most code on GitHub.
|
||||
|
||||
### Usage
|
||||
|
||||
Copy-paste this code into your readme and change the links.
|
||||
|
||||
Endpoint: `api/top-langs?username=anuraghazra`
|
||||
|
||||
```md
|
||||
[](https://github.com/anuraghazra/github-readme-stats)
|
||||
```
|
||||
Use the `api/top-langs` endpoint with the API or the `card: 'top-langs'` option with the GitHub Action.
|
||||
|
||||
### Exclude individual repositories
|
||||
|
||||
You can use the `&exclude_repo=repo1,repo2` parameter to exclude individual repositories.
|
||||
|
||||
```md
|
||||
[](https://github.com/anuraghazra/github-readme-stats)
|
||||
?username=anuraghazra&exclude_repo=github-readme-stats,anuraghazra.github.io
|
||||
```
|
||||
|
||||
### Hide individual languages
|
||||
@@ -379,7 +495,7 @@ You can use the `&exclude_repo=repo1,repo2` parameter to exclude individual repo
|
||||
You can use `&hide=language1,language2` parameter to hide individual languages.
|
||||
|
||||
```md
|
||||
[](https://github.com/anuraghazra/github-readme-stats)
|
||||
?username=anuraghazra&hide=javascript,html
|
||||
```
|
||||
|
||||
### Show more languages
|
||||
@@ -387,7 +503,7 @@ You can use `&hide=language1,language2` parameter to hide individual languages.
|
||||
You can use the `&langs_count=` option to increase or decrease the number of languages shown on the card. Valid values are integers between 1 and 10 (inclusive), and the default is 5.
|
||||
|
||||
```md
|
||||
[](https://github.com/anuraghazra/github-readme-stats)
|
||||
?username=anuraghazra&langs_count=8
|
||||
```
|
||||
|
||||
### Compact Language Card Layout
|
||||
@@ -395,7 +511,15 @@ You can use the `&langs_count=` option to increase or decrease the number of lan
|
||||
You can use the `&layout=compact` option to change the card design.
|
||||
|
||||
```md
|
||||
[](https://github.com/anuraghazra/github-readme-stats)
|
||||
?username=anuraghazra&layout=compact
|
||||
```
|
||||
|
||||
### Hide Progress Bars
|
||||
|
||||
You can use the `&hide_progress=true` option to hide the percentages and the progress bars (layout will be automatically set to `compact`).
|
||||
|
||||
```md
|
||||
?username=anuraghazra&hide_progress=true
|
||||
```
|
||||
|
||||
### Demo
|
||||
@@ -406,17 +530,33 @@ You can use the `&layout=compact` option to change the card design.
|
||||
|
||||
[](https://github.com/anuraghazra/github-readme-stats)
|
||||
|
||||
- Hidden progress bars
|
||||
|
||||
[](https://github.com/anuraghazra/github-readme-stats)
|
||||
|
||||
# Wakatime Week Stats
|
||||
|
||||
### Usage
|
||||
|
||||
Use the `api/wkatime` endpoint with the API or the `card: 'wakatime'` option with the GitHub Action.
|
||||
|
||||
Change the `?username=` value to your [Wakatime](https://wakatime.com) username.
|
||||
|
||||
```md
|
||||
[](https://github.com/anuraghazra/github-readme-stats)
|
||||
?username=willianrod
|
||||
```
|
||||
|
||||
> **Note**:
|
||||
> Please be aware that we currently only show data from Wakatime profiles that are public.
|
||||
|
||||
### Compact Wakatime Card Layout
|
||||
|
||||
You can use the `&layout=compact` option to change the card design.
|
||||
|
||||
```md
|
||||
?username=willianrod&layout=compact
|
||||
```
|
||||
|
||||
### Demo
|
||||
|
||||
[](https://github.com/anuraghazra/github-readme-stats)
|
||||
@@ -489,14 +629,14 @@ By default, GitHub does not lay out the cards side by side. To do that, you can
|
||||
|
||||
```html
|
||||
<a href="https://github.com/anuraghazra/github-readme-stats">
|
||||
<img align="center" src="https://github-readme-stats.vercel.app/api/pin/?username=anuraghazra&repo=github-readme-stats" />
|
||||
<img align="center" src="https://SVG_URL/" />
|
||||
</a>
|
||||
<a href="https://github.com/anuraghazra/convoychat">
|
||||
<img align="center" src="https://github-readme-stats.vercel.app/api/pin/?username=anuraghazra&repo=convoychat" />
|
||||
<img align="center" src="https://SVG_URL/" />
|
||||
</a>
|
||||
```
|
||||
|
||||
## Deploy on your own Vercel instance
|
||||
## Deploy your own Vercel instance
|
||||
|
||||
#### :film_projector: [Check Out Step By Step Video Tutorial By @codeSTACKr](https://youtu.be/n6d4KHSKqGk?t=107)
|
||||
|
||||
@@ -535,7 +675,7 @@ Since the GitHub API only allows 5k requests per hour, my `https://github-readme
|
||||
|
||||
### Keep your fork up to date
|
||||
|
||||
You can keep your fork, and thus your private Vercel instance up to date with the upstream using GitHubs' [Sync Fork button](https://docs.github.com/en/pull-requests/collaborating-with-pull-requests/working-with-forks/syncing-a-fork). You can also use the [pull](https://github.com/wei/pull) package created by [@wei](https://github.com/wei) to automate this process.
|
||||
You can keep your fork, and thus your private Vercel instance up to date with the upstream using GitHub's [Sync Fork button](https://docs.github.com/en/pull-requests/collaborating-with-pull-requests/working-with-forks/syncing-a-fork). You can also use the [pull](https://github.com/wei/pull) package created by [@wei](https://github.com/wei) to automate this process.
|
||||
|
||||
## :sparkling_heart: Support the project
|
||||
|
||||
|
||||
@@ -76,10 +76,11 @@ const createProgressTextNode = ({ width, color, name, progress, index }) => {
|
||||
* @param {object} props Function properties.
|
||||
* @param {Lang} props.lang Programming language object.
|
||||
* @param {number} props.totalSize Total size of all languages.
|
||||
* @param {boolean} props.hideProgress Whether to hide percentage.
|
||||
* @param {number} props.index Index of the programming language.
|
||||
* @returns {string} Compact layout programming language SVG node.
|
||||
*/
|
||||
const createCompactLangNode = ({ lang, totalSize, index }) => {
|
||||
const createCompactLangNode = ({ lang, totalSize, hideProgress, index }) => {
|
||||
const percentage = ((lang.size / totalSize) * 100).toFixed(2);
|
||||
const staggerDelay = (index + 3) * 150;
|
||||
const color = lang.color || "#858585";
|
||||
@@ -88,7 +89,7 @@ const createCompactLangNode = ({ lang, totalSize, index }) => {
|
||||
<g class="stagger" style="animation-delay: ${staggerDelay}ms">
|
||||
<circle cx="5" cy="6" r="5" fill="${color}" />
|
||||
<text data-testid="lang-name" x="15" y="10" class='lang-name'>
|
||||
${lang.name} ${percentage}%
|
||||
${lang.name} ${hideProgress ? "" : percentage + "%"}
|
||||
</text>
|
||||
</g>
|
||||
`;
|
||||
@@ -100,9 +101,10 @@ const createCompactLangNode = ({ lang, totalSize, index }) => {
|
||||
* @param {object[]} props Function properties.
|
||||
* @param {Lang[]} props.langs Array of programming languages.
|
||||
* @param {number} props.totalSize Total size of all languages.
|
||||
* @param {boolean} props.hideProgress Whether to hide percentage.
|
||||
* @returns {string} Programming languages SVG node.
|
||||
*/
|
||||
const createLanguageTextNode = ({ langs, totalSize }) => {
|
||||
const createLanguageTextNode = ({ langs, totalSize, hideProgress }) => {
|
||||
const longestLang = getLongestLang(langs);
|
||||
const chunked = chunkArray(langs, langs.length / 2);
|
||||
const layouts = chunked.map((array) => {
|
||||
@@ -111,6 +113,7 @@ const createLanguageTextNode = ({ langs, totalSize }) => {
|
||||
createCompactLangNode({
|
||||
lang,
|
||||
totalSize,
|
||||
hideProgress,
|
||||
index,
|
||||
}),
|
||||
);
|
||||
@@ -160,9 +163,10 @@ const renderNormalLayout = (langs, width, totalLanguageSize) => {
|
||||
* @param {Lang[]} langs Array of programming languages.
|
||||
* @param {number} width Card width.
|
||||
* @param {number} totalLanguageSize Total size of all languages.
|
||||
* @param {boolean} hideProgress Whether to hide progress bar.
|
||||
* @returns {string} Compact layout card SVG object.
|
||||
*/
|
||||
const renderCompactLayout = (langs, width, totalLanguageSize) => {
|
||||
const renderCompactLayout = (langs, width, totalLanguageSize, hideProgress) => {
|
||||
const paddingRight = 50;
|
||||
const offsetWidth = width - paddingRight;
|
||||
// progressOffset holds the previous language's width and used to offset the next language
|
||||
@@ -193,15 +197,21 @@ const renderCompactLayout = (langs, width, totalLanguageSize) => {
|
||||
.join("");
|
||||
|
||||
return `
|
||||
<mask id="rect-mask">
|
||||
${
|
||||
!hideProgress
|
||||
? `
|
||||
<mask id="rect-mask">
|
||||
<rect x="0" y="0" width="${offsetWidth}" height="8" fill="white" rx="5"/>
|
||||
</mask>
|
||||
${compactProgressBar}
|
||||
|
||||
<g transform="translate(0, 25)">
|
||||
`
|
||||
: ""
|
||||
}
|
||||
<g transform="translate(0, ${hideProgress ? "0" : "25"})">
|
||||
${createLanguageTextNode({
|
||||
langs,
|
||||
totalSize: totalLanguageSize,
|
||||
hideProgress: hideProgress,
|
||||
})}
|
||||
</g>
|
||||
`;
|
||||
@@ -276,6 +286,7 @@ const renderTopLanguages = (topLangs, options = {}) => {
|
||||
text_color,
|
||||
bg_color,
|
||||
hide,
|
||||
hide_progress,
|
||||
theme,
|
||||
layout,
|
||||
custom_title,
|
||||
@@ -305,11 +316,17 @@ const renderTopLanguages = (topLangs, options = {}) => {
|
||||
let height = calculateNormalLayoutHeight(langs.length);
|
||||
|
||||
let finalLayout = "";
|
||||
if (layout === "compact") {
|
||||
if (layout === "compact" || hide_progress == true) {
|
||||
width = width + 50; // padding
|
||||
height = calculateCompactLayoutHeight(langs.length);
|
||||
height =
|
||||
calculateCompactLayoutHeight(langs.length) + (hide_progress ? -25 : 0);
|
||||
|
||||
finalLayout = renderCompactLayout(langs, width, totalLanguageSize);
|
||||
finalLayout = renderCompactLayout(
|
||||
langs,
|
||||
width,
|
||||
totalLanguageSize,
|
||||
hide_progress,
|
||||
);
|
||||
} else {
|
||||
finalLayout = renderNormalLayout(langs, width, totalLanguageSize);
|
||||
}
|
||||
|
||||
Vendored
+1
@@ -38,6 +38,7 @@ export type TopLangOptions = CommonOptions & {
|
||||
custom_title: string;
|
||||
langs_count: number;
|
||||
disable_animations: boolean;
|
||||
hide_progress: boolean;
|
||||
};
|
||||
|
||||
type WakaTimeOptions = CommonOptions & {
|
||||
|
||||
@@ -102,6 +102,7 @@
|
||||
"Csound Score": "#1a1a1a",
|
||||
"Cuda": "#3A4E3A",
|
||||
"Curry": "#531242",
|
||||
"Cypher": "#34c0eb",
|
||||
"Cython": "#fedf5b",
|
||||
"D": "#ba595e",
|
||||
"DM": "#447265",
|
||||
@@ -124,6 +125,7 @@
|
||||
"Earthly": "#2af0ff",
|
||||
"Easybuild": "#069406",
|
||||
"Ecere Projects": "#913960",
|
||||
"Ecmarkup": "#eb8131",
|
||||
"EditorConfig": "#fff1f2",
|
||||
"Eiffel": "#4d6977",
|
||||
"Elixir": "#6e4a7e",
|
||||
@@ -215,6 +217,7 @@
|
||||
"Idris": "#b30000",
|
||||
"Ignore List": "#000000",
|
||||
"ImageJ Macro": "#99AAFF",
|
||||
"Imba": "#16cec6",
|
||||
"Inno Setup": "#264b99",
|
||||
"Io": "#a9188d",
|
||||
"Ioke": "#078193",
|
||||
@@ -286,6 +289,7 @@
|
||||
"Mathematica": "#dd1100",
|
||||
"Max": "#c4a79c",
|
||||
"Mercury": "#ff2b2b",
|
||||
"Mermaid": "#ff3670",
|
||||
"Meson": "#007800",
|
||||
"Metal": "#8f14e9",
|
||||
"MiniYAML": "#ff1111",
|
||||
@@ -318,6 +322,10 @@
|
||||
"Nu": "#c9df40",
|
||||
"NumPy": "#9C8AF9",
|
||||
"Nunjucks": "#3d8137",
|
||||
"OASv2-json": "#85ea2d",
|
||||
"OASv2-yaml": "#85ea2d",
|
||||
"OASv3-json": "#85ea2d",
|
||||
"OASv3-yaml": "#85ea2d",
|
||||
"OCaml": "#3be133",
|
||||
"ObjectScript": "#424893",
|
||||
"Objective-C": "#438eff",
|
||||
@@ -327,14 +335,18 @@
|
||||
"Omgrofl": "#cabbff",
|
||||
"Opal": "#f7ede0",
|
||||
"Open Policy Agent": "#7d9199",
|
||||
"OpenAPI Specification v2": "#85ea2d",
|
||||
"OpenAPI Specification v3": "#85ea2d",
|
||||
"OpenCL": "#ed2e2d",
|
||||
"OpenEdge ABL": "#5ce600",
|
||||
"OpenQASM": "#AA70FF",
|
||||
"OpenSCAD": "#e5cd45",
|
||||
"Option List": "#476732",
|
||||
"Org": "#77aa99",
|
||||
"Oxygene": "#cdd0e3",
|
||||
"Oz": "#fab738",
|
||||
"P4": "#7055b5",
|
||||
"PDDL": "#0d00ff",
|
||||
"PEG.js": "#234d6b",
|
||||
"PHP": "#4F5D95",
|
||||
"PLSQL": "#dad8d8",
|
||||
@@ -351,6 +363,7 @@
|
||||
"PigLatin": "#fcd7de",
|
||||
"Pike": "#005390",
|
||||
"PogoScript": "#d80074",
|
||||
"Polar": "#ae81ff",
|
||||
"Portugol": "#f8bd00",
|
||||
"PostCSS": "#dc3a0c",
|
||||
"PostScript": "#da291c",
|
||||
@@ -414,6 +427,7 @@
|
||||
"Sass": "#a53b70",
|
||||
"Scala": "#c22d40",
|
||||
"Scaml": "#bd181a",
|
||||
"Scenic": "#fdc700",
|
||||
"Scheme": "#1e4aec",
|
||||
"Scilab": "#ca0f21",
|
||||
"Self": "#0579aa",
|
||||
@@ -421,6 +435,7 @@
|
||||
"Shell": "#89e051",
|
||||
"ShellCheck Config": "#cecfcb",
|
||||
"Shen": "#120F14",
|
||||
"Simple File Verification": "#C9BFED",
|
||||
"Singularity": "#64E6AD",
|
||||
"Slash": "#007eff",
|
||||
"Slice": "#003fa2",
|
||||
@@ -428,6 +443,7 @@
|
||||
"SmPL": "#c94949",
|
||||
"Smalltalk": "#596706",
|
||||
"Smarty": "#f0c040",
|
||||
"Smithy": "#c44536",
|
||||
"Solidity": "#AA6746",
|
||||
"SourcePawn": "#f69e1d",
|
||||
"Squirrel": "#800000",
|
||||
@@ -478,6 +494,7 @@
|
||||
"Vim Script": "#199f4b",
|
||||
"Vim Snippet": "#199f4b",
|
||||
"Visual Basic .NET": "#945db7",
|
||||
"Visual Basic 6.0": "#2c6353",
|
||||
"Volt": "#1F1F1F",
|
||||
"Vue": "#41b883",
|
||||
"Vyper": "#2980b9",
|
||||
@@ -514,6 +531,7 @@
|
||||
"fish": "#4aae47",
|
||||
"hoon": "#00b171",
|
||||
"jq": "#c7254e",
|
||||
"just": "#384d54",
|
||||
"kvlang": "#1da6e0",
|
||||
"mIRC Script": "#3d57c3",
|
||||
"mcfunction": "#E22837",
|
||||
|
||||
@@ -374,6 +374,13 @@ export const themes = {
|
||||
border_color: "170F0C",
|
||||
bg_color: "170F0C",
|
||||
},
|
||||
rose: {
|
||||
title_color: "8d192b",
|
||||
text_color: "862931",
|
||||
icon_color: "B71F36",
|
||||
border_color: "e9d8d4",
|
||||
bg_color: "e9d8d4",
|
||||
},
|
||||
};
|
||||
|
||||
export default themes;
|
||||
|
||||
Reference in New Issue
Block a user