diff --git a/templates/repo/commit_header.tmpl b/templates/repo/commit_header.tmpl index 9604daf2b0..f0c094c9bd 100644 --- a/templates/repo/commit_header.tmpl +++ b/templates/repo/commit_header.tmpl @@ -181,11 +181,11 @@ {{ctx.Locale.Tr "repo.diff.parent"}} {{range .Parents}} {{if $.PageIsWiki}} - + {{ShortSha .}} {{else}} - + {{ShortSha .}} {{end}} @@ -200,7 +200,7 @@ {{ShortSha .CommitID}} {{else}} - + {{ShortSha .CommitID}} {{end}} diff --git a/templates/repo/commits_table.tmpl b/templates/repo/commits_table.tmpl index c0e4f5ca46..1c2f793d1c 100644 --- a/templates/repo/commits_table.tmpl +++ b/templates/repo/commits_table.tmpl @@ -10,11 +10,11 @@ {{if .IsDiffCompare}}
- + {{if not .BaseIsCommit}}{{if .BaseIsBranch}}{{svg "octicon-git-branch"}}{{else if .BaseIsTag}}{{svg "octicon-tag"}}{{end}}{{.BaseBranch}}{{else}}{{ShortSha .BaseBranch}}{{end}} ... - + {{if not .HeadIsCommit}}{{if .HeadIsBranch}}{{svg "octicon-git-branch"}}{{else if .HeadIsTag}}{{svg "octicon-tag"}}{{end}}{{.HeadBranch}}{{else}}{{ShortSha .HeadBranch}}{{end}}
diff --git a/templates/repo/editor/cherry_pick.tmpl b/templates/repo/editor/cherry_pick.tmpl index 49b210f75c..362b8d52ee 100644 --- a/templates/repo/editor/cherry_pick.tmpl +++ b/templates/repo/editor/cherry_pick.tmpl @@ -11,7 +11,7 @@
diff --git a/templates/repo/shabox.tmpl b/templates/repo/shabox.tmpl index 270eab7759..86413a5412 100644 --- a/templates/repo/shabox.tmpl +++ b/templates/repo/shabox.tmpl @@ -1,4 +1,4 @@ -{{$class := "ui sha label"}} +{{$class := "sha label"}} {{if .signature}} {{$class = (print $class " isSigned")}} {{if .verification.Verified}} diff --git a/web_src/css/index.css b/web_src/css/index.css index d86a784bcc..7b0fa45916 100644 --- a/web_src/css/index.css +++ b/web_src/css/index.css @@ -30,6 +30,7 @@ @import "./modules/svg.css"; @import "./modules/flexcontainer.css"; @import "./modules/user-cards.css"; +@import "./modules/hashbox.css"; @import "./shared/flex-list.css"; @import "./shared/milestone.css"; diff --git a/web_src/css/modules/hashbox.css b/web_src/css/modules/hashbox.css new file mode 100644 index 0000000000..316ac1f655 --- /dev/null +++ b/web_src/css/modules/hashbox.css @@ -0,0 +1,104 @@ +.sha.label { + display: inline-flex; + flex-shrink: 0; + gap: 0; + align-items: center; + margin: 0 6px; /* needs to go but looked into case-by-case */ + padding: 0; + min-width: 0; /* from .ui.label, may be bad actually */ + background: var(--color-label-bg); + color: var(--color-label-text); + border: 1px solid var(--color-light-border); + border-radius: var(--border-radius); + white-space: nowrap; + font-family: var(--fonts-monospace); + font-size: 13px; + font-weight: var(--font-weight-normal); + line-height: 1; +} + +.primary.sha.label { + border: none; + background: var(--color-primary); + color: var(--color-primary-contrast); +} + +.sha.label .shortsha { + padding: 0.33rem 0.5rem; +} + +.sha.label .signature { + color: var(--color-text); + background: var(--color-light); + padding: 0.25rem 0.33rem; + border-left: 1px solid var(--color-light-border); + border-top-right-radius: inherit; + border-bottom-right-radius: inherit; +} + +.sha.label .signature-author { + display: flex; + gap: 0.25rem; +} + +.sha.label .signature-author .avatar { + height: 16px; + width: 16px; + margin: 0 !important; /* In some areas selectors with .avatar are too broad */ +} + +.sha.label.isSigned.isWarning { + border: 1px solid var(--color-red-badge); + background: var(--color-red-badge-bg); +} + +.sha.label.isSigned.isWarning .signature { + border-left: 1px solid var(--color-red-badge); + color: var(--color-red-badge); +} + +.sha.label.isSigned.isWarning:hover { + background: var(--color-red-badge-hover-bg); +} + +.sha.label.isSigned.isVerified { + border: 1px solid var(--color-green-badge); + background: var(--color-green-badge-bg); +} + +.sha.label.isSigned.isVerified .signature { + border-left: 1px solid var(--color-green-badge); + color: var(--color-green-badge); +} + +.sha.label.isSigned.isVerified:hover { + background: var(--color-green-badge-hover-bg); +} + +.sha.label.isSigned.isVerifiedUntrusted { + border: 1px solid var(--color-yellow-badge); + background: var(--color-yellow-badge-bg); +} + +.sha.label.isSigned.isVerifiedUntrusted .signature { + border-left: 1px solid var(--color-yellow-badge); + color: var(--color-yellow-badge); +} + +.sha.label.isSigned.isVerifiedUntrusted:hover { + background: var(--color-yellow-badge-hover-bg); +} + +.sha.label.isSigned.isVerifiedUnmatched { + border: 1px solid var(--color-orange-badge); + background: var(--color-orange-badge-bg); +} + +.sha.label.isSigned.isVerifiedUnmatched .signature { + border-left: 1px solid var(--color-orange-badge); + color: var(--color-orange-badge); +} + +.sha.label.isSigned.isVerifiedUnmatched:hover { + background: var(--color-orange-badge-hover-bg); +} diff --git a/web_src/css/repo.css b/web_src/css/repo.css index a3713a4c3d..4aa6faa46e 100644 --- a/web_src/css/repo.css +++ b/web_src/css/repo.css @@ -1238,103 +1238,6 @@ pdf-object { background-color: var(--color-light) !important; } -.ui .sha.label { - font-family: var(--fonts-monospace); - font-size: 13px; - font-weight: var(--font-weight-normal); - margin: 0 6px; - padding: 0; - gap: 0; - flex-shrink: 0; -} - -.ui.ui .sha.label { - border: 1px solid var(--color-light-border); -} - -.ui.primary.sha.label { - border: none !important; - background: var(--color-primary) !important; -} - -.sha.label .shortsha { - padding: 0.33rem 0.5rem; -} - -.sha.label .signature { - color: var(--color-text); - background: var(--color-light); - padding: 0.25rem 0.33rem; - border-left: 1px solid var(--color-light-border); -} - -.sha.label .signature-author { - display: flex; - gap: 0.25rem; -} - -.sha.label .signature-author .avatar { - height: 16px; - margin-bottom: 0; - width: 16px; -} - -.sha.label.isSigned.isWarning { - border: 1px solid var(--color-red-badge); - background: var(--color-red-badge-bg); -} - -.sha.label.isSigned.isWarning .signature { - border-left: 1px solid var(--color-red-badge); - color: var(--color-red-badge); -} - -.sha.label.isSigned.isWarning:hover { - background: var(--color-red-badge-hover-bg) !important; -} - -.sha.label.isSigned.isVerified { - border: 1px solid var(--color-green-badge); - background: var(--color-green-badge-bg); -} - -.sha.label.isSigned.isVerified .signature { - border-left: 1px solid var(--color-green-badge); - color: var(--color-green-badge); -} - -.sha.label.isSigned.isVerified:hover { - background: var(--color-green-badge-hover-bg) !important; -} - -.sha.label.isSigned.isVerifiedUntrusted { - border: 1px solid var(--color-yellow-badge); - background: var(--color-yellow-badge-bg); -} - -.sha.label.isSigned.isVerifiedUntrusted .signature { - border-left: 1px solid var(--color-yellow-badge); - color: var(--color-yellow-badge); -} - -.sha.label.isSigned.isVerifiedUntrusted:hover { - background: var(--color-yellow-badge-hover-bg) !important; -} - -.sha.label.isSigned.isVerifiedUnmatched { - border: 1px solid var(--color-orange-badge); - background: var(--color-orange-badge-bg); -} - -.sha.label.isSigned.isVerifiedUnmatched .signature { - border-left: 1px solid var(--color-orange-badge); - color: var(--color-orange-badge); -} - -.sha.label.isSigned.isVerifiedUnmatched:hover { - background: var(--color-orange-badge-hover-bg) !important; -} - .repository .data-table { width: 100%; }