diff options
author | silverwind <me@silverwind.io> | 2020-11-29 16:52:11 +0100 |
---|---|---|
committer | GitHub <noreply@github.com> | 2020-11-29 17:52:11 +0200 |
commit | 295fc99607915d85141fd16099d2d9f59a7ee977 (patch) | |
tree | 89eec5bc2e3fbdd28be4fa63065d2022894dc7f1 | |
parent | e00a3554279d314a4dab4ce11bdd86707201d0d2 (diff) | |
download | gitea-295fc99607915d85141fd16099d2d9f59a7ee977.tar.gz gitea-295fc99607915d85141fd16099d2d9f59a7ee977.zip |
Markdown and Repo header tweaks (#13744)
* Markdown and Repo header tweaks
- Use CSS vars for all markdown colors
- Tweak repo header, removing double borders and adjust sizes
- Use menu instead of buttons for issue open/close switcher
- Add emoji inversion for select emoji glyphs in arc-green
- Use border over box-shadow for all buttons
- Add spacing element to login form without openid
* repo settings navbar fix
* use shared template in more places and adjust dashboard
* fix remaining open/close combos
-rw-r--r-- | templates/repo/branch_dropdown.tmpl | 2 | ||||
-rw-r--r-- | templates/repo/home.tmpl | 6 | ||||
-rw-r--r-- | templates/repo/issue/list.tmpl | 22 | ||||
-rw-r--r-- | templates/repo/issue/milestone_issues.tmpl | 22 | ||||
-rw-r--r-- | templates/repo/issue/milestones.tmpl | 10 | ||||
-rw-r--r-- | templates/repo/issue/openclose.tmpl | 10 | ||||
-rw-r--r-- | templates/repo/projects/list.tmpl | 6 | ||||
-rw-r--r-- | templates/repo/settings/navbar.tmpl | 2 | ||||
-rw-r--r-- | templates/shared/issuelist.tmpl | 9 | ||||
-rw-r--r-- | templates/user/auth/signin_navbar.tmpl | 2 | ||||
-rw-r--r-- | templates/user/dashboard/issues.tmpl | 10 | ||||
-rw-r--r-- | templates/user/dashboard/milestones.tmpl | 10 | ||||
-rw-r--r-- | web_src/less/_base.less | 33 | ||||
-rw-r--r-- | web_src/less/_markdown.less | 38 | ||||
-rw-r--r-- | web_src/less/_repository.less | 12 | ||||
-rw-r--r-- | web_src/less/themes/theme-arc-green.less | 83 |
16 files changed, 129 insertions, 148 deletions
diff --git a/templates/repo/branch_dropdown.tmpl b/templates/repo/branch_dropdown.tmpl index a7eafa3874..81229c0ef5 100644 --- a/templates/repo/branch_dropdown.tmpl +++ b/templates/repo/branch_dropdown.tmpl @@ -1,4 +1,4 @@ -<div class="fitted item choose reference"> +<div class="fitted item choose reference mr-1"> <div class="ui floating filter dropdown custom" data-can-create-branch="{{.CanCreateBranch}}" data-no-results="{{.i18n.Tr "repo.pulls.no_results"}}"> <div class="ui basic small compact button" @click="menuVisible = !menuVisible" @keyup.enter="menuVisible = !menuVisible"> <span class="text"> diff --git a/templates/repo/home.tmpl b/templates/repo/home.tmpl index 98c5aa5738..0922bd7387 100644 --- a/templates/repo/home.tmpl +++ b/templates/repo/home.tmpl @@ -63,7 +63,7 @@ <!-- 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"> + <div class="fitted item mx-0"> <a href="{{.BaseRepo.Link}}/compare/{{.BaseRepo.DefaultBranch | EscapePound}}...{{if ne .Repository.Owner.Name .BaseRepo.Owner.Name}}{{.Repository.Owner.Name}}:{{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> @@ -72,8 +72,8 @@ {{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" id="file-buttons"> - <div class="ui tiny blue buttons"> + <div class="right fitted item mr-0" id="file-buttons"> + <div class="ui tiny primary buttons"> {{if .Repository.CanEnableEditor}} {{if .CanAddFile}} <a href="{{.RepoLink}}/_new/{{EscapePound .BranchName}}/{{EscapePound .TreePath}}" class="ui button"> diff --git a/templates/repo/issue/list.tmpl b/templates/repo/issue/list.tmpl index 49adcd08bf..95aea0c13b 100644 --- a/templates/repo/issue/list.tmpl +++ b/templates/repo/issue/list.tmpl @@ -28,16 +28,7 @@ <div class="ui divider"></div> <div id="issue-filters" class="ui stackable grid"> <div class="six wide column"> - <div class="ui tiny basic status buttons"> - <a class="ui {{if not .IsShowClosed}}green active{{end}} basic button" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort={{$.SortType}}&state=open&labels={{.SelectLabels}}&milestone={{.MilestoneID}}&assignee={{.AssigneeID}}"> - {{svg "octicon-issue-opened"}} - {{.i18n.Tr "repo.issues.open_tab" .IssueStats.OpenCount}} - </a> - <a class="ui {{if .IsShowClosed}}red active{{end}} basic button" href="{{$.Link}}?q={{$.Keyword}}&type={{.ViewType}}&sort={{$.SortType}}&state=closed&labels={{.SelectLabels}}&milestone={{.MilestoneID}}&assignee={{.AssigneeID}}"> - {{svg "octicon-issue-closed"}} - {{.i18n.Tr "repo.issues.close_tab" .IssueStats.ClosedCount}} - </a> - </div> + {{template "repo/issue/openclose" .}} </div> <div class="ten wide right aligned column"> <div class="ui secondary filter stackable menu labels"> @@ -122,16 +113,7 @@ </div> <div id="issue-actions" class="ui stackable grid hide"> <div class="six wide column"> - <div class="ui tiny basic status buttons"> - <a class="ui {{if not .IsShowClosed}}green active{{end}} basic button" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort={{$.SortType}}&state=open&labels={{.SelectLabels}}&milestone={{.MilestoneID}}&assignee={{.AssigneeID}}"> - {{svg "octicon-issue-opened"}} - {{.i18n.Tr "repo.issues.open_tab" .IssueStats.OpenCount}} - </a> - <a class="ui {{if .IsShowClosed}}red active{{end}} basic button" href="{{$.Link}}?q={{$.Keyword}}&type={{.ViewType}}&sort={{$.SortType}}&state=closed&labels={{.SelectLabels}}&milestone={{.MilestoneID}}&assignee={{.AssigneeID}}"> - {{svg "octicon-issue-closed"}} - {{.i18n.Tr "repo.issues.close_tab" .IssueStats.ClosedCount}} - </a> - </div> + {{template "repo/issue/openclose" .}} </div> {{/* Ten wide does not cope well and makes the columns stack. This seems to be related to jQuery's hide/show: in fact, switching diff --git a/templates/repo/issue/milestone_issues.tmpl b/templates/repo/issue/milestone_issues.tmpl index 5794ac422f..a78b20893f 100644 --- a/templates/repo/issue/milestone_issues.tmpl +++ b/templates/repo/issue/milestone_issues.tmpl @@ -40,16 +40,7 @@ <div class="ui divider"></div> <div id="issue-filters" class="ui stackable grid"> <div class="six wide column"> - <div class="ui tiny basic status buttons"> - <a class="ui {{if not .IsShowClosed}}green active{{end}} basic button" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort={{$.SortType}}&state=open&labels={{.SelectLabels}}&assignee={{.AssigneeID}}"> - {{svg "octicon-issue-opened"}} - {{.i18n.Tr "repo.issues.open_tab" .IssueStats.OpenCount}} - </a> - <a class="ui {{if .IsShowClosed}}red active{{end}} basic button" href="{{$.Link}}?q={{$.Keyword}}&type={{.ViewType}}&sort={{$.SortType}}&state=closed&labels={{.SelectLabels}}&assignee={{.AssigneeID}}"> - {{svg "octicon-issue-closed"}} - {{.i18n.Tr "repo.issues.close_tab" .IssueStats.ClosedCount}} - </a> - </div> + {{template "repo/issue/openclose" .}} </div> <div class="ten wide right aligned column"> <div class="ui secondary filter stackable menu labels"> @@ -118,16 +109,7 @@ </div> <div id="issue-actions" class="ui stackable grid hide"> <div class="six wide column"> - <div class="ui tiny basic status buttons"> - <a class="ui {{if not .IsShowClosed}}green active{{end}} basic button" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort={{$.SortType}}&state=open&labels={{.SelectLabels}}&assignee={{.AssigneeID}}"> - {{svg "octicon-issue-opened"}} - {{.i18n.Tr "repo.issues.open_tab" .IssueStats.OpenCount}} - </a> - <a class="ui {{if .IsShowClosed}}red active{{end}} basic button" href="{{$.Link}}?q={{$.Keyword}}&type={{.ViewType}}&sort={{$.SortType}}&state=closed&labels={{.SelectLabels}}&assignee={{.AssigneeID}}"> - {{svg "octicon-issue-closed"}} - {{.i18n.Tr "repo.issues.close_tab" .IssueStats.ClosedCount}} - </a> - </div> + {{template "repo/issue/openclose" .}} </div> {{/* Ten wide does not cope well and makes the columns stack. diff --git a/templates/repo/issue/milestones.tmpl b/templates/repo/issue/milestones.tmpl index ca49664392..22daf66b37 100644 --- a/templates/repo/issue/milestones.tmpl +++ b/templates/repo/issue/milestones.tmpl @@ -12,13 +12,13 @@ </div> <div class="ui divider"></div> {{template "base/alert" .}} - <div class="ui tiny basic buttons"> - <a class="ui {{if not .IsShowClosed}}green active{{end}} basic button" href="{{.RepoLink}}/milestones?state=open"> - {{svg "octicon-milestone"}} + <div class="ui compact tiny menu"> + <a class="item{{if not .IsShowClosed}} active{{end}}" href="{{.RepoLink}}/milestones?state=open"> + {{svg "octicon-milestone" 16 "mr-3"}} {{.i18n.Tr "repo.milestones.open_tab" .OpenCount}} </a> - <a class="ui {{if .IsShowClosed}}red active{{end}} basic button" href="{{.RepoLink}}/milestones?state=closed"> - {{svg "octicon-milestone"}} + <a class="item{{if .IsShowClosed}} active{{end}}" href="{{.RepoLink}}/milestones?state=closed"> + {{svg "octicon-milestone" 16 "mr-3"}} {{.i18n.Tr "repo.milestones.close_tab" .ClosedCount}} </a> </div> diff --git a/templates/repo/issue/openclose.tmpl b/templates/repo/issue/openclose.tmpl new file mode 100644 index 0000000000..050660522a --- /dev/null +++ b/templates/repo/issue/openclose.tmpl @@ -0,0 +1,10 @@ +<div class="ui compact tiny menu"> + <a class="{{if not .IsShowClosed}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort={{$.SortType}}&state=open&labels={{.SelectLabels}}&milestone={{.MilestoneID}}&assignee={{.AssigneeID}}"> + {{svg "octicon-issue-opened" 16 "mr-3"}} + {{.i18n.Tr "repo.issues.open_tab" .IssueStats.OpenCount}} + </a> + <a class="{{if .IsShowClosed}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&type={{.ViewType}}&sort={{$.SortType}}&state=closed&labels={{.SelectLabels}}&milestone={{.MilestoneID}}&assignee={{.AssigneeID}}"> + {{svg "octicon-issue-closed" 16 "mr-3"}} + {{.i18n.Tr "repo.issues.close_tab" .IssueStats.ClosedCount}} + </a> +</div> diff --git a/templates/repo/projects/list.tmpl b/templates/repo/projects/list.tmpl index c7ee628316..838bbdf1c1 100644 --- a/templates/repo/projects/list.tmpl +++ b/templates/repo/projects/list.tmpl @@ -12,12 +12,12 @@ </div> <div class="ui divider"></div> {{template "base/alert" .}} - <div class="ui tiny basic buttons"> - <a class="ui {{if not .IsShowClosed}}green active{{end}} basic button" href="{{.RepoLink}}/projects?state=open"> + <div class="ui compact tiny menu"> + <a class="item{{if not .IsShowClosed}} active{{end}}" href="{{.RepoLink}}/projects?state=open"> {{svg "octicon-project"}} {{.i18n.Tr "repo.issues.open_tab" .OpenCount}} </a> - <a class="ui {{if .IsShowClosed}}red active{{end}} basic button" href="{{.RepoLink}}/projects?state=closed"> + <a class="item{{if .IsShowClosed}} active{{end}}" href="{{.RepoLink}}/projects?state=closed"> {{svg "octicon-check"}} {{.i18n.Tr "repo.milestones.close_tab" .ClosedCount}} </a> diff --git a/templates/repo/settings/navbar.tmpl b/templates/repo/settings/navbar.tmpl index 1944bd12e2..1aba5de731 100644 --- a/templates/repo/settings/navbar.tmpl +++ b/templates/repo/settings/navbar.tmpl @@ -1,4 +1,4 @@ -<div class="ui secondary pointing tabular top attached borderless menu stackable new-menu navbar"> +<div class="ui secondary pointing tabular top attached borderless menu stackable new-menu navbar shadow-body"> <div class="new-menu-inner"> <a class="{{if .PageIsSettingsOptions}}active{{end}} item" href="{{.RepoLink}}/settings"> {{.i18n.Tr "repo.settings.options"}} diff --git a/templates/shared/issuelist.tmpl b/templates/shared/issuelist.tmpl index beb78a5491..ddba083b59 100644 --- a/templates/shared/issuelist.tmpl +++ b/templates/shared/issuelist.tmpl @@ -22,9 +22,9 @@ {{end}} {{else}} {{if .IsClosed}} - {{svg "octicon-issue-opened" 16 "text red"}} + {{svg "octicon-issue-closed" 16 "text red"}} {{else}} - {{svg "octicon-issue-closed" 16 "text green"}} + {{svg "octicon-issue-opened" 16 "text green"}} {{end}} {{end}} </div> @@ -74,7 +74,10 @@ {{end}} {{if ne .DeadlineUnix 0}} <span class="due-date poping up" data-content="{{$.i18n.Tr "repo.issues.due_date"}}" data-variation="tiny inverted" data-position="right center"> - {{svg "octicon-calendar" 14 "mr-2"}}<span{{if .IsOverdue}} class="overdue"{{end}}>{{.DeadlineUnix.FormatShort}}</span> + <span{{if .IsOverdue}} class="overdue"{{end}}> + {{svg "octicon-calendar" 14 "mr-2"}} + {{.DeadlineUnix.FormatShort}} + </span> </span> {{end}} {{if .IsPull}} diff --git a/templates/user/auth/signin_navbar.tmpl b/templates/user/auth/signin_navbar.tmpl index 85ebcd90f8..6df235ffc4 100644 --- a/templates/user/auth/signin_navbar.tmpl +++ b/templates/user/auth/signin_navbar.tmpl @@ -18,4 +18,6 @@ {{end}} </div> </div> +{{else}} + <div class="mt-4"></div> {{end}} diff --git a/templates/user/dashboard/issues.tmpl b/templates/user/dashboard/issues.tmpl index 93ec2ed005..131ca40b3d 100644 --- a/templates/user/dashboard/issues.tmpl +++ b/templates/user/dashboard/issues.tmpl @@ -54,13 +54,13 @@ <div class="twelve wide column content"> <div class="ui three column stackable grid"> <div class="column"> - <div class="ui tiny basic status buttons"> - <a class="ui {{if not .IsShowClosed}}green active{{end}} basic button" href="{{.Link}}?type={{$.ViewType}}&repos=[{{range $.RepoIDs}}{{.}}%2C{{end}}]&sort={{$.SortType}}&state=open&q={{$.Keyword}}"> - {{svg "octicon-issue-opened"}} + <div class="ui compact tiny menu"> + <a class="item{{if not .IsShowClosed}} active{{end}}" href="{{.Link}}?type={{$.ViewType}}&repos=[{{range $.RepoIDs}}{{.}}%2C{{end}}]&sort={{$.SortType}}&state=open&q={{$.Keyword}}"> + {{svg "octicon-issue-opened" 16 "mr-3"}} {{.i18n.Tr "repo.issues.open_tab" .ShownIssueStats.OpenCount}} </a> - <a class="ui {{if .IsShowClosed}}red active{{end}} basic button" href="{{.Link}}?type={{$.ViewType}}&repos=[{{range $.RepoIDs}}{{.}}%2C{{end}}]&sort={{$.SortType}}&state=closed&q={{$.Keyword}}"> - {{svg "octicon-issue-closed"}} + <a class="item{{if .IsShowClosed}} active{{end}}" href="{{.Link}}?type={{$.ViewType}}&repos=[{{range $.RepoIDs}}{{.}}%2C{{end}}]&sort={{$.SortType}}&state=closed&q={{$.Keyword}}"> + {{svg "octicon-issue-closed" 16 "mr-3"}} {{.i18n.Tr "repo.issues.close_tab" .ShownIssueStats.ClosedCount}} </a> </div> diff --git a/templates/user/dashboard/milestones.tmpl b/templates/user/dashboard/milestones.tmpl index c3fe4e2236..16b5cf7286 100644 --- a/templates/user/dashboard/milestones.tmpl +++ b/templates/user/dashboard/milestones.tmpl @@ -34,13 +34,13 @@ </div> </div> <div class="twelve wide column content"> - <div class="ui tiny basic status buttons"> - <a class="ui {{if not .IsShowClosed}}green active{{end}} basic button" href="{{.Link}}?repos=[{{range $.RepoIDs}}{{.}}%2C{{end}}]&sort={{$.SortType}}&state=open"> - {{svg "octicon-issue-opened"}} + <div class="ui compact tiny menu"> + <a class="item{{if not .IsShowClosed}} active{{end}}" href="{{.Link}}?repos=[{{range $.RepoIDs}}{{.}}%2C{{end}}]&sort={{$.SortType}}&state=open"> + {{svg "octicon-issue-opened" 16 "mr-3"}} {{.i18n.Tr "repo.milestones.open_tab" .MilestoneStats.OpenCount}} </a> - <a class="ui {{if .IsShowClosed}}red active{{end}} basic button" href="{{.Link}}?repos=[{{range $.RepoIDs}}{{.}}%2C{{end}}]&sort={{$.SortType}}&state=closed"> - {{svg "octicon-issue-closed"}} + <a class="item{{if .IsShowClosed}} active{{end}}" href="{{.Link}}?repos=[{{range $.RepoIDs}}{{.}}%2C{{end}}]&sort={{$.SortType}}&state=closed"> + {{svg "octicon-issue-closed" 16 "mr-3"}} {{.i18n.Tr "repo.milestones.close_tab" .MilestoneStats.ClosedCount}} </a> </div> diff --git a/web_src/less/_base.less b/web_src/less/_base.less index c6f7d043af..d2dd9dcb3f 100644 --- a/web_src/less/_base.less +++ b/web_src/less/_base.less @@ -76,7 +76,7 @@ /* target-based colors */ --color-body: #ffffff; --color-text: #212121; - --color-text-light: #444444; + --color-text-light: #555555; --color-text-light-2: #888888; --color-box-header: #f7f7f7; --color-box-body: #ffffff; @@ -91,9 +91,12 @@ --color-label-hover: #00000015; --color-label-basic: #00000008; --color-label-border: #00000018; - --color-hover: #0000000d; - --color-active: #00000014; + --color-hover: #0000000a; + --color-active: #00000010; --color-menu: #ffffff; + --color-markdown-table-row: #00000008; + --color-markdown-code-block: #00000010; + --color-button: #ffffff; } :root:lang(ja) { @@ -231,6 +234,10 @@ a.muted:hover, color: var(--color-primary-dark-2); } +.ui.breadcrumb .divider { + color: var(--color-text-light-2); +} + .ui.input.focus > input, .ui.input > input:focus { border-color: var(--color-primary); @@ -1124,16 +1131,19 @@ footer { .ui.menu.new-menu::after { position: absolute; display: block; - background-image: linear-gradient(to right, transparent, var(--color-navbar) 100%); - content: ' '; + background: linear-gradient(to right, transparent, var(--color-navbar) 100%); + content: ''; right: 0; height: 39px; - z-index: 1000; width: 60px; visibility: visible; pointer-events: none; } +.ui.menu.new-menu.shadow-body::after { + background: linear-gradient(to right, transparent, var(--color-body) 100%); +} + .ui.menu.new-menu .item { margin: 0 !important; } @@ -1403,6 +1413,13 @@ a.ui.label:hover { font-size: .85714286rem; } +.ui.button { + background: var(--color-button); + border: 1px solid var(--color-secondary); + box-shadow: none !important; + color: var(--color-text); +} + .ui.blue.button, .ui.blue.buttons .button, .ui.primary.button, @@ -1714,6 +1731,10 @@ table th[data-sortt-desc] { color: var(--color-text); } +.ui.header { + color: var(--color-text); +} + .ui.header .ui.label { margin-left: .25rem; } diff --git a/web_src/less/_markdown.less b/web_src/less/_markdown.less index dd1e80246d..2261733503 100644 --- a/web_src/less/_markdown.less +++ b/web_src/less/_markdown.less @@ -104,14 +104,14 @@ padding-bottom: .3em; font-size: 2.25em; line-height: 1.2; - border-bottom: 1px solid #eeeeee; + border-bottom: 1px solid var(--color-secondary); } h2 { padding-bottom: .3em; font-size: 1.75em; line-height: 1.225; - border-bottom: 1px solid #eeeeee; + border-bottom: 1px solid var(--color-secondary); } h3 { @@ -129,7 +129,7 @@ h6 { font-size: 1em; - color: #777777; + color: var(--color-text-light-2); } p, @@ -147,7 +147,7 @@ height: 4px; padding: 0; margin: 16px 0; - background-color: #e7e7e7; + background-color: var(--color-secondary); border: 0; } @@ -204,8 +204,8 @@ blockquote { margin-left: 0; padding: 0 15px; - color: #777777; - border-left: 4px solid #dddddd; + color: var(--color-text-light-2); + border-left: 4px solid var(--color-secondary); } blockquote > :first-child { @@ -230,16 +230,15 @@ table th, table td { padding: 6px 13px !important; - border: 1px solid #dddddd !important; + border: 1px solid var(--color-secondary) !important; } table tr { - background-color: #ffffff; - border-top: 1px solid #cccccc; + border-top: 1px solid var(--color-secondary); } table tr:nth-child(2n) { - background-color: #f8f8f8; + background-color: var(--color-markdown-table-row); } img { @@ -263,7 +262,7 @@ padding: 7px; margin: 13px 0 0; overflow: hidden; - border: 1px solid #dddddd; + border: 1px solid var(--color-secondary); } span.frame span img { @@ -275,7 +274,7 @@ display: block; padding: 5px 0 0; clear: both; - color: #333333; + color: var(--color-text); } span.align-center { @@ -344,7 +343,7 @@ padding: .2em .3em; margin: 0; font-size: 85%; - background-color: rgba(0, 0, 0, .04); + background-color: var(--color-label); border-radius: 3px; } @@ -377,7 +376,7 @@ overflow: auto; font-size: 85%; line-height: 1.45; - background-color: #f7f7f7; + background-color: var(--color-markdown-code-block); border-radius: 3px; } @@ -415,13 +414,12 @@ padding: 3px 5px; font-size: 11px; line-height: 10px; - color: #555555; + color: var(--color-text-light); vertical-align: middle; - background-color: #fcfcfc; - border: solid 1px #cccccc; - border-bottom-color: #bbbbbb; + background-color: var(--color-label); + border: 1px solid var(--color-secondary); border-radius: 3px; - box-shadow: inset 0 -1px 0 #bbbbbb; + box-shadow: inset 0 -1px 0 var(--color-secondary); } input[type="checkbox"] { @@ -441,7 +439,6 @@ .csv-data .blob-num { padding: 10px 8px 9px; text-align: right; - background: #ffffff; border: 0; } @@ -451,7 +448,6 @@ .csv-data th { font-weight: 600; - background: #f8f8f8; border-top: 0; } diff --git a/web_src/less/_repository.less b/web_src/less/_repository.less index 4c2aff31c9..d1f0317b75 100644 --- a/web_src/less/_repository.less +++ b/web_src/less/_repository.less @@ -225,13 +225,19 @@ .clone.button { font-size: 13px; - padding: 0 5px; + padding: 7.5px 5px; &:first-child { border-radius: var(--border-radius) 0 0 var(--border-radius); } } + #repo-clone-https, + #repo-clone-ssh, + #clipboard-btn { + border-right: none; + } + .icon.button { padding: 0 10px; } @@ -280,6 +286,10 @@ width: 100%; } } + + .button + .button { + border-left: none; + } } #repo-files-table { diff --git a/web_src/less/themes/theme-arc-green.less b/web_src/less/themes/theme-arc-green.less index 02f274f9b0..49a86de99d 100644 --- a/web_src/less/themes/theme-arc-green.less +++ b/web_src/less/themes/theme-arc-green.less @@ -74,7 +74,7 @@ --color-box-body: #353945; --color-text: #bbc0ca; --color-text-light: #969aa5; - --color-text-light-2: #666a75; + --color-text-light-2: #767a85; --color-footer: #2e323e; --color-timeline: #4a505c; --color-input-text: #d5dbe6; @@ -82,13 +82,16 @@ --color-input-border: #454a57; --color-input-border-hover: #505667; --color-navbar: #2a2e3a; - --color-label: #ffffff10; + --color-label: #ffffff0d; --color-label-hover: #ffffff20; --color-label-basic: #00000016; --color-label-border: #ffffff28; --color-hover: #ffffff0d; --color-active: #ffffff14; --color-menu: #2e323e; + --color-markdown-table-row: #ffffff06; + --color-markdown-code-block: #2a2e3a; + --color-button: #353846; } /* Background */ @@ -566,11 +569,6 @@ a.ui.basic.green.label:hover { color: #b75252 !important; } -.ui.header, -.ui.breadcrumb .divider { - color: var(--color-secondary-dark-6); -} - .ui.divider:not(.vertical):not(.horizontal) { border-bottom-color: var(--color-secondary); border-top-color: transparent; @@ -645,12 +643,6 @@ a.ui.basic.green.label:hover { background-color: #a0cc75; } -.ui.button { - background: #353846; - border: 1px solid var(--color-secondary); - color: #dbdbdb; -} - .ui.basic.button, .ui.basic.buttons .button { color: var(--color-secondary-dark-6); @@ -693,7 +685,6 @@ a.ui.basic.green.label:hover { color: #dbdbdb; } -.ui.table thead th, .ui.table > thead > tr > th { background: var(--color-secondary); color: #dbdbdb !important; @@ -711,33 +702,6 @@ a.ui.basic.green.label:hover { color: var(--color-secondary-dark-6) !important; } -.markdown:not(code) h2 { - border-bottom: 1px solid #304251; -} - -.markdown:not(code) .highlight pre, -.markdown:not(code) pre { - background-color: #2a2e3a; - border: 1px solid var(--color-secondary); -} - -.markdown:not(code) table tr:nth-child(2n) { - background-color: #2a2e39; -} - -.markdown:not(code) table tr:nth-child(2n-1) { - background-color: #383b44; -} - -.markdown:not(code) table thead tr:nth-child(2n-1) { - background-color: #464c5d !important; -} - -.markdown:not(code) table td, -.markdown:not(code) table th { - border-color: var(--color-secondary) !important; -} - .repository.file.editor.edit, .repository.wiki.new .CodeMirror { .editor-preview, @@ -1195,6 +1159,30 @@ a.blob-excerpt:hover { border-color: #6a737d !important; } +/* invert emojis that are hard to read otherwise */ +.emoji[aria-label="check mark"], +.emoji[aria-label="currency exchange"], +.emoji[aria-label="TOP arrow"], +.emoji[aria-label="END arrow"], +.emoji[aria-label="ON! arrow"], +.emoji[aria-label="SOON arrow"], +.emoji[aria-label="heavy dollar sign"], +.emoji[aria-label="copyright"], +.emoji[aria-label="registered"], +.emoji[aria-label="trade mark"], +.emoji[aria-label="multiply"], +.emoji[aria-label="plus"], +.emoji[aria-label="minus"], +.emoji[aria-label="divide"], +.emoji[aria-label="curly loop"], +.emoji[aria-label="double curly loop"], +.emoji[aria-label="wavy dash"], +.emoji[aria-label="paw prints"], +.emoji[aria-label="musical note"], +.emoji[aria-label="musical notes"] { + filter: invert(100%); +} + .editor-toolbar { background-color: var(--color-secondary); border-color: var(--color-secondary); @@ -1382,19 +1370,6 @@ a.blob-excerpt:hover { } } -.markdown:not(code) h1 { - border-bottom-color: #888; -} - -.markdown:not(code) blockquote { - border-left-color: #888; -} - -.markdown:not(code) code, -.markdown:not(code) tt { - background-color: #2a2e3a; -} - footer .container .links > * { border-left-color: #888; } |