Merge pull request #8163 from snipe/fixes/fix-for-css-on-column-selector

Fixed weird padlock display in asset listing with encrypted custom fields

app/Presenters/AssetPresenter.php

@@ -268,8 +268,11 @@ class AssetPresenter extends Presenter
                 "searchable" => true,
                 "sortable" => true,
                 "switchable" => true,
-                "title" => ($field->field_encrypted=='1') ?'<i class="fa fa-lock"></i> '.$field->name : $field->name,
+                "title" => $field->name,
-                "formatter" => "customFieldsFormatter"
+                "formatter"=> 'customFieldsFormatter',
+                "escape" => true,
+                "class" => ($field->field_encrypted=='1') ? 'css-padlock' : '',
+                "visible" => true,
             ];
 
         }

public/mix-manifest.json

@@ -2,7 +2,7 @@
     "/js/build/vue.js": "/js/build/vue.js?id=461ae9803574a5a52d43",
     "/css/AdminLTE.css": "/css/AdminLTE.css?id=56b8066cfbc70df10545",
     "/css/app.css": "/css/app.css?id=407edb63cc6b6dc62405",
-    "/css/overrides.css": "/css/overrides.css?id=014ba62bc420467fd405",
+    "/css/overrides.css": "/css/overrides.css?id=d1fe6296eb548247a5ad",
     "/css/skins/skin-blue.css": "/css/skins/skin-blue.css?id=c28283a1d468e2337428",
     "/css/skins/skin-red.css": "/css/skins/skin-red.css?id=079dd6c501fa9ea60a98",
     "/css/skins/skin-contrast.css": "/css/skins/skin-contrast.css?id=62e14190151e9efc9995",
@@ -18,10 +18,10 @@
     "/css/skins/skin-blue-dark.css": "/css/skins/skin-blue-dark.css?id=d25c77d9c6f4cfe2efd4",
     "/css/skins/skin-orange-dark.css": "/css/skins/skin-orange-dark.css?id=abc219c1fed59cecb860",
     "/css/skins/skin-orange.css": "/css/skins/skin-orange.css?id=59664dbd286988d2a438",
-    "/js/build/vue.js.map": "/js/build/vue.js.map?id=edafd9b8d5c4f4218518",
+    "/js/build/vue.js.map": "/js/build/vue.js.map?id=b1638dbc458713cd9c38",
     "/css/AdminLTE.css.map": "/css/AdminLTE.css.map?id=5a2d6f3c59191ce716e2",
     "/css/app.css.map": "/css/app.css.map?id=96b5c985e860716e6a16",
-    "/css/overrides.css.map": "/css/overrides.css.map?id=fe0a3186bd85efc442ca",
+    "/css/overrides.css.map": "/css/overrides.css.map?id=f3e3cf42859eb4a28a7b",
     "/css/skins/skin-blue.css.map": "/css/skins/skin-blue.css.map?id=129b9523e6ffd5683230",
     "/css/skins/skin-red.css.map": "/css/skins/skin-red.css.map?id=292dfa49bf2b6f23fa59",
     "/css/skins/skin-contrast.css.map": "/css/skins/skin-contrast.css.map?id=bf37f812f0b6a109b5ce",
@@ -37,8 +37,8 @@
     "/css/skins/skin-blue-dark.css.map": "/css/skins/skin-blue-dark.css.map?id=32784cb5d02773eb0e69",
     "/css/skins/skin-orange-dark.css.map": "/css/skins/skin-orange-dark.css.map?id=68b998638217fd08ef29",
     "/css/skins/skin-orange.css.map": "/css/skins/skin-orange.css.map?id=f90fda3cc0a48c048a9e",
-    "/css/dist/all.css": "/css/dist/all.css?id=32f6e6a70fdaa03a0d88",
+    "/css/dist/all.css": "/css/dist/all.css?id=0491555899142b86167d",
     "/js/dist/all.js": "/js/dist/all.js?id=bf5cd2065e997d7692e0",
