diff options
author | Kate Butler <kate@innocraft.com> | 2019-05-28 04:28:04 +0300 |
---|---|---|
committer | Matthieu Aubry <mattab@users.noreply.github.com> | 2019-05-28 04:28:04 +0300 |
commit | d100ab0bde28b8ec4cd28203b892df7a23113c43 (patch) | |
tree | 5f82daf7389513a6db8dab81b5da99de2419f409 /plugins/CoreHome | |
parent | e35fcd8ce317a83d85543259cfd61f7e5f756931 (diff) |
Update video content on Welcome widget (#14454)
* Remove Piwik promo video on Welcome widget and replace with link to Matomo videos
* Fix image overlapping text on smaller screen widths
* Updated screenshots for dashboard welcome widget
* Update test screenshots
* Revert file permissions
Diffstat (limited to 'plugins/CoreHome')
-rw-r--r-- | plugins/CoreHome/images/promo_splash.png | bin | 12070 -> 0 bytes | |||
-rw-r--r-- | plugins/CoreHome/images/promo_video_splash.jpg | bin | 0 -> 41108 bytes | |||
-rw-r--r-- | plugins/CoreHome/stylesheets/promo.less | 26 | ||||
-rw-r--r-- | plugins/CoreHome/templates/getPromoVideo.twig | 30 |
4 files changed, 9 insertions, 47 deletions
diff --git a/plugins/CoreHome/images/promo_splash.png b/plugins/CoreHome/images/promo_splash.png Binary files differdeleted file mode 100644 index 9a78f8e283..0000000000 --- a/plugins/CoreHome/images/promo_splash.png +++ /dev/null diff --git a/plugins/CoreHome/images/promo_video_splash.jpg b/plugins/CoreHome/images/promo_video_splash.jpg Binary files differnew file mode 100644 index 0000000000..a2bf76a0c0 --- /dev/null +++ b/plugins/CoreHome/images/promo_video_splash.jpg diff --git a/plugins/CoreHome/stylesheets/promo.less b/plugins/CoreHome/stylesheets/promo.less index ab0ed8f124..bf4992d603 100644 --- a/plugins/CoreHome/stylesheets/promo.less +++ b/plugins/CoreHome/stylesheets/promo.less @@ -1,37 +1,16 @@ #piwik-promo-thumbnail { - background: @theme-color-background-base url(plugins/CoreHome/images/promo_splash.png) no-repeat 0 0; - background-position: center; width: 100%; - max-width: 321px; + min-height: 178px; margin: 0 auto 0 auto; } -#piwik-promo-embed { - margin-left: 1px; -} - -#piwik-promo-embed>iframe { - z-index: 0; -} - -#piwik-promo-thumbnail { - height: 178px; -} - #piwik-promo-thumbnail:hover { opacity: .75; cursor: pointer; } #piwik-promo-thumbnail>img { - display: block; - position: relative; - top: 53px; - left: 125px; -} - -#piwik-promo-video { - margin: 2em 0 2em 0; + width: 100%; } #piwik-widget-footer { @@ -66,6 +45,7 @@ margin: 1em 0 0 1.25em; color: @theme-color-text-lighter; display: inline-block; + width: 90%; } #piwik-promo-videos-link:hover { diff --git a/plugins/CoreHome/templates/getPromoVideo.twig b/plugins/CoreHome/templates/getPromoVideo.twig index e068bb25e1..56e46d75ef 100644 --- a/plugins/CoreHome/templates/getPromoVideo.twig +++ b/plugins/CoreHome/templates/getPromoVideo.twig @@ -1,15 +1,12 @@ <div id="piwik-promo"> - <div id="piwik-promo-video"> - <div id="piwik-promo-thumbnail"> - <img src="plugins/Morpheus/images/video_play.png"/> + <a id="piwik-promo-videos-link" href="https://matomo.org/docs/videos/" rel="noreferrer noopener" target="_blank"> + <div id="piwik-promo-video"> + <div id="piwik-promo-thumbnail"> + <img src="plugins/CoreHome/images/promo_video_splash.jpg"/> + </div> </div> - <div id="piwik-promo-embed" style="display:none;"> - </div> - </div> - - <a id="piwik-promo-videos-link" href="https://matomo.org/blog/2012/12/piwik-how-to-videos/" rel="noreferrer noopener" target="_blank"> - {{ 'CoreHome_ViewAllPiwikVideoTutorials'|translate }} + <span>{{ 'CoreHome_ViewAllPiwikVideoTutorials'|translate }}</span> </a> <div id="piwik-promo-share"> @@ -35,18 +32,3 @@ <div id="piwik-widget-footer" style="color:#666;">{{ 'CoreHome_CloseWidgetDirections'|translate }}</div> </div> - -<script type="application/javascript"> - $(function () { - $('#piwik-promo-thumbnail').click(function () { - var promoEmbed = $('#piwik-promo-embed'), - widgetWidth = $(this).closest('.widgetContent').width(), - height = (266 * widgetWidth) / 421, - embedHtml = '<iframe width="100%" height="' + height + '" src="https://www.youtube-nocookie.com/embed/OslfF_EH81g?autoplay=1&vq=hd720&wmode=transparent" frameborder="0" wmode="Opaque"></iframe>'; - - $(this).hide(); - promoEmbed.height(height).html(embedHtml); - promoEmbed.show(); - }); - }); -</script> |