Font-Awesome fixed and IE9 removed (#52)

* replaced the font-awesome js with css
* fixed #47
* fixed #46
* removed IE9 support
sidebar
Tealk 2018-02-08 15:58:41 +01:00 committed by Tom Hutchison
parent d47024ebed
commit db642cbb53
5 changed files with 72 additions and 190 deletions

View File

@ -34,25 +34,10 @@ class SkinPivot extends SkinTemplate {
$wgPivotFeatures[$fgOption] = $fgOptionValue;
}
}
switch ($wgPivotFeatures['IeEdgeCode']) {
case 1:
$out->addHeadItem('ie-meta', '<meta http-equiv="X-UA-Compatible" content="IE=edge" />');
break;
case 2:
if (isset($_SERVER['HTTP_USER_AGENT']) && (strpos($_SERVER['HTTP_USER_AGENT'], 'MSIE') !== false))
header('X-UA-Compatible: IE=edge');
break;
}
$out->addModuleStyles('skins.pivot.styles');
}
public function initPage(OutputPage $out) {
global $wgLocalStylePath;
parent::initPage($out);
$viewport_meta = 'width=device-width, user-scalable=yes, initial-scale=1.0';
$out->addMeta('viewport', $viewport_meta);
$out->addModuleScripts('skins.pivot.js');
$out->addHeadItem('font', '<link rel="preload" href="/skins/pivot/assets/fonts/fontawesome-webfont.woff2?v=4.7.0" as="font" type="font/woff2" crossorigin="anonymous" />');
}
}

View File

