Change <a> elements to underline on hover (#17898)

Fomantic brings a opinionated style that removed underline on mouse
hover which I think is important UX to have.

This re-enables the underline in the Fomantic config and fixes a few
cases where underline was deemed disruptive.
This commit is contained in:
silverwind 2021-12-17 21:29:00 -08:00 committed by GitHub
parent 8662ff68da
commit 9296baf65a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 27 additions and 29 deletions

View file

@ -31,14 +31,12 @@
</div>
<div class="issue-item-main f1 fc df">
<div class="issue-item-top-row">
<a class="title" href="{{if .HTMLURL}}{{.HTMLURL}}{{else}}{{$.Link}}/{{.Index}}{{end}}">
{{RenderEmoji .Title}}
{{if .IsPull }}
{{if (index $.CommitStatus .PullRequest.ID)}}
{{template "repo/commit_status" (index $.CommitStatus .PullRequest.ID)}}
{{end}}
<a class="title tdn" href="{{if .HTMLURL}}{{.HTMLURL}}{{else}}{{$.Link}}/{{.Index}}{{end}}">{{RenderEmoji .Title}}</a>
{{if .IsPull}}
{{if (index $.CommitStatus .PullRequest.ID)}}
{{template "repo/commit_status" (index $.CommitStatus .PullRequest.ID)}}
{{end}}
</a>
{{end}}
<span class="labels-list ml-2">
{{range .Labels}}
<a class="ui label" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&state={{$.State}}&labels={{.ID}}{{if ne $.listType "milestone"}}&milestone={{$.MilestoneID}}{{end}}&assignee={{$.AssigneeID}}" style="color: {{.ForegroundColor}}; background-color: {{.Color}}" title="{{.Description | RenderEmojiPlain}}">{{.Name | RenderEmoji}}</a>
@ -126,14 +124,14 @@
</div>
<div class="issue-item-icon-right text grey">
{{range .Assignees}}
<a class="ui assignee tooltip" href="{{.HomeLink}}" data-content="{{.GetDisplayName}}" data-position="left center">
<a class="ui assignee tooltip tdn" href="{{.HomeLink}}" data-content="{{.GetDisplayName}}" data-position="left center">
{{avatar .}}
</a>
{{end}}
</div>
<div class="issue-item-icon-right text grey">
{{if .NumComments}}
<a href="{{if .HTMLURL}}{{.HTMLURL}}{{else}}{{$.Link}}/{{.Index}}{{end}}">
<a class="tdn" href="{{if .HTMLURL}}{{.HTMLURL}}{{else}}{{$.Link}}/{{.Index}}{{end}}">
{{svg "octicon-comment" 16 "mr-2"}}{{.NumComments}}
</a>
{{end}}

View file

@ -6,3 +6,4 @@
@useCustomScrollbars: false;
@disabledOpacity: var(--opacity-disabled);
@variationPopupTooltip: false;
@linkHoverUnderline: underline;

View file

@ -37826,7 +37826,7 @@ a {
a:hover {
color: #1e70bf;
text-decoration: none;
text-decoration: underline;
}
/*******************************

View file

@ -236,6 +236,7 @@ a,
.ui.breadcrumb a {
color: var(--color-primary);
cursor: pointer;
text-decoration-skip-ink: all;
}
a.muted {
@ -245,7 +246,19 @@ a.muted {
a:hover,
a.muted:hover,
.ui.breadcrumb a:hover {
color: var(--color-primary-dark-2);
color: var(--color-primary);
}
a.label,
.repository-menu a,
.ui.search .results a,
.ui .menu a,
.issue-keyword a {
text-decoration: none !important;
}
.ui.breadcrumb a:hover {
text-decoration: underline !important;
}
.ui.breadcrumb .divider {

View file

@ -2837,20 +2837,6 @@ tbody.commit-list {
}
}
.commit-summary a {
&:hover {
text-decoration: underline solid;
}
&.default-link {
text-decoration: none;
&:hover {
text-decoration: underline solid;
}
}
}
.commit-list .commit-status-link {
display: inline-block;
vertical-align: middle;
@ -3012,13 +2998,12 @@ td.blob-excerpt {
background-color: #fafafa;
}
.issue-keyword,
.commit-body .issue-keyword:hover {
border-bottom: 1px dotted var(--color-text-light-2);
.issue-keyword {
border-bottom: 1px dotted var(--color-text-light-3) !important;
}
.issue-keyword:hover {
border-bottom: none;
border-bottom: none !important;
}
.file-header {

View file

@ -6,6 +6,7 @@
.ac { align-items: center !important; }
.tc { text-align: center !important; }
.tl { text-align: left !important; }
.tdn { text-decoration: none !important; }
.jc { justify-content: center !important; }
.js { justify-content: flex-start !important; }
.je { justify-content: flex-end !important; }