* Search and Diff CSS enhancements - Use flexbox for language stats - Improve labels and code boxes on repo and code search - Use flexbox on diff header and improve suppressed diff text - Add dedicated color for diff expander * more diff tweaks, less vertical padding on header * more minor tweaks * always show fold icon, image diff improvments * remove margin Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com> Co-authored-by: techknowlogick <techknowlogick@gitea.io>tags/v1.15.0-dev
@@ -16,10 +16,10 @@ | |||
<h3> | |||
{{.i18n.Tr "explore.code_search_results" (.Keyword|Escape) | Str2html }} | |||
</h3> | |||
<div> | |||
<div class="df ac fw"> | |||
{{range $term := .SearchResultLanguages}} | |||
<a class="ui text-label {{if eq $.Language $term.Language}}primary {{end}}basic label" href="{{AppSubUrl}}/explore/code?q={{$.Keyword}}{{if ne $.Language $term.Language}}&l={{$term.Language}}{{end}}"> | |||
<i class="color-icon" style="background-color: {{$term.Color}}"></i> | |||
<a class="ui text-label df ac mr-1 my-1 {{if eq $.Language $term.Language}}primary {{end}}basic label" href="{{AppSubUrl}}/explore/code?q={{$.Keyword}}{{if ne $.Language $term.Language}}&l={{$term.Language}}{{end}}"> | |||
<i class="color-icon mr-3" style="background-color: {{$term.Color}}"></i> | |||
{{$term.Language}} | |||
<div class="detail">{{$term.Count}}</div> | |||
</a> | |||
@@ -31,7 +31,7 @@ | |||
<div class="diff-file-box diff-box file-content non-diff-file-content repo-search-result"> | |||
<h4 class="ui top attached normal header"> | |||
<span class="file"><a rel="nofollow" href="{{EscapePound $repo.HTMLURL}}">{{$repo.FullName}}</a> - {{.Filename}}</span> | |||
<a class="ui basic grey tiny button" rel="nofollow" href="{{EscapePound $repo.HTMLURL}}/src/commit/{{$result.CommitID}}/{{EscapePound .Filename}}">{{$.i18n.Tr "repo.diff.view_file"}}</a> | |||
<a class="ui basic tiny button" rel="nofollow" href="{{EscapePound $repo.HTMLURL}}/src/commit/{{$result.CommitID}}/{{EscapePound .Filename}}">{{$.i18n.Tr "repo.diff.view_file"}}</a> | |||
</h4> | |||
<div class="ui attached table segment"> | |||
<div class="file-body file-code code-view"> |
@@ -38,12 +38,12 @@ | |||
{{end}} | |||
</div> | |||
</div> | |||
<div class="metas"> | |||
<div class="metas df ac"> | |||
{{if .PrimaryLanguage }} | |||
<span class="text grey"><i class="color-icon" style="background-color: {{.PrimaryLanguage.Color}}"></i>{{ .PrimaryLanguage.Language }}</span> | |||
<span class="text grey df ac mr-3"><i class="color-icon mr-3" style="background-color: {{.PrimaryLanguage.Color}}"></i>{{ .PrimaryLanguage.Language }}</span> | |||
{{end}} | |||
<span class="text grey">{{svg "octicon-star"}} {{.NumStars}}</span> | |||
<span class="text grey">{{svg "octicon-git-branch"}} {{.NumForks}}</span> | |||
<span class="text grey df ac mr-3">{{svg "octicon-star" 16 "mr-3"}}{{.NumStars}}</span> | |||
<span class="text grey df ac mr-3">{{svg "octicon-git-branch" 16 "mr-3"}}{{.NumForks}}</span> | |||
</div> | |||
</div> | |||
<div class="description"> |
@@ -33,10 +33,10 @@ | |||
{{end}} | |||
</div> | |||
</div> | |||
<ol class="diff-detail-box diff-stats detail-files hide" id="diff-files"> | |||
<ol class="diff-detail-box diff-stats m-0 hide" id="diff-files"> | |||
{{range .Diff.Files}} | |||
<li> | |||
<div class="diff-counter pull-right"> | |||
<div class="bold df ac pull-right"> | |||
{{if not .IsBin}} | |||
{{template "repo/diff/stats" dict "file" . "root" $}} | |||
{{else}} | |||
@@ -45,7 +45,7 @@ | |||
</div> | |||
<!-- todo finish all file status, now modify, add, delete and rename --> | |||
<span class="status {{DiffTypeToStr .GetType}} poping up" data-content="{{DiffTypeToStr .GetType}}" data-variation="inverted tiny" data-position="right center"> </span> | |||
<a class="file" href="#diff-{{.Index}}">{{.Name}}</a> | |||
<a class="file mono" href="#diff-{{.Index}}">{{.Name}}</a> | |||
</li> | |||
{{end}} | |||
</ol> | |||
@@ -53,23 +53,28 @@ | |||
{{if $file.IsIncomplete}} | |||
<div class="diff-file-box diff-box file-content"> | |||
<h4 class="ui top attached normal header rounded"> | |||
<div class="diff-counter ui left"> | |||
<a role="button" class="fold-file muted mr-2"> | |||
{{svg "octicon-chevron-down" 18}} | |||
</a> | |||
<div class="bold ui left df ac"> | |||
{{if not $file.IsRenamed}} | |||
{{template "repo/diff/stats" dict "file" . "root" $}} | |||
{{end}} | |||
</div> | |||
<span class="file">{{$file.Name}}</span> | |||
<div>{{$.i18n.Tr "repo.diff.file_suppressed"}}</div> | |||
{{if $file.IsProtected}} | |||
<span class="ui right basic label">{{$.i18n.Tr "repo.diff.protected"}}</span> | |||
{{end}} | |||
{{if and (not $file.IsSubmodule) (not $.PageIsWiki)}} | |||
{{if $file.IsDeleted}} | |||
<a class="ui basic grey tiny button" rel="nofollow" href="{{EscapePound $.BeforeSourcePath}}/{{EscapePound .Name}}">{{$.i18n.Tr "repo.diff.view_file"}}</a> | |||
{{else}} | |||
<a class="ui basic grey tiny button" rel="nofollow" href="{{EscapePound $.SourcePath}}/{{EscapePound .Name}}">{{$.i18n.Tr "repo.diff.view_file"}}</a> | |||
<span class="file mono">{{$file.Name}}</span> | |||
<div class="diff-file-header-actions df ac"> | |||
<div class="text grey">{{$.i18n.Tr "repo.diff.file_suppressed"}}</div> | |||
{{if $file.IsProtected}} | |||
<span class="ui basic label">{{$.i18n.Tr "repo.diff.protected"}}</span> | |||
{{end}} | |||
{{end}} | |||
{{if and (not $file.IsSubmodule) (not $.PageIsWiki)}} | |||
{{if $file.IsDeleted}} | |||
<a class="ui basic tiny button" rel="nofollow" href="{{EscapePound $.BeforeSourcePath}}/{{EscapePound .Name}}">{{$.i18n.Tr "repo.diff.view_file"}}</a> | |||
{{else}} | |||
<a class="ui basic tiny button" rel="nofollow" href="{{EscapePound $.SourcePath}}/{{EscapePound .Name}}">{{$.i18n.Tr "repo.diff.view_file"}}</a> | |||
{{end}} | |||
{{end}} | |||
</div> | |||
</h4> | |||
</div> | |||
{{else}} | |||
@@ -82,21 +87,19 @@ | |||
{{else}} | |||
{{$isImage = (call $.IsImageFileInHead $file.Name)}} | |||
{{end}} | |||
{{if or (not $file.IsBin) $isImage}} | |||
<a role="button" class="fold-file"> | |||
<a role="button" class="fold-file muted mr-2"> | |||
{{svg "octicon-chevron-down" 18}} | |||
</a> | |||
{{end}} | |||
<div class="diff-counter"> | |||
<div class="bold df ac"> | |||
{{if $file.IsBin}} | |||
{{$.i18n.Tr "repo.diff.bin"}} | |||
{{else if not $file.IsRenamed}} | |||
{{template "repo/diff/stats" dict "file" . "root" $}} | |||
{{end}} | |||
</div> | |||
<span class="file">{{if $file.IsRenamed}}{{$file.OldName}} → {{end}}{{$file.Name}}{{if .IsLFSFile}} ({{$.i18n.Tr "repo.stored_lfs"}}){{end}}</span> | |||
<span class="file mono">{{if $file.IsRenamed}}{{$file.OldName}} → {{end}}{{$file.Name}}{{if .IsLFSFile}} ({{$.i18n.Tr "repo.stored_lfs"}}){{end}}</span> | |||
</div> | |||
<div class="df ac"> | |||
<div class="diff-file-header-actions df ac"> | |||
{{if $file.IsProtected}} | |||
<span class="ui basic label">{{$.i18n.Tr "repo.diff.protected"}}</span> | |||
{{end}} | |||
@@ -111,8 +114,8 @@ | |||
</h4> | |||
<div class="diff-file-body ui attached unstackable table segment"> | |||
{{if ne $file.Type 4}} | |||
<div class="file-body file-code has-context-menu code-diff {{if $.IsSplitStyle}}code-diff-split{{else}}code-diff-unified{{end}}"> | |||
<table class="chroma"> | |||
<div class="file-body file-code has-context-menu{{if not $isImage}} code-diff{{end}}{{if $.IsSplitStyle}} code-diff-split{{else}} code-diff-unified{{end}}{{if $isImage}} py-4{{end}}"> | |||
<table class="chroma{{if $isImage}} w-100{{end}}"> | |||
<tbody> | |||
{{if $isImage}} | |||
{{template "repo/diff/image_diff" dict "file" . "root" $}} | |||
@@ -130,7 +133,6 @@ | |||
</div> | |||
</div> | |||
{{end}} | |||
<br> | |||
{{end}} | |||
{{if .Diff.IsIncomplete}} |
@@ -2,22 +2,22 @@ | |||
{{ $imagePathNew := printf "%s/%s" .root.RawPath (EscapePound .file.Name) }} | |||
<tr> | |||
<th class="halfwidth center"> | |||
<th class="halfwidth center pl-3 pr-2"> | |||
{{.root.i18n.Tr "repo.diff.file_before"}} | |||
</th> | |||
<th class="halfwidth center"> | |||
<th class="halfwidth center pl-2 pr-3"> | |||
{{.root.i18n.Tr "repo.diff.file_after"}} | |||
</th> | |||
</tr> | |||
<tr> | |||
<td class="halfwidth center"> | |||
<td class="halfwidth center pl-3 pr-2"> | |||
{{if or .file.IsDeleted (not .file.IsCreated)}} | |||
<a href="{{$imagePathOld}}" target="_blank"> | |||
<img src="{{$imagePathOld}}" class="border red" /> | |||
</a> | |||
{{end}} | |||
</td> | |||
<td class="halfwidth center"> | |||
<td class="halfwidth center pl-2 pr-3"> | |||
{{if or .file.IsCreated (not .file.IsDeleted)}} | |||
<a href="{{$imagePathNew}}" target="_blank"> | |||
<img src="{{$imagePathNew}}" class="border green" /> | |||
@@ -29,7 +29,7 @@ | |||
{{ $imageInfoHead := (call .root.ImageInfo .file.Name) }} | |||
{{if or $imageInfoBase $imageInfoHead }} | |||
<tr> | |||
<td class="halfwidth center"> | |||
<td class="halfwidth center pl-3 pr-2"> | |||
{{if $imageInfoBase }} | |||
{{ $classWidth := "" }} | |||
{{ $classHeight := "" }} | |||
@@ -52,7 +52,7 @@ | |||
{{.root.i18n.Tr "repo.diff.file_byte_size"}}: <span class="text {{$classByteSize}}">{{FileSize $imageInfoBase.ByteSize}}</span> | |||
{{end}} | |||
</td> | |||
<td class="halfwidth center"> | |||
<td class="halfwidth center pl-2 pr-3"> | |||
{{if $imageInfoHead }} | |||
{{ $classWidth := "" }} | |||
{{ $classHeight := "" }} |
@@ -1,4 +1,4 @@ | |||
{{Add .file.Addition .file.Deletion}} | |||
<span class="diff-stats-bar poping up ml-2" data-content="{{.root.i18n.Tr "repo.diff.stats_desc_file" (Add .file.Addition .file.Deletion) .file.Addition .file.Deletion | Str2html}}" data-variation="wide"> | |||
<span class="diff-stats-bar poping up mx-3" data-content="{{.root.i18n.Tr "repo.diff.stats_desc_file" (Add .file.Addition .file.Deletion) .file.Addition .file.Deletion | Str2html}}" data-variation="wide"> | |||
<div class="diff-stats-add-bar" style="width: {{DiffStatsWidth .file.Addition .file.Deletion}}%"></div> | |||
</span> |
@@ -16,10 +16,10 @@ | |||
<h3> | |||
{{.i18n.Tr "repo.search.results" (.Keyword|Escape) .RepoLink .RepoName | Str2html }} | |||
</h3> | |||
<div> | |||
<div class="df ac fw"> | |||
{{range $term := .SearchResultLanguages}} | |||
<a class="ui text-label {{if eq $.Language $term.Language}}primary {{end}}basic label" href="{{EscapePound $.SourcePath}}/search?q={{$.Keyword}}{{if ne $.Language $term.Language}}&l={{$term.Language}}{{end}}"> | |||
<i class="color-icon" style="background-color: {{$term.Color}}"></i> | |||
<a class="ui text-label df ac mr-1 my-1 {{if eq $.Language $term.Language}}primary {{end}}basic label" href="{{EscapePound $.SourcePath}}/search?q={{$.Keyword}}{{if ne $.Language $term.Language}}&l={{$term.Language}}{{end}}"> | |||
<i class="color-icon mr-3" style="background-color: {{$term.Color}}"></i> | |||
{{$term.Language}} | |||
<div class="detail">{{$term.Count}}</div> | |||
</a> | |||
@@ -30,7 +30,7 @@ | |||
<div class="diff-file-box diff-box file-content non-diff-file-content repo-search-result"> | |||
<h4 class="ui top attached normal header"> | |||
<span class="file">{{.Filename}}</span> | |||
<a class="ui basic grey tiny button" rel="nofollow" href="{{EscapePound $.SourcePath}}/src/commit/{{$result.CommitID}}/{{EscapePound .Filename}}">{{$.i18n.Tr "repo.diff.view_file"}}</a> | |||
<a class="ui basic tiny button" rel="nofollow" href="{{EscapePound $.SourcePath}}/src/commit/{{$result.CommitID}}/{{EscapePound .Filename}}">{{$.i18n.Tr "repo.diff.view_file"}}</a> | |||
</h4> | |||
<div class="ui attached table segment"> | |||
<div class="file-body file-code code-view"> |
@@ -23,15 +23,16 @@ | |||
<div class="ui segment sub-menu language-stats-details" style="display: none"> | |||
<div class="ui horizontal center link list"> | |||
{{range .LanguageStats}} | |||
<div class="item"> | |||
<i class="color-icon" style="background-color: {{ .Color }}"></i> | |||
<span class="ui"><b> | |||
{{if eq .Language "other" }} | |||
{{ $.i18n.Tr "repo.language_other" }} | |||
{{else}} | |||
{{ .Language }} | |||
{{end}} | |||
</b> {{ .Percentage }}%</span> | |||
<div class="item df ac jc"> | |||
<i class="color-icon mr-3" style="background-color: {{ .Color }}"></i> | |||
<span class="bold mr-3"> | |||
{{if eq .Language "other" }} | |||
{{ $.i18n.Tr "repo.language_other" }} | |||
{{else}} | |||
{{ .Language }} | |||
{{end}} | |||
</span> | |||
{{ .Percentage }}% | |||
</div> | |||
{{end}} | |||
</div> |
@@ -1,10 +1,10 @@ | |||
<div class="ui bottom attached table segment df ac sb"> | |||
<div class="ml-3"> | |||
<div class="df ac ml-4"> | |||
{{if .result.Language}} | |||
<i class="color-icon" style="background-color: {{.result.Color}}"></i>{{.result.Language}} | |||
<i class="color-icon mr-3" style="background-color: {{.result.Color}}"></i>{{.result.Language}} | |||
{{end}} | |||
</div> | |||
<div class="mr-3"> | |||
<div class="mr-4"> | |||
{{if not .result.UpdatedUnix.IsZero}} | |||
<span class="ui grey text">{{.root.i18n.Tr "explore.code_last_indexed_at" (TimeSinceUnix .result.UpdatedUnix .root.i18n.Lang) | Safe}}</span> | |||
{{end}} |
@@ -85,7 +85,8 @@ | |||
--color-text-dark: #080808; | |||
--color-text: #212121; | |||
--color-text-light: #555555; | |||
--color-text-light-2: #888888; | |||
--color-text-light-2: #808080; | |||
--color-text-light-3: #a0a0a0; | |||
--color-box-header: #f7f7f7; | |||
--color-box-body: #ffffff; | |||
--color-footer: #ffffff; | |||
@@ -98,6 +99,7 @@ | |||
--color-label: #00000010; | |||
--color-label-hover: #00000015; | |||
--color-label-basic: #00000008; | |||
--color-label-basic-hover: #00000015; | |||
--color-label-border: #00000018; | |||
--color-hover: #0000000a; | |||
--color-active: #00000010; | |||
@@ -109,6 +111,7 @@ | |||
--color-code-bg: #ffffff; | |||
--color-markdown-code-block: #00000010; | |||
--color-secondary-bg: #f4f4f4; | |||
--color-expand-button: #d8efff; | |||
/* backgrounds */ | |||
--checkbox-mask-checked: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="-1 -1 18 18" width="16" height="16"><path fill-rule="evenodd" d="M13.78 4.22a.75.75 0 010 1.06l-7.25 7.25a.75.75 0 01-1.06 0L2.22 9.28a.75.75 0 011.06-1.06L6 10.94l6.72-6.72a.75.75 0 011.06 0z"></path></svg>'); | |||
--checkbox-mask-indeterminate: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M2 7.75A.75.75 0 012.75 7h10a.75.75 0 010 1.5h-10A.75.75 0 012 7.75z"></path></svg>'); | |||
@@ -170,6 +173,7 @@ h6 { | |||
} | |||
body { | |||
color: var(--color-text); | |||
background-color: var(--color-body); | |||
overflow-y: auto; | |||
display: flex; | |||
@@ -304,6 +308,11 @@ a.muted:hover, | |||
} | |||
.ui.ui.menu .item.disabled { | |||
color: var(--color-text-light-3); | |||
} | |||
/* slightly more contrast for filters on issue list */ | |||
.ui.ui.menu .dropdown.item.disabled { | |||
color: var(--color-text-light-2); | |||
} | |||
@@ -809,10 +818,6 @@ a.ui.card:hover, | |||
font-weight: normal; | |||
} | |||
&.bold { | |||
font-weight: 600; | |||
} | |||
&.italic { | |||
font-style: italic; | |||
} | |||
@@ -1387,18 +1392,6 @@ a.ui.label:hover { | |||
color: var(--color-text); | |||
} | |||
.ui.basic.labels .label, | |||
.ui.basic.label { | |||
background: var(--color-label-basic); | |||
border-color: var(--color-label-border); | |||
color: var(--color-text); | |||
} | |||
.ui.basic.labels a.label:hover, | |||
a.ui.basic.label:hover { | |||
background: var(--color-label-hover); | |||
} | |||
.ui.label > .detail .icons { | |||
margin-right: .25em; | |||
} | |||
@@ -1439,6 +1432,9 @@ a.ui.basic.label:hover { | |||
.lines-num, | |||
.lines-code { | |||
font-size: 12px; | |||
font-family: var(--fonts-monospace); | |||
line-height: 20px; | |||
padding-top: 0; | |||
padding-bottom: 0; | |||
vertical-align: top; | |||
@@ -1549,12 +1545,6 @@ a.ui.basic.label:hover { | |||
overflow-y: visible; | |||
} | |||
*:not(.fa):not(.svg):not(.icon) { | |||
font-size: 12px; | |||
font-family: var(--fonts-monospace); | |||
line-height: 20px; | |||
} | |||
table { | |||
width: 100%; | |||
} | |||
@@ -1576,6 +1566,10 @@ a.ui.basic.label:hover { | |||
color: var(--color-text); | |||
} | |||
.ui.button.no-text .icon { | |||
margin: 0 !important; | |||
} | |||
.ui.buttons .button:first-child { | |||
border-left: 1px solid var(--color-secondary); | |||
} | |||
@@ -1644,6 +1638,20 @@ a.ui.basic.label:hover { | |||
color: var(--color-primary) !important; | |||
} | |||
.ui.basic.labels .label, | |||
.ui.basic.label { | |||
background: var(--color-label-basic); | |||
border-color: var(--color-label-border); | |||
color: var(--color-text); | |||
} | |||
.ui.basic.labels a.label:hover, | |||
a.ui.basic.label:hover { | |||
color: var(--color-text); | |||
border-color: var(--color-label-border); | |||
background: var(--color-label-basic-hover); | |||
} | |||
.ui.label > img { | |||
width: auto !important; | |||
vertical-align: middle; | |||
@@ -1703,15 +1711,10 @@ a.ui.basic.label:hover { | |||
} | |||
.color-icon { | |||
margin-right: .5em; | |||
margin-left: .5em; | |||
display: inline-block; | |||
border: 0 solid rgba(0, 0, 0, .2); | |||
border-radius: 100%; | |||
height: 14px; | |||
width: 14px; | |||
position: relative; | |||
top: 2px; | |||
} | |||
.ui.label > .color-icon { | |||
@@ -1835,10 +1838,6 @@ table th[data-sortt-desc] { | |||
align-items: center !important; | |||
} | |||
.text-label .color-icon { | |||
position: static !important; | |||
} | |||
.emoji, | |||
.reaction { | |||
font-size: 1.25em; |
@@ -15,39 +15,32 @@ | |||
.ui.repository.list { | |||
.item { | |||
padding-bottom: 25px; | |||
padding-bottom: 1.5rem; | |||
&:not(:first-child) { | |||
border-top: 1px solid var(--color-secondary); | |||
padding-top: 25px; | |||
padding-top: 1.5rem; | |||
} | |||
.ui.header { | |||
font-size: 1.5rem; | |||
padding-bottom: 10px; | |||
margin-bottom: .5rem; | |||
.name { | |||
word-break: break-all; | |||
} | |||
.metas { | |||
color: #888888; | |||
font-size: 14px; | |||
font-weight: normal; | |||
span:not(:last-child) { | |||
margin-right: 5px; | |||
} | |||
} | |||
} | |||
.time { | |||
font-size: 12px; | |||
color: #808080; | |||
} | |||
.ui.tags { | |||
margin-bottom: 1em; | |||
margin-bottom: .5rem; | |||
} | |||
} | |||
} |
@@ -1413,7 +1413,7 @@ | |||
.diff-detail-box { | |||
padding: 7px 0; | |||
background: #ffffff; | |||
background: var(--color-body); | |||
line-height: 30px; | |||
@media @mediaMdAndDown { | |||
@@ -1425,7 +1425,6 @@ | |||
position: sticky; | |||
top: 0; | |||
z-index: 8; | |||
margin-bottom: 10px; | |||
border-bottom: 1px solid var(--color-secondary); | |||
padding-left: 2px; | |||
padding-right: 2px; | |||
@@ -1442,8 +1441,12 @@ | |||
margin-right: .25rem; | |||
} | |||
.diff-detail-actions .btn-review { | |||
margin-right: 0 !important; | |||
.diff-detail-actions > * { | |||
margin-right: 0; | |||
} | |||
.diff-detail-actions > * + * { | |||
margin-left: .25rem; | |||
} | |||
span.status { | |||
@@ -1454,26 +1457,21 @@ | |||
vertical-align: middle; | |||
&.modify { | |||
background-color: #f0db88; | |||
background-color: var(--color-yellow); | |||
} | |||
&.add { | |||
background-color: #b4e2b4; | |||
background-color: var(--color-green); | |||
} | |||
&.del { | |||
background-color: #e9aeae; | |||
background-color: var(--color-red); | |||
} | |||
&.rename { | |||
background-color: #dad8ff; | |||
background-color: var(--color-teal); | |||
} | |||
} | |||
.detail-files { | |||
background: #ffffff; | |||
margin: 0; | |||
} | |||
} | |||
.diff-box .header { | |||
@@ -1486,12 +1484,18 @@ | |||
} | |||
.button { | |||
padding: 8px 10px; | |||
padding: 8px 12px; | |||
flex: 0 0 auto; | |||
margin-top: -8px; | |||
margin-bottom: -8px; | |||
margin-right: 0; | |||
} | |||
} | |||
.diff-file-box { | |||
margin-top: 1rem; | |||
margin-bottom: 1rem; | |||
.header { | |||
background-color: var(--color-box-header); | |||
} | |||
@@ -1588,7 +1592,6 @@ | |||
} | |||
.diff-stats { | |||
clear: both; | |||
margin-bottom: 5px; | |||
max-height: 400px; | |||
@@ -1599,9 +1602,12 @@ | |||
list-style: none; | |||
padding-bottom: 4px; | |||
margin-bottom: 4px; | |||
border-bottom: 1px dashed var(--color-secondary); | |||
padding-left: 6px; | |||
} | |||
li + li { | |||
border-top: 1px solid var(--color-secondary); | |||
} | |||
} | |||
.repo-search-result { | |||
@@ -2961,9 +2967,8 @@ td.blob-excerpt { | |||
border-radius: var(--border-radius) !important; | |||
} | |||
.diff-counter { | |||
font-weight: 600; | |||
margin-right: 8px; | |||
.diff-file-header-actions > * + * { | |||
margin-left: .5rem !important; | |||
} | |||
.diff-stats-bar { | |||
@@ -2971,8 +2976,6 @@ td.blob-excerpt { | |||
background-color: var(--color-red); | |||
height: 12px; | |||
width: 40px; | |||
position: relative; | |||
top: 2px; | |||
.diff-stats-add-bar { | |||
background-color: var(--color-green); |
@@ -122,19 +122,14 @@ | |||
color: var(--color-text); | |||
} | |||
a.fold-file { | |||
margin-right: 10px; | |||
color: inherit; | |||
} | |||
a.blob-excerpt { | |||
color: #575a68; | |||
color: var(--color-text-light); | |||
height: 28px; | |||
display: flex; | |||
justify-content: center; | |||
align-items: center; | |||
width: 100%; | |||
background: var(--color-primary-light-5); | |||
background: var(--color-expand-button); | |||
} | |||
a.blob-excerpt:hover { |
@@ -12,12 +12,16 @@ | |||
.f1 { flex: 1 !important; } | |||
.fw { flex-wrap: wrap !important; } | |||
.vm { vertical-align: middle !important; } | |||
.w-100 { width: 100% !important; } | |||
.h-100 { height: 100% !important; } | |||
.mono { | |||
font-family: var(--fonts-monospace) !important; | |||
font-size: .9em !important; /* compensate for monospace fonts being usually slighty larger */ | |||
} | |||
.bold { font-weight: 600 !important; } | |||
.word-break { | |||
word-wrap: break-word !important; | |||
word-break: break-all !important; |
@@ -82,7 +82,8 @@ | |||
--color-text-dark: #dbe0ea; | |||
--color-text: #bbc0ca; | |||
--color-text-light: #a6aab5; | |||
--color-text-light-2: #868a95; | |||
--color-text-light-2: #8a8e99; | |||
--color-text-light-3: #707687; | |||
--color-footer: #2e323e; | |||
--color-timeline: #4c525e; | |||
--color-input-text: #d5dbe6; | |||
@@ -92,7 +93,8 @@ | |||
--color-navbar: #2a2e3a; | |||
--color-label: #ffffff0d; | |||
--color-label-hover: #ffffff20; | |||
--color-label-basic: #00000016; | |||
--color-label-basic: #00000030; | |||
--color-label-basic-hover: #40404030; | |||
--color-label-border: #ffffff28; | |||
--color-hover: #ffffff0d; | |||
--color-active: #ffffff14; | |||
@@ -104,6 +106,8 @@ | |||
--color-code-bg: #2a2e3a; | |||
--color-shadow: #00000060; | |||
--color-secondary-bg: #2a2e3a; | |||
--color-text-focus: #fff; | |||
--color-expand-button: #3c404d; | |||
} | |||
.repository.branches .commit-divergence .bar { | |||
@@ -118,10 +122,6 @@ | |||
background: var(--color-primary-alpha-20) !important; | |||
} | |||
body { | |||
color: var(--color-secondary-dark-6); | |||
} | |||
::placeholder, | |||
.CodeMirror-placeholder { | |||
color: #6a737d !important; | |||
@@ -505,15 +505,6 @@ td.blob-excerpt { | |||
background-color: rgba(0, 0, 0, .15); | |||
} | |||
a.blob-excerpt { | |||
color: #ccc; | |||
background: #393d4a; | |||
} | |||
a.blob-excerpt:hover { | |||
background: #87ab63; | |||
} | |||
.lines-code.active, | |||
.lines-code .active { | |||
background: #534d1b !important; | |||
@@ -658,18 +649,6 @@ a.blob-excerpt:hover { | |||
border-right-color: var(--color-secondary) !important; | |||
} | |||
.repository .diff-detail-box { | |||
background-color: #383c4a; | |||
.detail-files { | |||
background-color: inherit; | |||
} | |||
&.sticky { | |||
border-bottom-color: var(--color-secondary); | |||
} | |||
} | |||
/* code mirror dark theme */ | |||
.CodeMirror { |