tdsds.com/gitea
1
1
Fork 0
mirror of https://github.com/go-gitea/gitea synced 2025-07-23 10:48:37 +00:00
Code Releases Activity

Replace code fold icons with octicons (#12222)

Browse Source 
- replace font-awesome icons with octicons
- clean up js and css surrounding the code expansion and file folding
- fix hover color on arc-green
- tweak diff line number colors

Co-authored-by: zeripath <art27@cantab.net>
This commit is contained in:
silverwind
2020-07-13 15:21:19 +02:00
committed by GitHub
parent b49a195839
commit 84a419de98
8 changed files with 146 additions and 105 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
web_src/js/index.js
View File

@@ -19,7 +19,7 @@ import initTableSort from './features/tablesort.js';
import ActivityTopAuthors from './components/ActivityTopAuthors.vue';
import {initNotificationsTable, initNotificationCount} from './features/notification.js';
import {createCodeEditor} from './features/codeeditor.js';
import {svgs} from './svg.js';
import {svg, svgs} from './svg.js';
const {AppSubUrl, StaticUrlPrefix, csrf} = window.config;
@@ -2017,22 +2017,17 @@ function initCodeView() {
}
}).trigger('hashchange');
}
$('.fold-code').on('click', ({target}) => {
const box = target.closest('.file-content');
$(document).on('click', '.fold-file', ({currentTarget}) => {
const box = currentTarget.closest('.file-content');
const folded = box.dataset.folded !== 'true';
target.classList.add(`fa-chevron-${folded ? 'right' : 'down'}`);
target.classList.remove(`fa-chevron-${folded ? 'down' : 'right'}`);
currentTarget.innerHTML = svg(`octicon-chevron-${folded ? 'right' : 'down'}`, 18);
box.dataset.folded = String(folded);
});
function insertBlobExcerpt(e) {
const $blob = $(e.currentTarget);
const $row = $blob.parent().parent();
$.get(`${$blob.data('url')}?${$blob.data('query')}&anchor=${$blob.data('anchor')}`, (blob) => {
$row.replaceWith(blob);
$(`[data-anchor="${$blob.data('anchor')}"]`).on('click', (e) => { insertBlobExcerpt(e) });
});
}
$('.ui.blob-excerpt').on('click', (e) => { insertBlobExcerpt(e) });
$(document).on('click', '.blob-excerpt', async ({currentTarget}) => {
const {url, query, anchor} = currentTarget.dataset;
const blob = await $.get(`${url}?${query}&anchor=${anchor}`);
currentTarget.closest('tr').outerHTML = blob;
});
}
function initU2FAuth() {

4
web_src/js/svg.js
View File

@@ -1,3 +1,5 @@
import octiconChevronDown from '../../public/img/svg/octicon-chevron-down.svg';
import octiconChevronRight from '../../public/img/svg/octicon-chevron-right.svg';
import octiconGitMerge from '../../public/img/svg/octicon-git-merge.svg';
import octiconGitPullRequest from '../../public/img/svg/octicon-git-pull-request.svg';
import octiconInternalRepo from '../../public/img/svg/octicon-internal-repo.svg';
@@ -12,6 +14,8 @@ import octiconRepoTemplate from '../../public/img/svg/octicon-repo-template.svg'
import octiconRepoTemplatePrivate from '../../public/img/svg/octicon-repo-template-private.svg';
export const svgs = {
'octicon-chevron-down': octiconChevronDown,
'octicon-chevron-right': octiconChevronRight,
'octicon-git-merge': octiconGitMerge,
'octicon-git-pull-request': octiconGitPullRequest,
'octicon-internal-repo': octiconInternalRepo,

33
web_src/less/_repository.less
View File

@@ -1694,6 +1694,11 @@
padding: 0 5px !important;
}
.tag-code .lines-num,
.tag-code td {
padding: 0 !important;
}
tbody {
tr {
td.halfwidth {
@@ -1727,17 +1732,21 @@
.code-diff-unified tbody tr {
&.del-code td {
background-color: #ffeef0 !important;
border-color: #f1c0c0 !important;
background-color: #ffeef0;
border-color: #f1c0c0;
}
&.add-code td {
background-color: #e6ffed;
border-color: #bef5cb;
}
&.del-code td.lines-num {
background-color: #ffe5e4;
}
&.add-code td.lines-num {
background-color: #cdffd8;
border-color: #bef5cb;
}
}
@@ -3001,19 +3010,15 @@ tbody.commit-list {
margin: 0 !important;
}
.tag-code,
.tag-code td {
background-color: #e6f1f6;
border-color: #f1f8ff !important;
padding-top: 8px;
padding-bottom: 8px;
vertical-align: middle;
color: rgba(27, 31, 35, .7);
.tag-code {
height: 28px;
}
.tag-code td.lines-num {
background-color: #f6e6eb !important;
border-color: #dbedff;
.tag-code,
.tag-code td {
background-color: #f0f9ff;
border-color: #f1f8ff !important;
vertical-align: middle;
}
.issue-keyword {

31
web_src/less/_review.less
View File

@@ -133,27 +133,24 @@
color: rgba(0, 0, 0, .87);
}
.ui.fold-code {
margin-right: 1em;
padding-left: 5px;
cursor: pointer;
width: 22px;
font-size: 12px;
a.fold-file {
margin-right: 10px;
color: inherit;
}
.ui.fold-code:hover {
color: #428bca;
a.blob-excerpt {
color: #575a68;
height: 28px;
display: flex;
justify-content: center;
align-items: center;
width: 100%;
background: #daecfe;
}
.ui.blob-excerpt {
display: block;
line-height: 20px;
font-size: 16px;
cursor: pointer;
}
.ui.blob-excerpt:hover {
color: #428bca;
a.blob-excerpt:hover {
background: #428bca;
color: #fff;
}
.btn-review > .dropdown.icon {

23
web_src/less/themes/theme-arc-green.less
View File

@@ -1056,11 +1056,19 @@ a.ui.basic.green.label:hover {
border-color: #634343 !important;
}
.repository .diff-file-box .code-diff-unified tbody tr.del-code td.lines-num {
background-color: #4e2c2c !important;
}
.repository .diff-file-box .code-diff-unified tbody tr.add-code td {
background-color: #283e2d !important;
border-color: #314a37 !important;
}
.repository .diff-file-box .code-diff-unified tbody tr.add-code td.lines-num {
background-color: #2c4632 !important;
}
.removed-code {
background-color: #5f3737;
}
@@ -1071,12 +1079,11 @@ a.ui.basic.green.label:hover {
.tag-code,
.tag-code td {
background: #242637 !important;
background: #353945 !important;
}
.tag-code td.lines-num {
background-color: #242637 !important;
border-color: transparent !important;
background-color: #3a3e4c !important;
}
.tag-code td.lines-type-marker,
@@ -1424,7 +1431,6 @@ input {
}
.lines-num {
background: #2e323e !important;
color: #9e9e9e !important;
border-color: #2d2d2d !important;
}
@@ -1433,6 +1439,15 @@ td.blob-excerpt {
background-color: rgba(0, 0, 0, .15);
}
a.blob-excerpt {
color: #ccc;
background: #393d4a;
}
a.blob-excerpt:hover {
background: #87ab63;
}
.code-view .lines-code.active {
background: #534d1b !important;
}