Skip to content

feat: show action buttons only on hover #869

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.

Sign up for GitHub

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

Merged
merged 4 commits into from
Mar 12, 2024
Merged

feat: show action buttons only on hover #869

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
21c01fe
feat: show action buttons only on hover
setchy Mar 8, 2024
cac2aa1
Merge branch 'main' into feature/action-buttons-on-hover
setchy Mar 8, 2024
fb4866a
Merge remote-tracking branch 'origin/main' into feature/action-button…
setchy Mar 11, 2024
721f86a
Merge branch 'feature/action-buttons-on-hover' of https://github.com/…
setchy Mar 11, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions src/components/NotificationRow.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -67,7 +67,7 @@ export const NotificationRow: React.FC<IProps> = ({
]);

return (
<div className="flex space-x-3 py-2 px-3 bg-white dark:bg-gray-dark dark:text-white hover:bg-gray-100 dark:hover:bg-gray-darker border-b border-gray-100 dark:border-gray-darker">
<div className="flex space-x-3 py-2 px-3 bg-white dark:bg-gray-dark dark:text-white hover:bg-gray-100 dark:hover:bg-gray-darker border-b border-gray-100 dark:border-gray-darker group">
<div
className={`flex justify-center items-center w-5 ${realIconColor}`}
title={notificationTitle}
Expand All @@ -90,7 +90,7 @@ export const NotificationRow: React.FC<IProps> = ({
</div>
</div>

<div className="flex justify-center items-center gap-2">
<div className="flex justify-center items-center gap-2 opacity-0 group-hover:opacity-80 transition-opacity">
<button
className="focus:outline-none h-full hover:text-green-500"
title="Mark as Done"
Expand Down
4 changes: 2 additions & 2 deletions src/components/Repository.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -40,13 +40,13 @@ export const RepositoryNotifications: React.FC<IProps> = ({

return (
<>
<div className="flex py-2 px-3 bg-gray-100 dark:bg-gray-darker dark:text-white">
<div className="flex py-2 px-3 bg-gray-100 dark:bg-gray-darker dark:text-white group">
<div className="flex flex-1 space-x-3 items-center mt-0 text-sm font-medium overflow-hidden overflow-ellipsis whitespace-nowrap">
<img className="rounded w-5 h-5" src={avatarUrl} />
<span onClick={openBrowser}>{repoName}</span>
</div>

<div className="flex justify-center items-center gap-2">
<div className="flex justify-center items-center gap-2 opacity-0 group-hover:opacity-80 transition-opacity">
<button
className="focus:outline-none h-full hover:text-green-500"
title="Mark Repository as Done"
Expand Down
4 changes: 2 additions & 2 deletions src/components/__snapshots__/NotificationRow.test.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@

exports[`components/Notification.js should render itself & its children 1`] = `
<div
className="flex space-x-3 py-2 px-3 bg-white dark:bg-gray-dark dark:text-white hover:bg-gray-100 dark:hover:bg-gray-darker border-b border-gray-100 dark:border-gray-darker"
className="flex space-x-3 py-2 px-3 bg-white dark:bg-gray-dark dark:text-white hover:bg-gray-100 dark:hover:bg-gray-darker border-b border-gray-100 dark:border-gray-darker group"
>
<div
className="flex justify-center items-center w-5 text-green-500"
Expand Down Expand Up @@ -59,7 +59,7 @@ exports[`components/Notification.js should render itself & its children 1`] = `
</div>
</div>
<div
className="flex justify-center items-center gap-2"
className="flex justify-center items-center gap-2 opacity-0 group-hover:opacity-80 transition-opacity"
>
<button
className="focus:outline-none h-full hover:text-green-500"
Expand Down
4 changes: 2 additions & 2 deletions src/components/__snapshots__/Repository.test.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
exports[`components/Repository.tsx should render itself & its children 1`] = `
[
<div
className="flex py-2 px-3 bg-gray-100 dark:bg-gray-darker dark:text-white"
className="flex py-2 px-3 bg-gray-100 dark:bg-gray-darker dark:text-white group"
>
<div
className="flex flex-1 space-x-3 items-center mt-0 text-sm font-medium overflow-hidden overflow-ellipsis whitespace-nowrap"
Expand All @@ -19,7 +19,7 @@ exports[`components/Repository.tsx should render itself & its children 1`] = `
</span>
</div>
<div
className="flex justify-center items-center gap-2"
className="flex justify-center items-center gap-2 opacity-0 group-hover:opacity-80 transition-opacity"
>
<button
className="focus:outline-none h-full hover:text-green-500"
Expand Down