[VBV-2021] [UI] Introduce visual flag/banner for favorite images

+ Added star icon to favorite images Change-Id: If0524ae64b8c7b43da1fb849d24355506833338c Reviewed-on: https://bellevue-ci.eng.vmware.com:8080/35911 Upgrade-Verified: jenkins <[email protected]> Closures-Verified: jenkins <[email protected]> Bellevue-Verified: jenkins <[email protected]> CS-Verified: jenkins <[email protected]> Reviewed-by: Iveta Ilieva <[email protected]>
afilipov1 · Jun 13, 2018 · 89d08a5 · 89d08a5
1 parent b8b56a8
commit 89d08a5
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 2 deletions.
diff --git a/ui/app/src/js/components/templates/ListItemImageVue.html b/ui/app/src/js/components/templates/ListItemImageVue.html
@@ -12,8 +12,9 @@
   role="alert" v-if="model.alert"><i class="fa alert-icon"
   :class="{'fa-check': model.alert.type === 'success', 'fa-exclamation-circle': model.alert.type === 'fail'}"
 ></i><span>{{model.alert.message}}</span></div>
-<div class="image-item" :data-name="model.registry + '/' + model.name">
-  <div class="image-header">
+  <div class="image-item" :data-name="model.registry + '/' + model.name">
+    <div v-if="isFavorite" class="favImage"><i class="fa fa-star"></i></div>
+    <div class="image-header">
     <img :src="model.icon"/>
     <div class="title-holder">
       <div class="title truncateText" :title="model.name">{{model.name}}</div>

diff --git a/ui/app/src/styles/components/_list-views.scss b/ui/app/src/styles/components/_list-views.scss
@@ -324,6 +324,12 @@
     margin-left: -20px;
     margin-right: -20px;
   }
+  .list-view .image-item .favImage {
+    position:  absolute;
+    top: 1px;
+    left: 5px;
+    color: $secondary-hint_title_color;
+  }
   .list-view .image-item .image-content {
     font-weight: 300;
     margin-bottom: 10px;