DEV Community: Siddeshwar Navaneetharan

More Willpower to Developers

Siddeshwar Navaneetharan — Wed, 24 Nov 2021 17:18:35 +0000

My Workflow

Scenario: You're a developer, scouring the open source ocean of github, making contributions, raising issues, reading comments in the issue, contributing back, raising PRs and sometimes, the end result is just too far away for the journey to be satisfying enough to keep going. Wouldn't a pick-me-up go a long way ?

Enter uplifiting-quote-action. Any comment you make on a PR or issue and you are met with an uplifting quote. The right words at the right time can do wonders to help recharge your willpower and help you get back on track with renewed vigor and energy.

Behind this action is but one purpose, to kindle the developer's mind to action whenever he/she experiences a sense of declining enthusiasm.

Submission Category:

Wacky Wildcards 😝

Yaml File or Link to Code

Infinity-Intellect / uplifiting-quote-action

Comments an uplifting quote every time you comment on a PR or an issue.

uplifiting-quote-action

Comments an uplifting quote every time you comment on a PR or an issue.

Inputs

`github_token`

Required A github token

`comment_starter`

Optional A custom beginning statement for a comment

Outputs

None

Example Usage

name: quote_comment
on: issue_comment
jobs:
  pr_commented:
    name: PR Comment
    if: ${{ github.event.issue.pull_request }}
    runs-on: ubuntu-latest
    steps:
      - uses: infinity-intellect/uplifiting-quote-action@v1.0.0
        with:
          github_token: ${{ secrets.GITHUB_TOKEN }}
          comment_starter: 'Thanks for commenting on this PR.'
  issue_commented:
    name: Issue Comment
    if: ${{ !github.event.issue.pull_request }}
    runs-on: ubuntu-latest
    steps:
      - uses: infinity-intellect/uplifiting-quote-action@v1.0.0
        with:
          github_token: ${{ secrets.GITHUB_TOKEN }}
          comment_starter: 'We appreciate you taking your time to comment on this issue.'

View on GitHub

Additional Resources / Info

Javscript Github Actions Documentation (Very beginner-friendly!)

As a Github actions newbie, I only regret not getting into this sooner. I can't wait to create more actions that will aid in the developer workflow.

Custom colour for angular material components

Siddeshwar Navaneetharan — Wed, 24 Nov 2021 10:31:31 +0000

Problem

So, you have an angular material component, say a chip or a button like so:

<button mat-flat-button> Done button>

The designs provided to you show that the background colour of the button should be green and the text should be white.
You frantically search the web for a solution. Look no further !

Solution

In your corresponding styling file (.css or .scss), include the following style selector:

.mat-green {
 background-color: green;
 color: white;
}

And then, in your .html file, simply set the color input attribute to green as below:

<button mat-flat-button color="green"> Done button>

And voilà ! There you have it.

Note: You can provide any name to the css selector and prefix it with mat- and set the name to the color attribute.

VSCode Productivity Hack #1

Siddeshwar Navaneetharan — Mon, 22 Nov 2021 18:21:01 +0000

Coveted Comparisons

Let me paint you a picture; you're working on a project that has several identical configuration files. The difference between these files is that each is used in different environments i.e. one file for the development environment, one file for the staging environment and another for the production environment.

Now wouldn't it be easier if you could open the side by side and make a comparison to see what's present in one and missing in the other ? Well, look no further, for VSCode has the all-powerful Select to compare and Compare Selected feature.

Steps

Right click the first file you want to compare against and click Select For Compare
Right the second file, which you want to compare with the first and click Compare with Selected
Voila ! There you have it, two files one beside the other with the diffs.

That's all for today folks !