XWIKI-21492: Underline inline links (#3077)

* Fixed spacing for hidelefthideright * Added a comment * Improved the inline link selector by extending the exceptions * Added a specific rule on the SolrSearch page
xwiki · Apr 19, 2024 · 9b34c6e · 9b34c6e
1 parent 1746f0f
commit 9b34c6e
Show file tree

Hide file tree

Showing 3 changed files with 35 additions and 7 deletions.
diff --git a/...ngo-skin/xwiki-platform-flamingo-skin-resources/src/main/resources/flamingo/htmlheader.vm b/...ngo-skin/xwiki-platform-flamingo-skin-resources/src/main/resources/flamingo/htmlheader.vm
@@ -154,8 +154,7 @@
 ## be concatenated without space.
 <$bodyTagName id="body" class="skin-flamingo wiki-${xcontext.database} ${bodyAction}body panel-left-width-${leftPanelsWidth} panel-right-width-${rightPanelsWidth} drawer drawer--right ${preferenceUnderlining}
   #if("$!doc.space" != "") space-${escapetool.xml($doc.space.replaceAll(' ', '_'))}#end
-  #if($showLeftPanels == "0") hideleft#end
-  #if($showRightPanels == "0")hideright#end
+  #if($showLeftPanels == "0") hideleft#end#if($showRightPanels == "0")hideright#end##Take care not to add any space between these two classes, they should combine in only one class if both are present.
   #if($hidecolumns && ($!hidecolumns == 1)) hidelefthideright#end
   #if($showLeftPanels != "0" && $showRightPanels != "0" && $!hidecolumns != 1) content#end">
 <div id="xwikimaincontainer">

diff --git a/...skin/xwiki-platform-flamingo-skin-resources/src/main/resources/flamingo/less/general.less b/...skin/xwiki-platform-flamingo-skin-resources/src/main/resources/flamingo/less/general.less
@@ -145,6 +145,15 @@ body.content {
   }
 
   &.preference-underlining-only-inline-links {
+    // Define an inline link mixin
+    .not-inline-link {
+      text-decoration: none;
+      // Make sure we don't take over the default behaviour on hover with too much specificity.
+      &:hover, &:focus {
+        text-decoration: underline;
+      }
+    }
+
     // Main rule for the content
     #xwikicontent a {
       text-decoration: underline;
@@ -168,13 +177,23 @@ body.content {
       & .buttonwrapper,
       & #user-menu-col {
         & a {
-          text-decoration: none;
-          // Make sure we don't take over the default behaviour on hover with too much specificity.
-          &:hover, &:focus {
-            text-decoration: underline
-          }
+          .not-inline-link();
         }
       }
+
+      /* Remove the underlining from links with the btn class.
+       Those are already styled differently from their neighboring text. */
+      & a.btn {
+        .not-inline-link();
+      }
+
+      /* Remove the underlining from links with an image or an icon.
+        In the vast majority of cases, these links are already easy to find.
+       */
+      & a:has(img), // With an image or an icon from the Silk iconTheme
+      & a:has(span.fa) { // With an icon from the Font Awesome iconTheme
+        .not-inline-link();
+      }
     }
 
     // Helper classes for easier content customization. Note that those only work for this preference.

diff --git a/...platform-search-solr/xwiki-platform-search-solr-ui/src/main/resources/Main/SolrSearch.xml b/...platform-search-solr/xwiki-platform-search-solr-ui/src/main/resources/Main/SolrSearch.xml
@@ -816,6 +816,16 @@ a.search-result-highlightAll:after {
   white-space: nowrap;
 }
 
+/* Override the default style for links in content. */
+body.content.preference-underlining-only-inline-links #xwikicontent .search-facet-body .itemName,
+body.content.preference-underlining-only-inline-links #xwikicontent .search-facet-body .more {
+  text-decoration: none;
+  /* Make sure we don't take over the default behaviour on hover with too much specificity. */
+  &amp;:hover, &amp;:focus {
+    text-decoration: underline;
+  }
+}
+
 .search-facet-body .itemName,
 .search-facet-body .facet-value-toggler,
 .search-facet-body .more {