Skip to content

Even more repo rework #15005

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

Closed
wants to merge 39 commits into from
Closed
Show file tree
Hide file tree
Changes from 3 commits
Commits
Show all changes
39 commits
Select commit Hold shift + click to select a range
64e7404
Various mobile reworks for repo pages
CL-Jeremy Mar 16, 2021
04aa913
Merge branch 'master' into mobile-repo-rework
CL-Jeremy Mar 16, 2021
80f5df0
Fix stylelint (whitespaces)
CL-Jeremy Mar 16, 2021
a57ad3b
Fix SHA badge with avatar
CL-Jeremy Mar 16, 2021
7828478
Fix Safari quirks
CL-Jeremy Mar 16, 2021
ddd682b
Fix issues on commit list page
CL-Jeremy Mar 16, 2021
74c9c4e
Actually fix the issue; replace icon
CL-Jeremy Mar 16, 2021
53f423e
Hide avatar on mobile portrait
CL-Jeremy Mar 16, 2021
a8e2c1b
Adapt flexbox logic for repo file list header
CL-Jeremy Mar 16, 2021
e4bd476
Make more progress
CL-Jeremy Mar 17, 2021
d906f8d
Fix SHA label alignment for inline environment
CL-Jeremy Mar 17, 2021
369de45
Complete rework of SHA label-related stuff
CL-Jeremy Mar 18, 2021
e157b18
Restore original aesthetics of Git graph
CL-Jeremy Mar 18, 2021
a214a2a
More alignment and overflow fixes
CL-Jeremy Mar 18, 2021
6696e22
Just use flex in flex (Git graph page)
CL-Jeremy Mar 19, 2021
273844b
Commit list header: wrap long commit SHA when needed
CL-Jeremy Mar 19, 2021
2ea73dd
Use mono class for sha label; fix timeline
CL-Jeremy Mar 19, 2021
37babb5
Fix topic multiple dropdown label alignment
CL-Jeremy Mar 20, 2021
26faaea
Reposition snippet to to avoid generalization
CL-Jeremy Mar 20, 2021
abf804e
Rework SHA labels once more and add comments
CL-Jeremy Mar 20, 2021
4738cab
Add color for unverified signed SHA label
CL-Jeremy Mar 20, 2021
238b2c7
Make multiselect dropdown label icon override global
CL-Jeremy Mar 20, 2021
e35f158
Timeline event avatar: disable nested selectors
CL-Jeremy Mar 20, 2021
43633cc
Fix repo file list header commit message overflow
CL-Jeremy Mar 21, 2021
9ab3cd8
Explicit height for SHA label; colors in variables
CL-Jeremy Mar 22, 2021
1c297f4
Merge branch 'master' into mobile-repo-rework
CL-Jeremy Mar 22, 2021
d8f78bc
Move out SVG class matching regex
CL-Jeremy Mar 22, 2021
80e48fd
JS syntax for topic dropdown
CL-Jeremy Mar 22, 2021
59a2fdf
Add fomantic override colors for dropdown etc.
CL-Jeremy Mar 22, 2021
42302eb
Re-adjust dynamic column widths for repo file list
CL-Jeremy Apr 4, 2021
db83962
Fix various margins (depends on #14704)
CL-Jeremy Apr 5, 2021
00d5dbd
More SHA label alignment tweaks
CL-Jeremy Apr 5, 2021
91f5d80
Use flexbox for commit info segment
CL-Jeremy Apr 5, 2021
34ffae5
User spans with margin instead of  
CL-Jeremy Apr 6, 2021
31ab7f0
Merge branch 'master' into mobile-repo-rework
CL-Jeremy Apr 6, 2021
b886f89
Finish forgotten WIP on commit page SHA label
CL-Jeremy Apr 6, 2021
0a40ced
Fix selector leaking to branch selector
CL-Jeremy Apr 7, 2021
46c81ef
Fix octicon helper class for .ui.tiny
CL-Jeremy Apr 7, 2021
386e815
Fix missing quote in HTML tag
CL-Jeremy Apr 9, 2021
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
3 changes: 2 additions & 1 deletion modules/templates/helper.go
Original file line number Diff line number Diff line change
Expand Up @@ -555,7 +555,8 @@ func SVG(icon string, others ...interface{}) template.HTML {
svgStr = heightRe.ReplaceAllString(svgStr, fmt.Sprintf(`height="%d"`, size))
}
if class != "" {
svgStr = strings.Replace(svgStr, `class="`, fmt.Sprintf(`class="%s `, class), 1)
matches := regexp.MustCompile(`class="(.*?)"`).FindStringSubmatch(svgStr)
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is personal taste: I don't want to have <svg> elements generated by svg.js and helper.go to have different order of class names. I originally planned to deduplicate the class names (like in svg.js) but that would add unnecessary costs with no added benefit.

Copy link
Member

@silverwind silverwind Mar 21, 2021

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You should move regexp.MustCompile out of the function to not compile the regex every function call.

svgStr = strings.Replace(svgStr, matches[0], fmt.Sprintf(`class="%s %s"`, matches[1], class), 1)
}
return template.HTML(svgStr)
}
Expand Down
8 changes: 4 additions & 4 deletions templates/repo/branch/list.tmpl
Original file line number Diff line number Diff line change
Expand Up @@ -9,10 +9,10 @@
</h4>