-    "/css/build/all.css": "/css/build/all.css?id=32f6e6a70fdaa03a0d88",
+    "/css/build/all.css": "/css/build/all.css?id=0491555899142b86167d",
     "/js/build/all.js": "/js/build/all.js?id=bf5cd2065e997d7692e0"
 }

resources/assets/less/overrides.less

@@ -465,3 +465,72 @@ h4 {
   border-top: 1px solid #dddddd;
   display: table-cell;
 }
+
+
+
+
+/**
+
+ COLUMN SELECTOR ICONS
+ -----------------------------
+ This is kind of weird, but it is necessary to prevent the column-selector code from barfing, since
+ any HTML used in the UserPresenter "title" attribute breaks the column selector HTML.
+
+ Instead, we use CSS to add the icon into the table header, which leaves the column selector
+ "title" text as-is.
+
+ See https://github.com/snipe/snipe-it/issues/7989
+
+ */
+
+th.css-barcode > .th-inner,
+th.css-license > .th-inner,
+th.css-consumable > .th-inner,
+th.css-accessory > .th-inner
+{
+  font-size: 0px;
+  line-height: 4!important;
+  text-align: left;
+  text-rendering: auto;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+
+th.css-padlock > .th-inner::before,
+th.css-barcode > .th-inner::before,
+th.css-license > .th-inner::before,
+th.css-consumable > .th-inner::before,
+th.css-accessory > .th-inner::before
+
+{
+  display: inline-block;
+  font: normal normal normal 14px/1 FontAwesome;
+  font-size: 20px;
+}
+
+th.css-padlock > .th-inner::before
+{
+  content: "\f023";
+  padding-right: 2px;
+}
+
+th.css-barcode > .th-inner::before
+{
+  content: "\f02a";
+}
+
+th.css-license > .th-inner::before
+{
+  content: "\f0c7";
+}
+
+th.css-consumable > .th-inner::before
+{
+  content: "\f043";
+}
+
+th.css-accessory > .th-inner::before
+{
+  content: "\f11c";
+}

resources/views/users/index.blade.php

@@ -15,66 +15,6 @@
 
 @section('header_right')
 
-<style>
-    /**
-    This is kind of weird, but it is necessary to prevent the column-selector code from barfing, since
-    any HTML used in the UserPresenter "title" attribute breaks the column selector HTML.
-
-    Instead, we use CSS to add the icon into the table header, which leaves the column selector
-    "title" text as-is.
-
-    See https://github.com/snipe/snipe-it/issues/7989
-
-     */
-    th.css-barcode > .th-inner,
-    th.css-license > .th-inner,
-    th.css-consumable > .th-inner,
-    th.css-accessory > .th-inner
-    {
-        font-size: 0px;
-        line-height: 4!important;
-        text-align: left;
-        text-rendering: auto;
-        -webkit-font-smoothing: antialiased;
-        -moz-osx-font-smoothing: grayscale;
-    }
-
-
-    th.css-barcode > .th-inner::before,
-    th.css-license > .th-inner::before,
-    th.css-consumable > .th-inner::before,
-    th.css-accessory > .th-inner::before
-
-    {
-        display: inline-block;
-        font: normal normal normal 14px/1 FontAwesome;
-        font-size: 20px;
-    }
-
-
-    th.css-barcode > .th-inner::before
-    {
-        content: "\f02a";
-    }
-
-    th.css-license > .th-inner::before
-    {
-        content: "\f0c7";
-    }
-
-    th.css-consumable > .th-inner::before
-    {
-        content: "\f043";
-    }
-
-    th.css-accessory > .th-inner::before
-    {
-        content: "\f11c";
-    }
-
-
-</style>
-
     @can('create', \App\Models\User::class)
       @if ($snipeSettings->ldap_enabled == 1)
       <a href="{{ route('ldap/user') }}" class="btn btn-default pull-right"><span class="fa fa-sitemap"></span> LDAP Sync</a>