Update screenshots in default dashboard (#8483)

src/Umbraco.Web.UI.Client/src/less/pages/welcome-dashboard.less

@@ -39,21 +39,20 @@
     text-decoration: none;
     display: block;
     margin: 10px;
-}
 
-.welcome-dashboard__info-box:hover {
-    border: 2px solid @turquoise;
-    cursor: pointer;
-    transition: border-color 150ms ease-in-out;
-    text-decoration: none;
-}
+    &:hover {
+        border: 2px solid @turquoise;
+        cursor: pointer;
+        transition: border-color 150ms ease-in-out;
+        text-decoration: none;
+    }
 
-.welcome-dashboard__info-box:active,
-.welcome-dashboard__info-box:focus {
-    text-decoration: none;
+    &:active,
+    &:focus {
+        text-decoration: none;
+    }
 }
 
-
 .welcome-dashboard__info-box-title {
     color: @turquoise-d1;
     font-size: 16px;
@@ -74,7 +73,7 @@
 }
 
 .welcome-dashboard__card {
-    background-color: @gray-10;
+    background-color: @grayLighter;
     border-radius: 3px;
     margin: 10px;
     display: flex;
@@ -113,6 +112,6 @@
 }
 
 .welcome-dashboard__card-teaser {
-    font-size: 14px;
+    font-size: 13px;
     margin-bottom: 15px;
-}
+}

src/Umbraco.Web.UI.Client/src/views/dashboard/dashboard.tabs.controller.js

@@ -70,7 +70,7 @@ function startUpDynamicContentController($q, $timeout, $scope, dashboardResource
             {
                 title: "Umbraco.TV - Learn from the source!",
                 description: "Umbraco.TV will help you go from zero to Umbraco hero at a pace that suits you. Our easy to follow online training videos will give you the fundamental knowledge to start building awesome Umbraco websites.",
-                img: "views/dashboard/default/umbracotv.jpg",
+                img: "views/dashboard/default/umbracotv.png",
                 url: "https://umbraco.tv/?utm_source=core&utm_medium=dashboard&utm_content=image&utm_campaign=tv",
                 altText: "Umbraco.TV - Hours of Umbraco Video Tutorials",
                 buttonText: "Visit Umbraco.TV"
@@ -78,7 +78,7 @@ function startUpDynamicContentController($q, $timeout, $scope, dashboardResource
             {
                 title: "Our Umbraco - The Friendliest Community",
                 description: "Our Umbraco - the official community site is your one stop for everything Umbraco. Whether you need a question answered or looking for cool plugins, the world's best and friendliest community is just a click away.",
-                img: "views/dashboard/default/ourumbraco.jpg",
+                img: "views/dashboard/default/ourumbraco.png",
                 url: "https://our.umbraco.com/?utm_source=core&utm_medium=dashboard&utm_content=image&utm_campaign=our",
                 altText: "Our Umbraco",
                 buttonText: "Visit Our Umbraco"
@@ -109,19 +109,16 @@ function startUpDynamicContentController($q, $timeout, $scope, dashboardResource
             //we capture it like this, so we avoid UI errors - which automatically triggers ui based on http response code
             if (data && data.sections) {
                 vm.dashboard = data;
-            } else{
+            } else {
                 vm.showDefault = true;
             }
-
         },
-
         function (exception) {
             console.error(exception);
             vm.loading = false;
             vm.showDefault = true;
         });
 
-
     onInit();
 
 }

src/Umbraco.Web.UI.Client/src/views/dashboard/default/StartupDashboardIntro.html

@@ -35,7 +35,6 @@
     </div>
     <!-- grid container end -->
 
-
     <!-- Default content in case we cannot fetch content from the outside -->
     <div style="max-width: 1200px" ng-if="vm.showDefault">
 
@@ -49,27 +48,27 @@
         </div>
 
         <div class="welcome-dashboard__info-box-boxes">
-            <a ng-href="{{infoBox.url}}" target="_blank" class="welcome-dashboard__info-box" ng-repeat="infoBox in vm.defaultDashboard.infoBoxes">
-                <div class="welcome-dashboard__info-box-title">{{ infoBox.title }}</div>
-                <div class="welcome-dashboard__info-box-description">{{ infoBox.description }}</div>
+            <a ng-href="{{infoBox.url}}" href="" target="_blank" rel="noreferrer" class="welcome-dashboard__info-box" ng-repeat="infoBox in vm.defaultDashboard.infoBoxes">
+                <div class="welcome-dashboard__info-box-title">{{infoBox.title}}</div>
+                <div class="welcome-dashboard__info-box-description">{{infoBox.description}}</div>
             </a>
         </div>
 
         <div class="welcome-dashboard__cards">
             <div class="welcome-dashboard__card" ng-repeat="article in vm.defaultDashboard.articles">
                 <div class="welcome-dashboard__card-image-wrapper">
-                    <a ng-href="{{article.url}}" target="_blank">
-                        <img class="welcome-dashboard__card-image" ng-src="{{article.img}}" alt="{{ article.altText }}" />
+                    <a ng-href="{{article.url}}" href="" target="_blank" rel="noreferrer">
+                        <img class="welcome-dashboard__card-image" ng-src="{{article.img}}" alt="{{article.altText}}" />
                     </a>
                 </div>
                 <div class="welcome-dashboard__card-content">
-                    <h2 class="welcome-dashboard__card-title">{{ article.title }}</h2>
-                    <div class="welcome-dashboard__card-teaser">{{ article.description }}</div>
-                    <a class="btn btn-success" ng-href="{{article.url}}" target="_blank">{{article.buttonText}}</a>
+                    <h2 class="welcome-dashboard__card-title">{{article.title}}</h2>
+                    <div class="welcome-dashboard__card-teaser">{{article.description}}</div>
+                    <a class="button" ng-href="{{article.url}}" href="" target="_blank" rel="noreferrer">{{article.buttonText}}</a>
                 </div>
             </div>
         </div>
 
     </div>
 
-</div>
+</div>