diff options
| author | Bartosz Dziewoński <matma.rex@gmail.com> | 2023-04-12 23:39:27 +0200 |
|---|---|---|
| committer | Bartosz Dziewoński <matma.rex@gmail.com> | 2023-04-13 05:16:08 +0200 |
| commit | 9137566ab1db644d1e6f11816f307e8a8ff7446b (patch) | |
| tree | 81e40971f31fe3717d04b76936c5ed96ae03e762 /resources/src | |
| parent | ad5e4644cc1dbb00e48728e6a02c82b98871f513 (diff) | |
| download | mediawikicore-9137566ab1db644d1e6f11816f307e8a8ff7446b.tar.gz mediawikicore-9137566ab1db644d1e6f11816f307e8a8ff7446b.zip | |
jquery.makeCollapsible: Use <button> instead of <a>, but styled like a link
Bug: T333357
Change-Id: I06acf7dc19fba13e23d2594f8a41cbc58f973939
Diffstat (limited to 'resources/src')
| -rw-r--r-- | resources/src/jquery/jquery.makeCollapsible.js | 10 | ||||
| -rw-r--r-- | resources/src/jquery/jquery.makeCollapsible.less (renamed from resources/src/jquery/jquery.makeCollapsible.css) | 32 |
2 files changed, 35 insertions, 7 deletions
diff --git a/resources/src/jquery/jquery.makeCollapsible.js b/resources/src/jquery/jquery.makeCollapsible.js index 3a6c67ad0d96..58ac806bdbc3 100644 --- a/resources/src/jquery/jquery.makeCollapsible.js +++ b/resources/src/jquery/jquery.makeCollapsible.js @@ -257,15 +257,11 @@ // Default toggle link. Only build it when needed to avoid jQuery memory leaks (event data). var buildDefaultToggleLink = function () { - return $( '<a>' ) + return $( '<span>' ) .addClass( 'mw-collapsible-text' ) .text( collapseText ) - .wrap( '<span class="mw-collapsible-toggle mw-collapsible-toggle-default"></span>' ) - .parent() - .attr( { - role: 'button', - tabindex: 0 - } ); + .wrap( '<button type="button" class="mw-collapsible-toggle mw-collapsible-toggle-default"></button>' ) + .parent(); }; // Check if this element has a custom position for the toggle link diff --git a/resources/src/jquery/jquery.makeCollapsible.css b/resources/src/jquery/jquery.makeCollapsible.less index f7705eceec91..69d204209334 100644 --- a/resources/src/jquery/jquery.makeCollapsible.css +++ b/resources/src/jquery/jquery.makeCollapsible.less @@ -4,6 +4,8 @@ * These instead should live in jquery.makeCollapsible.styles */ +@import 'mediawiki.skin.variables.less'; + /* See also jquery.makeCollapsible.js */ .mw-collapsible-toggle { float: right; @@ -11,6 +13,36 @@ -webkit-user-select: none; -ms-user-select: none; user-select: none; + // This element is now a button, but it used to be a link, so keep link styles for now + // (until someone dares to try to change the design). + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + background: none; + margin: 0; + padding: 0; + border: 0; + font: inherit; + + .mw-collapsible-text { + color: @color-link; + + .mw-underline-always & { + text-decoration: underline; + } + + .mw-underline-never & { + text-decoration: none; + } + } + + &:hover .mw-collapsible-text { + text-decoration: underline; + } + + &:active .mw-collapsible-text { + color: @color-link--active; + } } .mw-collapsible-toggle-default::before { |