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 <[email protected]> Co-authored-by: wxiaoguang <[email protected]>
go-gitea · Mar 25, 2023 · 73b4010 · 73b4010
1 parent de5b368
commit 73b4010
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 37 deletions.
diff --git 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
@@ -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;
 }
 
+.user.notification table button {
+  padding: 3px 3px 3px 5px;
+}
+
 #notification_div .tab.segment {
   overflow-x: auto;
-  padding: 0;
 }
 
-#notification_div .menu .active.item {
+#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
@@ -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');