style(document): improve display of elements

Co-Authored-by: Bertrand Zuchuat <[email protected]>
rero · Feb 13, 2025 · 628ec32 · 628ec32
1 parent a5f6064
commit 628ec32
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 12 deletions.
diff --git a/...s/admin/src/app/circulation/patron/patron-transactions/patron-transactions.component.html b/...s/admin/src/app/circulation/patron/patron-transactions/patron-transactions.component.html
@@ -18,7 +18,7 @@
   <p-accordion [activeIndex]="0" (onOpen)="accordionOpen($event)">
     <p-accordionTab>
       <ng-template pTemplate="header">
-        <div class="flex w-full">
+        <div class="flex align-items-center w-full">
           <h6 class="flex flex-grow-1" translate>Engaged fees</h6>
           @if (statistics()['fees_engaged'] > 0) {
             <p-tag severity="warning" class="mr-2">
@@ -62,7 +62,7 @@ <h6 class="flex flex-grow-1" translate>Engaged fees</h6>
 
     <p-accordionTab>
       <ng-template pTemplate="header">
-        <div class="flex w-full">
+        <div class="flex align-items-center w-full">
           <h6 class="flex flex-grow-1" translate>Overdue preview fees</h6>
           @if (tabs.overduePreviewFees.totalAmount > 0) {
             <p-tag severity="secondary" class="mr-2">

diff --git a/...ects/admin/src/app/record/detail-view/document-detail-view/holding/holding.component.html b/...ects/admin/src/app/record/detail-view/document-detail-view/holding/holding.component.html
@@ -1,6 +1,6 @@
 <!--
   RERO ILS UI
-  Copyright (C) 2019-2024 RERO
+  Copyright (C) 2019-2025 RERO
 
   This program is free software: you can redistribute it and/or modify
   it under the terms of the GNU Affero General Public License as published by
@@ -18,7 +18,7 @@
   <ng-template pTemplate="header">
     <!-- MAIN ROW ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ -->
     <div class="w-full">
-      <div class="grid">
+      <div class="grid align-items-center">
         <div id="holding-location-{{ holding.metadata.pid }}" class="col-6">
           @if (holding.metadata._masked) {
             <admin-record-masked [record]="holding"></admin-record-masked>
@@ -33,7 +33,7 @@
         @if (holdingType === 'serial') {
           <div class="col-4 justify-content-end flex">
             @if (permissions) {
-              <div class="flex gap-1">
+              <div class="flex gap-1 mr-3">
                 <!-- HOLDING VIEW -->
                 <p-button
                   icon="fa fa-eye"
@@ -72,6 +72,7 @@
                 <p-button
                   icon="fa fa-trash"
                   class="pointer-events-auto"
+                  severity="danger"
                   outlined
                   size="small"
                   [title]="'Delete holdings'|translate"
@@ -106,7 +107,7 @@
         <!-- SERIAL HOLDING -->
         @case ('serial') {
           @if (items) {
-            <div class="grid grid-nogutter p-2 font-bold">
+            <div class="grid grid-nogutter py-2 px-1 font-bold">
               <div class="col-3" translate>Barcode</div>
               <div class="col-3" translate>Status</div>
               <div class="col-3" translate>Unit</div>

diff --git a/...-view/document-detail-view/holding/serial-holding-item/serial-holding-item.component.html b/...-view/document-detail-view/holding/serial-holding-item/serial-holding-item.component.html
@@ -16,8 +16,8 @@
   along with this program.  If not, see <http://www.gnu.org/licenses/>.
 -->
 @if (item && ((item.metadata.issue && item.metadata.issue.status !== itemIssueStatus.DELETED) || item.metadata.type === 'provisional')) {
-    <div class="grid grid-nogutter pt-2 flex-grow-1">  <!-- First row :: item detail -->
-      <div class="col-3">
+    <div class="grid grid-nogutter py-2 px-1 flex-grow-1">  <!-- First row :: item detail -->
+      <div class="col-3 flex align-items-center">
         @if (item.metadata._masked) {
           <admin-record-masked [record]="item" />
         }
@@ -29,22 +29,22 @@
           {{ item.metadata.barcode }}
         }
       </div>
-      <div class="col-3">
+      <div class="col-3 flex align-items-center">
         <shared-availability
           recordType="item"
           [record]="item"
           [apiService]="itemApiService"
         />
       </div>
-      <div class="col-3">
+      <div class="col-3 flex align-items-center">
         {{ item.metadata.enumerationAndChronology }}
       </div>
-      <div class="col-3 flex">
+      <div class="col-3 flex align-items-center">
         <div class="flex-grow-1">
         <shared-inherited-call-number class-="flex-grow-1" [item]="item" />
         </div>
         @if (permissions) {
-          <div class="flex gap-2 justify-content-end">
+          <div class="flex gap-1 justify-content-end">
             <p-button
               class="pointer-events-auto"
               icon="fa fa-shopping-basket"