third_party
/
gitea
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Dropdowns, Labels fixes and more CSS tweaks (#13733)

Browse Source 
* Dropdowns and Labels fixes

- Rework dropdown, menu and label styles
- Improve issue sidebar milestone and label sections
- Fix archived repo and private org badge
- Move more colors to CSS vars
- Move issue number to end of title on issue page

* more dropdown fixes

* fix basic blue labels - fixes #13731

* improve class setting on svg

Co-authored-by: zeripath <art27@cantab.net>
Co-authored-by: techknowlogick <techknowlogick@gitea.io>
tokarchuk/v1.17
silverwind 4 years ago committed by GitHub
parent da4bb6fc4e
commit e00a355427
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
17 changed files with 412 additions and 516 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 4
      templates/explore/repo_list.tmpl
  2. 6
      templates/org/home.tmpl
  3. 4
      templates/repo/header.tmpl
  4. 8
      templates/repo/home.tmpl
  5. 4
      templates/repo/issue/milestone_issues.tmpl
  6. 40
      templates/repo/issue/new_form.tmpl
  7. 44
      templates/repo/issue/view_content/sidebar.tmpl
  8. 3
      templates/repo/issue/view_title.tmpl
  9. 18
      templates/repo/release/new.tmpl
  10. 2
      templates/repo/sub_menu.tmpl
  11. 31
      web_src/js/index.js
  12. 19
      web_src/js/svg.js
  13. 189
      web_src/less/_base.less
  14. 41
      web_src/less/_organization.less
  15. 107
      web_src/less/_repository.less
  16. 1
      web_src/less/helpers.less
  17. 245
      web_src/less/themes/theme-arc-green.less

4
templates/explore/repo_list.tmpl
Unescape View File

@ -8,7 +8,9 @@
<a class="name" href="{{.Link}}">
{{if or $.PageIsExplore $.PageIsProfileStarList }}{{if .Owner}}{{.Owner.Name}} / {{end}}{{end}}{{.Name}}
</a>
{{if .IsArchived}}<span class="ui compact label">{{$.i18n.Tr "repo.desc.archived"}}</span>{{end}}
{{if .IsArchived}}
<span class="ui basic label">{{$.i18n.Tr "repo.desc.archived"}}</span>
{{end}}
{{if .IsTemplate}}
{{if .IsPrivate}}
<span class="ui basic label">{{$.i18n.Tr "repo.desc.private_template"}}</span>

6
templates/org/home.tmpl
Unescape View File

@ -1,5 +1,5 @@
{{template "base/head" .}}
<div class="organization profile">
<div class="organization profile mt-5">
{{/* overflow: auto is the clearfix - this avoids the image going beyond
the container where it is supposed to stay inside. */}}
<div class="ui container" style="overflow: auto">
@ -8,8 +8,8 @@
<div class="ui header">
{{.Org.DisplayName}}
<span class="org-visibility">
{{if .Org.Visibility.IsLimited}}<div class="ui large orange horizontal label">{{.i18n.Tr "org.settings.visibility.limited_shortname"}}</div>{{end}}
{{if .Org.Visibility.IsPrivate}}<div class="ui large red horizontal label">{{.i18n.Tr "org.settings.visibility.private_shortname"}}</div>{{end}}
{{if .Org.Visibility.IsLimited}}<div class="ui large basic horizontal label">{{.i18n.Tr "org.settings.visibility.limited_shortname"}}</div>{{end}}
{{if .Org.Visibility.IsPrivate}}<div class="ui large basic horizontal label">{{.i18n.Tr "org.settings.visibility.private_shortname"}}</div>{{end}}
</span>
{{if .IsOrganizationOwner}}<a class="middle text grey" href="{{.OrgLink}}/settings">{{svg "octicon-gear"}}</a>{{end}}
</div>

4
templates/repo/header.tmpl
Unescape View File

@ -28,7 +28,9 @@
{{end}}
{{end}}
{{end}}
{{if .IsArchived}}<span class="ui compact label">{{$.i18n.Tr "repo.desc.archived"}}</span>{{end}}
{{if .IsArchived}}
<span class="ui basic label">{{$.i18n.Tr "repo.desc.archived"}}</span>
{{end}}
{{if .IsMirror}}<div class="fork-flag">{{$.i18n.Tr "repo.mirror_from"}} <a target="_blank" rel="noopener noreferrer" href="{{if .SanitizedOriginalURL}}{{.SanitizedOriginalURL}}{{else}}{{MirrorAddress $.Mirror}}{{end}}">{{if .SanitizedOriginalURL}}{{.SanitizedOriginalURL}}{{else}}{{MirrorAddress $.Mirror}}{{end}}</a></div>{{end}}
{{if .IsFork}}<div class="fork-flag">{{$.i18n.Tr "repo.forked_from"}} <a href="{{.BaseRepo.Link}}">{{SubStr .BaseRepo.RelLink 1 -1}}</a></div>{{end}}
{{if .IsGenerated}}<div class="fork-flag">{{$.i18n.Tr "repo.generated_from"}} <a href="{{.TemplateRepo.Link}}">{{SubStr .TemplateRepo.RelLink 1 -1}}</a></div>{{end}}

8
templates/repo/home.tmpl
Unescape View File

@ -23,12 +23,12 @@
</div>
{{end}}
</div>
<div class="ui" id="repo-topics">
{{range .Topics}}<a class="ui repo-topic small label topic" href="{{AppSubUrl}}/explore/repos?q={{.Name}}&topic=1">{{.Name}}</a>{{end}}
{{if and .Permission.IsAdmin (not .Repository.IsArchived)}}<a id="manage_topic">{{.i18n.Tr "repo.topic.manage_topics"}}</a>{{end}}
<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 segment error" id="topic_edit" style="display:none">
<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">

4
templates/repo/issue/milestone_issues.tmpl
Unescape View File

@ -14,9 +14,9 @@
{{if not .Repository.IsArchived}}
<div class="column right aligned">
{{if or .CanWriteIssues .CanWritePulls}}
<a class="ui grey button" href="{{.RepoLink}}/milestones/{{.MilestoneID}}/edit">{{.i18n.Tr "repo.milestones.edit"}}</a>
<a class="ui button" href="{{.RepoLink}}/milestones/{{.MilestoneID}}/edit">{{.i18n.Tr "repo.milestones.edit"}}</a>
{{end}}
<a class="ui green button" href="{{.RepoLink}}/issues/new{{if .NewIssueChooseTemplate}}/choose{{end}}?milestone={{.MilestoneID}}">{{.i18n.Tr "repo.issues.new"}}</a>
<a class="ui primary button" href="{{.RepoLink}}/issues/new{{if .NewIssueChooseTemplate}}/choose{{end}}?milestone={{.MilestoneID}}">{{.i18n.Tr "repo.issues.new"}}</a>
</div>
{{end}}
</div>

40
templates/repo/issue/new_form.tmpl
Unescape View File

@ -99,21 +99,25 @@
{{if .OpenMilestones}}
<div class="divider"></div>
<div class="header">
{{svg "octicon-milestone"}}
{{.i18n.Tr "repo.issues.new.open_milestone"}}
</div>
{{range .OpenMilestones}}
<div class="item" data-id="{{.ID}}" data-href="{{$.RepoLink}}/issues?milestone={{.ID}}"> {{.Name}}</div>
<a class="item" data-id="{{.ID}}" data-href="{{$.RepoLink}}/issues?milestone={{.ID}}">
{{svg "octicon-milestone" 16 "mr-2"}}
{{.Name}}
</a>
{{end}}
{{end}}
{{if .ClosedMilestones}}
<div class="divider"></div>
<div class="header">
{{svg "octicon-milestone"}}
{{.i18n.Tr "repo.issues.new.closed_milestone"}}
</div>
{{range .ClosedMilestones}}
<a class="item" data-id="{{.ID}}" data-href="{{$.RepoLink}}/issues?milestone={{.ID}}"> {{.Name}}</a>
<a class="item" data-id="{{.ID}}" data-href="{{$.RepoLink}}/issues?milestone={{.ID}}">
{{svg "octicon-milestone" 16 "mr-2"}}
{{.Name}}
</a>
{{end}}
{{end}}
{{end}}
@ -123,7 +127,10 @@
<span class="no-select item {{if .Milestone}}hide{{end}}">{{.i18n.Tr "repo.issues.new.no_milestone"}}</span>
<div class="selected">
{{if .Milestone}}
<a class="item" href="{{.RepoLink}}/issues?milestone={{.Milestone.ID}}"> {{.Milestone.Name}}</a>
<a class="item muted sidebar-item-link" href="{{.RepoLink}}/issues?milestone={{.Milestone.ID}}">
{{svg "octicon-milestone" 18 "mr-3"}}
{{.Milestone.Name}}
</a>
{{end}}
</div>
</div>
@ -156,21 +163,25 @@
{{if .OpenProjects}}
<div class="divider"></div>
<div class="header">
{{svg "octicon-project"}}
{{.i18n.Tr "repo.issues.new.open_projects"}}
</div>
{{range .OpenProjects}}
<div class="item" data-id="{{.ID}}" data-href="{{$.RepoLink}}/projects/{{.ID}}">{{.Title}}</div>
<a class="item muted sidebar-item-link" data-id="{{.ID}}" data-href="{{$.RepoLink}}/projects/{{.ID}}">
{{svg "octicon-project" 18 "mr-3"}}
{{.Title}}
</a>
{{end}}
{{end}}
{{if .ClosedProjects}}
<div class="divider"></div>
<div class="header">
{{svg "octicon-project"}}
{{.i18n.Tr "repo.issues.new.closed_projects"}}
</div>
{{range .ClosedProjects}}
<a class="item" data-id="{{.ID}}" data-href="{{$.RepoLink}}/projects/{{.ID}}">{{.Title}}</a>
<a class="item muted sidebar-item-link" data-id="{{.ID}}" data-href="{{$.RepoLink}}/projects/{{.ID}}">
{{svg "octicon-project" 18 "mr-3"}}
{{.Title}}
</a>
{{end}}
{{end}}
{{end}}
@ -180,14 +191,15 @@
<span class="no-select item {{if .Project}}hide{{end}}">{{.i18n.Tr "repo.issues.new.no_projects"}}</span>
<div class="selected">
{{if .Project}}
<a class="item" href="{{.RepoLink}}/projects/{{.Project.ID}}">{{.Project.Title}}</a>
<a class="item muted sidebar-item-link" href="{{.RepoLink}}/projects/{{.Project.ID}}">
{{svg "octicon-project" 18 "mr-3"}}
{{.Project.Title}}
</a>
{{end}}
</div>
</div>
{{end}}
<div class="ui divider"></div>
<input id="assignee_ids" name="assignee_ids" type="hidden" value="{{.assignee_ids}}">
<div class="ui {{if not .HasIssuesOrPullsWritePermission}}disabled{{end}} floating jump select-assignees dropdown">
<span class="text">
@ -204,7 +216,7 @@
</div>
<div class="no-select item">{{.i18n.Tr "repo.issues.new.clear_assignees"}}</div>
{{range .Assignees}}
<a class="item" href="#" data-id="{{.ID}}" data-id-selector="#assignee_{{.ID}}">
<a class="item muted" href="#" data-id="{{.ID}}" data-id-selector="#assignee_{{.ID}}">
<span class="octicon-check invisible">{{svg "octicon-check"}}</span>
<span class="text">
<img class="ui avatar image" src="{{.RelAvatarLink}}"> {{.GetDisplayName}}
@ -218,7 +230,7 @@
{{.i18n.Tr "repo.issues.new.no_assignees"}}
</span>
{{range .Assignees}}
<a style="padding: 5px;color:rgba(0, 0, 0, 0.87);" class="hide item" id="assignee_{{.ID}}" href="{{$.RepoLink}}/issues?assignee={{.ID}}">
<a class="hide item p-2 muted" id="assignee_{{.ID}}" href="{{$.RepoLink}}/issues?assignee={{.ID}}">
<img class="ui avatar image" src="{{.RelAvatarLink}}" style="vertical-align: middle;">&nbsp;{{.GetDisplayName}}
</a>
{{end}}

44
templates/repo/issue/view_content/sidebar.tmpl
Unescape View File

@ -55,8 +55,8 @@
{{range .PullReviewers}}
<div class="item mb-2">
{{if .User}}
<a href="{{.User.HomeLink}}">
<img class="ui avatar image mr-2" src="{{.User.RelAvatarLink}}">
<a class="muted sidebar-item-link" href="{{.User.HomeLink}}">
<img class="ui avatar image mr-3" src="{{.User.RelAvatarLink}}">
{{.User.GetDisplayName}}
</a>
{{else if .Team}}
@ -153,21 +153,25 @@
{{if .OpenMilestones}}
<div class="divider"></div>
<div class="header">
{{svg "octicon-milestone"}}
{{.i18n.Tr "repo.issues.new.open_milestone"}}
</div>
{{range .OpenMilestones}}
<div class="item" data-id="{{.ID}}" data-href="{{$.RepoLink}}/issues?milestone={{.ID}}"> {{.Name}}</div>
<a class="item" data-id="{{.ID}}" data-href="{{$.RepoLink}}/issues?milestone={{.ID}}">
{{svg "octicon-milestone" 16 "mr-2"}}
{{.Name}}
</a>
{{end}}
{{end}}
{{if .ClosedMilestones}}
<div class="divider"></div>
<div class="header">
{{svg "octicon-milestone"}}
{{.i18n.Tr "repo.issues.new.closed_milestone"}}
</div>
{{range .ClosedMilestones}}
<a class="item" data-id="{{.ID}}" data-href="{{$.RepoLink}}/issues?milestone={{.ID}}"> {{.Name}}</a>
<a class="item" data-id="{{.ID}}" data-href="{{$.RepoLink}}/issues?milestone={{.ID}}">
{{svg "octicon-milestone" 16 "mr-2"}}
{{.Name}}
</a>
{{end}}
{{end}}
{{end}}
@ -177,7 +181,10 @@
<span class="no-select item {{if .Issue.Milestone}}hide{{end}}">{{.i18n.Tr "repo.issues.new.no_milestone"}}</span>
<div class="selected">
{{if .Issue.Milestone}}
<a class="item" href="{{.RepoLink}}/milestone/{{.Issue.Milestone.ID}}"> {{.Issue.Milestone.Name}}</a>
<a class="item muted sidebar-item-link" href="{{.RepoLink}}/milestone/{{.Issue.Milestone.ID}}">
{{svg "octicon-milestone" 18 "mr-3"}}
{{.Issue.Milestone.Name}}
</a>
{{end}}
</div>
</div>
@ -195,21 +202,25 @@
{{if .OpenProjects}}
<div class="divider"></div>
<div class="header">
{{svg "octicon-project"}}
{{.i18n.Tr "repo.issues.new.open_projects"}}
</div>
{{range .OpenProjects}}
<div class="item" data-id="{{.ID}}" data-href="{{$.RepoLink}}/projects/{{.ID}}">{{svg "octicon-project"}} {{.Title}}</div>
<a class="item muted sidebar-item-link" data-id="{{.ID}}" data-href="{{$.RepoLink}}/projects/{{.ID}}">
{{svg "octicon-project" 18 "mr-3"}}
{{.Title}}
</a>
{{end}}
{{end}}
{{if .ClosedProjects}}
<div class="divider"></div>
<div class="header">
{{svg "octicon-project"}}
{{.i18n.Tr "repo.issues.new.closed_projects"}}
</div>
{{range .ClosedProjects}}
<a class="item" data-id="{{.ID}}" data-href="{{$.RepoLink}}/projects/{{.ID}}">{{svg "octicon-project"}} {{.Title}}</a>
<a class="item muted sidebar-item-link" data-id="{{.ID}}" data-href="{{$.RepoLink}}/projects/{{.ID}}">
{{svg "octicon-project" 18 "mr-3"}}
{{.Title}}
</a>
{{end}}
{{end}}
</div>
@ -218,7 +229,10 @@
<span class="no-select item {{if .Issue.ProjectID}}hide{{end}}">{{.i18n.Tr "repo.issues.new.no_projects"}}</span>
<div class="selected">
{{if .Issue.ProjectID}}
<a class="item" href="{{.RepoLink}}/projects/{{.Issue.ProjectID}}">{{svg "octicon-project"}} {{.Issue.Project.Title}}</a>
<a class="item muted sidebar-item-link" href="{{.RepoLink}}/projects/{{.Issue.ProjectID}}">
{{svg "octicon-project" 18 "mr-3"}}
{{.Issue.Project.Title}}
</a>
{{end}}
</div>
</div>
@ -264,9 +278,9 @@
<span class="no-select item {{if .Issue.Assignees}}hide{{end}}">{{.i18n.Tr "repo.issues.new.no_assignees"}}</span>
<div class="selected">
{{range .Issue.Assignees}}
<div class="item" style="margin-bottom: 10px;">
<a href="{{$.RepoLink}}/{{if $.Issue.IsPull}}pulls{{else}}issues{{end}}?assignee={{.ID}}">
<img class="ui avatar image mr-2" src="{{.RelAvatarLink}}">
<div class="item">
<a class="muted sidebar-item-link" href="{{$.RepoLink}}/{{if $.Issue.IsPull}}pulls{{else}}issues{{end}}?assignee={{.ID}}">
<img class="ui avatar image mr-3" src="{{.RelAvatarLink}}">
{{.GetDisplayName}}
</a>
</div>

3
templates/repo/issue/view_title.tmpl
Unescape View File

@ -6,7 +6,8 @@
</div>
{{end}}
<h1>
<span class="index">#{{.Issue.Index}}</span> <span id="issue-title">{{RenderEmoji .Issue.Title}}</span>
<span id="issue-title">{{RenderEmoji .Issue.Title}}</span>
<span class="index">#{{.Issue.Index}}</span>
<div id="edit-title-input" class="ui input" style="display: none">
<input value="{{.Issue.Title}}" maxlength="255">
</div>

18
templates/repo/release/new.tmpl
Unescape View File

@ -67,27 +67,27 @@
<span class="help">{{.i18n.Tr "repo.release.prerelease_helper"}}</span>
<div class="field">
{{if .PageIsEditRelease}}
<a class="ui blue basic button" href="{{.RepoLink}}/releases">
<a class="ui button" href="{{.RepoLink}}/releases">
{{.i18n.Tr "repo.release.cancel"}}
</a>
<a class="ui red button delete-button" data-url="{{$.RepoLink}}/releases/delete" data-id="{{.ID}}">
{{$.i18n.Tr "repo.release.delete_release"}}
</a>
{{if .IsDraft}}
<input class="ui grey button" type="submit" name="draft" value="{{.i18n.Tr "repo.release.save_draft"}}"/>
<button class="ui green button">
<input class="ui button" type="submit" name="draft" value="{{.i18n.Tr "repo.release.save_draft"}}"/>
<button class="ui primary button">
{{.i18n.Tr "repo.release.publish"}}
</button>
{{else}}
<button class="ui green button">
<button class="ui primary button">
{{.i18n.Tr "repo.release.edit_release"}}
</button>
{{end}}
<a class="ui red button delete-button" data-url="{{$.RepoLink}}/releases/delete" data-id="{{.ID}}">
{{$.i18n.Tr "repo.release.delete_release"}}
</a>
{{else}}
<button class="ui green button">
<input class="ui button" type="submit" name="draft" value="{{.i18n.Tr "repo.release.save_draft"}}"/>
<button class="ui primary button">
{{.i18n.Tr "repo.release.publish"}}
</button>
<input class="ui grey button" type="submit" name="draft" value="{{.i18n.Tr "repo.release.save_draft"}}"/>
{{end}}
</div>
</div>

2
templates/repo/sub_menu.tmpl
Unescape View File

@ -1,4 +1,4 @@
<div class="ui segments repository-summary{{if and (.Permission.CanRead $.UnitTypeCode) (not .IsEmptyRepo) .LanguageStats }} repository-summary-language-stats{{end}}">
<div class="ui segments repository-summary{{if and (.Permission.CanRead $.UnitTypeCode) (not .IsEmptyRepo) .LanguageStats }} repository-summary-language-stats{{end}} mt-3">
<div class="ui segment sub-menu repository-menu">
<div class="ui two horizontal center link list">
{{if and (.Permission.CanRead $.UnitTypeCode) (not .IsEmptyRepo)}}

31
web_src/js/index.js
Unescape View File

@ -517,20 +517,23 @@ function initCommentForm() {
$(this).data('id'),
).then(reload);
}
switch (input_id) {
case '#milestone_id':
$list.find('.selected').html(`<a class="item" href=${$(this).data('href')}>${
htmlEscape($(this).text())}</a>`);
break;
case '#project_id':
$list.find('.selected').html(`<a class="item" href=${$(this).data('href')}>${
htmlEscape($(this).text())}</a>`);
break;
case '#assignee_id':
$list.find('.selected').html(`<a class="item" href=${$(this).data('href')}>` +
`<img class="ui avatar image" src=${$(this).data('avatar')}>${
htmlEscape($(this).text())}</a>`);
let icon = '';
if (input_id === '#milestone_id') {
icon = svg('octicon-milestone', 18, 'mr-3');
} else if (input_id === '#project_id') {
icon = svg('octicon-project', 18, 'mr-3');
} else if (input_id === '#assignee_id') {
icon = `<img class="ui avatar image mr-3" src=${$(this).data('avatar')}>`;
}
$list.find('.selected').html(`
<a class="item muted sidebar-item-link" href=${$(this).data('href')}>
${icon}
${htmlEscape($(this).text())}
</a>
`);
$(`.ui${select_id}.list .no-select`).addClass('hide');
$(input_id).val($(this).data('id'));
});
@ -3324,7 +3327,7 @@ function initTopicbar() {
const last = viewDiv.children('a').last();
for (let i = 0; i < topicArray.length; i++) {
const link = $('<a class="ui repo-topic small label topic"></a>');
const link = $('<a class="ui repo-topic large label topic"></a>');
link.attr('href', `${AppSubUrl}/explore/repos?q=${encodeURIComponent(topicArray[i])}&topic=1`);
link.text(topicArray[i]);
link.insertBefore(last);

19
web_src/js/svg.js
Unescape View File

@ -6,7 +6,9 @@ import octiconIssueClosed from '../../public/img/svg/octicon-issue-closed.svg';
import octiconIssueOpened from '../../public/img/svg/octicon-issue-opened.svg';
import octiconLink from '../../public/img/svg/octicon-link.svg';
import octiconLock from '../../public/img/svg/octicon-lock.svg';
import octiconMilestone from '../../public/img/svg/octicon-milestone.svg';
import octiconMirror from '../../public/img/svg/octicon-mirror.svg';
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';
@ -20,7 +22,9 @@ export const svgs = {
'octicon-issue-opened': octiconIssueOpened,
'octicon-link': octiconLink,
'octicon-lock': octiconLock,
'octicon-milestone': octiconMilestone,
'octicon-mirror': octiconMirror,
'octicon-project': octiconProject,
'octicon-repo': octiconRepo,
'octicon-repo-forked': octiconRepoForked,
'octicon-repo-template': octiconRepoTemplate,
@ -29,16 +33,15 @@ export const svgs = {
const parser = new DOMParser();
const serializer = new XMLSerializer();
// retrieve a HTML string for given SVG icon name and size in pixels
export function svg(name, size = 16) {
if (name in svgs) {
if (size === 16) return svgs[name];
// retrieve a HTML string for given SVG icon name, size and additional classes
export function svg(name, size = 16, className = '') {
if (!(name in svgs)) return '';
if (size === 16 && !className) return svgs[name];
const document = parser.parseFromString(svgs[name], 'image/svg+xml');
const svgNode = document.firstChild;
svgNode.setAttribute('width', String(size));
svgNode.setAttribute('height', String(size));
if (size !== 16) svgNode.setAttribute('width', String(size));
if (size !== 16) svgNode.setAttribute('height', String(size));
if (className) svgNode.classList.add(...className.split(/\s+/));
return serializer.serializeToString(svgNode);
}
return '';
}

189
web_src/less/_base.less
Unescape View File

@ -77,14 +77,23 @@
--color-body: #ffffff;
--color-text: #212121;
--color-text-light: #444444;
--color-text-light-2: #888888;
--color-box-header: #f7f7f7;
--color-box-body: #ffffff;
--color-footer: #ffffff;
--color-timeline: #ececec;
--color-input-text: #212121;
--color-input-background: #ffffff;
--color-input-border: #dedede;
--color-input-border-hover: #cecece;
--color-navbar: #f8f8f8;
--color-label: #00000010;
--color-label-hover: #00000015;
--color-label-basic: #00000008;
--color-label-border: #00000018;
--color-hover: #0000000d;
--color-active: #00000014;
--color-menu: #ffffff;
}
:root:lang(ja) {
@ -212,7 +221,12 @@ a,
cursor: pointer;
}
a.muted {
color: inherit;
}
a:hover,
a.muted:hover,
.ui.breadcrumb a:hover {
color: var(--color-primary-dark-2);
}
@ -226,6 +240,104 @@ a:hover,
border-right-color: var(--color-primary);
}
.ui.menu {
background: var(--color-menu);
border-color: var(--color-secondary);
}
.ui.menu .item {
color: var(--color-text);
}
.ui.link.menu .item:hover,
.ui.menu .dropdown.item:hover,
.ui.menu .link.item:hover,
.ui.menu a.item:hover {
color: var(--color-text);
background: var(--color-hover);
}
.ui.menu .active.item,
.ui.menu .active.item:hover,
.ui.vertical.menu .active.item:hover {
color: var(--color-text);
background: var(--color-active);
}
.ui.link.menu .item:active,
.ui.menu .link.item:active,
.ui.menu a.item:active {
color: var(--color-text);
background: none;
}
.ui.dropdown .menu {
background: var(--color-menu);
border-color: var(--color-secondary);
}
.ui.dropdown .menu > .header:not(.ui) {
color: var(--color-text);
}
.ui.dropdown .menu > .item {
color: var(--color-text);
}
.ui.dropdown .menu > .item:hover {
color: var(--color-text);
background: var(--color-hover);
}
.ui.dropdown .menu .active.item {
font-weight: normal;
}
.ui.selection.dropdown .menu > .item {
border-color: var(--color-secondary);
}
.ui.selection.visible.dropdown > .text:not(.default) {
color: var(--color-text);
}
.ui.dropdown.selected,
.ui.dropdown .menu .selected.item {
color: var(--color-text);
background: var(--color-hover);
}
.ui.secondary.menu .dropdown.item:hover,
.ui.secondary.menu .link.item:hover,
.ui.secondary.menu a.item:hover {
color: var(--color-text);
background: var(--color-hover);
}
.ui.secondary.menu .active.item,
.ui.secondary.menu .active.item:hover {
color: var(--color-text);
background: var(--color-active);
}
.ui.menu .dropdown.item .menu {
background: var(--color-menu);
}
.ui.menu .ui.dropdown .menu > .item {
color: var(--color-text) !important;
}
.ui.menu .ui.dropdown .menu > .item:hover {
color: var(--color-text) !important;
background: var(--color-hover) !important;
}
.ui.menu .ui.dropdown .menu > .active.item {
color: var(--color-text) !important;
background: var(--color-active) !important;
}
.ui.selection.active.dropdown,
.ui.selection.active.dropdown:hover,
.ui.selection.active.dropdown .menu,
@ -749,13 +861,13 @@ a:hover,
}
.migrate {
color: #888888 !important;
color: var(--color-text-light-2) !important;
opacity: .5;
a {
color: #444444 !important;
color: var(--color-text-light) !important;
&:hover {
color: #000000 !important;
color: var(--color-text) !important;
}
}
}
@ -865,11 +977,11 @@ a:hover,
}
footer {
background-color: white;
border-top: 1px solid #d6d6d6;
background-color: var(--color-footer);
border-top: 1px solid var(--color-secondary);
width: 100%;
flex-basis: 40px;
color: #888888;
color: var(--color-text-light);
.container {
width: 100vw !important;
@ -883,7 +995,7 @@ footer {
}
.links > * {
border-left: 1px solid #d6d6d6;
border-left: 1px solid var(--color-secondary);
padding-left: 8px;
margin-left: 5px;
@ -1110,6 +1222,21 @@ i.icon.centerlock {
.ui.label {
padding: .3em .5em;
background: var(--color-label);
color: var(--color-text-light);
}
.ui.labels a.label:hover,
a.ui.label:hover {
background: var(--color-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.label > .detail .icons {
@ -1331,9 +1458,9 @@ i.icon.centerlock {
.ui.ui.ui.basic.blue.label,
.ui.basic.labels .primary.label,
.ui.ui.ui.basic.primary.label {
background: transparent;
border-color: var(--color-primary);
color: var(--color-primary);
background: transparent !important;
border-color: var(--color-primary) !important;
color: var(--color-primary) !important;
}
.ui.label > img {
@ -1503,6 +1630,48 @@ table th[data-sortt-desc] {
vertical-align: -.15em;
}
.labelspage {
list-style: none;
padding-top: 0;
.item {
margin-top: 0;
margin-right: -14px;
margin-left: -14px;
padding: 10px;
border-bottom: 1px solid var(--color-secondary);
border-top: none;
a {
font-size: 15px;
padding-top: 5px;
padding-right: 10px;
color: var(--color-text-light);
&:hover {
color: var(--color-primary-light-2);
}
&.open-issues {
margin-right: 30px;
}
}
.ui.label {
font-size: 1em;
}
}
.item:last-child {
border-bottom: none;
padding-bottom: 0;
}
.orglabel {
opacity: .7;
}
}
/* https://github.com/go-gitea/gitea/pull/11486 */
.ui.sub.header {
text-transform: none;

41
web_src/less/_organization.less
Unescape View File

@ -173,45 +173,4 @@
height: 60px;
}
}
&.settings {
.labelspage {
list-style: none;
padding-top: 0;
.item {
margin-top: 0;
margin-right: -14px;
margin-left: -14px !important;
padding: 10px;
border-bottom: 1px solid var(--color-secondary);
border-top: none;
a {
font-size: 15px;
padding-top: 5px;
padding-right: 10px;
color: #666666;
&:hover {
color: #000000;
}
&.open-issues {
margin-right: 30px;
}
}
.ui.label {
font-size: 1em;
}
}
.item:last-child {
border-bottom: none;
padding-bottom: 0;
}
}
}
}

107
web_src/less/_repository.less
Unescape View File

@ -165,14 +165,14 @@
.label-filter .menu .info {
display: inline-block;
padding: .5rem .25rem;
border-bottom: 1px solid #cccccc;
border-bottom: 1px solid var(--color-secondary);
font-size: 12px;
width: 100%;
white-space: nowrap;
text-align: center;
code {
border: 1px solid #cccccc;
border: 1px solid var(--color-secondary);
border-radius: 3px;
padding: 1px 2px;
font-size: 11px;
@ -388,7 +388,7 @@
}
.jumpable-path {
color: #888888;
color: var(--color-text-light-2);
}
}
@ -684,9 +684,7 @@
}
.index {
font-weight: 300;
color: #aaaaaa;
letter-spacing: -1px;
color: var(--color-text-light-2);
}
.label {
@ -828,7 +826,9 @@
.avatar.image img {
width: 20px;
height: 20px;
margin-right: .15em;
margin-right: .5rem;
position: relative;
top: -2px;
}
&:first-child:not(.commit) {
@ -853,7 +853,7 @@
float: left;
margin-left: -33px;
margin-right: 8px;
color: #666;
color: var(--color-text-light-2);
align-items: center;
justify-content: center;
@ -1069,11 +1069,11 @@
span.ui.image {
font-size: 128px;
color: #000000;
color: var(--color-text);
}
span.ui.image:hover {
color: #000000;
color: var(--color-text);
}
}
}
@ -1218,49 +1218,6 @@
}
}
.labelspage {
list-style: none;
padding-top: 0;
.item {
margin-top: 0;
margin-right: -14px;
margin-left: -14px;
padding: 10px;
border-bottom: 1px solid var(--color-secondary);
border-top: none;
a {
font-size: 15px;
padding-top: 5px;
padding-right: 10px;
color: #666666;
&:hover {
color: #000000;
}
&.open-issues {
margin-right: 30px;
}
}
.ui.label {
font-size: 1em;
}
}
.item:last-child {
border-bottom: none;
padding-bottom: 0;
}
.orglabel {
opacity: .7;
}
}
.milestone.list {
list-style: none;
padding-top: 15px;
@ -1268,12 +1225,12 @@
> .item {
padding-top: 10px;
padding-bottom: 10px;
border-bottom: 1px dashed #aaaaaa;
border-bottom: 1px dashed var(--color-secondary);
> a {
padding-top: 5px;
padding-right: 10px;
color: #000000;
color: var(--color-text);
&:hover {
color: var(--color-primary);
@ -1292,7 +1249,7 @@
}
.meta {
color: #999999;
color: var(--color-text-light-2);
padding-top: 5px;
.issue-stats .svg {
@ -1311,10 +1268,10 @@
font-size: 15px;
padding-top: 5px;
padding-right: 10px;
color: #666666;
color: var(--color-text-light-2);
&:hover {
color: #000000;
color: var(--color-text);
}
}
}
@ -1651,7 +1608,7 @@
.file {
flex: 1;
color: #888888;
color: var(--color-text-light-2);
word-break: break-all;
}
@ -2243,7 +2200,7 @@
color: #6cc644;
.pull-right {
color: #000;
color: var(--color-text);
}
.ui.text {
@ -2327,19 +2284,19 @@
}
a {
color: black;
color: var(--color-text);
&:hover {
color: #666666;
color: var(--color-primary-light-2);
}
}
span.ui {
color: black;
color: var(--color-text);
}
&.active {
background: rgba(0, 0, 0, .05);
background: var(--color-secondary);
}
}
}
@ -2649,7 +2606,7 @@
&.key {
.meta {
padding-top: 5px;
color: #666666;
color: var(--color-text-light-2);
}
}
@ -2979,10 +2936,15 @@ tbody.commit-list {
#repo-topics {
margin-top: 5px;
display: flex;
align-items: center;
flex-wrap: wrap;
}
.repo-topic {
font-weight: normal !important;
cursor: pointer;
margin: 2px !important;
}
#new-dependency-drop-list {
@ -3189,6 +3151,11 @@ td.blob-excerpt {
margin-top: 1em;
}
.sidebar-item-link {
display: inline-flex;
align-items: center;
}
.diff-file-box[data-folded="true"] .diff-file-body {
display: none;
}
@ -3226,16 +3193,6 @@ td.blob-excerpt {
}
}
.select-project .item {
color: inherit;
display: inline-flex;
align-items: center;
}
.select-project .item .svg {
margin-right: .5rem;
}
.migrate .cards .card {
text-align: center;
}

1
web_src/less/helpers.less
Unescape View File

@ -1,4 +1,5 @@
.df { display: flex !important; }
.dif { display: inline-flex !important; }
.ac { align-items: center !important; }
.jc { justify-content: center !important; }
.js { justify-content: flex-start !important; }

245
web_src/less/themes/theme-arc-green.less
Unescape View File

@ -74,12 +74,21 @@
--color-box-body: #353945;
--color-text: #bbc0ca;
--color-text-light: #969aa5;
--color-text-light-2: #666a75;
--color-footer: #2e323e;
--color-timeline: #4a505c;
--color-input-text: #d5dbe6;
--color-input-background: #2e323e;
--color-input-border: #454a57;
--color-input-border-hover: #505667;
--color-navbar: #2a2e3a;
--color-label: #ffffff10;
--color-label-hover: #ffffff20;
--color-label-basic: #00000016;
--color-label-border: #ffffff28;
--color-hover: #ffffff0d;
--color-active: #ffffff14;
--color-menu: #2e323e;
}
/* Background */
@ -460,22 +469,6 @@
color: #bbbbbb;
}
.repository .ui.segment.sub-menu .list .item {
color: #dbdbdb;
a,
span.ui {
color: #dbdbdb;
}
}
.repository .ui.segment.sub-menu .list .item a:hover {
color: #fff;
}
.repository .ui.segment.sub-menu .list .item.active {
background: var(--color-secondary);
}
.repository.branches .commit-divergence .bar {
background: #6a737d;
}
@ -508,55 +501,6 @@ body {
box-shadow: 1px 1px 0 0 #1b1c1d !important; /* .ui.inverted.popup */
}
.ui.card > .extra a:not(.ui):hover,
.ui.cards > .card > .extra a:not(.ui):hover {
color: #a0cc75;
}
.ui.breadcrumb a:hover {
color: #a0cc75;
}
.ui.breadcrumb a {
color: #87ab63;
}
.repository .metas .ui.list a .text {
color: #87ab63;
}
.repository .metas .ui.list a .text:hover {
color: #a0cc75;
}
.repository .label.list .item a {
color: #87ab63;
}
.repository .label.list .item a:hover {
color: #a0cc75;
}
.repository .milestone.list > .item {
border-bottom-color: var(--color-secondary);
}
.repository .milestone.list > .item > a {
color: #87ab63;
}
.repository .milestone.list > .item > a:hover {
color: #a0cc75;
}
.repository .milestone.list > .item .operate > a {
color: #87ab63;
}
.repository .milestone.list > .item .operate > a:hover {
color: #a0cc75;
}
.ui.green.progress .bar {
background-color: #668844;
}
@ -570,14 +514,6 @@ body {
border-color: var(--color-secondary-alpha-40);
}
.ui.secondary.menu .active.item {
color: #dbdbdb;
}
.ui.secondary.menu .item {
color: var(--color-secondary-dark-6);
}
.following.bar .top.menu a.item:hover {
color: #fff;
}
@ -586,68 +522,12 @@ body {
background: #353945;
}
.ui.secondary.menu .active.item,
.ui.secondary.menu .dropdown.item:hover,
.ui.secondary.menu .link.item:hover,
.ui.secondary.menu .active.item:hover,
.ui.secondary.menu a.item:hover,
.ui.dropdown .menu .active.item,
.ui.link.menu .item:hover,
.ui.menu .dropdown.item:hover,
.ui.menu .link.item:hover,
.ui.menu a.item:hover,
.ui.menu .active.item {
color: #dbdbdb;
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: var(--color-secondary-dark-6) !important;
}
.ui.menu .ui.dropdown .menu > .item:hover,
.ui.menu .ui.dropdown .menu > .selected.item {
color: #dbdbdb !important;
background: #454b5a !important;
}
.ui.secondary.menu .dropdown.item > .menu,
.ui.text.menu .dropdown.item > .menu {
border: 1px solid #434444;
}
footer {
background: #2e323e;
border-top: 1px solid #313131;
color: #bababa;
}
.ui.menu .dropdown.item .menu {
background: #2c303a;
}
.ui.dropdown .menu > .header,
.ui.dropdown .menu > .header:not(.ui) {
color: #dbdbdb;
}
.ui.labels a.label:hover,
a.ui.label:hover {
background: #454b5a;
color: #dbdbdb;
}
.ui.basic.labels a.label:hover,
a.ui.basic.label:hover {
background: var(--color-body);
}
.ui.red.label,
.ui.red.labels .label {
background-color: #7d3434 !important;
@ -660,28 +540,10 @@ a.ui.basic.label:hover {
background-color: #936e00 !important;
}
.ui.menu {
background: var(--color-secondary);
border: 1px solid #353945;
}
.ui.menu .active.item:hover,
.ui.vertical.menu .active.item:hover {
color: #dbdbdb;
background: #4b5162;
}
.ui.accordion .title:not(.ui) {
color: #dbdbdb;
}
.ui.label,
.ui.label.basic {
color: #dbdbdb;
border-color: #6a737d;
background-color: #383c4a;
}
.ui.green.label,
.ui.green.labels .label,
.ui.basic.green.label {
@ -704,24 +566,6 @@ a.ui.basic.green.label:hover {
color: #b75252 !important;
}
.ui.menu .item {
background: var(--color-secondary);
color: var(--color-secondary-dark-6);
}
.ui.menu .item.disabled,
.ui.menu .item.disabled:hover,
.ui.ui.menu .item.disabled,
.ui.ui.menu .item.disabled:hover {
color: #626773;
opacity: 1;
}
.ui.pagination.menu .active.item {
color: #fff;
background-color: #87ab63;
}
.ui.header,
.ui.breadcrumb .divider {
color: var(--color-secondary-dark-6);
@ -732,10 +576,6 @@ a.ui.basic.green.label:hover {
border-top-color: transparent;
}
.ui.menu .item > .label {
background: #505667;
}
.form .help {
color: #7f8699;
}
@ -827,12 +667,6 @@ a.ui.basic.green.label:hover {
box-shadow: none;
}
.ui.blue.label,
.ui.blue.labels .label {
background-color: var(--color-primary-light-2) !important;
border-color: var(--color-primary) !important;
}
.ui.labeled.button:not([class*="left labeled"]) > .label,
.ui[class*="left labeled"].button > .button {
background: var(--color-secondary);
@ -917,14 +751,6 @@ a.ui.basic.green.label:hover {
}
}
.ui.dropdown .menu {
background: #2c303a;
}
.ui.dropdown .menu > .message:not(.ui) {
color: #636363;
}
.overflow.menu .items .item {
color: #9d9d9d;
}
@ -950,20 +776,6 @@ a.ui.basic.green.label:hover {
color: #dbdbdb;
}
.ui.dropdown .menu .selected.item,
.ui.dropdown.selected {
color: #dbdbdb;
}
.ui.dropdown .menu > .item:hover {
color: #dbdbdb;
background: #353945;
}
.ui.dropdown .menu > .item {
color: var(--color-secondary-dark-6);
}
.repository.view.issue .comment-list .event > .svg.issue-symbol {
background: #3b4954;
}
@ -1081,22 +893,6 @@ td.blob-hunk {
border: 1px solid #333640;
}
.ui.selection.active.dropdown,
.ui.selection.active.dropdown:hover,
.ui.selection.active.dropdown .menu,
.ui.selection.active.dropdown:hover .menu {
box-shadow: 0 2px 3px 0 rgba(0, 0, 0, .1);
}
.ui.menu .ui.dropdown .menu > .active.item {
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;
@ -1186,14 +982,6 @@ td.blob-hunk {
background-color: #984646;
}
.ui.selection.dropdown .menu > .item {
border-top: 1px solid #313c47;
}
.ui.selection.visible.dropdown > .text:not(.default) {
color: var(--color-secondary-dark-6);
}
.ui.positive.message {
background-color: #0d491b;
color: #87ab63;
@ -1320,7 +1108,6 @@ a.blob-excerpt:hover {
.ui.text {
color: var(--color-secondary-dark-6);
}
.pull-right,
a {
color: #c2c193;
}
@ -1335,7 +1122,6 @@ a.blob-excerpt:hover {
.ui.text {
color: var(--color-secondary-dark-6);
}
.pull-right,
a {
color: #c2a893;
}
@ -1349,9 +1135,6 @@ a.blob-excerpt:hover {
.ui.text {
color: #d07d7d;
}
.pull-right {
color: var(--color-secondary-dark-6);
}
}
}
@ -1385,16 +1168,6 @@ a.blob-excerpt:hover {
border-color: #634343 !important;
}
.repository .labelspage .item a,
.organization.settings .labelspage .item a {
color: #6a737d;
}
.repository .labelspage .item a:hover,
.organization.settings .labelspage .item a:hover {
color: var(--color-secondary-dark-6);
}
.ui.header .sub.header {
color: var(--color-secondary-dark-6);
}

Write Preview
Loading…
Cancel
Save