usememos/memos
1
1
Fork 0
mirror of https://github.com/usememos/memos.git synced 2025-02-01 10:07:59 +08:00
Code Issues Projects Releases Packages Wiki Activity

chore: update github badge style

Browse source
This commit is contained in:
boojack 2022-07-16 09:52:57 +08:00
parent 9b5a555d1f
commit 1d55545e30
2 changed files with 24 additions and 29 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
web/src/components/GitHubBadge.tsx
View file

@ -13,18 +13,17 @@ const GitHubBadge: React.FC<Props> = () => {
});
}, []);
const handleClick = () => {
window.location.href = "https://github.com/usememos/memos";
};
return (
<div className="github-badge-container" onClick={handleClick}>
<a className="github-badge-container" href="https://github.com/usememos/memos">
<div className="github-icon">
<img className="icon-img" src="/github.webp" alt="" />
Star
</div>
<span className={`count-text ${starCount || "pulse"}`}>{starCount || "🌟"}</span>
</div>
<div className="count-text">
{starCount || ""}
<span className="icon-text">🌟</span>
</div>
</a>
);
};

40
web/src/less/github-badge.less
View file

@ -10,29 +10,25 @@
}
> .count-text {
@apply px-3 text-xs font-bold text-gray-800;
@apply w-auto h-full flex flex-row justify-center items-center px-3 text-xs font-bold text-gray-800;
&.pulse {
@apply text-sm;
animation: 1s linear 0s infinite pulse;
}
@keyframes pulse {
0% {
margin-bottom: 0px;
}
30% {
margin-bottom: 2px;
}
60% {
margin-bottom: 6px;
}
70% {
margin-bottom: 3px;
}
100% {
margin-bottom: 0px;
}
> .icon-text {
@apply text-sm ml-1;
animation: 1.6s linear 0s infinite pulse;
}
}
}
@keyframes pulse {
0% {
transform: scale(0.95);
}
70% {
transform: scale(1.2);
}
100% {
transform: scale(0.95);
}
}