From e06b67fd73358ac52e2e71fa96d708520de33f3e Mon Sep 17 00:00:00 2001
From: root <root@TI-03.OHB.LOCAL>
Date: Wed, 26 Jun 2024 08:29:32 -0300
Subject: [PATCH 1/5] Resolution of issue #1190 - Improving the accessibility
 of the status page using the item-operation component

---
 .../item-operation/item-operation.component.html         | 4 ++--
 .../item-operation/item-operation.component.scss         | 9 +++++++++
 .../item-operation/item-operation.component.ts           | 1 +
 3 files changed, 12 insertions(+), 2 deletions(-)
 create mode 100644 src/app/item-page/edit-item-page/item-operation/item-operation.component.scss

diff --git a/src/app/item-page/edit-item-page/item-operation/item-operation.component.html b/src/app/item-page/edit-item-page/item-operation/item-operation.component.html
index 85c6a2cca18..e2820173152 100644
--- a/src/app/item-page/edit-item-page/item-operation/item-operation.component.html
+++ b/src/app/item-page/edit-item-page/item-operation/item-operation.component.html
@@ -1,9 +1,9 @@
-<div class="col-3 float-left d-flex h-100 action-label">
+<div class="col-12 col-md-3 column-height float-left d-flex h-100 action-label">
       <span class="justify-content-center align-self-center">
         {{'item.edit.tabs.status.buttons.' + operation.operationKey + '.label' | translate}}
       </span>
 </div>
-<div class="col-9 float-left action-button">
+<div class="col-12 col-md-9 float-left action-button">
   <span *ngIf="operation.authorized">
     <button class="btn btn-outline-primary" [disabled]="operation.disabled" [routerLink]="operation.operationUrl" [attr.aria-label]="'item.edit.tabs.status.buttons.' + operation.operationKey + '.button' | translate">
       {{'item.edit.tabs.status.buttons.' + operation.operationKey + '.button' | translate}}
