Dashboard: Adds folder name and link to the dashboard overview on the homepage (#27214)

* Chore: Added foldername to the dashboard overview on the startpage

## Dashlist

### added
- new `<span>` containing `dash.folderTitle`
- styling for the newly created `<span>`

### changed
- added sass-nesting to classes in `_panel_dashlist.scss`

closes #26869

* Chore: Added foldername to the dashboard overview on the startpage

## Dashlist

### changed
- added `ng-if` directive to the dashlist-folder span

* Chore: Added foldername to the dashboard overview on the startpage

## Dashlist

### changed
- added folder-icon and removed brackets to indicate `folderTitle`
- changed font-size of folderTitle-`span` and added left margin

public/app/plugins/panel/dashlist/module.html

@@ -9,6 +9,10 @@
           <span class="dashlist-title">
             {{dash.title}}
           </span>
+          <span ng-if="dash.folderTitle" class="dashlist-folder">
+            <icon name="'folder'" type="mono" size="'xs'"></icon>
+            {{dash.folderTitle}}
+          </span>
           <span class="dashlist-star" ng-click="ctrl.starDashboard(dash, $event)">
             <icon name="dash.isStarred ? 'favorite':'star'" type="dash.isStarred ? 'mono':'default'"></icon>
           </span>

public/sass/components/_panel_dashlist.scss

@@ -8,18 +8,26 @@
   padding-top: 3px;
 }
 
-.dashlist-link {
-  @include list-item();
+.dashlist {
+  &-link {
+    @include list-item();
 
-  .fa {
-    padding-top: 3px;
+    .fa {
+      padding-top: 3px;
+    }
+
+    .fa-star {
+      color: $orange;
+    }
   }
 
-  .dashlist-star {
+  &-star {
     float: right;
   }
 
-  .fa-star {
-    color: $orange;
+  &-folder {
+    color: $text-color-weak;
+    margin-left: $space-sm;
+    font-size: $font-size-xs;
   }
 }