<div class="ui attached table segment">
<table class="ui very basic striped fixed table single line">
<table class="ui very basic striped fixed table single line unstackable table">
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

There are two tables now.

<tbody>
<tr>
<td>
<td class="six wide">
{{range .Branches}}
{{if eq .Name $.DefaultBranch}}
{{if .IsProtected}}
Expand All @@ -23,7 +23,7 @@
{{end}}
{{end}}
</td>
<td class="right aligned overflow-visible">
<td class="two wide right aligned overflow-visible">
<div class="ui basic jump dropdown icon button poping up" data-content="{{$.i18n.Tr "repo.branch.download" ($.DefaultBranch)}}" data-variation="tiny inverted" data-position="top right">
<i class="download icon"></i>
<div class="menu">
Expand All @@ -42,7 +42,7 @@
{{.i18n.Tr "repo.branches"}}
</h4>
<div class="ui attached table segment">
<table class="ui very basic striped fixed table single line">
<table class="ui very basic striped fixed single line unstackable table">
<tbody>
{{range .Branches}}
{{if ne .Name $.DefaultBranch}}
Expand Down
2 changes: 1 addition & 1 deletion templates/repo/commits.tmpl
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
{{template "repo/header" .}}
<div class="ui container">
{{template "repo/sub_menu" .}}
<div class="ui secondary stackable menu mobile--margin-between-items">
<div class="ui secondary menu flex-wrappable fw">
{{template "repo/branch_dropdown" .}}
<div class="fitted item">
<a href="{{.RepoLink}}/graph" class="ui basic small compact button">
Expand Down
6 changes: 3 additions & 3 deletions templates/repo/commits_list.tmpl
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
<div class="ui attached table segment">
<table class="ui very basic striped fixed table single line" id="commits-table">
<table class="ui very basic striped fixed single line unstackable table" id="commits-table">
<thead>
<tr>
<th class="four wide">{{.i18n.Tr "repo.commits.author"}}</th>
<th class="two wide sha">SHA1</th>
<th class="seven wide message">{{.i18n.Tr "repo.commits.message"}}</th>
<th class="three wide right aligned">{{.i18n.Tr "repo.commits.date"}}</th>
<th class="three wide text right age">{{.i18n.Tr "repo.commits.date"}}</th>
</tr>
</thead>
<tbody class="commit-list">
Expand Down Expand Up @@ -76,7 +76,7 @@
<pre class="commit-body" style="display: none;">{{RenderCommitBody .Message $.RepoLink $.Repository.ComposeMetas}}</pre>
{{end}}
</td>
<td class="text right aligned">{{TimeSince .Author.When $.Lang}}</td>
<td class="text right age">{{TimeSince .Author.When $.Lang}}</td>
</tr>
{{end}}
</tbody>
Expand Down
17 changes: 9 additions & 8 deletions templates/repo/commits_table.tmpl
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<h4 class="ui top attached header commits-table df ac sb">
<h4 class="ui top attached header commits-table df sb">
<div class="commits-table-left df ac">
{{if or .PageIsCommits (gt .CommitCount 0)}}
{{.CommitCount}} {{.i18n.Tr "repo.commits.commits"}} {{if .Branch}}({{.Branch}}){{end}}
Expand All @@ -8,16 +8,17 @@
</div>
<div class="commits-table-right df ac">
{{if .PageIsCommits}}
<form class="ignore-dirty" action="{{.RepoLink}}/commits/{{.BranchNameSubURL | EscapePound}}/search">
<div class="ui tiny search input">
<form class="ignore-dirty df fw ac f1" action="{{.RepoLink}}/commits/{{.BranchNameSubURL | EscapePound}}/search">
<div class="ui tiny search input f1">
<input name="q" placeholder="{{.i18n.Tr "repo.commits.search"}}" value="{{.Keyword}}" autofocus>
</div>
&nbsp;
<div class="ui checkbox">
<input type="checkbox" name="all" id="all" value="true" {{.All}}>
<label for="all">{{.i18n.Tr "repo.commits.search_all"}} &nbsp;&nbsp;</label>
<div class="df ac je">
<div class="ui checkbox ml-4">
<input type="checkbox" name="all" id="all" value="true" {{.All}}>
<label for="all">{{.i18n.Tr "repo.commits.search_all"}}</label>
</div>
<button class="ui primary tiny button ml-4 mr-0 poping up" data-panel="#add-deploy-key-panel" data-content={{.i18n.Tr "repo.commits.search.tooltip"}}>{{.i18n.Tr "repo.commits.find"}}</button>
</div>
<button class="ui primary tiny button mr-0 poping up" data-panel="#add-deploy-key-panel" data-content={{.i18n.Tr "repo.commits.search.tooltip"}}>{{.i18n.Tr "repo.commits.find"}}</button>
</form>
{{else if .IsDiffCompare}}
<a href="{{$.CommitRepoLink}}/commit/{{.BeforeCommitID}}" class="ui green sha label">{{if not .BaseIsCommit}}{{if .BaseIsBranch}}{{svg "octicon-git-branch"}}{{else if .BaseIsTag}}{{svg "octicon-tag"}}{{end}}{{.BaseBranch}}{{else}}{{ShortSha .BaseBranch}}{{end}}</a>
Expand Down
74 changes: 37 additions & 37 deletions templates/repo/home.tmpl
Original file line number Diff line number Diff line change
Expand Up @@ -3,13 +3,36 @@
{{template "repo/header" .}}
<div class="ui container {{if .IsBlame}}fluid padded{{end}}">
{{template "base/alert" .}}
<div class="ui repo-description">
<div id="repo-desc">
{{if .Repository.DescriptionHTML}}<span class="description">{{.Repository.DescriptionHTML}}</span>{{else if .IsRepositoryAdmin}}<span class="no-description text-italic">{{.i18n.Tr "repo.no_desc"}}</span>{{end}}
<a class="link" href="{{.Repository.Website}}">{{.Repository.Website}}</a>
<div class="ui stackable secondary menu repo-description mb-0">
<div class="fitted item repo-desc-wrapper">
<div id="repo-desc">
{{if .Repository.DescriptionHTML}}<span class="description">{{.Repository.DescriptionHTML}}</span>{{else if .IsRepositoryAdmin}}<span class="no-description text-italic">{{.i18n.Tr "repo.no_desc"}}</span>{{end}}
<a class="link" href="{{.Repository.Website}}">{{.Repository.Website}}</a>
</div>
<div id="repo-topics">
{{range .Topics}}<a class="ui repo-topic large label topic" href="{{AppSubUrl}}/explore/repos?q={{.Name}}&topic=1">{{.Name}}</a>{{end}}
{{if and .Permission.IsAdmin (not .Repository.IsArchived)}}<a id="manage_topic" class="muted">{{.i18n.Tr "repo.topic.manage_topics"}}</a>{{end}}
</div>
{{if and .Permission.IsAdmin (not .Repository.IsArchived)}}
<div class="ui repo-topic-edit form" id="topic_edit" style="display:none">
<div class="field">
<div class="ui action input">
<div class="ui fluid multiple search selection dropdown pr-3">
<input type="hidden" name="topics" value="{{range $i, $v := .Topics}}{{.Name}}{{if lt (Add $i 1) (len $.Topics)}},{{end}}{{end}}">
{{- range .Topics -}}
<a class="ui small label topic transition visible" data-value="{{.Name}}" style="display: inline-block !important;">{{.Name}}{{svg "octicon-x" 16 "delete icon"}}</a>
{{- end -}}
<div class="text"></div>
</div>
<a class="ui button primary" href="javascript:;" id="save_topic" data-link="{{.RepoLink}}/topics">{{.i18n.Tr "repo.topic.done"}}</a>
Copy link
Member

