loading up the forgejo repo on tangled to test page performance
0
fork

Configure Feed

Select the types of activity you want to include in your feed.

Refactor clone-panel styles (#29861)

1. The borders were doubled on the "empty" page, fix it.
2. Remove unnecessary CSS classes like "clone", "compact", etc
3. Use CSS class "clone-panel" instead of ID "clone-panel"
4. Use `tw-flex-1` instead of `gt-f1`
5. Remove unnecessary ID "more-btn"

(cherry picked from commit 673286d8c8a00bf7240a93187d767fb5a5e32a31)

authored by

wxiaoguang and committed by
Earl Warren
2141bc32 cd28684a

+18 -32
+3 -3
templates/repo/clone_buttons.tmpl
··· 1 1 <!-- there is always at least one button (by context/repo.go) --> 2 2 {{if $.CloneButtonShowHTTPS}} 3 - <button class="ui small compact clone button" id="repo-clone-https" data-link="{{$.CloneButtonOriginLink.HTTPS}}"> 3 + <button class="ui small button" id="repo-clone-https" data-link="{{$.CloneButtonOriginLink.HTTPS}}"> 4 4 HTTPS 5 5 </button> 6 6 {{end}} 7 7 {{if $.CloneButtonShowSSH}} 8 - <button class="ui small compact clone button" id="repo-clone-ssh" data-link="{{$.CloneButtonOriginLink.SSH}}"> 8 + <button class="ui small button" id="repo-clone-ssh" data-link="{{$.CloneButtonOriginLink.SSH}}"> 9 9 SSH 10 10 </button> 11 11 {{end}} 12 12 <input id="repo-clone-url" size="20" class="js-clone-url" value="{{$.CloneButtonOriginLink.HTTPS}}" readonly> 13 - <button class="ui basic small compact icon button" id="clipboard-btn" data-tooltip-content="{{ctx.Locale.Tr "copy_url"}}" data-clipboard-target="#repo-clone-url" aria-label="{{ctx.Locale.Tr "copy_url"}}"> 13 + <button class="ui small icon button" id="clipboard-btn" data-tooltip-content="{{ctx.Locale.Tr "copy_url"}}" data-clipboard-target="#repo-clone-url" aria-label="{{ctx.Locale.Tr "copy_url"}}"> 14 14 {{svg "octicon-copy" 14}} 15 15 </button>
+1 -1
templates/repo/empty.tmpl
··· 37 37 </a> 38 38 {{end}} 39 39 {{end}} 40 - <div class="ui action small input gt-df gt-f1"> 40 + <div class="clone-panel ui action small input tw-flex-1"> 41 41 {{template "repo/clone_buttons" .}} 42 42 </div> 43 43 </div>
+2 -2
templates/repo/home.tmpl
··· 132 132 <div class="gt-df gt-ac"> 133 133 <!-- Only show clone panel in repository home page --> 134 134 {{if eq $n 0}} 135 - <div class="ui action tiny input" id="clone-panel"> 135 + <div class="clone-panel ui action tiny input"> 136 136 {{template "repo/clone_buttons" .}} 137 - <button id="more-btn" class="ui basic small compact jump dropdown icon button" data-tooltip-content="{{ctx.Locale.Tr "repo.more_operations"}}"> 137 + <button class="ui small jump dropdown icon button" data-tooltip-content="{{ctx.Locale.Tr "repo.more_operations"}}"> 138 138 {{svg "octicon-kebab-horizontal"}} 139 139 <div class="menu"> 140 140 {{if not $.DisableDownloadSourceArchives}}
+1 -1
templates/repo/wiki/revision.tmpl
··· 15 15 </div> 16 16 </div> 17 17 <div class="ui eight wide column text right"> 18 - <div class="ui action small input" id="clone-panel"> 18 + <div class="clone-panel ui action small input"> 19 19 {{template "repo/clone_buttons" .}} 20 20 {{template "repo/clone_script" .}} 21 21 </div>
+1 -1
templates/repo/wiki/view.tmpl
··· 28 28 </div> 29 29 </div> 30 30 </div> 31 - <div class="ui action small input gt-df gt-ac" id="clone-panel"> 31 + <div class="clone-panel ui action small input"> 32 32 {{template "repo/clone_buttons" .}} 33 33 {{template "repo/clone_script" .}} 34 34 </div>
+9 -23
web_src/css/repo.css
··· 143 143 margin-bottom: 12px; 144 144 } 145 145 146 - .repository #clone-panel #repo-clone-url { 146 + .repository .clone-panel #repo-clone-url { 147 147 width: 320px; 148 148 border-radius: 0; 149 149 } 150 150 151 - @media (min-width: 768px) and (max-width: 991.98px) { 152 - .repository #clone-panel #repo-clone-url { 153 - width: 200px; 154 - } 155 - } 156 - 157 - @media (max-width: 767.98px) { 158 - .repository #clone-panel #repo-clone-url { 151 + @media (max-width: 991.98px) { 152 + .repository .clone-panel #repo-clone-url { 159 153 width: 200px; 160 154 } 161 155 } 162 156 163 - .repository #clone-panel #repo-clone-https, 164 - .repository #clone-panel #repo-clone-ssh { 165 - border-right: none; 166 - } 167 - 168 - .repository #clone-panel #more-btn { 169 - border-left: none; 157 + .repository .ui.action.input.clone-panel > button + button, 158 + .repository .ui.action.input.clone-panel > button + input { 159 + margin-left: -1px; /* make the borders overlap to avoid double borders */ 170 160 } 171 161 172 - .repository #clone-panel button:first-of-type { 162 + .repository .clone-panel > button:first-of-type { 173 163 border-radius: var(--border-radius) 0 0 var(--border-radius) !important; 174 164 } 175 165 176 - .repository #clone-panel button:last-of-type { 166 + .repository .clone-panel > button:last-of-type { 177 167 border-radius: 0 var(--border-radius) var(--border-radius) 0 !important; 178 168 } 179 169 180 - .repository #clone-panel .dropdown .menu { 170 + .repository .clone-panel .dropdown .menu { 181 171 right: 0 !important; 182 172 left: auto !important; 183 173 } ··· 1756 1746 1757 1747 .repository.quickstart .guide .item small { 1758 1748 font-weight: var(--font-weight-normal); 1759 - } 1760 - 1761 - .repository.quickstart .guide .clone.button:first-child { 1762 - border-radius: var(--border-radius) 0 0 var(--border-radius); 1763 1749 } 1764 1750 1765 1751 .repository.quickstart .guide #repo-clone-url {
+1 -1
web_src/css/repo/wiki.css
··· 58 58 } 59 59 60 60 @media (max-width: 767.98px) { 61 - .repository.wiki #clone-panel #repo-clone-url { 61 + .repository.wiki .clone-panel #repo-clone-url { 62 62 width: 160px; 63 63 } 64 64 .repository.wiki .wiki-content-main.with-sidebar,