Use brackets-wrap

This also should make things easier for people who use userstyles
who would want to hide brackets or otherwise change their content
without resorting to weird hacks, like changing the font size of
the parent element to 0 and making text invisible, and then
reverting it in child elements.

src/General/Index.coffee

@@ -83,9 +83,8 @@ Index =
     $.on @pagelist, 'click', @cb.pageNav
     $.on @searchInput, 'input', @onSearchInput
     $.on $('#index-search-clear', @navLinks), 'click', @clearSearch
-    $.on $('#returnlink', @navLinks),  'click', Navigate.navigate
-    $.on $('#cataloglink', @navLinks), 'click', -> window.location = "//boards.4chan.org/#{g.BOARD}/catalog"
-      
+    $.on $('#returnlink a',  @navLinks), 'click', Navigate.navigate
+    $.on $('#cataloglink a', @navLinks), 'click', -> window.location = "//boards.4chan.org/#{g.BOARD}/catalog"
 
     @update() if g.VIEW is 'index'
     $.asap (-> $('.board', doc) or d.readyState isnt 'loading'), ->
@@ -292,7 +291,7 @@ Index =
         new Notice 'error', 'Index refresh failed.', 1
       return
 
-    timeEl = $ '#index-last-refresh', Index.navLinks
+    timeEl = $ '#index-last-refresh time', Index.navLinks
     timeEl.dataset.utc = Date.parse req.getResponseHeader 'Last-Modified'
     RelativeDates.update timeEl
     Index.scrollToIndex()

src/General/css/style.css

@@ -273,12 +273,12 @@ div.center:not(.ad-cnt) {
   font-weight: bold;
 }
 /* 4chan X link brackets */
-.brackets-wrap::after {
-  content: "]";
-}
 .brackets-wrap::before {
   content: "[";
 }
+.brackets-wrap::after {
+  content: "]";
+}
 /* Notifications */
 #notifications {
   position: fixed;
@@ -508,16 +508,6 @@ div.center:not(.ad-cnt) {
 .thread #index-search {
   display: none;
 }
-#returnlink::before,
-#bottomlink::before,
-#index-last-refresh::before {
-  content: '[';
-}
-#returnlink::after,
-#bottomlink::after,
-#index-last-refresh::after  {
-  content: ']';
-}
 
 /* Announcement Hiding */
 :root.hide-announcement #globalMessage {

src/General/html/Features/Index-navlinks.html

@@ -1,6 +1,6 @@
-<a href=.././ id=returnlink>Return</a> 
-[<a href=javascript:; id=cataloglink>Catalog</a>] 
-<a href="#bottom" id=bottomlink>Bottom</a> 
-<time id="index-last-refresh" title="Last index refresh">...</time> 
+<span class=brackets-wrap id=returnlink><a href=.././>Return</a></span> 
+<span class=brackets-wrap id=cataloglink><a href=javascript:;>Catalog</a></span> 
+<span class=brackets-wrap id=bottomlink><a href="#bottom">Bottom</a></span> 
+<span class=brackets-wrap id="index-last-refresh"><time title="Last index refresh">...</time></span> 
 <input type="search" id="index-search" class="field" placeholder="Search">
 <a id="index-search-clear" href="javascript:;" title="Clear search">×</a>