From 73b4010fcd93e921b626a6f51de7a148de276283 Mon Sep 17 00:00:00 2001 From: John Olheiser <john.olheiser@gmail.com> Date: Sat, 25 Mar 2023 14:37:34 -0500 Subject: [PATCH] Remove row clicking from notification table (#22695) Resolves #22692 I don't think there's a need for this entire row to be clickable (and even different links depending on which segment you click) The links still point to the same spot, so no information is lost here. --------- Signed-off-by: jolheiser <john.olheiser@gmail.com> Co-authored-by: wxiaoguang <wxiaoguang@gmail.com> --- .../user/notification/notification_div.tmpl | 6 +-- web_src/css/user.css | 37 ++++++++----------- web_src/js/features/common-global.js | 15 -------- 3 files changed, 19 insertions(+), 39 deletions(-) diff --git a/templates/user/notification/notification_div.tmpl b/templates/user/notification/notification_div.tmpl index 9a4fbe786e..101e4d24e4 100644 --- a/templates/user/notification/notification_div.tmpl +++ b/templates/user/notification/notification_div.tmpl @@ -35,7 +35,7 @@ {{$issue := .Issue}} {{$repo := .Repository}} <tr id="notification_{{.ID}}"> - <td class="collapsing gt-pl-4" data-href="{{.Link}}"> + <td class="collapsing gt-pl-4"> {{if eq .Status 3}} {{svg "octicon-pin" 16 "text blue"}} {{else if not $issue}} @@ -58,7 +58,7 @@ {{end}} {{end}} </td> - <td class="eleven wide" data-href="{{.Link}}"> + <td class="eleven wide"> <a class="item" href="{{.Link}}"> {{if $issue}} #{{$issue.Index}} - {{$issue.Title}} @@ -67,7 +67,7 @@ {{end}} </a> </td> - <td data-href="{{$repo.Link}}"> + <td> <a class="item" href="{{$repo.Link}}">{{$repo.FullName}}</a> </td> <td class="collapsing"> diff --git a/web_src/css/user.css b/web_src/css/user.css index 8722181c29..620f1da0e2 100644 --- a/web_src/css/user.css +++ b/web_src/css/user.css @@ -90,23 +90,6 @@ padding: 8px 15px; } -.user.notification .content { - float: left; - margin-left: 7px; -} - -.user.notification table form { - display: inline-block; -} - -.user.notification table button { - padding: 3px 3px 3px 5px; -} - -.user.notification table tr { - cursor: pointer; -} - .user .button.adopt, .user .button.delete { margin-top: -15px; @@ -152,15 +135,27 @@ object-fit: contain; } -#notification_div .tab.segment { - overflow-x: auto; - padding: 0; +.user.notification table button { + padding: 3px 3px 3px 5px; } -#notification_div .menu .active.item { +#notification_div .tab.segment { + overflow-x: auto; +} + +#notification_div .tabular.menu .active.item { background: var(--color-box-body); } #notification_table { border: none; } + +#notification_table tr { + cursor: default; +} + +#notification_table td a { + width: 100%; + display: inline-block; +} diff --git a/web_src/js/features/common-global.js b/web_src/js/features/common-global.js index 3546a052b3..a10ca74ab5 100644 --- a/web_src/js/features/common-global.js +++ b/web_src/js/features/common-global.js @@ -124,21 +124,6 @@ export function initGlobalCommon() { toggleElem($($(this).data('target'))); }); - // make table <tr> and <td> elements clickable like a link - $('tr[data-href], td[data-href]').on('click', function (e) { - const href = $(this).data('href'); - if (e.target.nodeName === 'A') { - // if a user clicks on <a>, then the <tr> or <td> should not act as a link. - return; - } - if (e.ctrlKey || e.metaKey) { - // ctrl+click or meta+click opens a new window in modern browsers - window.open(href); - } else { - window.location = href; - } - }); - // prevent multiple form submissions on forms containing .loading-button document.addEventListener('submit', (e) => { const btn = e.target.querySelector('.loading-button');