Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Feature request] Option to remove Github icon from Stats card #141

Open
VladimirAlexiev opened this issue Feb 26, 2023 · 2 comments
Open

Comments

@VladimirAlexiev
Copy link

VladimirAlexiev commented Feb 26, 2023

Context

At my profile https://rawgit2.com/VladimirAlexiev/my/master/index.html
I've included several Github cards: 3 from you and 1 from https://github-readme-stats.vercel.app:
image

As you see, the last card drops to a new line because there's not enough space to show it on the same line.

I'd like to remove the Github icon (crossed-out in red).

  • Unlike the piecharts, it carries no info, it just takes space
  • Github is already mentioned in the first card
  • If I wanted to emphasize better that these are Github stats, I could include a Heading2, rather than spending horizontal space

Alternatives

  • If I reduce browser zoom, all 4 cards fit on the same line
  • There's no way to remove the icon that carries no info
  • Maybe I can eliminate the space between cards by changing the current markup:
<a href="https://github.com/VladimirAlexiev"><img 
  src="https://github-profile-summary-cards.vercel.app/api/cards/profile-details?username=VladimirAlexiev&theme=vue"/></a>
<a href="https://github.com/VladimirAlexiev"><img
  src="https://github-profile-summary-cards.vercel.app/api/cards/repos-per-language?username=VladimirAlexiev&theme=vue"/></a>

to something like

<a href="https://github.com/VladimirAlexiev"><img
  src="https://github-profile-summary-cards.vercel.app/api/cards/profile-details?username=VladimirAlexiev&theme=vue"/></a><a
  href="https://github.com/VladimirAlexiev"><img
  src="https://github-profile-summary-cards.vercel.app/api/cards/repos-per-language?username=VladimirAlexiev&theme=vue"/></a>

(UPD: it doesn't)

Has the feature been requested before?

No

If the feature request is approved, would you be willing to submit a PR?

I might, if you give me some pointers into reading https://github.com/vn7n24fzkq/github-profile-summary-cards/blob/main/src/cards/stats-card.ts

@MR-Addict
Copy link
Contributor

I think you can do something like this to make them evenly seperate into two rows like this:

<div>
  <div>
    <a href="https://github.com/VladimirAlexiev"><img src="https://github-profile-summary-cards.vercel.app/api/cards/profile-details?username=VladimirAlexiev&amp;theme=vue"></a>
    <a href="https://github.com/VladimirAlexiev"><img src="https://github-profile-summary-cards.vercel.app/api/cards/repos-per-language?username=VladimirAlexiev&amp;theme=vue"></a>
  </div>
  <div>
    <a href="https://github.com/VladimirAlexiev"><img src="https://github-profile-summary-cards.vercel.app/api/cards/stats?username=VladimirAlexiev&amp;theme=vue"></a>
    <a href="https://github.com/VladimirAlexiev"><img src="https://github-readme-stats.vercel.app/api?username=VladimirAlexiev&amp;show_icons=true&amp;disable_animations=true&amp;text_bold=false&amp;card_width=365px&amp;layout=compact&amp;custom_title=Stats2&amp;include_all_commits=true&amp;count_private=true&amp;theme=vue"></a>
  </div>
</div>

And if you're not using markdown to write your webiste, you can definitely add some css to position your elements like this:

<style>
  .github-state{
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
</style>
<div class="github-state">
    <a href="https://github.com/VladimirAlexiev"><img src="https://github-profile-summary-cards.vercel.app/api/cards/profile-details?username=VladimirAlexiev&amp;theme=vue"></a>
    <a href="https://github.com/VladimirAlexiev"><img src="https://github-profile-summary-cards.vercel.app/api/cards/repos-per-language?username=VladimirAlexiev&amp;theme=vue"></a>
    <a href="https://github.com/VladimirAlexiev"><img src="https://github-profile-summary-cards.vercel.app/api/cards/stats?username=VladimirAlexiev&amp;theme=vue"></a>
    <a href="https://github.com/VladimirAlexiev"><img src="https://github-readme-stats.vercel.app/api?username=VladimirAlexiev&amp;show_icons=true&amp;disable_animations=true&amp;text_bold=false&amp;card_width=365px&amp;layout=compact&amp;custom_title=Stats2&amp;include_all_commits=true&amp;count_private=true&amp;theme=vue"></a>
</div>

@VladimirAlexiev
Copy link
Author

Thanks @MR-Addict ! I think I can more easily use a blank line in markdown..
But I'd like to fit on one row.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants