Skip to content

Commit 6db66d8

Browse files
authored
Fix some UI alignments (#25277)
Fixes: #25282 Fix the problems: 1. The `repo-button-row` had various patches before, this PR makes it consistent 2. The "Add File" has wrong CSS class "icon", remove it 3. The "Add File" padding was overridden by "!important", fix it by `.repo-button-row .button.dropdown` with comment 4. The selector `.ui.segments ~ .ui.top.attached.header` is incorrect, it should use `+`
1 parent 14b802e commit 6db66d8

File tree

5 files changed

+18
-21
lines changed

5 files changed

+18
-21
lines changed

templates/repo/commits.tmpl

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
{{template "repo/header" .}}
44
<div class="ui container">
55
{{template "repo/sub_menu" .}}
6-
<div class="repo-button-row gt-df gt-ac gt-sb gt-fw gt-mb-4 gt-mt-3">
6+
<div class="repo-button-row">
77
<div class="gt-df gt-ac">
88
{{template "repo/branch_dropdown" dict "root" . "ContainerClasses" "gt-mr-2"}}
99
<a href="{{.RepoLink}}/graph" class="ui basic small compact button">

templates/repo/home.tmpl

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -61,7 +61,7 @@
6161
</div>
6262
{{end}}
6363
{{template "repo/sub_menu" .}}
64-
<div class="repo-button-row gt-df gt-ac gt-sb gt-fw">
64+
<div class="repo-button-row">
6565
<div class="gt-df gt-ac gt-fw gt-gap-y-3">
6666
{{template "repo/branch_dropdown" dict "root" . "ContainerClasses" "gt-mr-2"}}
6767
{{if and .CanCompareOrPull .IsViewBranch (not .Repository.IsArchived)}}
@@ -84,8 +84,9 @@
8484
{{end}}
8585

8686
{{if and .CanWriteCode .IsViewBranch (not .Repository.IsArchived)}}
87-
<button class="ui basic compact dropdown jump icon button gt-mr-2"{{if not .Repository.CanEnableEditor}} disabled{{end}}>
88-
<span class="text">{{.locale.Tr "repo.editor.add_file"}}</span>
87+
<button class="ui dropdown basic compact jump button gt-mr-2"{{if not .Repository.CanEnableEditor}} disabled{{end}}>
88+
{{.locale.Tr "repo.editor.add_file"}}
89+
{{svg "octicon-triangle-down" 14 "dropdown icon"}}
8990
<div class="menu">
9091
<a class="item" href="{{.RepoLink}}/_new/{{.BranchName | PathEscapeSegments}}/{{.TreePath | PathEscapeSegments}}">
9192
{{.locale.Tr "repo.editor.new_file"}}
@@ -99,7 +100,6 @@
99100
{{.locale.Tr "repo.editor.patch"}}
100101
</a>
101102
</div>
102-
{{svg "octicon-triangle-down" 14 "dropdown icon"}}
103103
</button>
104104
{{end}}
105105

templates/repo/wiki/view.tmpl

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
{{template "repo/header" .}}
44
{{$title := .title}}
55
<div class="ui container">
6-
<div class="repo-button-row gt-df gt-ac gt-sb gt-fw">
6+
<div class="repo-button-row">
77
<div class="gt-df gt-ac">
88
<div class="ui floating filter dropdown" data-no-results="{{.locale.Tr "repo.pulls.no_results"}}">
99
<div class="ui basic small button">

web_src/css/base.css

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2099,8 +2099,8 @@ a.ui.basic.label:hover {
20992099
}
21002100

21012101
/* if a .top.attached.header is followed by a .segment, add some margin */
2102-
.ui.segments ~ .ui.top.attached.header,
2103-
.ui.attached.segment ~ .ui.top.attached.header {
2102+
.ui.segments + .ui.top.attached.header,
2103+
.ui.attached.segment + .ui.top.attached.header {
21042104
margin-top: 1rem;
21052105
}
21062106

web_src/css/repo.css

Lines changed: 10 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -2693,26 +2693,23 @@
26932693
}
26942694

26952695
.repo-button-row {
2696-
margin-bottom: 10px;
2697-
}
2698-
2699-
.repo-button-row > * {
2700-
margin-top: 8px;
2701-
}
2702-
2703-
.wiki .repo-button-row {
2704-
margin-bottom: 0;
2705-
}
2706-
2707-
.wiki .repo-button-row > * {
2708-
margin-top: 0;
2696+
margin: 10px 0;
2697+
display: flex;
2698+
align-items: center;
2699+
gap: 0.5em;
2700+
flex-wrap: wrap;
2701+
justify-content: space-between;
27092702
}
27102703

27112704
.repo-button-row .button {
27122705
padding: 6px 10px !important;
27132706
height: 30px;
27142707
}
27152708

2709+
.repo-button-row .button.dropdown {
2710+
padding-right: 22px !important; /* normal buttons have !important paddings, so we need to override it for dropdown (Add File) icons */
2711+
}
2712+
27162713
.repo-button-row input {
27172714
height: 30px;
27182715
}

0 commit comments

Comments
 (0)