@silverwind silverwind Mar 21, 2021

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can this ugly href be removed while you're here?

</div>
</div>
</div>
{{end}}
<div class="mb-3"></div>
</div>
{{if .RepoSearchEnabled}}
<div class="ui repo-search">
<div class="fitted item mb-4" id="repo-search">
<form class="ui form ignore-dirty" action="{{.RepoLink}}/search" method="get">
<div class="field">
<div class="ui action input">
Expand All @@ -23,29 +46,6 @@
</div>
{{end}}
</div>
<div class="mt-3" id="repo-topics">
{{range .Topics}}<a class="ui repo-topic large label topic" href="{{AppSubUrl}}/explore/repos?q={{.Name}}&topic=1">{{.Name}}</a>{{end}}
{{if and .Permission.IsAdmin (not .Repository.IsArchived)}}<a id="manage_topic" class="muted">{{.i18n.Tr "repo.topic.manage_topics"}}</a>{{end}}
</div>
{{if and .Permission.IsAdmin (not .Repository.IsArchived)}}
<div class="ui repo-topic-edit grid form" id="topic_edit" style="display:none">
<div class="fourteen wide column">
<div class="field">
<div class="ui fluid multiple search selection dropdown">
<input type="hidden" name="topics" value="{{range $i, $v := .Topics}}{{.Name}}{{if lt (Add $i 1) (len $.Topics)}},{{end}}{{end}}">
{{range .Topics}}
<div class="ui small label topic transition visible" data-value="{{.Name}}" style="display: inline-block !important; cursor: default;">{{.Name}}{{svg "octicon-x" 16 "delete icon ml-3 mt-1"}}</div>
{{end}}
<div class="text"></div>
</div>
</div>
</div>
<div class="two wide column">
<a class="ui button primary" href="javascript:;" id="save_topic"
data-link="{{.RepoLink}}/topics">{{.i18n.Tr "repo.topic.done"}}</a>
</div>
</div>
{{end}}
<div class="hide" id="validate_prompt">
<span id="count_prompt">{{.i18n.Tr "repo.topic.count_prompt"}}</span>
<span id="format_prompt">{{.i18n.Tr "repo.topic.format_prompt"}}</span>
Expand All @@ -56,14 +56,14 @@
</div>
{{end}}
{{template "repo/sub_menu" .}}
<div class="ui stackable secondary menu mobile--margin-between-items mobile--no-negative-margins">
<div class="ui secondary menu flex-wrappable fw">
{{template "repo/branch_dropdown" .}}
{{ $n := len .TreeNames}}
{{ $l := Subtract $n 1}}
<!-- If home page, show new PR. If not, show breadcrumb -->
{{if eq $n 0}}
{{if and .CanCompareOrPull .IsViewBranch (not .Repository.IsArchived)}}
<div class="fitted item mx-0">
<div class="fitted item">
<a href="{{.BaseRepo.Link}}/compare/{{.BaseRepo.DefaultBranch | EscapePound}}...{{if ne .Repository.Owner.Name .BaseRepo.Owner.Name}}{{.Repository.Owner.Name}}{{if .BaseRepo.IsFork}}/{{.Repository.Name}}{{end}}:{{end}}{{.BranchName | EscapePound}}">
<button id="new-pull-request" class="ui compact basic button">{{if .PullRequestCtx.Allowed}}{{.i18n.Tr "repo.pulls.compare_changes"}}{{else}}{{.i18n.Tr "action.compare_branch"}}{{end}}</button>
</a>
Expand All @@ -72,7 +72,7 @@
{{else}}
<div class="fitted item"><span class="ui breadcrumb repo-path"><a class="section" href="{{.RepoLink}}/src/{{EscapePound .BranchNameSubURL}}" title="{{.Repository.Name}}">{{EllipsisString .Repository.Name 30}}</a>{{range $i, $v := .TreeNames}}<span class="divider">/</span>{{if eq $i $l}}<span class="active section" title="{{$v}}">{{EllipsisString $v 30}}</span>{{else}}{{ $p := index $.Paths $i}}<span class="section"><a href="{{EscapePound $.BranchLink}}/{{EscapePound $p}}" title="{{$v}}">{{EllipsisString $v 30}}</a></span>{{end}}{{end}}</span></div>
{{end}}
<div class="right fitted item mr-0" id="file-buttons">
<div class="right fitted item" id="file-buttons">
<div class="ui tiny primary buttons">
{{if .Repository.CanEnableEditor}}
{{if .CanAddFile}}
Expand All @@ -94,18 +94,18 @@
</div>

