Starting prep for v2.0.1 release

CHANGELOG.md

@@ -1,3 +1,8 @@
+## Version 2.0.1
+
+* [code] Move Echo above Page Actions button
+* [feature] Add page indicator support
+
 ## Version 2.0
 
 * [feature] [b/c break] Upgrade to Foundation 5.5.3 (Foundation Tabs have a coding change to build tabs on pages)

Foreground.skin.php

@@ -154,6 +154,15 @@ class foregroundTemplate extends BaseTemplate {
 		<div id="page-content">
 		<div class="row">
 				<div class="large-12 columns">
+					<!-- Output page indicators -->
+					<?php echo $this->getIndicators(); ?>
+					<!-- If user is logged in output echo location -->
+					<?php if ($wgUser->isLoggedIn()): ?>
+					<div id="echo-notifications">
+					<div id="echo-notifications-alerts"></div>
+					<div id="echo-notifications-messages"></div>
+					</div>
+					<?php endif; ?>
 				<!--[if lt IE 9]>
 				<div id="siteNotice" class="sitenotice panel radius"><?php echo $this->text('sitename') . ' '. wfMessage( 'foreground-browsermsg' )->text(); ?></div>
 				<![endif]-->
@@ -175,12 +184,6 @@ class foregroundTemplate extends BaseTemplate {
 							<?php wfRunHooks( 'SkinTemplateToolboxEnd', array( &$this, true ) );  ?>
 						</ul>
 						<!--RTL -->
-						<?php if ($wgUser->isLoggedIn()): ?>
-							<div id="echo-notifications">
-							<div id="echo-notifications-alerts"></div>
-							<div id="echo-notifications-messages"></div>
-							</div>
-						<?php endif; ?>
 					<?php endif;
 					$namespace = str_replace('_', ' ', $this->getSkin()->getTitle()->getNsText());
 					$displaytitle = $this->data['title'];

assets/stylesheets/foreground.css

@@ -725,21 +725,22 @@ body.mw-special-Userlogin h2.title {
   display:none;
 }
 
-/* Don't like the black top bar? Copy this into your Foreground.css and change the colors
-.top-bar,
-.top-bar-section ul,
-.top-bar-section ul li.active > a,
-.top-bar-section li a:not(.button),
-.top-bar-section .has-form,
-.top-bar.expanded .title-area  {
-   background: black;
-   color: white;
+/* Don't like the black top bar? Copy this into your Foreground.css and change the colors 
+
+.top-bar, 
+.top-bar-section ul, 
+.top-bar-section ul li.active > a, 
+.top-bar-section li a:not(.button), 
+.top-bar-section .has-form {
+    background: #333333;
 }
 
+
 .top-bar-section > ul > .divider,
 .top-bar-section > ul > [role="separator"] {
   border-color: black;
 }
+
 */
 
 .vertical-divider {
@@ -754,6 +755,7 @@ body.mw-special-Userlogin h2.title {
 	background: inherit;
 }
 
+
 .top-bar input {
     width: auto;
     display: inline;
@@ -761,127 +763,111 @@ body.mw-special-Userlogin h2.title {
 
 /* Add improved styling for the Echo extension */
 
-#echo-notifications .mw-echo-ui-notificationBadgeButtonPopupWidget > .oo-ui-popupWidget  {
-    font-size: 80%;
-}
-
 #echo-notifications {
   float: right;
   display: inline-block;
-  margin: .5em 1em;
-}
-
-#echo-notifications #pt-notifications,
-#echo-notifications #pt-notifications-alert,
-#echo-notifications #pt-notifications-message {
+  margin: -1em 0 1em;
   position: relative;
-  list-style: none;
-  border-radius: 6px;
-  background-color: #E7E7E7;
-  z-index: 499;
+  z-index: 500;
+  height: 23px;
 }
 
-#echo-notifications #pt-notifications .mw-echo-notifications-badge
-{
-  text-align: center;
-  border-radius: 6px;
-  margin: 0;
-  padding:6px;
+#pt-notifications-alert .mw-echo-notifications-badge,
+#pt-notifications-message .mw-echo-notifications-badge {
+  background-size: 1.6em !important;
+  display: inline !important;
+  font-size: 1.2em;
+  filter: invert(25%);
+  color: transparent;
 }
 
-#echo-notifications #pt-notifications-alert .mw-echo-notifications-badge
-{
-  text-align: center;
-  border-radius: 6px;
-  margin: 0;
+#echo-notifications li {
+  list-style: none;
 }
 
-#echo-notifications #pt-notifications a.mw-echo-short-link .mw-badge,
-#echo-notifications #pt-notifications-alert a.mw-echo-short-link .mw-badge
-{
-  margin:0;
-  padding:6px;
+#echo-notifications-messages {
+  float: right;
 }
-
-#echo-notifications #pt-notifications .mw-badge-content,
-#echo-notifications #pt-notifications-alert .mw-badge-content
-{
-  font-size: 1.3em;
-  line-height: 1.1;
+#echo-notifications-alerts {
+  float: right;
 }
 
-#echo-notifications .mw-echo-overlay-pokey {
-  top: 30px;
-  left: -1px;
-}
-#echo-notifications .mw-echo-overlay {
-  left: -185px;
-  width: 300px;
-  top: 40px;
+#pt-notifications-alert .mw-echo-unseen-notifications,
+#pt-notifications-message .mw-echo-unseen-notifications {
+  color: #0645ad !important;
 }
 
