Converted to icon headers

Signed-off-by: snipe <snipe@snipe.net>
This commit is contained in:
snipe 2024-08-12 13:48:44 +01:00
parent f373cb03f5
commit 852a233086
23 changed files with 120 additions and 84 deletions

View file

@ -44,6 +44,7 @@ class LocationsController extends Controller
'manager_id',
'image',
'assigned_assets_count',
'assigned_accessories_count',
'users_count',
'assets_count',
'assigned_assets_count',
@ -73,6 +74,7 @@ class LocationsController extends Controller
'locations.currency',
])->withCount('assignedAssets as assigned_assets_count')
->withCount('assets as assets_count')
->withCount('assignedAccessories as assigned_accessories_count')
->withCount('rtd_assets as rtd_assets_count')
->withCount('children as children_count')
->withCount('users as users_count');

View file

@ -46,6 +46,7 @@ class LocationsTransformer
'phone' => ($location->phone!='') ? e($location->phone): null,
'fax' => ($location->fax!='') ? e($location->fax): null,
'assigned_assets_count' => (int) $location->assigned_assets_count,
'assigned_accessories_count' => (int) $location->assigned_accessories_count,
'assets_count' => (int) $location->assets_count,
'rtd_assets_count' => (int) $location->rtd_assets_count,
'users_count' => (int) $location->users_count,

View file

