From 7b060509f535de49389ef16e41062f690e019bc4 Mon Sep 17 00:00:00 2001
From: Charles Hacskaylo <charlesh88@gmail.com>
Date: Mon, 30 Mar 2020 17:30:53 -0700
Subject: [PATCH] c-object-label changes brought over from `topic-conditionals`
 (#2823)

- SCSS mods;
- Markup in select objects
---
 src/plugins/tabs/components/tabs.vue |  4 ++--
 src/ui/components/ObjectFrame.vue    | 12 +++++------
 src/ui/components/object-label.scss  | 32 ++++++++++++++++++++--------
 src/ui/layout/BrowseBar.vue          |  4 ++--
 4 files changed, 33 insertions(+), 19 deletions(-)

diff --git a/src/plugins/tabs/components/tabs.vue b/src/plugins/tabs/components/tabs.vue
index 262f1bb217..5b109a4b56 100644
--- a/src/plugins/tabs/components/tabs.vue
+++ b/src/plugins/tabs/components/tabs.vue
@@ -40,10 +40,10 @@
     >
         <div
             v-if="currentTab"
-            class="c-tabs-view__object-name l-browse-bar__object-name--w"
+            class="c-tabs-view__object-name c-object-label l-browse-bar__object-name--w"
             :class="currentTab.type.definition.cssClass"
         >
-            <div class="l-browse-bar__object-name">
+            <div class="l-browse-bar__object-name c-object-label__name">
                 {{ currentTab.domainObject.name }}
             </div>
         </div>
diff --git a/src/ui/components/ObjectFrame.vue b/src/ui/components/ObjectFrame.vue
index 411567a578..7c4754ffdc 100644
--- a/src/ui/components/ObjectFrame.vue
+++ b/src/ui/components/ObjectFrame.vue
@@ -28,12 +28,12 @@
     }"
 >
     <div class="c-so-view__header">
-        <div
-            class="c-so-view__header__icon"
-            :class="cssClass"
-        ></div>
-        <div class="c-so-view__header__name">
-            {{ domainObject && domainObject.name }}
+        <div class="c-object-label"
+             :class="cssClass"
+        >
+            <div class="c-object-label__name">
+                {{ domainObject && domainObject.name }}
+            </div>
         </div>
         <context-menu-drop-down
             :object-path="objectPath"
diff --git a/src/ui/components/object-label.scss b/src/ui/components/object-label.scss
index c2bd5e5a18..32dabb94c5 100644
--- a/src/ui/components/object-label.scss
+++ b/src/ui/components/object-label.scss
@@ -1,28 +1,42 @@
 .c-object-label {
     // <a> tag and draggable element that holds type icon and name.
     // Used mostly in trees and lists
-    border-radius: $controlCr;
     display: flex;
     align-items: center;
-    flex: 1 1 auto;
+    flex: 0 1 auto;
     overflow: hidden;
-    padding: $interiorMarginSm 1px;
     white-space: nowrap;
 
     &__name {
         @include ellipsize();
         display: inline;
-        color: $colorItemTreeFg;
+    }
+
+    &__type-icon,
+    &:before {
+        // Type icon. Must be an HTML entity to allow inclusion of alias indicator.
+        display: block;
+        flex: 0 0 auto;
+        font-size: 1.1em;
+        opacity: 0.6;
+        margin-right: $interiorMargin;
+    }
+}
+
+.c-tree .c-object-label {
+    border-radius: $controlCr;
+    padding: $interiorMarginSm 1px;
+
+    &__name {
+        display: inline;
         width: 100%;
     }
 
     &__type-icon {
-        // Type icon. Must be an HTML entity to allow inclusion of alias indicator.
-        display: block;
-        flex: 0 0 auto;
-        font-size: 1.3em;
-        margin-right: $interiorMarginSm;
         color: $colorItemTreeIcon;
+        font-size: 1.25em;
+        margin-right: $interiorMarginSm;
+        opacity: 1;
         width: $treeTypeIconW;
     }
 }
diff --git a/src/ui/layout/BrowseBar.vue b/src/ui/layout/BrowseBar.vue
index a473b21bb8..84932fc694 100644
--- a/src/ui/layout/BrowseBar.vue
+++ b/src/ui/layout/BrowseBar.vue
@@ -7,11 +7,11 @@
             @click="goToParent"
         ></button>
         <div
-            class="l-browse-bar__object-name--w"
+            class="l-browse-bar__object-name--w c-object-label"
             :class="type.cssClass"
         >
             <span
-                class="l-browse-bar__object-name c-input-inline"
+                class="l-browse-bar__object-name c-object-label__name c-input-inline"
                 contenteditable
                 @blur="updateName"
                 @keydown.enter.prevent