Skip to content

Commit

Permalink
Remove dashes between organization member avatars on hover (#23034)
Browse files Browse the repository at this point in the history
On the home page of an organization, there are unexpected dashes between
the avatars of the members when hovering over the avatars, as shown in
below:

![hover including title](https://user-images.githubusercontent.com/17645053/220271470-4f49e16f-87eb-4ffa-b38e-23feae1ff92d.png)

![hover without title](https://user-images.githubusercontent.com/17645053/220271512-e4a67685-6b72-4742-a34f-e01ed248c1de.png)

This is because in `fomantic/build/semantic.css` there is a
rule `text-decoration: underline;` when hovering over the `<a>` tag.
Here, the `<a>` tag has width and height because of the avatar image inside,
leading to the unexpected underlines.

This PR overrides the `a:hover` rule so the underline does not exist anymore.

Co-authored-by: delvh <leon@kske.dev>
  • Loading branch information
HesterG and delvh authored Feb 21, 2023
1 parent e7b560f commit 9ebf642
Showing 1 changed file with 4 additions and 0 deletions.
4 changes: 4 additions & 0 deletions web_src/less/_organization.less
Original file line number Diff line number Diff line change
Expand Up @@ -93,6 +93,10 @@
&.teams,
&.profile {
.members {
a:hover {
text-decoration: none;
}

.ui.avatar {
width: 48px;
height: 48px;
Expand Down

0 comments on commit 9ebf642

Please sign in to comment.