-#echo-notifications .mw-echo-overlay-title {
-  padding: 10px;
-}
+/* Make Echo extension more mobile friendly on small widths */
 
-#echo-notifications .mw-echo-icon {
-  margin: 5px;
+@media only screen and (max-width: 450px) {
+.oo-ui-popupWidget-popup {
+    width: auto !important;
+    position: relative !important;
+    margin-left: -260px !important;
+    font-size: 75% !important;
 }
-
-#echo-notifications a.mw-echo-short-link .mw-badge {
-  margin-left: 0;
+.oo-ui-clippableElement-clippable.oo-ui-popupWidget-body {
+    width: 100% !important;
 }
-
-#echo-notifications #mw-echo-overlay-pref-link {
-  background-image:none;
-  font-size: 14px;
-  padding-left:0;
-  border-left:none;
 }
 
-#echo-notifications #mw-echo-overlay-link {
-  padding: 10px 0px 10px 15px;
-  background-position: left 50%;
-  border-right: none;
-  margin-right:0;
+/*Fix ULS CSS */
+#pt-uls a.uls-trigger {
+  padding-left:15px !important;
 }
 
-#echo-notifications .mw-echo-dismiss {
-  padding: 10px;
-  font-size: .8em;
-  min-width: 100%;
+/* Orbit Slider Overrides for MW */
+.orbit-container .orbit-slides-container img {
+    width: 100%;
 }
-
-#echo-notifications .mw-echo-notification {
-  overflow: visible;
+.orbit-bullets {
+    margin: 0 auto 30px auto !important;
 }
 
-#echo-notifications .mw-echo-title {
-  max-width: 99%;
+/* Block-Grid UL fixes */
+ul[class*="block-grid"] {
+    margin: 0;
 }
 
-/* Make Echo extension more mobile friendly on small widths */
+/* WikiEditor related fixes */
 
-@media only screen and (min-width: 550px) {
-#echo-notifications .mw-echo-overlay { left: -420px; width: 350px; }
-#echo-notifications #mw-echo-overlay-pref-link { padding: 10px 0 10px 30px; }
-#echo-notifications #mw-echo-overlay-link { border-right: 1px solid #DDDDDD; margin-right: 2em; }
+/* lable of toolbar */
+.wikiEditor-ui-toolbar .label {
+    background: transparent;
+    color: #000;
 }
-
-/*Fix ULS CSS */
-#pt-uls a.uls-trigger {
-  padding-left:15px !important;
+/* selection boxes in toolbar adhere to font-size */
+.wikiEditor-ui-toolbar .page-characters div span {
+    height: 1.75em;
 }
-
-/*Fixes Visual Editor */
-#content .oo-ui-widget {
-    height: 45px;
+/* backound of controls adhere to #p-cactions */
+.wikiEditor-ui-controls {
+    background-color: #f6f6f6; 
+}
+/* background of buttions adhere to #p-cactions*/
+.wikiEditor-ui-buttons {
+    background-color: #f6f6f6;
 }
 
-#content .oo-ui-toolbar-tools {
-    font-size: 90%;
+/* Visual Editor Fixes */
+.ve-activated #content {
+    margin-top: 4em;
+}
+.ve-ce-documentNode {
+    background:#fff;
+}
+.oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool > .oo-ui-tool-link,
+.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-widget-disabled > .oo-ui-tool-link  {
+    display: inline !important;
 }
 
-#content .oo-ui-toolbar-actions > .oo-ui-buttonElement.oo-ui-labelElement > .oo-ui-buttonElement-button > .oo-ui-labelElement-label {
-    line-height: 2.75em !important;
+.mw-indicators {
+    float: right;
+    line-height: 1.6;
+    font-size: 0.875em;
+    position: relative;
+    margin: -1em .5em 0;
+    max-height: 25px;
+    width: auto;
+    z-index: 1;
 }