@ -1,11 +1,6 @@
jQuery(document).ready(function() {
// Add the 'less than IE9' class to appropriate version of IE by checking for their support of cssFloat (true in v9)
if (!jQuery.support.cssFloat) { jQuery('html').addClass('lt-ie9').addClass('no-js'); }
jQuery(document).foundation(function (response) {
// console.log(response.errors); < this line will produce error in ie9!
if (window.console) console.log(response.errors);
});
@ -16,63 +11,4 @@ jQuery(document).ready(function() {
jQuery("#pt-notifications-alert").prependTo("#echo-notifications-alerts");
jQuery("#pt-notifications-notice").prependTo("#echo-notifications-notice");
// Append font-awesome icons
jQuery('[id^=ca-nstab] a').prepend('<div id="drop-icon"><i class="fa fa-file fa-fw"></i></div>')
jQuery('li#ca-talk a').prepend('<div id="drop-icon"><i class="fa fa-comments-o fa-fw"></i></div>')
jQuery('li#ca-form_edit a').prepend('<div id="drop-icon"><i class="fa fa-pencil-square fa-fw"></i></div>')
jQuery('li#ca-history a').prepend('<div id="drop-icon"><i class="fa fa-archive fa-fw"></i></div>')
jQuery('li#ca-delete a').prepend('<div id="drop-icon"><i class="fa fa-trash-o fa-fw"></i></div>')
jQuery('li#ca-move a').prepend('<div id="drop-icon"><i class="fa fa-truck fa-fw"></i></div>')
jQuery('li#ca-protect a').prepend('<div id="drop-icon"><i class="fa fa-shield fa-fw"></i></div>')
jQuery('li#ca-unprotect a').prepend('<div id="drop-icon"><i class="fa fa-shield fa-fw"></i></div>')
jQuery('li#ca-watch a').prepend('<div id="drop-icon"><i class="fa fa-star-o fa-fw"></i></div>')
jQuery('li#ca-unwatch a').prepend('<div id="drop-icon"><i class="fa fa-star fa-fw"></i></div>')
jQuery('li#ca-purge a').prepend('<div id="drop-icon"><i class="fa fa-refresh fa-fw"></i></div>')
jQuery('li#ca-undelete a').prepend('<div id="drop-icon"><i class="fa fa-undo fa-fw"></i></div>')
jQuery('li#ca-ask_delete_permanently a').prepend('<div id="drop-icon"><i class="fa fa-cut fa-fw"></i></div>')
if ( jQuery( '#ca-addsection' ).length ) {
jQuery('li#ca-addsection a').html('<div id="drop-icon"><i class="fa fa-plus fa-fw"></i></div>' + jQuery('li#ca-addsection a').attr('title').replace(/\[.+/g,""))
}
jQuery('li#pt-uls a').prepend('<div id="drop-icon"><i class="fa fa-book fa-fw"></i></div>')
jQuery('li#pt-userpage a').prepend('<div id="drop-icon"><i class="fa fa-user fa-fw"></i></div>')
jQuery('li#pt-mytalk a').prepend('<div id="drop-icon"><i class="fa fa-comments fa-fw"></i></div>')
jQuery('li#pt-adminlinks a').prepend('<div id="drop-icon"><i class="fa fa-bolt fa-fw"></i></div>')
jQuery('li#pt-preferences a').prepend('<div id="drop-icon"><i class="fa fa-ellipsis-h fa-fw"></i></div>')
jQuery('li#pt-watchlist a').prepend('<div id="drop-icon"><i class="fa fa-th-list fa-fw"></i></div>')
jQuery('li#pt-mycontris a').prepend('<div id="drop-icon"><i class="fa fa-smile-o fa-fw"></i></div>')
jQuery('li#pt-logout a').prepend('<div id="drop-icon"><i class="fa fa-power-off fa-fw"></i></div>')
jQuery('li#t-smwbrowselink a').prepend('<div id="drop-icon"><i class="fa fa-eye fa-fw"></i></div>')
jQuery('li#t-whatlinkshere a').prepend('<div id="drop-icon"><i class="fa fa-arrows fa-fw"></i></div>')
jQuery('li#t-blockip a').prepend('<div id="drop-icon"><i class="fa fa-ban fa-fw"></i></div>')
jQuery('li#t-recentchangeslinked a').prepend('<div id="drop-icon"><i class="fa fa-bars fa-fw"></i></div>')
jQuery('li#t-contributions a').prepend('<div id="drop-icon"><i class="fa fa-smile-o fa-fw"></i></div>')
jQuery('li#t-log a').prepend('<div id="drop-icon"><i class="fa fa-bars fa-fw"></i></div>')
jQuery('li#t-emailuser a').prepend('<div id="drop-icon"><i class="fa fa-envelope fa-fw"></i></div>')
jQuery('li#t-userrights a').prepend('<div id="drop-icon"><i class="fa fa-gavel fa-fw"></i></div>')
jQuery('li#t-upload a').prepend('<div id="drop-icon"><i class="fa fa-upload fa-fw"></i></div>')
jQuery('li#t-specialpages a').prepend('<div id="drop-icon"><i class="fa fa-magic fa-fw"></i></div>')
jQuery('li#t-print a').prepend('<div id="drop-icon"><i class="fa fa-print fa-fw"></i></div>')
jQuery('li#t-permalink a').prepend('<div id="drop-icon"><i class="fa fa-dot-circle-o fa-fw"></i></div>')
jQuery('li#t-info a').prepend('<div id="drop-icon"><i class="fa fa-info fa-fw"></i></div>')
jQuery('li#t-cite a').prepend('<div id="drop-icon"><i class="fa fa-quote-left fa-fw"></i></div>')
jQuery('li#feedlinks a').prepend('<div id="drop-icon"><i class="fa fa-rss fa-fw"></i></div>')
jQuery('li#n-recentchanges a').prepend('<div id="drop-icon"><i class="fa fa-tasks fa-fw"></i></div>')
jQuery('li#n-help a').prepend('<div id="drop-icon"><i class="fa fa-question fa-fw"></i></div>')
jQuery('li#n-randompage a').prepend('<div id="drop-icon"><i class="fa fa-random fa-fw"></i></div>')
// Turn categories into labels
jQuery('#mw-normal-catlinks ul li a').addClass('label');
});
// Have to wait until the window is fully loaded because of Visual Editor to prepend icons for editing
jQuery(window).load(function() {
jQuery('li#ca-ve-edit a').prepend('<div id="drop-icon"><i class="fa fa-pencil fa-fw"></i></div>')
jQuery('li#ca-viewsource a').prepend('<div id="drop-icon"><i class="fa fa-book fa-fw"></i></div>')
jQuery('li#ca-edit a').prepend('<div id="drop-icon"><i class="fa fa-pencil-square-o fa-fw"></i></div>')
});

View File

@ -0,0 +1,68 @@
.side-nav li a:before,
#drop1 li a:before,
.right-off-canvas-menu li a:before {
font: normal normal normal 14px/1 FontAwesome;
font-size: inherit;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
margin-right: 5px;
display: inline-block;
width: 1em;
}
/* -- Navigation -- */
#n-mainpage-description a:before {content: "\f015";}
#n-recentchanges a:before {content: "\f0ae";}
#n-randompage a:before {content: "\f074";}
#n-help a:before {content: "\f128";}
/* -- Toolbox -- */
#t-whatlinkshere a:before {content: "\f047";}
#t-recentchangeslinked a:before {content: "\f0c9";}
#t-specialpages a:before {content: "\f0d0";}
#t-print a:before {content: "\f02f";}
#t-permalink a:before {content: "\f192";}
#t-info a:before {content: "\f129";}
/* -- Actions -- */
#ca-nstab-main a:before {content: "\f015";}
#ca-talk a:before {content: "\f0e6";}
#ca-edit a:before {content: "\f044";}
#ca-history a:before {content: "\f187";}
#ca-delete a:before {content: "\f014";}
#ca-move a:before {content: "\f0d1";}
#ca-protect a:before {content: "\f132";}
#ca-unprotect a:before {content: "\f132";}
#ca-watch a:before {content: "\f006";}
#ca-unwatch a:before {content: "\f005";}
#ca-ve-edit a:before {content: "\f040";}
#ca-viewsource a:before {content: "\f02d";}
#ca-form_edit a:before {content: "\f14b";}
#ca-purge a:before {content: "\f021";}
#ca-undelete a:before {content: "\f0e2";}
#ca-ask_delete_permanently a:before {content: "\f0c4";}
#ca-addsection a:before {content: "\f067";}
/* -- Usermenu -- */
#pt-userpage a:before {content: "\f007";}
#pt-mytalk a:before {content: "\f086";}
#pt-adminlinks a:before {content: "\f0e7";}
#pt-preferences a:before {content: "\f141";}
#pt-watchlist a:before {content: "\f00b";}
#pt-mycontris a:before {content: "\f118";}
#pt-logout a:before {content: "\f011";}
#pt-uls a:before {content: "\f02d";}
#t-smwbrowselink a:before {content: "\f06e";}
#t-blockip a:before {content: "\f05e";}
#t-contributions a:before {content: "\f118";}
#t-log a:before {content: "\f0c9";}
#t-emailuser a:before {content: "\f0e0";}
#t-userrights a:before {content: "\f0e3";}
#t-upload a:before {content: "\f093";}
#t-cite a:before {content: "\f10d";}
#feedlinks a:before {content: "\f09e";}

View File

@ -73,7 +73,6 @@ body.action-formedit .row.hide-on-form-edit { display: none;}
#p-cactions #drop1 {
z-index: 1000;
white-space: nowrap;
border: 1px solid cyan;
}
#p-cactions #drop1 a {
width: 100%;
@ -648,113 +647,6 @@ span.smwttactiveinline span.smwbuiltin {
div.mw-htmlform-field-HTMLCheckField div.mw-label { height:0; }
/* ZUBR IE8 FIXES */
/* GRID: https://gist.github.com/zurbchris/5068210 */
.lt-ie9 .row { width: 940px; max-width: 100%; min-width: 768px; margin: 0 auto; }
.lt-ie9 .row .row { width: auto; max-width: none; min-width: 0; margin: 0 -15px; }
.lt-ie9 .row.large-collapse .column,
.lt-ie9 .row.large-collapse .columns { padding: 0; }
.lt-ie9 .row .row { width: auto; max-width: none; min-width: 0; margin: 0 -15px; }
.lt-ie9 .row .row.large-collapse { margin: 0; }
.lt-ie9 .column, .lt-ie9 .columns { float: left; min-height: 1px; padding: 0 15px; position: relative; }
.lt-ie9 .column.large-centered, .columns.large-centered { float: none; margin: 0 auto; }
.lt-ie9 [class*="column"] + [class*="column"]:last-child { float: right; }
.lt-ie9 [class*="column"] + [class*="column"].end { float: left; }
.lt-ie9 .large-1,
.lt-ie9 .row .large-1 { width: 8.33333%; }
.lt-ie9 .large-2,
.lt-ie9 .row .large-2 { width: 16.66667%; }
.lt-ie9 .large-3,
.lt-ie9 .row .large-3 { width: 25%; }
.lt-ie9 .large-4,
.lt-ie9 .row .large-4 { width: 33.33333%; }
.lt-ie9 .large-5,
.lt-ie9 .row .large-5 { width: 41.66667%; }
.lt-ie9 .large-6,
.lt-ie9 .row .large-6 { width: 50%; }
.lt-ie9 .large-7,
.lt-ie9 .row .large-7 { width: 58.33333%; }
.lt-ie9 .large-8,
.lt-ie9 .row .large-8 { width: 66.66667%; }
.lt-ie9 .large-9,
.lt-ie9 .row .large-9 { width: 75%; }
.lt-ie9 .large-10,
.lt-ie9 .row .large-10 { width: 83.33333%; }
.lt-ie9 .large-11,
.lt-ie9 .row .large-11 { width: 91.66667%; }
.lt-ie9 .large-12,
.lt-ie9 .row .large-12 { width: 100%; }
.lt-ie9 .row .large-offset-1 { margin-left: 8.33333%; }
.lt-ie9 .row .large-offset-2 { margin-left: 16.66667%; }
.lt-ie9 .row .large-offset-3 { margin-left: 25%; }
.lt-ie9 .row .large-offset-4 { margin-left: 33.33333%; }
.lt-ie9 .row .large-offset-5 { margin-left: 41.66667%; }
.lt-ie9 .row .large-offset-6 { margin-left: 50%; }
.lt-ie9 .row .large-offset-7 { margin-left: 58.33333%; }
.lt-ie9 .row .large-offset-8 { margin-left: 66.66667%; }
.lt-ie9 .row .large-offset-9 { margin-left: 75%; }
.lt-ie9 .row .large-offset-10 { margin-left: 83.33333%; }
.lt-ie9 .pull-2 { right: 16.66667%; }
.lt-ie9 .pull-3 { right: 25%; }
.lt-ie9 .pull-4 { right: 33.33333%; }
.lt-ie9 .pull-5 { right: 41.66667%; }
.lt-ie9 .pull-6 { right: 50%; }
.lt-ie9 .pull-7 { right: 58.33333%; }
.lt-ie9 .pull-8 { right: 66.66667%; }
.lt-ie9 .pull-9 { right: 75%; }
.lt-ie9 .pull-10 { right: 83.33333%; }
.lt-ie9 .push-2 { left: 16.66667%; }
.lt-ie9 .push-3 { left: 25%; }
.lt-ie9 .push-4 { left: 33.33333%; }
.lt-ie9 .push-5 { left: 41.66667%; }
.lt-ie9 .push-6 { left: 50%; }
.lt-ie9 .push-7 { left: 58.33333%; }
.lt-ie9 .push-8 { left: 66.66667%; }
.lt-ie9 .push-9 { left: 75%; }
.lt-ie9 .push-10 { left: 83.33333%; }
/* Nicolas Gallagher's micro clearfix */
.lt-ie9 .row { *zoom: 1; }
.lt-ie9 .row:before, .row:after { content: " "; display: table; }
.lt-ie9 .row:after { clear: both; }
/* END IE8 GRID */
.lt-ie9 .hide-for-small { display: block !important; }
/* TOP NAV */
.lt-ie9 .top-bar-section {
display:block;
}
.lt-ie9 .top-bar-section ul {
height: auto;
width: 100%;
}
.lt-ie9 .top-bar .top-bar-section ul,
.lt-ie9 .top-bar .top-bar-section ul li {
float: left;
display: inline;
}
/* END OTHER IE8 FIXES */
/* UNTIL I CAN DETERMINE WHY toolboxend GENERATES AN EMPTY <li> IN THE MENU, I'M HIDING IT */
#p-toolboxend { display:none;}

View File

@ -25,9 +25,10 @@
"position": "top",
"styles": [
"assets/stylesheets/normalize.css",
"assets/stylesheets/font-awesome.css",
"assets/stylesheets/font-awesome.min.css",
"assets/stylesheets/foundation.css",
"assets/stylesheets/pivot.css",
"assets/stylesheets/fontawsome.css",
"assets/stylesheets/pivot-print.css"
]
},