@ -71,6 +71,8 @@ class LocationPresenter extends Presenter
'switchable' => true,
'title' => trans('admin/hardware/form.default_location'),
'visible' => false,
'class' => 'css-house-flag',
'tooltip' => true,
],
[
@ -80,8 +82,17 @@ class LocationPresenter extends Presenter
'switchable' => true,
'title' => trans('admin/locations/message.assigned_assets'),
'visible' => true,
'class' => 'css-house-laptop',
],
[
'field' => 'assigned_accessories_count',
'searchable' => false,
'sortable' => true,
'switchable' => true,
'title' => trans('general.accessories_assigned'),
'visible' => true,
'class' => 'css-accessory',
],
[
'field' => 'users_count',
'searchable' => false,
@ -89,6 +100,7 @@ class LocationPresenter extends Presenter
'switchable' => true,
'title' => trans('general.people'),
'visible' => true,
'class' => 'css-house-user',
],
[
'field' => 'currency',

Binary file not shown.

Binary file not shown.

Binary file not shown.

BIN
public/css/dist/skins/_all-skins.css vendored Normal file

Binary file not shown.

BIN
public/css/dist/skins/_all-skins.min.css vendored Normal file

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

BIN
public/js/dist/all.js vendored

Binary file not shown.

View file

@ -1,24 +1,25 @@
{
"/js/build/app.js": "/js/build/app.js?id=842cc33168d973ac10d35eb664be2a2c",
"/css/dist/skins/skin-red.css": "/css/dist/skins/skin-red.css?id=44bf834f2110504a793dadec132a5898",
"/css/dist/skins/skin-blue.css": "/css/dist/skins/skin-blue.css?id=f677207c6cf9678eb539abecb408c374",
"/css/build/overrides.css": "/css/build/overrides.css?id=004835e70ed3ae2e2340162b7a37c752",
"/css/build/app.css": "/css/build/app.css?id=7ecac57fc8cf6fdbe447c18d5f2ae7bc",
"/js/build/app.js": "/js/build/app.js?id=da3f7fee4a180ba924f6a3920c94eb71",
"/css/dist/skins/skin-black-dark.css": "/css/dist/skins/skin-black-dark.css?id=f0b08873a06bb54daeee176a9459f4a9",
"/css/dist/skins/_all-skins.css": "/css/dist/skins/_all-skins.css?id=f4397c717b99fce41a633ca6edd5d1f4",
"/css/build/overrides.css": "/css/build/overrides.css?id=c4d85e7547ae9ddbb5aef45729d73f20",
"/css/build/app.css": "/css/build/app.css?id=c953eea1937a2c5f78dfc8fe411324ae",
"/css/build/AdminLTE.css": "/css/build/AdminLTE.css?id=4ea0068716c1bb2434d87a16d51b98c9",
"/css/dist/skins/skin-yellow.css": "/css/dist/skins/skin-yellow.css?id=7b315b9612b8fde8f9c5b0ddb6bba690",
"/css/dist/skins/skin-yellow-dark.css": "/css/dist/skins/skin-yellow-dark.css?id=393aaa7b368b0670fc42434c8cca7dc7",
"/css/dist/skins/skin-red.css": "/css/dist/skins/skin-red.css?id=44bf834f2110504a793dadec132a5898",
"/css/dist/skins/skin-red-dark.css": "/css/dist/skins/skin-red-dark.css?id=ad39859637dafa781288630f9d6d6523",
"/css/dist/skins/skin-purple.css": "/css/dist/skins/skin-purple.css?id=6fe68325d5356197672c27bc77cedcb4",
"/css/dist/skins/skin-purple-dark.css": "/css/dist/skins/skin-purple-dark.css?id=f8b26018a1533b9db864247daaf06daa",
"/css/dist/skins/skin-orange.css": "/css/dist/skins/skin-orange.css?id=6f0563e726c2fe4fab4026daaa5bfdf2",
"/css/dist/skins/skin-orange-dark.css": "/css/dist/skins/skin-orange-dark.css?id=4fa7aa3ba499c8f4e390eb8549da3f74",
"/css/dist/skins/skin-blue-dark.css": "/css/dist/skins/skin-blue-dark.css?id=0640e45bad692dcf62873c6e85904899",
"/css/dist/skins/skin-yellow-dark.css": "/css/dist/skins/skin-yellow-dark.css?id=393aaa7b368b0670fc42434c8cca7dc7",
"/css/dist/skins/skin-yellow.css": "/css/dist/skins/skin-yellow.css?id=7b315b9612b8fde8f9c5b0ddb6bba690",
"/css/dist/skins/skin-purple-dark.css": "/css/dist/skins/skin-purple-dark.css?id=f8b26018a1533b9db864247daaf06daa",
"/css/dist/skins/skin-purple.css": "/css/dist/skins/skin-purple.css?id=6fe68325d5356197672c27bc77cedcb4",
"/css/dist/skins/skin-red-dark.css": "/css/dist/skins/skin-red-dark.css?id=ad39859637dafa781288630f9d6d6523",
"/css/dist/skins/skin-black-dark.css": "/css/dist/skins/skin-black-dark.css?id=f0b08873a06bb54daeee176a9459f4a9",
"/css/dist/skins/skin-black.css": "/css/dist/skins/skin-black.css?id=76482123f6c70e866d6b971ba91de7bb",
"/css/dist/skins/skin-green-dark.css": "/css/dist/skins/skin-green-dark.css?id=553ee68741b5a392037abcf04da80adc",
"/css/dist/skins/skin-green.css": "/css/dist/skins/skin-green.css?id=0a82a6ae6bb4e58fe62d162c4fb50397",
"/css/dist/skins/skin-green-dark.css": "/css/dist/skins/skin-green-dark.css?id=553ee68741b5a392037abcf04da80adc",
"/css/dist/skins/skin-contrast.css": "/css/dist/skins/skin-contrast.css?id=da6c7997d9de2f8329142399f0ce50da",
"/css/dist/all.css": "/css/dist/all.css?id=656b0a0561a4be447c195846c3de3558",
"/css/dist/skins/skin-blue.css": "/css/dist/skins/skin-blue.css?id=f677207c6cf9678eb539abecb408c374",
"/css/dist/skins/skin-blue-dark.css": "/css/dist/skins/skin-blue-dark.css?id=0640e45bad692dcf62873c6e85904899",
"/css/dist/skins/skin-black.css": "/css/dist/skins/skin-black.css?id=76482123f6c70e866d6b971ba91de7bb",
"/css/dist/all.css": "/css/dist/all.css?id=7669e3b5dff0e448ae3ed2d6c38fc06a",
"/css/dist/signature-pad.css": "/css/dist/signature-pad.css?id=6a89d3cd901305e66ced1cf5f13147f7",
"/css/dist/signature-pad.min.css": "/css/dist/signature-pad.min.css?id=6a89d3cd901305e66ced1cf5f13147f7",
"/js/select2/i18n/af.js": "/js/select2/i18n/af.js?id=4f6fcd73488ce79fae1b7a90aceaecde",
@ -81,33 +82,34 @@
"/js/select2/i18n/vi.js": "/js/select2/i18n/vi.js?id=097a5b75b3e146e2d94ab8e1510be607",
"/js/select2/i18n/zh-CN.js": "/js/select2/i18n/zh-CN.js?id=2cff662ec5f972b4613566cf5988cda2",
"/js/select2/i18n/zh-TW.js": "/js/select2/i18n/zh-TW.js?id=04554a227c2ba0f3bb6ca3d2e01e5440",
"/css/webfonts/fa-brands-400.ttf": "/css/webfonts/fa-brands-400.ttf?id=0141634c24336be626e05c8b77d1fa27",
"/css/webfonts/fa-brands-400.woff2": "/css/webfonts/fa-brands-400.woff2?id=b3cf7a6dd618bd392f3ddcc61343a463",
"/css/webfonts/fa-regular-400.ttf": "/css/webfonts/fa-regular-400.ttf?id=9cf69d99de9d83f82466a647f5cb1f94",
"/css/webfonts/fa-regular-400.woff2": "/css/webfonts/fa-regular-400.woff2?id=f0549181a126fe40849a53792bb0e077",
"/css/webfonts/fa-solid-900.ttf": "/css/webfonts/fa-solid-900.ttf?id=509c0e46de844df754d10179cf03c953",
"/css/webfonts/fa-solid-900.woff2": "/css/webfonts/fa-solid-900.woff2?id=96d16b1bdb177fd796c810b9e706c780",
"/css/webfonts/fa-v4compatibility.ttf": "/css/webfonts/fa-v4compatibility.ttf?id=8994b282f9f3b7a00380bb1e2731a4bf",
"/css/webfonts/fa-v4compatibility.woff2": "/css/webfonts/fa-v4compatibility.woff2?id=111e341dba724e1df946e8d1f406a7bd",
"/css/webfonts/fa-brands-400.ttf": "/css/webfonts/fa-brands-400.ttf?id=67c719c0d21dfb09066b4ecdc2310cb8",
"/css/webfonts/fa-brands-400.woff2": "/css/webfonts/fa-brands-400.woff2?id=ea42d181254fd563d365feb2b03a07f4",
"/css/webfonts/fa-regular-400.ttf": "/css/webfonts/fa-regular-400.ttf?id=60e2f6dc1bf9de9da0aa485ccf81b40e",
"/css/webfonts/fa-regular-400.woff2": "/css/webfonts/fa-regular-400.woff2?id=f43a0d63897b14b80bcf10f2fae2d6f8",
"/css/webfonts/fa-solid-900.ttf": "/css/webfonts/fa-solid-900.ttf?id=d1d4daff53a4c06220c5b90933fca9dc",
"/css/webfonts/fa-solid-900.woff2": "/css/webfonts/fa-solid-900.woff2?id=541cafc702f56f57de95f3d1f792f428",
"/css/webfonts/fa-v4compatibility.ttf": "/css/webfonts/fa-v4compatibility.ttf?id=51ade19e1b10d7a0031b18568a2b01d5",
"/css/webfonts/fa-v4compatibility.woff2": "/css/webfonts/fa-v4compatibility.woff2?id=1cc408d68a27c3757b4460bbc542433e",
"/js/dist/bootstrap-table-locale-all.min.js": "/js/dist/bootstrap-table-locale-all.min.js?id=27eb00f47f9bae70cd630d184b7969f1",
"/js/dist/bootstrap-table-en-US.min.js": "/js/dist/bootstrap-table-en-US.min.js?id=57bdb4770b2924f5efeda100caf3c9b7",
"/css/dist/bootstrap-table.css": "/css/dist/bootstrap-table.css?id=8abbb6aea625ec64cd7ebdad77ebf6e5",
"/js/build/vendor.js": "/js/build/vendor.js?id=e27070bdbc5fce3bfd132b952d641fd6",
"/js/dist/bootstrap-table.js": "/js/dist/bootstrap-table.js?id=859e11e4e6b05c84e4b7302de29bac5e",
"/js/dist/all.js": "/js/dist/all.js?id=01108f9d8f4f67b20669f0c25a64eb5d",
"/css/dist/skins/skin-green.min.css": "/css/dist/skins/skin-green.min.css?id=0a82a6ae6bb4e58fe62d162c4fb50397",
"/css/dist/skins/skin-green-dark.min.css": "/css/dist/skins/skin-green-dark.min.css?id=553ee68741b5a392037abcf04da80adc",
"/css/dist/skins/skin-black.min.css": "/css/dist/skins/skin-black.min.css?id=76482123f6c70e866d6b971ba91de7bb",
"/css/dist/skins/_all-skins.min.css": "/css/dist/skins/_all-skins.min.css?id=f4397c717b99fce41a633ca6edd5d1f4",
"/css/dist/skins/skin-black-dark.min.css": "/css/dist/skins/skin-black-dark.min.css?id=f0b08873a06bb54daeee176a9459f4a9",
"/css/dist/skins/skin-blue.min.css": "/css/dist/skins/skin-blue.min.css?id=f677207c6cf9678eb539abecb408c374",
"/css/dist/skins/skin-black.min.css": "/css/dist/skins/skin-black.min.css?id=76482123f6c70e866d6b971ba91de7bb",
"/css/dist/skins/skin-blue-dark.min.css": "/css/dist/skins/skin-blue-dark.min.css?id=0640e45bad692dcf62873c6e85904899",
"/css/dist/skins/skin-yellow.min.css": "/css/dist/skins/skin-yellow.min.css?id=7b315b9612b8fde8f9c5b0ddb6bba690",
"/css/dist/skins/skin-yellow-dark.min.css": "/css/dist/skins/skin-yellow-dark.min.css?id=393aaa7b368b0670fc42434c8cca7dc7",
"/css/dist/skins/skin-red.min.css": "/css/dist/skins/skin-red.min.css?id=44bf834f2110504a793dadec132a5898",
"/css/dist/skins/skin-red-dark.min.css": "/css/dist/skins/skin-red-dark.min.css?id=ad39859637dafa781288630f9d6d6523",
"/css/dist/skins/skin-purple.min.css": "/css/dist/skins/skin-purple.min.css?id=6fe68325d5356197672c27bc77cedcb4",
"/css/dist/skins/skin-purple-dark.min.css": "/css/dist/skins/skin-purple-dark.min.css?id=f8b26018a1533b9db864247daaf06daa",
"/css/dist/skins/skin-orange.min.css": "/css/dist/skins/skin-orange.min.css?id=6f0563e726c2fe4fab4026daaa5bfdf2",
"/css/dist/skins/skin-blue.min.css": "/css/dist/skins/skin-blue.min.css?id=f677207c6cf9678eb539abecb408c374",
"/css/dist/skins/skin-contrast.min.css": "/css/dist/skins/skin-contrast.min.css?id=da6c7997d9de2f8329142399f0ce50da",
"/css/dist/skins/skin-green-dark.min.css": "/css/dist/skins/skin-green-dark.min.css?id=553ee68741b5a392037abcf04da80adc",
"/css/dist/skins/skin-green.min.css": "/css/dist/skins/skin-green.min.css?id=0a82a6ae6bb4e58fe62d162c4fb50397",
"/css/dist/skins/skin-orange-dark.min.css": "/css/dist/skins/skin-orange-dark.min.css?id=4fa7aa3ba499c8f4e390eb8549da3f74",
"/css/dist/skins/skin-contrast.min.css": "/css/dist/skins/skin-contrast.min.css?id=da6c7997d9de2f8329142399f0ce50da"
"/css/dist/skins/skin-orange.min.css": "/css/dist/skins/skin-orange.min.css?id=6f0563e726c2fe4fab4026daaa5bfdf2",
"/css/dist/skins/skin-purple-dark.min.css": "/css/dist/skins/skin-purple-dark.min.css?id=f8b26018a1533b9db864247daaf06daa",
"/css/dist/skins/skin-purple.min.css": "/css/dist/skins/skin-purple.min.css?id=6fe68325d5356197672c27bc77cedcb4",
"/css/dist/skins/skin-red-dark.min.css": "/css/dist/skins/skin-red-dark.min.css?id=ad39859637dafa781288630f9d6d6523",
"/css/dist/skins/skin-red.min.css": "/css/dist/skins/skin-red.min.css?id=44bf834f2110504a793dadec132a5898",
"/css/dist/skins/skin-yellow-dark.min.css": "/css/dist/skins/skin-yellow-dark.min.css?id=393aaa7b368b0670fc42434c8cca7dc7",
"/css/dist/skins/skin-yellow.min.css": "/css/dist/skins/skin-yellow.min.css?id=7b315b9612b8fde8f9c5b0ddb6bba690",
"/css/dist/bootstrap-table.css": "/css/dist/bootstrap-table.css?id=8abbb6aea625ec64cd7ebdad77ebf6e5",
"/js/build/vendor.js": "/js/build/vendor.js?id=c1c24b883f48dc3d16b817aed0b457cc",
"/js/dist/bootstrap-table.js": "/js/dist/bootstrap-table.js?id=859e11e4e6b05c84e4b7302de29bac5e",
"/js/dist/all.js": "/js/dist/all.js?id=ea6fb4f01f01c2194310403dafc1658f"
}

View file

@ -581,24 +581,23 @@ h4 {
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-envelope > .th-inner,
th.css-users > .th-inner,
th.css-location > .th-inner,
th.css-accessory > .th-inner
{
th.css-house-user > .th-inner,
th.css-house-flag > .th-inner,
th.css-house-laptop > .th-inner,
th.css-accessory > .th-inner {
font-size: 0px;
line-height: .75!important;
line-height: 0.75 !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,
@ -606,61 +605,82 @@ th.css-consumable > .th-inner::before,
th.css-envelope > .th-inner::before,
th.css-users > .th-inner::before,
th.css-location > .th-inner::before,
th.css-location > .th-inner::before,
th.css-house-user > .th-inner::before,
th.css-house-laptop > .th-inner::before,
th.css-house-flag > .th-inner::before,
th.css-accessory > .th-inner::before
{
display: inline-block;
font-size: 20px;
font-family: "Font Awesome 5 Free";
font-weight: 900;
}
th.css-padlock > .th-inner::before
{
th.css-padlock > .th-inner::before {
content: "\f023";
font-family: "Font Awesome 5 Free";
font-weight: 900;
padding-right: 4px;
font-size: 12px;
}
/**
BEGIN ICON TABLE HEADERS
Set the font-weight css property as 900 (For Solid), 400 (Regular or Brands), 300 (Light for pro icons).
**/
th.css-barcode > .th-inner::before
{
content: "\f02a"; font-family: "Font Awesome 5 Free"; font-weight: 900;
th.css-barcode > .th-inner::before {
content: "\f02a";
font-family: "Font Awesome 5 Free";
font-weight: 900;
}
th.css-license > .th-inner::before
{
content: "\f0c7"; font-family: "Font Awesome 5 Free"; font-weight: 400;
th.css-license > .th-inner::before {
content: "\f0c7";
font-family: "Font Awesome 5 Free";
font-weight: 400;
}
th.css-consumable > .th-inner::before
{
content: "\f043"; font-family: "Font Awesome 5 Free"; font-weight: 900;
th.css-consumable > .th-inner::before {
content: "\f043";
font-family: "Font Awesome 5 Free";
font-weight: 900;
}
th.css-envelope > .th-inner::before
{
content: "\f0e0"; font-family: "Font Awesome 5 Free"; font-weight: 400;
th.css-envelope > .th-inner::before {
content: "\f0e0";
font-family: "Font Awesome 5 Free";
font-weight: 400;
}
th.css-accessory > .th-inner::before
{
content: "\f11c"; font-family: "Font Awesome 5 Free"; font-weight: 400;
th.css-accessory > .th-inner::before {
content: "\f11c";
font-family: "Font Awesome 5 Free";
font-weight: 400;
}
th.css-users > .th-inner::before {
content: "\f0c0"; font-family: "Font Awesome 5 Free"; font-size: 15px;
content: "\f0c0";
font-family: "Font Awesome 5 Free";
font-size: 15px;
}
th.css-location > .th-inner::before {
content: "\f3c5"; font-family: "Font Awesome 5 Free"; font-size: 19px; margin-bottom: 0px;
content: "\f3c5";
font-family: "Font Awesome 5 Free";
font-size: 19px;
margin-bottom: 0px;
}
th.css-house-user > .th-inner::before {
content: "\e1b0";
font-family: "Font Awesome 5 Free";
font-size: 19px;
margin-bottom: 0px;
}
th.css-house-flag > .th-inner::before {
content: "\e50d";
font-family: "Font Awesome 5 Free";
font-size: 19px;
margin-bottom: 0px;
}
th.css-house-laptop > .th-inner::before {
content: "\e066";
font-family: "Font Awesome 5 Free";
font-size: 19px;
margin-bottom: 0px;
}
.small-box .inner {
padding-left: 15px;

View file

@ -32,7 +32,6 @@
data-bulk-button-id="#bulkLocationsEditButton"
data-bulk-form-id="#locationsBulkForm"
data-search="true"
data-show-footer="true"
data-side-pagination="server"
data-show-columns="true"
data-show-fullscreen="true"

View file

@ -22,7 +22,7 @@
<li class="active">
<a href="#users" data-toggle="tab" data-tooltip="true" title="{{ trans('general.users') }}">
<i class="fa-solid fa-house-user" style="font-size: 18px" aria-hidden="true"></i>
<span class="badge badge-secondary">
<span class="badge">
{{ number_format($location->users->count()) }}
</span>
<span class="sr-only">
@ -37,7 +37,7 @@
<li>
<a href="#assets" data-toggle="tab" data-tooltip="true" title="{{ trans('admin/locations/message.current_location') }}">
<i class="fa-solid fa-house-laptop" style="font-size: 18px" aria-hidden="true"></i>
<span class="badge badge-secondary">
<span class="badge">
{{ number_format($location->assets()->AssetsForShow()->count()) }}
</span>
<span class="sr-only">
@ -51,7 +51,7 @@
<li>
<a href="#rtd_assets" data-toggle="tab" data-tooltip="true" title="{{ trans('admin/hardware/form.default_location') }}">
<i class="fa-solid fa-house-flag" style="font-size: 18px" aria-hidden="true"></i>
<span class="badge badge-secondary">
<span class="badge">
{{ number_format($location->rtd_assets()->AssetsForShow()->count()) }}
</span>
<span class="sr-only">
@ -65,7 +65,7 @@
<li>
<a href="#assets_assigned" data-toggle="tab" data-tooltip="true" title="{{ trans('admin/locations/message.assigned_assets') }}">
<i class="fas fa-barcode" style="font-size: 18px" aria-hidden="true"></i>
<span class="badge badge-secondary">
<span class="badge">
{{ number_format($location->assignedAssets()->AssetsForShow()->count()) }}
</span>
<span class="sr-only">
@ -79,7 +79,7 @@
<li>
<a href="#accessories_assigned" data-toggle="tab" data-tooltip="true" title="{{ trans('general.accessories_assigned') }}">
<i class="fas fa-keyboard" style="font-size: 18px" aria-hidden="true"></i>
<span class="badge badge-secondary">
<span class="badge">
{{ number_format($location->assignedAccessories->count()) }}
</span>
<span class="sr-only">
@ -93,7 +93,7 @@
<li>
<a href="#accessories" data-toggle="tab" data-tooltip="true" title="{{ trans('general.accessories') }}">
<i class="fas fa-keyboard" style="font-size: 18px" aria-hidden="true"></i>
<span class="badge badge-secondary">
<span class="badge">
{{ number_format($location->accessories->count()) }}
</span>
<span class="sr-only">
@ -107,7 +107,7 @@
<li>
<a href="#consumables" data-toggle="tab" data-tooltip="true" title="{{ trans('general.consumables') }}">
<i class="fas fa-tint" style="font-size: 18px" aria-hidden="true"></i>
<span class="badge badge-secondary">
<span class="badge">
{{ number_format($location->consumables->count()) }}
</span>
<span class="sr-only">
@ -121,7 +121,7 @@
<li>
<a href="#components" data-toggle="tab" data-tooltip="true" title="{{ trans('general.components') }}">
<i class="fas fa-hdd" style="font-size: 18px" aria-hidden="true"></i>
<span class="badge badge-secondary">
<span class="badge">
{{ number_format($location->components->count()) }}
</span>
<span class="sr-only">