</div>
<div class="fitted item">
{{if eq $n 0}}
{{if .Repository.IsTemplate}}
{{if eq $n 0}}
{{if .Repository.IsTemplate}}
<div class="fitted item">
<div class="ui tiny blue buttons">
<a href="{{AppSubUrl}}/repo/create?template_id={{.Repository.ID}}" class="ui button">
{{.i18n.Tr "repo.use_template"}}
</a>
</div>
{{end}}
</div>
{{end}}
</div>
<div class="fitted item">
{{end}}
<div class="right fitted item">
<!-- Only show clone panel in repository home page -->
{{if eq $n 0}}
<div class="ui action tiny input" id="clone-panel">
Expand Down
8 changes: 4 additions & 4 deletions templates/repo/shabox_badge.tmpl
Original file line number Diff line number Diff line change
@@ -1,15 +1,15 @@
<div class="ui detail icon button">
<div class="ui detail icon mini button">
{{if .verification.Verified}}
<div title="{{if eq .verification.TrustStatus "trusted"}}{{else if eq .verification.TrustStatus "untrusted"}}{{$.root.i18n.Tr "repo.commits.signed_by_untrusted_user"}}: {{else}}{{$.root.i18n.Tr "repo.commits.signed_by_untrusted_user_unmatched"}}: {{end}}{{.verification.Reason}}">
{{if ne .verification.SigningUser.ID 0}}
{{svg "gitea-lock"}}
{{svg "gitea-lock" 12}}
{{avatar .verification.SigningUser 28 "signature"}}
{{else}}
<span title="{{$.root.i18n.Tr "gpg.default_key"}}">{{svg "gitea-lock-cog"}}</span>
<span title="{{$.root.i18n.Tr "gpg.default_key"}}">{{svg "gitea-lock-cog" 12}}</span>
{{avatarByEmail .verification.SigningEmail "" 28 "signature"}}
{{end}}
</div>
{{else}}
<span title="{{$.root.i18n.Tr .verification.Reason}}">{{svg "gitea-unlock"}}</span>
<span title="{{$.root.i18n.Tr .verification.Reason}}">{{svg "gitea-unlock" 12}}</span>
{{end}}
</div>
2 changes: 1 addition & 1 deletion templates/repo/sub_menu.tmpl
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<div class="ui segments repository-summary{{if and (.Permission.CanRead $.UnitTypeCode) (not .IsEmptyRepo) .LanguageStats }} repository-summary-language-stats{{end}} mt-3">
<div class="ui segments repository-summary{{if and (.Permission.CanRead $.UnitTypeCode) (not .IsEmptyRepo) .LanguageStats }} repository-summary-language-stats{{end}} mt-0">
<div class="ui segment sub-menu repository-menu">
<div class="ui two horizontal center link list">
{{if and (.Permission.CanRead $.UnitTypeCode) (not .IsEmptyRepo)}}
Expand Down
52 changes: 27 additions & 25 deletions templates/repo/view_list.tmpl
Original file line number Diff line number Diff line change
@@ -1,34 +1,36 @@
<table id="repo-files-table" class="ui single line table">
<table id="repo-files-table" class="ui single line unstackable table mt-0">
<thead>
<tr class="commit-list">
<th colspan="2">
{{if .LatestCommitUser}}
{{avatar .LatestCommitUser 24}}
{{if .LatestCommitUser.FullName}}
<a href="{{AppSubUrl}}/{{.LatestCommitUser.Name}}"><strong>{{.LatestCommitUser.FullName}}</strong></a>
<div class="df ac">
{{if .LatestCommitUser}}
{{avatar .LatestCommitUser 28 "mr-3"}}
{{if .LatestCommitUser.FullName}}
<a href="{{AppSubUrl}}/{{.LatestCommitUser.Name}}"><strong>{{.LatestCommitUser.FullName}}</strong></a>
{{else}}
<a href="{{AppSubUrl}}/{{.LatestCommitUser.Name}}"><strong>{{if .LatestCommit.Author}}{{.LatestCommit.Author.Name}}{{else}}{{.LatestCommitUser.Name}}{{end}}</strong></a>
{{end}}
{{else}}
<a href="{{AppSubUrl}}/{{.LatestCommitUser.Name}}"><strong>{{if .LatestCommit.Author}}{{.LatestCommit.Author.Name}}{{else}}{{.LatestCommitUser.Name}}{{end}}</strong></a>
{{end}}
{{else}}
{{if .LatestCommit.Author}}
{{avatarByEmail .LatestCommit.Author.Email .LatestCommit.Author.Name 24}}
<strong>{{.LatestCommit.Author.Name}}</strong>
{{if .LatestCommit.Author}}
{{avatarByEmail .LatestCommit.Author.Email .LatestCommit.Author.Name 28}}
<strong>{{.LatestCommit.Author.Name}}</strong>
{{end}}
{{end}}
{{end}}
<a rel="nofollow" class="ui sha label {{if .LatestCommit.Signature}} isSigned {{if .LatestCommitVerification.Verified }} isVerified{{if eq .LatestCommitVerification.TrustStatus "trusted"}}{{else if eq .LatestCommitVerification.TrustStatus "untrusted"}}Untrusted{{else}}Unmatched{{end}}{{else if .LatestCommitVerification.Warning}} isWarning{{end}}{{end}}" href="{{.RepoLink}}/commit/{{.LatestCommit.ID}}">
<span class="shortsha">{{ShortSha .LatestCommit.ID.String}}</span>
{{if .LatestCommit.Signature}}
{{template "repo/shabox_badge" dict "root" $ "verification" .LatestCommitVerification}}
<a rel="nofollow" class="ui sha label ml-3 mr-0{{if .LatestCommit.Signature}} isSigned {{if .LatestCommitVerification.Verified }} isVerified{{if eq .LatestCommitVerification.TrustStatus "trusted"}}{{else if eq .LatestCommitVerification.TrustStatus "untrusted"}}Untrusted{{else}}Unmatched{{end}}{{else if .LatestCommitVerification.Warning}} isWarning{{end}}{{end}}" href="{{.RepoLink}}/commit/{{.LatestCommit.ID}}">
<span class="shortsha">{{ShortSha .LatestCommit.ID.String}}</span>
{{if .LatestCommit.Signature}}
{{template "repo/shabox_badge" dict "root" $ "verification" .LatestCommitVerification}}
{{end}}
</a>
{{template "repo/commit_statuses" dict "Status" .LatestCommitStatus "Statuses" .LatestCommitStatuses "root" $}}
{{ $commitLink:= printf "%s/commit/%s" .RepoLink .LatestCommit.ID }}
<span class="grey commit-summary f1 ml-3" title="{{.LatestCommit.Summary}}"><span class="message-wrapper">{{RenderCommitMessageLinkSubject .LatestCommit.Message $.RepoLink $commitLink $.Repository.ComposeMetas}}</span>
{{if IsMultilineCommitMessage .LatestCommit.Message}}
<button class="basic compact mini ui icon button commit-button"><i class="ellipsis horizontal icon"></i></button>
<pre class="commit-body" style="display: none;">{{RenderCommitBody .LatestCommit.Message $.RepoLink $.Repository.ComposeMetas}}</pre>
{{end}}
</a>
{{template "repo/commit_statuses" dict "Status" .LatestCommitStatus "Statuses" .LatestCommitStatuses "root" $}}
{{ $commitLink:= printf "%s/commit/%s" .RepoLink .LatestCommit.ID }}
<span class="grey commit-summary" title="{{.LatestCommit.Summary}}"><span class="message-wrapper">{{RenderCommitMessageLinkSubject .LatestCommit.Message $.RepoLink $commitLink $.Repository.ComposeMetas}}</span>
{{if IsMultilineCommitMessage .LatestCommit.Message}}
<button class="basic compact mini ui icon button commit-button"><i class="ellipsis horizontal icon"></i></button>
<pre class="commit-body" style="display: none;">{{RenderCommitBody .LatestCommit.Message $.RepoLink $.Repository.ComposeMetas}}</pre>
{{end}}
</span>
</span>
</div>
</th>
<th class="text grey right age">{{if .LatestCommit.Author}}{{TimeSince .LatestCommit.Author.When $.Lang}}{{end}}</th>
</tr>
Expand Down
12 changes: 10 additions & 2 deletions web_src/js/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -3562,8 +3562,11 @@ function initTopicbar() {
blue: true,
basic: true,
},
templates: {
label: (_, text, preserveHTML, __) => $.fn.dropdown.settings.templates.escape(text, preserveHTML) + svg('octicon-x', 16, 'delete icon'),
},
className: {
label: 'ui small label'
label: 'ui small label topic'
},
apiSettings: {
url: `${AppSubUrl}/api/v1/topics/search?q={query}`,
Expand Down Expand Up @@ -3630,7 +3633,12 @@ function initTopicbar() {
if (!status) {
topics.last().removeClass('green').addClass('red');
}
return status && topicDropdown.children('a.ui.label.red').length === 0;
if (topicDropdown.children('a.ui.label.red').length > 0) {
saveBtn.removeClass('primary').addClass('grey').addClass('disabled');
} else {
saveBtn.addClass('primary').removeClass('grey').removeClass('disabled');
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
saveBtn.removeClass('primary').addClass('grey').addClass('disabled');
} else {
saveBtn.addClass('primary').removeClass('grey').removeClass('disabled');
saveBtn.removeClass('primary').addClass(['grey', 'disabled']);
} else {
saveBtn.addClass('primary').removeClass(['grey', 'disabled']);

}
return status && !saveBtn.hasClass('disabled');
};

topicForm.form({
Expand Down
2 changes: 2 additions & 0 deletions web_src/js/svg.js
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ import octiconProject from '../../public/img/svg/octicon-project.svg';
import octiconRepo from '../../public/img/svg/octicon-repo.svg';
import octiconRepoForked from '../../public/img/svg/octicon-repo-forked.svg';
import octiconRepoTemplate from '../../public/img/svg/octicon-repo-template.svg';
import octiconX from '../../public/img/svg/octicon-x.svg';

export const svgs = {
'octicon-chevron-down': octiconChevronDown,
Expand All @@ -28,6 +29,7 @@ export const svgs = {
'octicon-repo': octiconRepo,
'octicon-repo-forked': octiconRepoForked,
'octicon-repo-template': octiconRepoTemplate,
'octicon-x': octiconX,
};

const parser = new DOMParser();
Expand Down
17 changes: 17 additions & 0 deletions web_src/less/_base.less
Original file line number Diff line number Diff line change
Expand Up @@ -1390,6 +1390,23 @@ i.icon.centerlock {
color: var(--color-text-light);
}

.ui.active.label {
background: var(--color-secondary);
border-color: var(--color-secondary);
color: var(--color-text-dark);
}

.ui.active.label:hover,
a.ui.active.label:hover {
background: var(--color-secondary-dark-1);
color: var(--color-text-dark);
}

.ui.form .field.error .ui.multiple.selection.dropdown > .red.label {
color: #e7b6b6 !important;
background: #871717 !important;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Should use some vars here.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I invented these colors as I said in OP. I meant exactly this by "formalizing" - they have to fit into some scheme. I'd rather not use extra long names for this single use instance. I just didn't spot on cases where these colors could be shared... yet. Any suggestions?

Copy link
Member

@silverwind silverwind Mar 21, 2021

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Maybe --color-error-text and --color-error-bg. My point is that we want all colors the live in vars at :root so they can be easily altered for theming. Also, please add them in the :root section of arc-green.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

That would mean we'd better go deeper and override more stuff from Fomantic UI, which was not the main goal of this PR. Of course, since we are on it, I'll see what I can do. I mean to put all colors used in Semantic Dropdown into _base.less where I could basically just switch colors for the highlighted label (the invented colors are generated with a color picker by modifying the HSL values - I just happened to have come up with something so close to switching around the foreground and background colors - you could suggest better ones).

}

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can we maybe not use nested syntax to override fomantic? I prefer plain selectors in this case because it's easiert to search exact selector strings in fomantic source and just copy from there. Nested syntax would break this searching.

.ui.labels a.label:hover,
a.ui.label:hover {
background: var(--color-hover);
Expand Down
1 change: 1 addition & 0 deletions web_src/less/_explore.less
Original file line number Diff line number Diff line change
Expand Up @@ -40,6 +40,7 @@
}

.ui.tags {
margin-top: -.5rem;
margin-bottom: .5rem;
}
}
Expand Down
Loading