mirror of
https://github.com/StarCitizenTools/mediawiki-extensions-TabberNeue.git
synced 2024-11-24 00:13:28 +00:00
Revert "Merge branch 'master' into 'master'"
This reverts commitd75e942645
, reversing changes made toa0d684eadf
.
This commit is contained in:
parent
d75e942645
commit
f52f2d946b
|
@ -74,7 +74,7 @@ class TabberHooks {
|
|||
$tabBody = $parser->recursiveTagParse($tabBody, $frame);
|
||||
|
||||
$tab = '
|
||||
<div class="tabbercontent" title="' . htmlspecialchars($tabName) . '">
|
||||
<div class="tabbertab" title="' . htmlspecialchars($tabName) . '">
|
||||
<p>' . $tabBody . '</p>
|
||||
</div>';
|
||||
|
||||
|
|
54
css/tabber.css
Normal file
54
css/tabber.css
Normal file
|
@ -0,0 +1,54 @@
|
|||
ul.tabbernav {
|
||||
margin: 0;
|
||||
padding: 3px 0;
|
||||
border-bottom: 1px solid #CCC;
|
||||
font: bold 12px Verdana, sans-serif;
|
||||
}
|
||||
|
||||
ul.tabbernav li {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
display: inline-block;
|
||||
padding-top: 1em;
|
||||
}
|
||||
|
||||
ul.tabbernav li a {
|
||||
padding: 3px .5em;
|
||||
margin-left: 3px;
|
||||
border: 1px solid #CCC;
|
||||
border-bottom: none;
|
||||
background: #F2F7FF;
|
||||
text-decoration: none;
|
||||
white-space: pre;
|
||||
}
|
||||
|
||||
ul.tabbernav li a:link {
|
||||
color: #448;
|
||||
}
|
||||
|
||||
ul.tabbernav li a:visited {
|
||||
color: #667;
|
||||
}
|
||||
|
||||
ul.tabbernav li a:hover {
|
||||
color: #000;
|
||||
background: #FFF9F2;
|
||||
border-color: #CCC;
|
||||
}
|
||||
|
||||
ul.tabbernav li.tabberactive a {
|
||||
background-color: #FFF;
|
||||
border-bottom: 1px solid #FFF;
|
||||
}
|
||||
|
||||
ul.tabbernav li.tabberactive a:hover {
|
||||
color: #000;
|
||||
background: #FFF;
|
||||
border-bottom: 1px solid #FFF;
|
||||
}
|
||||
|
||||
.tabber .tabbertab {
|
||||
padding: 5px;
|
||||
border: 1px solid #CCC;
|
||||
border-top: 0;
|
||||
}
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "Tabber",
|
||||
"version": "2.4.5",
|
||||
"version": "2.4.4",
|
||||
"author": [
|
||||
"Eric Fortin",
|
||||
"Alexia E. Smith"
|
||||
|
@ -10,7 +10,7 @@
|
|||
"type": "parserhook",
|
||||
"license-name": "GPL-3.0-only",
|
||||
"requires": {
|
||||
"MediaWiki": ">= 1.31.0"
|
||||
"MediaWiki": ">= 1.29.0"
|
||||
},
|
||||
"MessagesDirs": {
|
||||
"Tabber": [
|
||||
|
@ -23,18 +23,14 @@
|
|||
"ResourceModules": {
|
||||
"ext.Tabber": {
|
||||
"styles": [
|
||||
"resources/ext.tabber.styles.less"
|
||||
"css/tabber.css"
|
||||
],
|
||||
"scripts": [
|
||||
"resources/ext.tabber.js"
|
||||
"js/tabber.js"
|
||||
],
|
||||
"targets": [
|
||||
"desktop",
|
||||
"mobile"
|
||||
],
|
||||
"dependencies": [
|
||||
"oojs-ui-core",
|
||||
"oojs-ui-widgets"
|
||||
]
|
||||
}
|
||||
},
|
||||
|
|
75
js/tabber.js
Normal file
75
js/tabber.js
Normal file
|
@ -0,0 +1,75 @@
|
|||
(function($) {
|
||||
$.fn.tabber = function() {
|
||||
return this.each(function() {
|
||||
// create tabs
|
||||
var $this = $(this),
|
||||
tabContent = $this.children('.tabbertab'),
|
||||
nav = $('<ul>').addClass('tabbernav'),
|
||||
loc;
|
||||
|
||||
tabContent.each(function() {
|
||||
$(this).attr('data-hash', mw.util.escapeIdForAttribute(this.title));
|
||||
var anchor = $('<a>').text(this.title).attr('title',this.title).attr('data-hash', $(this).attr('data-hash')).attr('href', '#');
|
||||
$('<li>').append(anchor).appendTo(nav);
|
||||
|
||||
// Append a manual word break point after each tab
|
||||
nav.append($('<wbr>'));
|
||||
});
|
||||
|
||||
$this.prepend(nav);
|
||||
|
||||
/**
|
||||
* Internal helper function for showing content
|
||||
* @param {string} title to show, matching only 1 tab
|
||||
* @return {bool} true if matching tab could be shown
|
||||
*/
|
||||
function showContent(title) {
|
||||
var content = tabContent.filter('[data-hash="' + title + '"]');
|
||||
if (content.length !== 1) { return false; }
|
||||
tabContent.hide();
|
||||
content.show();
|
||||
nav.find('.tabberactive').removeClass('tabberactive');
|
||||
nav.find('a[data-hash="' + title + '"]').parent().addClass('tabberactive');
|
||||
return true;
|
||||
}
|
||||
|
||||
// setup initial state
|
||||
var tab = new mw.Uri(location.href).fragment;
|
||||
if (tab === '' || !showContent(tab)) {
|
||||
showContent(tabContent.first().attr('data-hash'));
|
||||
}
|
||||
|
||||
// Respond to clicks on the nav tabs
|
||||
nav.on('click', 'a', function(e) {
|
||||
var title = $(this).attr('data-hash');
|
||||
e.preventDefault();
|
||||
if (history.pushState) {
|
||||
history.pushState(null, null, '#' + title);
|
||||
switchTab();
|
||||
} else {
|
||||
location.hash = '#' + title;
|
||||
}
|
||||
});
|
||||
|
||||
$(window).on('hashchange', function(event) {
|
||||
switchTab();
|
||||
});
|
||||
|
||||
function switchTab() {
|
||||
var tab = new mw.Uri(location.href).fragment;
|
||||
if (!tab.length) {
|
||||
showContent(tabContent.first().attr('data-hash'));
|
||||
}
|
||||
if (nav.find('a[data-hash="'+tab+'"]').length) {
|
||||
showContent(tab);
|
||||
}
|
||||
}
|
||||
|
||||
$this.addClass('tabberlive');
|
||||
});
|
||||
};
|
||||
}(jQuery));
|
||||
|
||||
$(document).ready(function() {
|
||||
$('.tabber').tabber();
|
||||
});
|
|
@ -1,49 +0,0 @@
|
|||
(function($) {
|
||||
$.fn.tabber = function() {
|
||||
return this.each(function() {
|
||||
|
||||
// Create tabs
|
||||
var $this = $(this),
|
||||
tabContent = $this.children('.tabbercontent'),
|
||||
loc;
|
||||
var tabcount = 0;
|
||||
var index = new OO.ui.IndexLayout();
|
||||
|
||||
tabContent.each(function() {
|
||||
tabcount++;
|
||||
CreateTab(this.title, tabcount);
|
||||
});
|
||||
|
||||
$('.tabber').append(index.$element);
|
||||
|
||||
// Add fallback class for styling
|
||||
$('.tabber').addClass('tabberlive');
|
||||
$('.oo-ui-tabSelectWidget').addClass('tabbernav');
|
||||
|
||||
function CreateTab(title, count) {
|
||||
|
||||
var content = $('.tabbercontent[title="' + title + '"]');
|
||||
|
||||
function TabPanelLayout(name, config) {
|
||||
TabPanelLayout.super.call(this, name, config);
|
||||
this.$element.attr('title', title).attr('data-hash', mw.util.escapeIdForAttribute(title));
|
||||
this.$element.addClass('tabbertab'); // Add fallback class for styling
|
||||
this.$element.append(content);
|
||||
}
|
||||
|
||||
OO.inheritClass(TabPanelLayout, OO.ui.TabPanelLayout);
|
||||
TabPanelLayout.prototype.setupTabItem = function() {
|
||||
this.tabItem.setLabel(title);
|
||||
};
|
||||
|
||||
var tabPanel = new TabPanelLayout(tabcount);
|
||||
|
||||
index.addTabPanels([tabPanel]);
|
||||
}
|
||||
});
|
||||
};
|
||||
}(jQuery));
|
||||
|
||||
$(document).ready(function() {
|
||||
$('.tabber').tabber();
|
||||
});
|
|
@ -1,21 +0,0 @@
|
|||
.tabber {
|
||||
.tabbertab {
|
||||
border: 1px solid #eaecf0;
|
||||
border-top: 0;
|
||||
}
|
||||
|
||||
.oo-ui-menuLayout-content,
|
||||
.oo-ui-menuLayout-expanded,
|
||||
.oo-ui-menuLayout-menu,
|
||||
.oo-ui-panelLayout {
|
||||
position: relative!important;
|
||||
}
|
||||
|
||||
.oo-ui-menuLayout-content {
|
||||
top: 0!important;
|
||||
}
|
||||
|
||||
.oo-ui-indexLayout.oo-ui-menuLayout-expanded > .oo-ui-menuLayout-menu {
|
||||
height: auto;
|
||||
}
|
||||
}
|
Loading…
Reference in a new issue