Rework notifications list (#24812)

- Replace `<table>` with flexbox
- Add issue modification time and issue number
- Remove big title
- Replace tabs with menu items
- Add clicked item deletion on back button cache restoration

---------

Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>

web_src/css/user.css

@@ -121,18 +121,6 @@
   object-fit: contain;
 }
 
-#notification_div .tab.segment {
-  overflow-x: auto;
-}
-
-#notification_div .tabular.menu .active.item {
-  background: var(--color-box-body);
-}
-
-#notification_table {
-  border: none;
-}
-
 #readme_profile {
   padding: 10px;
   border-radius: 0.28571429rem;
@@ -140,11 +128,29 @@
   border: 1px solid var(--color-secondary);
 }
 
-#notification_table tr {
-  cursor: default;
+#notification_table {
+  background: var(--color-box-body);
+  border: 1px solid var(--color-secondary);
+  border-radius: var(--border-radius);
 }
 
-#notification_table td a {
-  width: 100%;
-  display: inline-block;
+.notifications-item:hover {
+  background: var(--color-hover);
+}
+
+.notifications-buttons {
+  display: none;
+  min-width: 74px;
+}
+
+.notifications-updated {
+  display: flex;
+}
+
+.notifications-item:hover .notifications-buttons {
+  display: flex;
+}
+
+.notifications-item:hover .notifications-updated {
+  display: none;
 }