GitHubアクション「user-statistician」にハロウィンテーマを追加
ハロウィンとHacktoberfestに間に合うように、最近、user-statistician GitHubアクションに数種類のハロウィンテーマを追加しました。以前からこのGitHubアクションについて投稿していますが、GitHub上での活動を詳細にまとめたSVGを作成し、GitHubプロフィールのREADMEや個人のウェブサイトに掲載することができます。GitHubプロフィールリポジトリ内でスケジュール通りに動作するGitHubワークフローを通じて実行することを目的としています(ユーザー名と同じ名前のリポジトリ)。Pythonでコンテナアクションとして実装されており、GitHub GraphQL APIをクエリするためにGitHub CLIを使用しています。より詳しい機能については、以前のDEVの投稿や、このシリーズの他の投稿をご覧ください。
user-statistician GitHubアクションには、いくつかのビルトインカラーテーマが含まれています。これまでは、すべてのビルトインカラーテーマはGitHubのPrimerドキュメントで説明されているGitHubの様々なテーマに基づいていました。最近、halloween
、halloween-light
、batty
の3つの新しいハロウィン関連テーマを追加しました。既存のGitHubインスパイアされたテーマを使いたいけれど、オクトキャットの代わりにかぼちゃ(新しいhalloween
とhalloween-light
テーマから)やコウモリ(新しいbatty
テーマから)を使いたい場合は、それもサポートされています。
この記事の残りの部分では、新しいテーマの例と、新しいテーマの設定方法を説明する例のワークフローを示しています。
目次:
- ダークハロウィンテーマ: かぼちゃのトップでハロウィンカラー
- ライトハロウィンテーマ: かぼちゃのトップでハロウィンカラー
- コウモリテーマ: トップにコウモリがあるライトテーマ
- 他のテーマでかぼちゃやコウモリを使う方法
- カスタムカラーでかぼちゃやコウモリを使う方法
- 私を探せる場所
ダークハロウィンテーマ
まず新しいhalloween
テーマを使ったGitHubワークフローですが、デフォルトの入力をすべて使用します。以下のワークフローをリポジトリの.github/workflows
ディレクトリ内の.yml
ファイルに置くと、毎日午前3時(cron
を参照)に実行され、workflow_dispatch
イベントを通じて手動でも実行されます。テーマはアクションへのcolors
入力で設定されます。GitHub GraphQL APIをクエリするためにGITHUB_TOKEN
を環境変数として必要とします。GITHUB_TOKEN
に自動的に付与されるデフォルトの権限で十分です。
name: user-statistician
on:
schedule:
- cron: '0 3 * * *'
workflow_dispatch:
jobs:
stats:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v2
- name: Generate the user stats image for GitHub profile
uses: cicirello/user-statistician@v1
with:
colors: halloween
env:
GITHUB_TOKEN: ${{secrets.GITHUB_TOKEN}}
フルスクリーンモードから出る
上記ワークフローはデフォルトの場所を使用するので、生成されたSVGはimages/userstats.svg
にコミットされます。SVGファイルの場所や名前を変更するために使用できる入力がアクションにあります。デフォルトを維持する場合は、以下のMarkdownを使用してリポジトリのREADMEに画像を挿入できます。
フルスクリーンモードから出る
`halloween`テーマは次のサンプルのようになります:
[](https://res.cloudinary.com/practicaldev/image/fetch/s--UJKJZVzq--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://raw.githubusercontent.com/cicirello/user-statistician/samples/images/halloween.svg)
[](#light-halloween-theme)ライトハロウィンテーマ
---------------------------------------------------
2つ目の新しいテーマは`halloween-light`で、ハロウィンカラーを使用したライトテーマです。以下がサンプルワークフローです:
```yaml
name: user-statistician
on:
schedule:
- cron: '0 3 * * *'
workflow_dispatch:
jobs:
stats:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v2
- name: Generate the user stats image for GitHub profile
uses: cicirello/user-statistician@v1
with:
colors: halloween-light
env:
GITHUB_TOKEN: ${{secrets.GITHUB_TOKEN}}
フルスクリーンモードから出る
halloween-light
テーマは次のサンプルのようになります:
コウモリテーマ
3つ目の新しいテーマはbatty
で、トップにコウモリがあるライトテーマです。以下がサンプルワークフローです:
name: user-statistician
on:
schedule:
- cron: '0 3 * * *'
workflow_dispatch:
jobs:
stats:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v2
- name: Generate the user stats image for GitHub profile
uses: cicirello/user-statistician@v1
with:
colors: batty
env:
GITHUB_TOKEN: ${{secrets.GITHUB_TOKEN}}
フルスクリーンモードから出る
batty
テーマは次のサンプルのようになります:
他のテーマでかぼちゃやコウモリを使う方法
GitHubからインスパイアされた既存のテーマを使いたいけれど、デフォルトのオクトキャットの代わりにかぼちゃやコウモリを使いたい場合は、top-icon
入力を使用することで実現できます。例えば、top-icon: pumpkin
やtop-icon: bat
などです。以下はdark
テーマでかぼちゃを使う方法を示す例のワークフローです。
name: user-statistician
on:
schedule:
- cron: '0 3 * * *'
workflow_dispatch:
jobs:
stats:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v2
- name: Generate the user stats image for GitHub profile
uses: cicirello/user-statistician@v1
with:
colors: dark
top-icon: pumpkin
env:
GITHUB_TOKEN: ${{secrets.GITHUB_TOKEN}}
フルスクリーンモードから出る
ライトテーマでもかぼちゃが良く見えるはずです。それには、colors: light
を明示的に設定するか、またはcolors
入力を省略します(指定しない場合はデフォルトでライトテーマになります):
name: user-statistician
on:
schedule:
- cron: '0 3 * * *'
workflow_dispatch:
jobs:
stats:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v2
- name: Generate the user stats image for GitHub profile
uses: cicirello/user-statistician@v1
with:
top-icon: pumpkin
env:
GITHUB_TOKEN: ${{secrets.GITHUB_TOKEN}}
フルスクリーンモードから出る
デフォルトのlight
テーマでコウモリを上に配置するワークフローは次の通りです:
name: user-statistician
on:
schedule:
- cron: '0 3 * * *'
workflow_dispatch:
jobs:
stats:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v2
- name: Generate the user stats image for GitHub profile
uses: cicirello/user-statistician@v1
with:
top-icon: bat
env:
GITHUB_TOKEN: ${{secrets.GITHUB_TOKEN}}
フルスクリーンモードから出る
注意してください。たとえばtop-icon: bat
をダークテーマと一緒に使うと、コウモリは背景に溶け込んでしまうので試さないでください。
カスタムカラーでかぼちゃやコウモリを使う方法
ビルトインのテーマが気に入らない場合は、カスタムカラーを指定できます。以下はカスタムカラーを指定した例のワークフローで、デフォルトのオクトキャットの代わりにtop-icon: pumpkin
でかぼちゃを使ったものです:
name: user-statistician
on:
schedule:
- cron: '0 3 * * *'
workflow_dispatch:
jobs:
stats:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v2
- name: Generate the user stats image for GitHub profile
uses: cicirello/user-statistician@v1
with:
colors: '#ffffff #368cf9 #0349b4 #0349b4 #0E1116'
top-icon: pumpkin
env:
GITHUB_TOKEN: ${{secrets.GITHUB_TOKEN}}
フルスクリーンモードから出る
colors
入力のドキュメントをご覧ください。完全な詳細についてはこの入力の動作方法をご覧ください。前の例のように、この入力にテーマ名をシンプルに渡すこともできます。しかし、SVGの色名で指定された、またはこの例のように16進数で指定された5色のシーケンスも渡すことができます(16進数の6桁と3桁の色がサポートされています)。この例での色はlight-high-contrast
テーマのもので、背景色、境界色、アイコン色、タイトル色、テキスト色の順に指定されています。アイコン色は、様々な統計のアイコンにだけ影響を及ぼし、上部の角(例:オクトキャット、かぼちゃ、コウモリ)にあるアイコンには使用されません。デフォルトのオクトキャットを使用する場合(例えば、top-icon
を指定しない)、オクトキャットの色は選択した背景色とのコントラストを最大化するように設定されています。上部に何のアイコンも欲しくない場合は、top-icon: none
と渡すことができます。
私を探せる場所
ウェブ上で:
ビンセント・A・シシレロ - コンピュータサイエンスの教授
ビンセント・A・シシレロ - ストックトン大学のコンピュータサイエンス教授 - は、カーネギーメロン大学でロボティクスの博士号を取得し、人工知能、進化計算、スウォームインテリジェンス、計算知能の分野の研究者です。ACMシニアメンバー、IEEEシニアメンバー、AAAIライフメンバー、EAI名誉メンバー、SIAMメンバーです。
![favicon](https://res.cloudinary.com/practicaldev/image/fetch/s--qKMtrxV8--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://www.cicirello.org/images/favicon
こちらの記事はdev.toの良い記事を日本人向けに翻訳しています。
https://dev.to/cicirello/halloween-themes-for-the-user-statistician-github-action-4do6