Skip to content

Commit d5703d4

Browse files
authored
Remove "TODO" tasks from CSS file (#26835)
1. Use `gt-invisible` instead of `invisible`. 2. Use `gt-word-break` instead of `dont-break-out` (there is a slight different "hyphens", but I think it won't affect too much since it is only used for the "full name"). 3. Remove `.small.button:has(svg)` , now our buttons could layout SVG correctly, and actually I didn't see this CSS class is used in code.
1 parent 5b5bb8d commit d5703d4

File tree

9 files changed

+20
-40
lines changed

9 files changed

+20
-40
lines changed

templates/repo/diff/section_split.tmpl

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -47,7 +47,7 @@
4747
<td class="lines-type-marker lines-type-marker-old del-code"><span class="gt-mono" data-type-marker="{{$line.GetLineTypeMarker}}"></span></td>
4848
<td class="lines-code lines-code-old del-code">{{/*
4949
*/}}{{if and $.root.SignedUserID $.root.PageIsPullFiles}}{{/*
50-
*/}}<button type="button" aria-label="{{$.root.locale.Tr "repo.diff.comment.add_line_comment"}}" class="ui primary button add-code-comment add-code-comment-left{{if (not $line.CanComment)}} invisible{{end}}" data-side="left" data-idx="{{$line.LeftIdx}}">{{/*
50+
*/}}<button type="button" aria-label="{{$.root.locale.Tr "repo.diff.comment.add_line_comment"}}" class="ui primary button add-code-comment add-code-comment-left{{if (not $line.CanComment)}} gt-invisible{{end}}" data-side="left" data-idx="{{$line.LeftIdx}}">{{/*
5151
*/}}{{svg "octicon-plus"}}{{/*
5252
*/}}</button>{{/*
5353
*/}}{{end}}{{/*
@@ -62,7 +62,7 @@
6262
<td class="lines-type-marker lines-type-marker-new add-code">{{if $match.RightIdx}}<span class="gt-mono" data-type-marker="{{$match.GetLineTypeMarker}}"></span>{{end}}</td>
6363
<td class="lines-code lines-code-new add-code">{{/*
6464
*/}}{{if and $.root.SignedUserID $.root.PageIsPullFiles}}{{/*
65-
*/}}<button type="button" aria-label="{{$.root.locale.Tr "repo.diff.comment.add_line_comment"}}" class="ui primary button add-code-comment add-code-comment-right{{if (not $match.CanComment)}} invisible{{end}}" data-side="right" data-idx="{{$match.RightIdx}}">{{/*
65+
*/}}<button type="button" aria-label="{{$.root.locale.Tr "repo.diff.comment.add_line_comment"}}" class="ui primary button add-code-comment add-code-comment-right{{if (not $match.CanComment)}} gt-invisible{{end}}" data-side="right" data-idx="{{$match.RightIdx}}">{{/*
6666
*/}}{{svg "octicon-plus"}}{{/*
6767
*/}}</button>{{/*
6868
*/}}{{end}}{{/*
@@ -79,7 +79,7 @@
7979
<td class="lines-type-marker lines-type-marker-old">{{if $line.LeftIdx}}<span class="gt-mono" data-type-marker="{{$line.GetLineTypeMarker}}"></span>{{end}}</td>
8080
<td class="lines-code lines-code-old">{{/*
8181
*/}}{{if and $.root.SignedUserID $.root.PageIsPullFiles (not (eq .GetType 2))}}{{/*
82-
*/}}<button type="button" aria-label="{{$.root.locale.Tr "repo.diff.comment.add_line_comment"}}" class="ui primary button add-code-comment add-code-comment-left{{if (not $line.CanComment)}} invisible{{end}}" data-side="left" data-idx="{{$line.LeftIdx}}">{{/*
82+
*/}}<button type="button" aria-label="{{$.root.locale.Tr "repo.diff.comment.add_line_comment"}}" class="ui primary button add-code-comment add-code-comment-left{{if (not $line.CanComment)}} gt-invisible{{end}}" data-side="left" data-idx="{{$line.LeftIdx}}">{{/*
8383
*/}}{{svg "octicon-plus"}}{{/*
8484
*/}}</button>{{/*
8585
*/}}{{end}}{{/*
@@ -94,7 +94,7 @@
9494
<td class="lines-type-marker lines-type-marker-new">{{if $line.RightIdx}}<span class="gt-mono" data-type-marker="{{$line.GetLineTypeMarker}}"></span>{{end}}</td>
9595
<td class="lines-code lines-code-new">{{/*
9696
*/}}{{if and $.root.SignedUserID $.root.PageIsPullFiles (not (eq .GetType 3))}}{{/*
97-
*/}}<button type="button" aria-label="{{$.root.locale.Tr "repo.diff.comment.add_line_comment"}}" class="ui primary button add-code-comment add-code-comment-right{{if (not $line.CanComment)}} invisible{{end}}" data-side="right" data-idx="{{$line.RightIdx}}">{{/*
97+
*/}}<button type="button" aria-label="{{$.root.locale.Tr "repo.diff.comment.add_line_comment"}}" class="ui primary button add-code-comment add-code-comment-right{{if (not $line.CanComment)}} gt-invisible{{end}}" data-side="right" data-idx="{{$line.RightIdx}}">{{/*
9898
*/}}{{svg "octicon-plus"}}{{/*
9999
*/}}</button>{{/*
100100
*/}}{{end}}{{/*

templates/repo/diff/section_unified.tmpl

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -52,7 +52,7 @@
5252
{{else}}
5353
<td class="chroma lines-code{{if (not $line.RightIdx)}} lines-code-old{{end}}">{{/*
5454
*/}}{{if and $.root.SignedUserID $.root.PageIsPullFiles}}{{/*
55-
*/}}<button type="button" aria-label="{{$.root.locale.Tr "repo.diff.comment.add_line_comment"}}" class="ui primary button add-code-comment add-code-comment-{{if $line.RightIdx}}right{{else}}left{{end}}{{if (not $line.CanComment)}} invisible{{end}}" data-side="{{if $line.RightIdx}}right{{else}}left{{end}}" data-idx="{{if $line.RightIdx}}{{$line.RightIdx}}{{else}}{{$line.LeftIdx}}{{end}}">{{/*
55+
*/}}<button type="button" aria-label="{{$.root.locale.Tr "repo.diff.comment.add_line_comment"}}" class="ui primary button add-code-comment add-code-comment-{{if $line.RightIdx}}right{{else}}left{{end}}{{if (not $line.CanComment)}} gt-invisible{{end}}" data-side="{{if $line.RightIdx}}right{{else}}left{{end}}" data-idx="{{if $line.RightIdx}}{{$line.RightIdx}}{{else}}{{$line.LeftIdx}}{{end}}">{{/*
5656
*/}}{{svg "octicon-plus"}}{{/*
5757
*/}}</button>{{/*
5858
*/}}{{end}}{{/*

templates/repo/issue/labels/labels_selector_field.tmpl

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -21,18 +21,18 @@
2121
<div class="divider"></div>
2222
{{end}}
2323
{{$previousExclusiveScope = $exclusiveScope}}
24-
<a class="{{if .IsChecked}}checked{{end}} item" href="#" data-id="{{.ID}}" data-id-selector="#label_{{.ID}}" data-scope="{{$exclusiveScope}}"><span class="octicon-check {{if not .IsChecked}}invisible{{end}}">{{if $exclusiveScope}}{{svg "octicon-dot-fill"}}{{else}}{{svg "octicon-check"}}{{end}}</span>&nbsp;&nbsp;{{RenderLabel $.Context .}}
24+
<a class="{{if .IsChecked}}checked{{end}} item" href="#" data-id="{{.ID}}" data-id-selector="#label_{{.ID}}" data-scope="{{$exclusiveScope}}"><span class="octicon-check {{if not .IsChecked}}gt-invisible{{end}}">{{if $exclusiveScope}}{{svg "octicon-dot-fill"}}{{else}}{{svg "octicon-check"}}{{end}}</span>&nbsp;&nbsp;{{RenderLabel $.Context .}}
2525
{{if .Description}}<br><small class="desc">{{.Description | RenderEmoji $.Context}}</small>{{end}}</a>
2626
{{end}}
2727
<div class="divider"></div>
28-
{{$previousExclusiveScope := "_no_scope"}}
28+
{{$previousExclusiveScope = "_no_scope"}}
2929
{{range .OrgLabels}}
3030
{{$exclusiveScope := .ExclusiveScope}}
3131
{{if and (ne $previousExclusiveScope "_no_scope") (ne $previousExclusiveScope $exclusiveScope)}}
3232
<div class="divider"></div>
3333
{{end}}
3434
{{$previousExclusiveScope = $exclusiveScope}}
35-
<a class="{{if .IsChecked}}checked{{end}} item" href="#" data-id="{{.ID}}" data-id-selector="#label_{{.ID}}" data-scope="{{$exclusiveScope}}"><span class="octicon-check {{if not .IsChecked}}invisible{{end}}">{{if $exclusiveScope}}{{svg "octicon-dot-fill"}}{{else}}{{svg "octicon-check"}}{{end}}</span>&nbsp;&nbsp;{{RenderLabel $.Context .}}
35+
<a class="{{if .IsChecked}}checked{{end}} item" href="#" data-id="{{.ID}}" data-id-selector="#label_{{.ID}}" data-scope="{{$exclusiveScope}}"><span class="octicon-check {{if not .IsChecked}}gt-invisible{{end}}">{{if $exclusiveScope}}{{svg "octicon-dot-fill"}}{{else}}{{svg "octicon-check"}}{{end}}</span>&nbsp;&nbsp;{{RenderLabel $.Context .}}
3636
{{if .Description}}<br><small class="desc">{{.Description | RenderEmoji $.Context}}</small>{{end}}</a>
3737
{{end}}
3838
{{else}}

templates/repo/issue/new_form.tmpl

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -158,7 +158,7 @@
158158
<div class="no-select item">{{.locale.Tr "repo.issues.new.clear_assignees"}}</div>
159159
{{range .Assignees}}
160160
<a class="item muted" href="#" data-id="{{.ID}}" data-id-selector="#assignee_{{.ID}}">
161-
<span class="octicon-check invisible">{{svg "octicon-check"}}</span>
161+
<span class="octicon-check gt-invisible">{{svg "octicon-check"}}</span>
162162
<span class="text">
163163
{{ctx.AvatarUtils.Avatar . 28 "gt-mr-3"}}{{template "repo/search_name" .}}
164164
</span>

templates/repo/issue/view_content/sidebar.tmpl

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@
2020
{{range .Reviewers}}
2121
{{if .User}}
2222
<a class="{{if not .CanChange}}ui{{end}} item {{if .Checked}}checked{{end}} {{if not .CanChange}}ban-change{{end}}" href="#" data-id="{{.ItemID}}" data-id-selector="#review_request_{{.ItemID}}" {{if not .CanChange}} data-tooltip-content="{{$.locale.Tr "repo.issues.remove_request_review_block"}}"{{end}}>
23-
<span class="octicon-check {{if not .Checked}}invisible{{end}}">{{svg "octicon-check"}}</span>
23+
<span class="octicon-check {{if not .Checked}}gt-invisible{{end}}">{{svg "octicon-check"}}</span>
2424
<span class="text">
2525
{{ctx.AvatarUtils.Avatar .User 28 "gt-mr-3"}}{{template "repo/search_name" .User}}
2626
</span>
@@ -33,7 +33,7 @@
3333
{{range .TeamReviewers}}
3434
{{if .Team}}
3535
<a class="{{if not .CanChange}}ui{{end}} item {{if .Checked}}checked{{end}} {{if not .CanChange}}ban-change{{end}}" href="#" data-id="{{.ItemID}}" data-id-selector="#review_request_team_{{.Team.ID}}" {{if not .CanChange}} data-tooltip-content="{{$.locale.Tr "repo.issues.remove_request_review_block"}}"{{end}}>
36-
<span class="octicon-check {{if not .Checked}}invisible{{end}}">{{svg "octicon-check" 16}}</span>
36+
<span class="octicon-check {{if not .Checked}}gt-invisible{{end}}">{{svg "octicon-check" 16}}</span>
3737
<span class="text">
3838
{{svg "octicon-people" 16 "gt-ml-4 gt-mr-2"}}{{$.Issue.Repo.OwnerName}}/{{.Team.Name}}
3939
</span>
@@ -229,7 +229,7 @@
229229
{{$checked = true}}
230230
{{end}}
231231
{{end}}
232-
<span class="octicon-check {{if not $checked}}invisible{{end}}">{{svg "octicon-check"}}</span>
232+
<span class="octicon-check {{if not $checked}}gt-invisible{{end}}">{{svg "octicon-check"}}</span>
233233
<span class="text">
234234
{{ctx.AvatarUtils.Avatar . 20 "gt-mr-3"}}{{template "repo/search_name" .}}
235235
</span>

web_src/css/base.css

Lines changed: 0 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -506,13 +506,6 @@ a.label,
506506
border-right-color: var(--color-primary);
507507
}
508508

509-
/* fix button enlarged vertically by svg icon */
510-
/* TODO: change to just `.small.button:has(svg)` but may have global side effects */
511-
.ui.action.input .small.button:has(svg) {
512-
padding-top: 7px !important;
513-
padding-bottom: 7px !important;
514-
}
515-
516509
.ui.menu,
517510
.ui.vertical.menu {
518511
background: var(--color-menu);
@@ -953,14 +946,6 @@ img.ui.avatar,
953946
filter: saturate(2);
954947
}
955948

956-
/* TODO: use gt-word-break instead */
957-
.dont-break-out {
958-
overflow-wrap: break-word;
959-
word-wrap: break-word;
960-
word-break: break-all;
961-
hyphens: auto;
962-
}
963-
964949
.full.height {
965950
flex-grow: 1;
966951
padding-bottom: 80px;
@@ -2014,11 +1999,6 @@ a.ui.basic.label:hover {
20141999
margin-left: 0;
20152000
}
20162001

2017-
/* TODO: replace it with gt-invisible */
2018-
.invisible {
2019-
visibility: hidden;
2020-
}
2021-
20222002
.ui.segment,
20232003
.ui.segments,
20242004
.ui.attached.segment {

web_src/js/features/repo-diff.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -64,9 +64,9 @@ function initRepoDiffConversationForm() {
6464

6565
$form.closest('.conversation-holder').replaceWith($newConversationHolder);
6666
if ($form.closest('tr').data('line-type') === 'same') {
67-
$(`[data-path="${path}"] .add-code-comment[data-idx="${idx}"]`).addClass('invisible');
67+
$(`[data-path="${path}"] .add-code-comment[data-idx="${idx}"]`).addClass('gt-invisible');
6868
} else {
69-
$(`[data-path="${path}"] .add-code-comment[data-side="${side}"][data-idx="${idx}"]`).addClass('invisible');
69+
$(`[data-path="${path}"] .add-code-comment[data-side="${side}"][data-idx="${idx}"]`).addClass('gt-invisible');
7070
}
7171
$newConversationHolder.find('.dropdown').dropdown();
7272
initCompReactionSelector($newConversationHolder);

web_src/js/features/repo-issue.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -110,7 +110,7 @@ export function initRepoIssueSidebarList() {
110110
}
111111
filteredResponse.results.push({
112112
name: `#${issue.number} ${htmlEscape(issue.title)
113-
}<div class="text small dont-break-out">${htmlEscape(issue.repository.full_name)}</div>`,
113+
}<div class="text small gt-word-break">${htmlEscape(issue.repository.full_name)}</div>`,
114114
value: issue.id,
115115
});
116116
});
@@ -178,9 +178,9 @@ export function initRepoIssueCommentDelete() {
178178
const idx = $conversationHolder.data('idx');
179179
const lineType = $conversationHolder.closest('tr').data('line-type');
180180
if (lineType === 'same') {
181-
$(`[data-path="${path}"] .add-code-comment[data-idx="${idx}"]`).removeClass('invisible');
181+
$(`[data-path="${path}"] .add-code-comment[data-idx="${idx}"]`).removeClass('gt-invisible');
182182
} else {
183-
$(`[data-path="${path}"] .add-code-comment[data-side="${side}"][data-idx="${idx}"]`).removeClass('invisible');
183+
$(`[data-path="${path}"] .add-code-comment[data-side="${side}"][data-idx="${idx}"]`).removeClass('gt-invisible');
184184
}
185185
$conversationHolder.remove();
186186
}

web_src/js/features/repo-legacy.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -150,7 +150,7 @@ export function initRepoCommentForm() {
150150

151151
if ($(this).hasClass('checked')) {
152152
$(this).removeClass('checked');
153-
$(this).find('.octicon-check').addClass('invisible');
153+
$(this).find('.octicon-check').addClass('gt-invisible');
154154
if (hasUpdateAction) {
155155
if (!($(this).data('id') in items)) {
156156
items[$(this).data('id')] = {
@@ -164,7 +164,7 @@ export function initRepoCommentForm() {
164164
}
165165
} else {
166166
$(this).addClass('checked');
167-
$(this).find('.octicon-check').removeClass('invisible');
167+
$(this).find('.octicon-check').removeClass('gt-invisible');
168168
if (hasUpdateAction) {
169169
if (!($(this).data('id') in items)) {
170170
items[$(this).data('id')] = {
@@ -215,7 +215,7 @@ export function initRepoCommentForm() {
215215

216216
$(this).parent().find('.item').each(function () {
217217
$(this).removeClass('checked');
218-
$(this).find('.octicon-check').addClass('invisible');
218+
$(this).find('.octicon-check').addClass('gt-invisible');
219219
});
220220

221221
if (selector === 'select-reviewers-modify' || selector === 'select-assignees-modify') {

0 commit comments

Comments
 (0)