Better UI for Piwik 3, more responsive, faster, lots of other fixes (#10397)

* improved ui and responsiveness

* improve rss widget

* commit changes for ui again, got lost after the last commit

* fix more tests

* restoring files

* fix fonts

* fix more tests

* more test fixes

* fix some system tests

* fix tests

* fix system and ui tests

* fix updater tests

* make a page as loaded once the callback is called

* enable verbose

* more verbose output

* enable phantomjs debug flag

* debug should be a phantomjs option

* trying to fix installation tests

* fixes #10173 to not compile css files as less

* trying to minimize js/css requests to hopefully prevent random ui test fails

* disable verbose mode

* fix updater and installation

* lots of bugfixes and ui tweaks

* fix reset dashboard

* various bugfixes

* fix integration tests

* fix text color

* hoping to fix installation tests this way

* cache css/js resources for an hour, should speed up tests and prevent some random issues

* we need to avoid installing plugins multiple times at the same time when requesting resources

* finally getting the colors right again

* fix most tests, more tests for theme

* use an h2 element for titles for better accessibility

* fix headline color

* use actual theme text color (piwik-black)

* fix small font size was applied on all p elements

* fix tests

* now improving all the datatables

* trying to ignore images for visitor log

* Revert "trying to ignore images for visitor log"

This reverts commit ad1ff7267aae14ad905bef130e956c8593c4fb22.

* fix tests

* fix we had always ignored a max label width

* trying to fix file permissions

* fix more file permissions

* Improved plugins update API (#10028)

* refs #7983 let plugins add or remove fields to websites and better settings api

* * Hide CorePluginsAdmin API methods
* More documentation
* Added some more tests

* improved updates API for plugins

* better error code as duplicate column cannot really happen when not actually renaming a colum

Conflicts:
	core/Updates/3.0.0-b1.php
	plugins/CoreUpdater/Commands/Update/CliUpdateObserver.php

* fix DB field piwik_log_visit.location_provider too small (#10003)

* fixes #9564 fix DB field piwik_log_visit.location_provider too small

* use new plugins updater API

* DB field piwik_log_visit.visit_total_actions too small (#10002)

* fixes #9565 DB field piwik_log_visit.visit_total_actions too small

* change type of some db columns that are too small

* fix tests (#10040)
Conflicts:
	plugins/CoreAdminHome/Menu.php
	plugins/Goals/Menu.php
	plugins/MobileMessaging/Menu.php
	plugins/SitesManager/Menu.php
	plugins/UsersManager/Menu.php
	tests/PHPUnit/System/expected/test_apiGetReportMetadata__API.getWidgetMetadata.xml

* fix more file permissions

* repair more file permissions

* repair more file permissions

* trying to make ui tests work again, the table was missing

* fix some encoding issues

* cross browser fixes and usability improvement

* move back the config icon, need to find a better solution later

* more cross browser fixes

* bugfixes

* fix ui tests

* fix encoding issue

* fix various issues with the ui tests when a test gets aborted

* also skip this visitor log test when aborted

* there were 3 css files that were loaded separately, merge them instead into one css

* forgot to add the actual manifest

* do not add manifest if custom logo is specified

* load font css files first as it was before merging them into big css

* fix link icon was not aligned anymore

* minor fixes

* setting it back to 4px

* in popovers the font variable was always ignored and a different font loaded

* forgot to update screenshots

* fix remaining tests

* this should fix an update error

* added 3 new widgets system check, system summary and plugin updates

* tweak new widgets content

* no page reload when changing date or segment

* in admin home show only enabled widgets

* refs #10295 use getMockBuilder instead of deprecated getMock

* fix some ui tests

* fix various bugs

* fix more tests

* fix ui tests

* add a space between loading image and loading message

* fix docs so they appear on developer.piwik.org

* improved documentation

* introduce new Widget::renderTemplate method for consistency with controllers

* remove no longer needed files

* testing system fonts

* fix strong was not really bold

* more useful system summary

* remove ubuntu font

* fix most tests and removed most em elements

* fix tests

* fix headline was very thin

* update submodule

* update submodules

* update submodule

* fix failing ui tests

* update submodules

2 files changed, 54 insertions, 43 deletions

diff --git a/plugins/Dashboard/templates/_dashboardSettings.twig b/plugins/Dashboard/templates/_dashboardSettings.twig
index db21def819..9dc4bd2458 100644
--- a/plugins/Dashboard/templates/_dashboardSettings.twig
+++ b/plugins/Dashboard/templates/_dashboardSettings.twig
@@ -1,22 +1,24 @@
 <a class="title" title="{{ 'Dashboard_ManageDashboard'|translate|e('html_attr') }}" tabindex="4"><span class="icon icon-arrow-bottom"></span>{{ 'Dashboard_Dashboard'|translate }} </a>
-<ul class="dropdown submenu">
-    <li>
-        <div class="addWidget">{{ 'Dashboard_AddAWidget'|translate }}</div>
-        <ul class="widgetpreview-categorylist"></ul>
-    </li>
-    {% if dashboardActions|length > 0 %}
-    <li>
-        <div class="manageDashboard">{{ 'Dashboard_ManageDashboard'|translate }}</div>
-        <ul>
-            {% for action, title in dashboardActions %}
-            <li data-action="{{ action }}">{{ title|translate }}</li>
-            {% endfor %}
-        </ul>
-    </li>
-    {% endif %}
-    {% for action, title in generalActions %}
-    <li data-action="{{ action }}">{{ title|translate }}</li>
-    {% endfor %}
-</ul>
-<ul class="widgetpreview-widgetlist"></ul>
-<div class="widgetpreview-preview"></div>
\ No newline at end of file
+<div class="dropdown positionInViewport">
+    <ul class="submenu">
+        <li>
+            <div class="addWidget">{{ 'Dashboard_AddAWidget'|translate }}</div>
+            <ul class="widgetpreview-categorylist"></ul>
+        </li>
+        {% if dashboardActions|length > 0 %}
+            <li>
+                <div class="manageDashboard">{{ 'Dashboard_ManageDashboard'|translate }}</div>
+                <ul>
+                    {% for action, title in dashboardActions %}
+                        <li data-action="{{ action }}">{{ title|translate }}</li>
+                    {% endfor %}
+                </ul>
+            </li>
+        {% endif %}
+        {% for action, title in generalActions %}
+            <li class="generalAction" data-action="{{ action }}">{{ title|translate }}</li>
+        {% endfor %}
+    </ul>
+    <ul class="widgetpreview-widgetlist"></ul>
+    <div class="widgetpreview-preview"></div>
+</div>
diff --git a/plugins/Dashboard/templates/embeddedIndex.twig b/plugins/Dashboard/templates/embeddedIndex.twig
index a7633ca193..77d6fe4bb3 100644
--- a/plugins/Dashboard/templates/embeddedIndex.twig
+++ b/plugins/Dashboard/templates/embeddedIndex.twig
@@ -2,7 +2,7 @@
     <div class="ui-confirm" id="confirm">
         <h2>{{ 'Dashboard_DeleteWidgetConfirm'|translate }}</h2>
         <input role="yes" type="button" value="{{ 'General_Yes'|translate }}"/>
-        <input role="no" type="button" value="{{ 'General_Cancel'|translate }}"/>
+        <input role="no" type="button" value="{{ 'General_No'|translate }}"/>
     </div>
 
     <div class="ui-confirm" id="setAsDefaultWidgetsConfirm">
@@ -10,13 +10,13 @@
         {% set resetDashboard %}{{ 'Dashboard_ResetDashboard'|translate }}{% endset %}
         <div class="popoverSubMessage">{{ 'Dashboard_SetAsDefaultWidgetsConfirmHelp'|translate(resetDashboard) }}</div>
         <input role="yes" type="button" value="{{ 'General_Yes'|translate }}"/>
-        <input role="no" type="button" value="{{ 'General_Cancel'|translate }}"/>
+        <input role="no" type="button" value="{{ 'General_No'|translate }}"/>
     </div>
 
     <div class="ui-confirm" id="resetDashboardConfirm">
         <h2>{{ 'Dashboard_ResetDashboardConfirm'|translate }}</h2>
         <input role="yes" type="button" value="{{ 'General_Yes'|translate }}"/>
-        <input role="no" type="button" value="{{ 'General_Cancel'|translate }}"/>
+        <input role="no" type="button" value="{{ 'General_No'|translate }}"/>
     </div>
 
     <div class="ui-confirm" id="dashboardEmptyNotification">
@@ -36,15 +36,18 @@
                 {% endfor %}
             </div>
             {% endfor %}
+            <br class="clearfix" />
         </div>
         <input role="yes" type="button" value="{{ 'General_Save'|translate }}"/>
+        <input role="cancel" type="button" value="{{ 'General_Cancel'|translate }}"/>
     </div>
 
     <div class="ui-confirm" id="renameDashboardConfirm">
         <h2>{{ 'Dashboard_RenameDashboard'|translate }}</h2>
 
-        <div id="newDashboardNameInput"><label for="newDashboardName">{{ 'Dashboard_DashboardName'|translate }} </label>
-            <input type="input" name="newDashboardName" id="newDashboardName" value=""/>
+        <div id="newDashboardNameInput">
+            <label for="newDashboardName">{{ 'Dashboard_DashboardName'|translate }} </label>
+            <input type="text" name="newDashboardName" id="newDashboardName" value=""/>
         </div>
         <input role="yes" type="button" value="{{ 'General_Save'|translate }}"/>
         <input role="cancel" type="button" value="{{ 'General_Cancel'|translate }}"/>
@@ -55,11 +58,16 @@
             <h2>{{ 'Dashboard_CopyDashboardToUser'|translate }}</h2>
 
             <div class="inputs">
-                <label for="copyDashboardName">{{ 'Dashboard_DashboardName'|translate }} </label>
-                <input type="input" name="copyDashboardName" id="copyDashboardName" value=""/>
-                <label for="copyDashboardUser">{{ 'General_Username'|translate }} </label>
-                <select name="copyDashboardUser" id="copyDashboardUser"></select>
+                <div class="row">
+                    <div class="col s12 m6"><label for="copyDashboardName">{{ 'Dashboard_DashboardName'|translate }} </label></div>
+                    <div class="col s12 m6"><input type="text" name="copyDashboardName" id="copyDashboardName" value=""/></div>
+                </div>
+                <div class="row">
+                    <div class="col s12 m6"><label for="copyDashboardUser">{{ 'General_Username'|translate }} </label></div>
+                    <div class="col s12 m6"><select class="browser-default" name="copyDashboardUser" id="copyDashboardUser"></select></div>
+                </div>
             </div>
+
             <input role="yes" type="button" value="{{ 'General_Ok'|translate }}"/>
             <input role="cancel" type="button" value="{{ 'General_Cancel'|translate }}"/>
         </div>
@@ -69,20 +77,21 @@
         <h2>{{ 'Dashboard_CreateNewDashboard'|translate }}</h2>
 
         <div id="createDashboardNameInput">
-            <label>{{ 'Dashboard_DashboardName'|translate }} <input type="input" name="newDashboardName" id="createDashboardName" value=""/></label><br/>
-
-            <label for="dashboard_type_default">
+            <p>
+                <label>{{ 'Dashboard_DashboardName'|translate }} </label>
+                <input type="text" name="newDashboardName" id="createDashboardName" value=""/>
+            </p>
+            <p>
                 <input type="radio" checked="checked" name="type" value="default" id="dashboard_type_default" />
-                {{ 'Dashboard_DefaultDashboard'|translate }}
-            </label>
-            <br/><br/>
-
-            <label for="dashboard_type_empty">
+                <label for="dashboard_type_default">{{ 'Dashboard_DefaultDashboard'|translate }}</label>
+            </p>
+            <p>
                 <input type="radio" name="type" value="empty" id="dashboard_type_empty" />
-                {{ 'Dashboard_EmptyDashboard'|translate }}
-            </label>
+                <label for="dashboard_type_empty">{{ 'Dashboard_EmptyDashboard'|translate }}</label>
+            </p>
+
         </div>
-        <input role="yes" type="button" value="{{ 'General_Yes'|translate }}"/>
+        <input role="yes" type="button" value="{{ 'General_Ok'|translate }}"/>
         <input role="no" type="button" value="{{ 'General_Cancel'|translate }}"/>
     </div>
 
@@ -91,10 +100,10 @@
 
         <div class="popoverSubMessage">{{ 'Dashboard_NotUndo'|translate(resetDashboard) }}</div>
         <input role="yes" type="button" value="{{ 'General_Yes'|translate }}"/>
-        <input role="no" type="button" value="{{ 'General_Cancel'|translate }}"/>
+        <input role="no" type="button" value="{{ 'General_No'|translate }}"/>
     </div>
 
     {% include "@Dashboard/_widgetFactoryTemplate.twig" %}
 
-    <div id="dashboardWidgetsArea"></div>
+    <div id="dashboardWidgetsArea" class="row"></div>
 </div>
\ No newline at end of file