From 5f2aaa359c70348da841c883fdcefc396dff69d4 Mon Sep 17 00:00:00 2001 From: Stefan Giehl Date: Wed, 8 Dec 2021 01:11:42 +0100 Subject: Improve site without data page (#18462) * Improve site without data page * updates expected screenshots * use less mixin for matomo font css * fix typo * updates expected test files * Wording tweaks * Updated UI test screenshots Co-authored-by: Justin Velluppillai --- plugins/Live/stylesheets/live.less | 12 +----------- plugins/Live/stylesheets/visitor_profile.less | 2 +- plugins/Morpheus/stylesheets/base/mixins.less | 13 +++++++++++++ plugins/Morpheus/stylesheets/general/_jqueryUI.less | 7 ++----- plugins/Morpheus/stylesheets/main.less | 9 +-------- plugins/SitesManager/lang/en.json | 12 ++++++------ plugins/SitesManager/stylesheets/SitesManager.less | 5 +++++ plugins/SitesManager/templates/siteWithoutData.twig | 1 + .../expected-screenshots/EmptySite_emptySiteDashboard.png | 4 ++-- tests/UI/expected-screenshots/OneClickUpdate_login.png | 4 ++-- 10 files changed, 34 insertions(+), 35 deletions(-) diff --git a/plugins/Live/stylesheets/live.less b/plugins/Live/stylesheets/live.less index 5f121dce8c..7d4d87ea37 100644 --- a/plugins/Live/stylesheets/live.less +++ b/plugins/Live/stylesheets/live.less @@ -223,17 +223,7 @@ ol.actionList > li:not(.pageviewActions) { margin-top: 2px; float: left; margin-right: 5px; - - // copied frim [class^=icon-] style - font-family: 'matomo' !important; - speak: none; - font-style: normal; - font-weight: normal; - font-variant: normal; - text-transform: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; + .matomo-icon(); } } } diff --git a/plugins/Live/stylesheets/visitor_profile.less b/plugins/Live/stylesheets/visitor_profile.less index 0fd91fb8fd..aa199cdfd5 100644 --- a/plugins/Live/stylesheets/visitor_profile.less +++ b/plugins/Live/stylesheets/visitor_profile.less @@ -78,12 +78,12 @@ margin-right: 5px; &:before { + .matomo-icon(); color: #000; background-color: #fff; font-size: 16px; line-height: 16px; font-weight: 400; - font-family: matomo; padding: 1px; height: 18px; display: block; diff --git a/plugins/Morpheus/stylesheets/base/mixins.less b/plugins/Morpheus/stylesheets/base/mixins.less index 5028d33592..ddb5502633 100644 --- a/plugins/Morpheus/stylesheets/base/mixins.less +++ b/plugins/Morpheus/stylesheets/base/mixins.less @@ -20,6 +20,19 @@ strong { line-height: @line; } +.matomo-icon() { + /* copied from icons.css */ + font-family: 'matomo' !important; + speak: none; + font-style: normal; + font-weight: normal; + font-variant: normal; + text-transform: none; + line-height: 1; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + .border-radius (@radius: 6px) { -webkit-border-radius: @radius; -moz-border-radius: @radius; diff --git a/plugins/Morpheus/stylesheets/general/_jqueryUI.less b/plugins/Morpheus/stylesheets/general/_jqueryUI.less index 744605f6bf..ac3db8f80b 100644 --- a/plugins/Morpheus/stylesheets/general/_jqueryUI.less +++ b/plugins/Morpheus/stylesheets/general/_jqueryUI.less @@ -294,12 +294,9 @@ body .ui-tooltip.small { } .ui-dialog-titlebar .ui-icon-closethick { - font-family: 'matomo'; + .matomo-icon(); + line-height: inherit; font-weight: bold; - - /* Better Font Rendering =========== */ - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; font-size: 8px; background-image: none !important; text-indent: 0 !important; diff --git a/plugins/Morpheus/stylesheets/main.less b/plugins/Morpheus/stylesheets/main.less index 647c27c28f..af452f5fb4 100644 --- a/plugins/Morpheus/stylesheets/main.less +++ b/plugins/Morpheus/stylesheets/main.less @@ -499,14 +499,7 @@ div.dataTableVizHtmlTable, div.dataTableVizAllColumns, div.dataTableVizGoals { tr.subDataTable > td > span.label::before { - font-family: 'matomo' !important; - speak: none; - font-style: normal; - font-weight: normal; - font-variant: normal; - text-transform: none; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; + .matomo-icon(); .font-default(16px, 18px); color: #aaa; margin-right: 8px; diff --git a/plugins/SitesManager/lang/en.json b/plugins/SitesManager/lang/en.json index 191e280211..51b1ada059 100644 --- a/plugins/SitesManager/lang/en.json +++ b/plugins/SitesManager/lang/en.json @@ -75,10 +75,10 @@ "ShowTrackingTag": "View Tracking code", "Sites": "Websites", "SiteSearchUse": "You can use Matomo to track and report what visitors are searching in your website's internal search engine.", - "SiteWithoutDataTitle": "No data has been recorded yet, get set up below", - "SiteWithoutDataDescription": "Only one last step to track your web traffic with Matomo and gain valuable insights. You need to add some extra code to your website or mobile app if you haven't done already. Check your option below or %1$ssend all the instructions to a team mate%2$s.", - "SiteWithoutDataSetupTracking": "Please set up the %1$stracking code%2$s below into your website or mobile app if you haven't done already.", - "SiteWithoutDataMessageDisappears": "This message will disappear as soon as some data was tracked for this website.", + "SiteWithoutDataTitle": "Only one last step to track your traffic with Matomo and gain valuable insights", + "SiteWithoutDataDescription": "You need to add some extra code to your website or mobile app if you haven't already. Check your option below or %1$ssend all the instructions to a team mate%2$s.", + "SiteWithoutDataSetupTracking": "Please set up the %1$stracking code%2$s below into your website or mobile app if you haven't already.", + "SiteWithoutDataMessageDisappears": "This message will disappear as soon as some data is tracked for this website.", "SiteWithoutDataIgnoreMessage": "Don't show this message for the next hour", "SiteWithoutDataChoosePreferredWay": "Choose your preferred way of getting set up", "SiteWithoutDataOtherWays": "Other ways", @@ -87,7 +87,7 @@ "SiteWithoutDataMatomoTagManager": "Matomo Tag Manager", "SiteWithoutDataMatomoTagManagerNotActive": "Don't know what a Tag Manager is? Check out our %1$sTag Manager guide%2$s. If you are embedding multiple resources from 3rd party websites into your website, then tracking your website using the Tag Manager may be a better choice for you compared to using the regular JavaScript tracking.", "SiteWithoutDataGoogleTagManagerDescription": "You can use Matomo with Google Tag Manager. To setup Matomo Tracking in Google Tag Manager, follow the instructions from this %1$sguide%2$s.", - "SiteWithoutDataDetectedSite": "We've detected you're using a %1$s site. Simple follow the instructions from this %2$sguide%3$s.", + "SiteWithoutDataDetectedSite": "We've detected you're using a %1$s site. Simply follow the instructions from this %2$sguide%3$s.", "SiteWithoutDataDetectedGtm": "We've also detected you're using a Google Tag Manager. If you prefer to set up Matomo using GTM please follow this %2$sguide%3$s.", "SuperUserAccessCan": "A user with Super User access can also %1$s specify global settings%2$s for new websites.", "Timezone": "Time zone", @@ -117,4 +117,4 @@ "EmailInstructionsYourTrackingUrl": "Your tracking URL: %1$s", "DetectingYourSite": "Detecting your site" } -} \ No newline at end of file +} diff --git a/plugins/SitesManager/stylesheets/SitesManager.less b/plugins/SitesManager/stylesheets/SitesManager.less index 3fcff25546..0651e40ef4 100644 --- a/plugins/SitesManager/stylesheets/SitesManager.less +++ b/plugins/SitesManager/stylesheets/SitesManager.less @@ -118,6 +118,11 @@ td.editable-site-field:hover { } .site-without-data { + .card-title:after { + content: " \e9a5"; // icon-rocket + .matomo-icon(); + } + h3 { font-weight: bold; } diff --git a/plugins/SitesManager/templates/siteWithoutData.twig b/plugins/SitesManager/templates/siteWithoutData.twig index f5da6d405f..21665cc52c 100644 --- a/plugins/SitesManager/templates/siteWithoutData.twig +++ b/plugins/SitesManager/templates/siteWithoutData.twig @@ -27,6 +27,7 @@
+

 

{{ 'SitesManager_SiteWithoutDataDescription'|translate('', '')|raw }}

{{ 'SitesManager_SiteWithoutDataMessageDisappears'|translate }}

diff --git a/tests/UI/expected-screenshots/EmptySite_emptySiteDashboard.png b/tests/UI/expected-screenshots/EmptySite_emptySiteDashboard.png index 77b41a9fe2..9d15448e76 100644 --- a/tests/UI/expected-screenshots/EmptySite_emptySiteDashboard.png +++ b/tests/UI/expected-screenshots/EmptySite_emptySiteDashboard.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:accb79f60be4d13cdc2756410380a0e19c9b15a868a204c0857a91a595785268 -size 151171 +oid sha256:c5b7d1edfbde377ba4d1b516540f310a6766e4d0ab521ebe90c668aa0b5d2f95 +size 148409 diff --git a/tests/UI/expected-screenshots/OneClickUpdate_login.png b/tests/UI/expected-screenshots/OneClickUpdate_login.png index 58f72315e7..474d7e6aa0 100644 --- a/tests/UI/expected-screenshots/OneClickUpdate_login.png +++ b/tests/UI/expected-screenshots/OneClickUpdate_login.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:6d116ad0e8509086043d3166a891b7c92b79ed03ffcab362531e8460856e5998 -size 87530 +oid sha256:9adfdf87aee9bbe915e648506599d392ca750d7d503c522fd15d47c775e6b208 +size 85079 -- cgit v1.2.3