diff --git a/src/app/item-page/edit-item-page/item-operation/item-operation.component.scss b/src/app/item-page/edit-item-page/item-operation/item-operation.component.scss
new file mode 100644
index 00000000000..ff42005e34b
--- /dev/null
+++ b/src/app/item-page/edit-item-page/item-operation/item-operation.component.scss
@@ -0,0 +1,9 @@
+.column-height {
+  height: 100%;
+}
+
+@media screen and (max-width: map-get($grid-breakpoints, sm)) {
+  .column-height {
+    height: auto;
+  }
+}
diff --git a/src/app/item-page/edit-item-page/item-operation/item-operation.component.ts b/src/app/item-page/edit-item-page/item-operation/item-operation.component.ts
index 9cf4b30e6cd..f6773bc0432 100644
--- a/src/app/item-page/edit-item-page/item-operation/item-operation.component.ts
+++ b/src/app/item-page/edit-item-page/item-operation/item-operation.component.ts
@@ -11,6 +11,7 @@ import { ItemOperation } from './itemOperation.model';
 
 @Component({
   selector: 'ds-item-operation',
+  styleUrls: ['item-operation.component.scss'],
   templateUrl: './item-operation.component.html',
   imports: [
     TranslateModule,

From 5f4a049fddeceda0fdbb870410d3780b858bcca9 Mon Sep 17 00:00:00 2001
From: root <root@TI-03.OHB.LOCAL>
Date: Thu, 11 Jul 2024 15:51:33 -0300
Subject: [PATCH 2/5] Issue-1190/PR-3148 Improve the space between the text and
 the button

---
 .../edit-item-page/item-operation/item-operation.component.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/app/item-page/edit-item-page/item-operation/item-operation.component.html b/src/app/item-page/edit-item-page/item-operation/item-operation.component.html
index e2820173152..97e18cdaa6e 100644
--- a/src/app/item-page/edit-item-page/item-operation/item-operation.component.html
+++ b/src/app/item-page/edit-item-page/item-operation/item-operation.component.html
@@ -1,4 +1,4 @@
-<div class="col-12 col-md-3 column-height float-left d-flex h-100 action-label">
+<div class="col-12 col-md-3 column-height float-left d-flex action-label">
       <span class="justify-content-center align-self-center">
         {{'item.edit.tabs.status.buttons.' + operation.operationKey + '.label' | translate}}
       </span>

From 3800021ed364a7994b454e1a75c59a3f7f7581d1 Mon Sep 17 00:00:00 2001
From: root <root@TI-03.OHB.LOCAL>
Date: Mon, 15 Jul 2024 09:30:20 -0300
Subject: [PATCH 3/5] Issue-1190/PR-3148 Removing 100% height from the column
 containing the button text and leaving it automatic

---
 .../item-operation/item-operation.component.html         | 2 +-
 .../item-operation/item-operation.component.scss         | 9 ---------
 .../item-operation/item-operation.component.ts           | 1 -
 3 files changed, 1 insertion(+), 11 deletions(-)
 delete mode 100644 src/app/item-page/edit-item-page/item-operation/item-operation.component.scss

diff --git a/src/app/item-page/edit-item-page/item-operation/item-operation.component.html b/src/app/item-page/edit-item-page/item-operation/item-operation.component.html
index 97e18cdaa6e..deb8e15d29d 100644
--- a/src/app/item-page/edit-item-page/item-operation/item-operation.component.html
+++ b/src/app/item-page/edit-item-page/item-operation/item-operation.component.html
@@ -1,4 +1,4 @@
-<div class="col-12 col-md-3 column-height float-left d-flex action-label">
+<div class="col-12 col-md-3 h-auto float-left d-flex action-label">
       <span class="justify-content-center align-self-center">
         {{'item.edit.tabs.status.buttons.' + operation.operationKey + '.label' | translate}}
       </span>
diff --git a/src/app/item-page/edit-item-page/item-operation/item-operation.component.scss b/src/app/item-page/edit-item-page/item-operation/item-operation.component.scss
deleted file mode 100644
index ff42005e34b..00000000000
--- a/src/app/item-page/edit-item-page/item-operation/item-operation.component.scss
+++ /dev/null
@@ -1,9 +0,0 @@
-.column-height {
-  height: 100%;
-}
-
-@media screen and (max-width: map-get($grid-breakpoints, sm)) {
-  .column-height {
-    height: auto;
-  }
-}
diff --git a/src/app/item-page/edit-item-page/item-operation/item-operation.component.ts b/src/app/item-page/edit-item-page/item-operation/item-operation.component.ts
index f6773bc0432..9cf4b30e6cd 100644
--- a/src/app/item-page/edit-item-page/item-operation/item-operation.component.ts
+++ b/src/app/item-page/edit-item-page/item-operation/item-operation.component.ts
@@ -11,7 +11,6 @@ import { ItemOperation } from './itemOperation.model';
 
 @Component({
   selector: 'ds-item-operation',
-  styleUrls: ['item-operation.component.scss'],
   templateUrl: './item-operation.component.html',
   imports: [
     TranslateModule,

From f975e1da897b34df0621ecd78ee11d4fc58460b4 Mon Sep 17 00:00:00 2001
From: andreaNeki <andrea.montoya@neki-it.com.br>
Date: Tue, 1 Oct 2024 14:34:43 -0300
Subject: [PATCH 4/5] Edit item - making page content more responsive and
 accessible

---
 .../item-status/item-status.component.html       | 16 ++++++++--------
 .../item-status/item-status.component.scss       |  3 +++
 .../item-status/item-status.component.ts         |  1 +
 3 files changed, 12 insertions(+), 8 deletions(-)
 create mode 100644 src/app/item-page/edit-item-page/item-status/item-status.component.scss

diff --git a/src/app/item-page/edit-item-page/item-status/item-status.component.html b/src/app/item-page/edit-item-page/item-status/item-status.component.html
index faad0e679b8..30212c4a4c0 100644
--- a/src/app/item-page/edit-item-page/item-status/item-status.component.html
+++ b/src/app/item-page/edit-item-page/item-status/item-status.component.html
@@ -1,28 +1,28 @@
 <p class="mt-2">{{'item.edit.tabs.status.description' | translate}}</p>
 <div class="row">
-  <div *ngFor="let statusKey of statusDataKeys" class="w-100">
-    <div class="col-3 float-left status-label">
+  <div *ngFor="let statusKey of statusDataKeys" class="w-100 pt-1">
+    <div class="col-12 col-md-3 float-left status-label">
       {{'item.edit.tabs.status.labels.' + statusKey | translate}}:
     </div>
-    <div class="col-9 float-left status-data" id="status-{{statusKey}}">
+    <div class="col-12 col-md-9 float-left status-data" id="status-{{statusKey}}">
       {{statusData[statusKey]}}
     </div>
   </div>
 
-  <div *ngFor="let identifier of (identifiers$ | async)" class="w-100">
+  <div *ngFor="let identifier of (identifiers$ | async)" class="w-100 pt-1">
     <div *ngIf="(identifier.identifierType==='doi')">
-      <div class="col-3 float-left status-label">
+      <div class="col-12 col-md-3 float-left status-label">
         {{identifier.identifierType.toLocaleUpperCase()}}
       </div>
-      <div class="col-9 float-left status-label">{{identifier.value}}
+      <div class="col-12 col-md-9 float-left status-label">{{identifier.value}}
         ({{"item.edit.identifiers.doi.status."+identifier.identifierStatus|translate}})</div>
     </div>
   </div>
 
-  <div class="col-3 float-left status-label">
+  <div class="col-12 col-md-3 float-left status-label">
     {{'item.edit.tabs.status.labels.itemPage' | translate}}:
   </div>
-  <div class="col-9 float-left status-data" id="status-itemPage">
+  <div class="col-12 col-md-9 float-left status-data" id="status-itemPage">
     <a [routerLink]="itemPageRoute$ | async">{{itemPageRoute$ | async}}</a>
   </div>
 
diff --git a/src/app/item-page/edit-item-page/item-status/item-status.component.scss b/src/app/item-page/edit-item-page/item-status/item-status.component.scss
new file mode 100644
index 00000000000..349416cd20d
--- /dev/null
+++ b/src/app/item-page/edit-item-page/item-status/item-status.component.scss
@@ -0,0 +1,3 @@
+.status-label {
+  font-weight: 700;
+}
diff --git a/src/app/item-page/edit-item-page/item-status/item-status.component.ts b/src/app/item-page/edit-item-page/item-status/item-status.component.ts
index 1bb17dc77c5..0ad500b56f8 100644
--- a/src/app/item-page/edit-item-page/item-status/item-status.component.ts
+++ b/src/app/item-page/edit-item-page/item-status/item-status.component.ts
@@ -60,6 +60,7 @@ import { ItemOperation } from '../item-operation/itemOperation.model';
 
 @Component({
   selector: 'ds-base-item-status',
+  styleUrls: ['item-status.component.scss'],
   templateUrl: './item-status.component.html',
   changeDetection: ChangeDetectionStrategy.Default,
   animations: [

From 4aed1b60563b3486da9f5c98cd4ee15451553b73 Mon Sep 17 00:00:00 2001
From: andreaNeki <andrea.montoya@neki-it.com.br>
Date: Wed, 2 Oct 2024 08:45:52 -0300
Subject: [PATCH 5/5] Adjusting bold text on labels

---
 .../item-operation/item-operation.component.html          | 2 +-
 .../edit-item-page/item-status/item-status.component.html | 8 ++++----
 .../edit-item-page/item-status/item-status.component.scss | 3 ---
 .../edit-item-page/item-status/item-status.component.ts   | 1 -
 4 files changed, 5 insertions(+), 9 deletions(-)
 delete mode 100644 src/app/item-page/edit-item-page/item-status/item-status.component.scss

diff --git a/src/app/item-page/edit-item-page/item-operation/item-operation.component.html b/src/app/item-page/edit-item-page/item-operation/item-operation.component.html
index deb8e15d29d..0977876a195 100644
--- a/src/app/item-page/edit-item-page/item-operation/item-operation.component.html
+++ b/src/app/item-page/edit-item-page/item-operation/item-operation.component.html
@@ -1,5 +1,5 @@
 <div class="col-12 col-md-3 h-auto float-left d-flex action-label">
-      <span class="justify-content-center align-self-center">
+      <span class="justify-content-center align-self-center font-weight-bold">
         {{'item.edit.tabs.status.buttons.' + operation.operationKey + '.label' | translate}}
       </span>
 </div>
diff --git a/src/app/item-page/edit-item-page/item-status/item-status.component.html b/src/app/item-page/edit-item-page/item-status/item-status.component.html
index 30212c4a4c0..7d6e2e95599 100644
--- a/src/app/item-page/edit-item-page/item-status/item-status.component.html
+++ b/src/app/item-page/edit-item-page/item-status/item-status.component.html
@@ -1,7 +1,7 @@
 <p class="mt-2">{{'item.edit.tabs.status.description' | translate}}</p>
 <div class="row">
   <div *ngFor="let statusKey of statusDataKeys" class="w-100 pt-1">
-    <div class="col-12 col-md-3 float-left status-label">
+    <div class="col-12 col-md-3 float-left status-label font-weight-bold">
       {{'item.edit.tabs.status.labels.' + statusKey | translate}}:
     </div>
     <div class="col-12 col-md-9 float-left status-data" id="status-{{statusKey}}">
@@ -11,15 +11,15 @@
 
   <div *ngFor="let identifier of (identifiers$ | async)" class="w-100 pt-1">
     <div *ngIf="(identifier.identifierType==='doi')">
-      <div class="col-12 col-md-3 float-left status-label">
+      <div class="col-12 col-md-3 float-left status-label font-weight-bold">
         {{identifier.identifierType.toLocaleUpperCase()}}
       </div>
-      <div class="col-12 col-md-9 float-left status-label">{{identifier.value}}
+      <div class="col-12 col-md-9 float-left status-label font-weight-bold">{{identifier.value}}
         ({{"item.edit.identifiers.doi.status."+identifier.identifierStatus|translate}})</div>
     </div>
   </div>
 
-  <div class="col-12 col-md-3 float-left status-label">
+  <div class="col-12 col-md-3 float-left status-label font-weight-bold">
     {{'item.edit.tabs.status.labels.itemPage' | translate}}:
   </div>
   <div class="col-12 col-md-9 float-left status-data" id="status-itemPage">
diff --git a/src/app/item-page/edit-item-page/item-status/item-status.component.scss b/src/app/item-page/edit-item-page/item-status/item-status.component.scss
deleted file mode 100644
index 349416cd20d..00000000000
--- a/src/app/item-page/edit-item-page/item-status/item-status.component.scss
+++ /dev/null
@@ -1,3 +0,0 @@
-.status-label {
-  font-weight: 700;
-}
diff --git a/src/app/item-page/edit-item-page/item-status/item-status.component.ts b/src/app/item-page/edit-item-page/item-status/item-status.component.ts
index 0ad500b56f8..1bb17dc77c5 100644
--- a/src/app/item-page/edit-item-page/item-status/item-status.component.ts
+++ b/src/app/item-page/edit-item-page/item-status/item-status.component.ts
@@ -60,7 +60,6 @@ import { ItemOperation } from '../item-operation/itemOperation.model';
 
 @Component({
   selector: 'ds-base-item-status',
-  styleUrls: ['item-status.component.scss'],
   templateUrl: './item-status.component.html',
   changeDetection: ChangeDetectionStrategy.Default,
   animations: [