From c5020cff3df0a7d77ff7a453a2007edc7e5c3667 Mon Sep 17 00:00:00 2001 From: silverwind Date: Sat, 24 Oct 2020 21:15:29 +0200 Subject: [PATCH] Various UI and arc-green fixes (#13291) - introduce variable for border-radius value - fix some white borders in arc-green - add text selection and placeholder in arc-green - tweak branch list footer - more things I forgot Co-authored-by: Lauris BH Co-authored-by: techknowlogick Co-authored-by: zeripath --- templates/repo/branch/list.tmpl | 2 +- templates/repo/sub_menu.tmpl | 2 +- web_src/less/_base.less | 15 ++++++- web_src/less/_repository.less | 28 +++++++++--- web_src/less/themes/theme-arc-green.less | 54 +++++++++++++++++++++--- 5 files changed, 87 insertions(+), 14 deletions(-) diff --git a/templates/repo/branch/list.tmpl b/templates/repo/branch/list.tmpl index 4f184397d..58cbe10ca 100644 --- a/templates/repo/branch/list.tmpl +++ b/templates/repo/branch/list.tmpl @@ -19,7 +19,7 @@ {{svg "octicon-shield-lock"}} {{end}} {{$.DefaultBranch}} -

{{svg "octicon-git-commit"}}{{ShortSha .Commit.ID.String}} · {{RenderCommitMessage .Commit.CommitMessage $.RepoLink $.Repository.ComposeMetas}} · {{$.i18n.Tr "org.repo_updated"}} {{TimeSince .Commit.Committer.When $.i18n.Lang}}

+

{{svg "octicon-git-commit" 16 "mr-2"}}{{ShortSha .Commit.ID.String}} · {{RenderCommitMessage .Commit.CommitMessage $.RepoLink $.Repository.ComposeMetas}} · {{$.i18n.Tr "org.repo_updated"}} {{TimeSince .Commit.Committer.When $.i18n.Lang}}

{{end}} {{end}} diff --git a/templates/repo/sub_menu.tmpl b/templates/repo/sub_menu.tmpl index 8668ab240..73d6409a9 100644 --- a/templates/repo/sub_menu.tmpl +++ b/templates/repo/sub_menu.tmpl @@ -1,4 +1,4 @@ -
+
{{if and (.Permission.CanRead $.UnitTypeCode) (not .IsEmptyRepo)}} diff --git a/web_src/less/_base.less b/web_src/less/_base.less index fdaa3c181..aeecddb8a 100644 --- a/web_src/less/_base.less +++ b/web_src/less/_base.less @@ -5,6 +5,7 @@ --fonts-emoji: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", "Twemoji Mozilla"; /* other variables */ --fonts-regular: var(--fonts-proportional), var(--fonts-emoji), sans-serif; + --border-radius: .28571429rem; } :root:lang(ja) { @@ -114,7 +115,7 @@ a { } .rounded { - border-radius: .28571429rem !important; + border-radius: var(--border-radius) !important; } .wrap { @@ -1230,6 +1231,18 @@ table th[data-sortt-desc] { } } +.ui.dropdown .menu .item { + border-radius: 0; +} + +.ui.dropdown .menu .item:first-of-type { + border-radius: var(--border-radius) var(--border-radius) 0 0; +} + +.ui.dropdown .menu .item:last-of-type { + border-radius: 0 0 var(--border-radius) var(--border-radius); +} + .text-label { display: inline-flex !important; align-items: center !important; diff --git a/web_src/less/_repository.less b/web_src/less/_repository.less index 46d8376c1..e84060b06 100644 --- a/web_src/less/_repository.less +++ b/web_src/less/_repository.less @@ -248,7 +248,7 @@ padding: 0 5px; &:first-child { - border-radius: .28571429rem 0 0 .28571429rem; + border-radius: var(--border-radius) 0 0 var(--border-radius); } } @@ -1948,7 +1948,7 @@ } .clone.button:first-child { - border-radius: .28571429rem 0 0 .28571429rem; + border-radius: var(--border-radius) 0 0 var(--border-radius); } .ui.action.small.input { @@ -2390,7 +2390,14 @@ .item { width: 100%; - border-radius: 3px; + + &:first-of-type { + border-radius: var(--border-radius) 0 0 var(--border-radius); + } + + &:last-of-type { + border-radius: 0 var(--border-radius) var(--border-radius) 0; + } a { color: black; @@ -2499,6 +2506,8 @@ } .repository-summary { + box-shadow: none !important; + .segment.language-stats-details, .segment.repository-summary { border-top: none; @@ -2528,6 +2537,15 @@ } } + .repository-menu { + padding: 0 !important; + } + + .repository-menu .item { + padding-top: 9px !important; + padding-bottom: 9px !important; + } + &.diff .committed-by { padding-top: .5rem; @@ -3228,11 +3246,11 @@ td.blob-excerpt { } .diff-file-box[data-folded="true"] .diff-file-header { - border-radius: .28571429rem !important; + border-radius: var(--border-radius) !important; } /* prevent page shaking on language bar click */ -.repository.file .repository-summary { +.repository-summary-language-stats { height: 48px; overflow: hidden; } diff --git a/web_src/less/themes/theme-arc-green.less b/web_src/less/themes/theme-arc-green.less index abae67197..f8c612625 100644 --- a/web_src/less/themes/theme-arc-green.less +++ b/web_src/less/themes/theme-arc-green.less @@ -388,6 +388,14 @@ color: #fff; } +.repository .ui.segment.sub-menu .list .item.active { + background: #404552; +} + +.ui.segments { + border-color: #454b5a; +} + .ui.horizontal.segments > .segment { background-color: #383c4a; } @@ -433,6 +441,15 @@ body { background: #87ab63 !important; } +::selection { + background: #87ab63 !important; + color: #fff !important; +} + +::placeholder { + color: #7f7f7f !important; +} + a { color: #87ab63; } @@ -535,6 +552,7 @@ a:hover { border: 1px solid #333640; } +.ui.secondary.menu .active.item, .ui.secondary.menu .dropdown.item:hover, .ui.secondary.menu .link.item:hover, .ui.secondary.menu .active.item:hover, @@ -549,6 +567,12 @@ a:hover { background: #454b5a; } +.ui.link.list .item, +.ui.link.list a.item, +.ui.link.list .item a:not(.ui) { + color: #dbdbdb; +} + .ui.menu .ui.dropdown .menu > .item { color: #9e9e9e !important; } @@ -622,8 +646,8 @@ footer { .ui.label, .ui.label.basic { color: #dbdbdb; - border-color: rgb(152, 152, 152); - background-color: #2a2e39; + border-color: #6a737d; + background-color: #353945; } .issue.list > .item .title { @@ -672,6 +696,7 @@ a.ui.basic.green.label:hover { .ui.ui.menu .item.disabled, .ui.ui.menu .item.disabled:hover { color: #626773; + opacity: 1; } .ui.disabled.checkbox label, @@ -855,7 +880,7 @@ a.ui.basic.green.label:hover { .ui.basic.button, .ui.basic.buttons .button { color: #9e9e9e; - background: rgba(0, 0, 0, .08); + background: rgba(0, 0, 0, .06); box-shadow: none; } @@ -915,8 +940,8 @@ a.ui.basic.green.label:hover { } .ui.table tbody tr { - border-color: #333640; - background: #2a2e3a; + border-color: #404552; + background: #353945; } .ui .text.grey { @@ -1245,6 +1270,11 @@ td.blob-hunk { color: #dbdbdb !important; } +.repository .filter.menu.labels .label-filter .menu .info, +.repository .filter.menu.labels .label-filter .menu .info code { + border-color: #4e5361; +} + .ui.card, .ui.cards > .card { background: #353945; @@ -1719,6 +1749,7 @@ a.ui.labels .label:hover { border-color: #634343 !important; } +.repository .labelspage .item, .organization.settings .labelspage .item, .organization.teams .repositories .item:not(:last-child), .organization.teams .members .item:not(:last-child), @@ -1727,8 +1758,14 @@ a.ui.labels .label:hover { border-bottom-color: #404552; } +.repository .labelspage .item a, +.organization.settings .labelspage .item a { + color: #6a737d; +} + +.repository .labelspage .item a:hover, .organization.settings .labelspage .item a:hover { - color: #fff; + color: #9e9e9e; } .ui.blue.button:active, @@ -1766,6 +1803,11 @@ a.ui.labels .label:hover { background: #383c4a; } +.minicolors-panel { + background: #404552 !important; + border-color: #6a737d !important; +} + .editor-toolbar { background-color: #404552; border-color: #4b505f;