From 0434632fa48b4ee34e0515bbaed6ce7bf395b192 Mon Sep 17 00:00:00 2001
From: davivcu <dav.iv.kovac@gmail.com>
Date: Mon, 8 Jul 2024 14:26:03 +0200
Subject: [PATCH 1/6] Replace the verse-prose button with a select

---
 src/app/app.config.ts                         |  2 +-
 src/app/app.module.ts                         |  2 ++
 .../verse-prose-select.component.html         | 22 ++++++++++++
 .../verse-prose-select.component.scss         | 34 +++++++++++++++++++
 .../verse-prose-select.component.spec.ts      | 25 ++++++++++++++
 .../verse-prose-select.component.ts           | 27 +++++++++++++++
 .../text-panel/text-panel.component.html      |  7 +---
 .../panels/text-panel/text-panel.component.ts |  9 ++---
 src/assets/i18n/en.json                       |  3 +-
 src/assets/i18n/it.json                       |  3 +-
 10 files changed, 118 insertions(+), 16 deletions(-)
 create mode 100644 src/app/components/verse-prose-select/verse-prose-select.component.html
 create mode 100644 src/app/components/verse-prose-select/verse-prose-select.component.scss
 create mode 100644 src/app/components/verse-prose-select/verse-prose-select.component.spec.ts
 create mode 100644 src/app/components/verse-prose-select/verse-prose-select.component.ts

diff --git a/src/app/app.config.ts b/src/app/app.config.ts
index e4a46b42b..a85c6bb6f 100644
--- a/src/app/app.config.ts
+++ b/src/app/app.config.ts
@@ -236,4 +236,4 @@ export interface CustomEditorialConvention {
     };
 }
 
-export type TextFlow = 'prose' | 'verses';
+export type TextFlow = 'prose' | 'proseWithVerseNumbers' | 'verses';
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 4a549dba2..91593257e 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -141,6 +141,7 @@ import { TitleStmtComponent } from './components/title-stmt/title-stmt.component
 import { VerseComponent } from './components/verse/verse.component';
 import { VersesGroupComponent } from './components/verses-group/verses-group.component';
 import { VersionPanelComponent } from './panels/version-panel/version-panel.component';
+import { VerseProseSelectComponent } from './components/verse-prose-select/verse-prose-select.component';
 import { WordComponent } from './components/word/word.component';
 import { WitnessPanelComponent } from './panels/witness-panel/witness-panel.component';
 import { XmlBeautifyPipe } from './pipes/xml-beautify.pipe';
@@ -275,6 +276,7 @@ const DynamicComponents = [
     TextTextComponent,
     TextVersionsComponent,
     VersionPanelComponent,
+    VerseProseSelectComponent,
     WitnessPanelComponent,
     XmlBeautifyPipe,
     ...DynamicComponents,
diff --git a/src/app/components/verse-prose-select/verse-prose-select.component.html b/src/app/components/verse-prose-select/verse-prose-select.component.html
new file mode 100644
index 000000000..c43d85cca
--- /dev/null
+++ b/src/app/components/verse-prose-select/verse-prose-select.component.html
@@ -0,0 +1,22 @@
+<ng-select 
+    [items]="textFlowTypes" 
+    [multiple]="false" 
+    [closeOnSelect]="true" 
+    [searchable]="false"
+    [placeholder]="'selectItems' | translate"
+    [(ngModel)]="selectedType" 
+    [disabled]="textFlowTypes.length === 0"
+    [clearable]="false"
+    (change)="updateSelectedType($event)">
+    <ng-template ng-option-tmp let-item="item" let-item$="item$" let-index="index" let-search="searchTerm">
+        <evt-icon [iconInfo]="getProseVersesTogglerIcon(item)"></evt-icon>
+        <span class="ng-value-label"> {{item | translate}}</span>
+    </ng-template>
+    <ng-template ng-label-tmp let-item="item">
+        <evt-icon
+            [iconInfo]="getProseVersesTogglerIcon(item)"
+            label-left>
+        </evt-icon>
+        {{item | translate}}
+    </ng-template>
+</ng-select>
diff --git a/src/app/components/verse-prose-select/verse-prose-select.component.scss b/src/app/components/verse-prose-select/verse-prose-select.component.scss
new file mode 100644
index 000000000..98fc37f13
--- /dev/null
+++ b/src/app/components/verse-prose-select/verse-prose-select.component.scss
@@ -0,0 +1,34 @@
+ng-select {
+    width: 13.5rem;
+    margin-left: 0.3rem;
+}
+
+// ng-select overrides
+::ng-deep .ng-select {
+    min-width: 150px;
+}
+
+::ng-deep .ng-dropdown-panel {
+    .ng-dropdown-panel-items {
+        .ng-optgroup {
+            font-size: 90%;
+            font-variant: small-caps;
+        }
+
+        .ng-option {
+            padding-left: 10px !important;
+        }
+    }
+}
+
+.entities-select-toolbar {
+    display: flex;
+
+    .btn {
+        flex-grow: 1;
+    }
+}
+
+.select-all-btn {
+    cursor: pointer;
+}
\ No newline at end of file
diff --git a/src/app/components/verse-prose-select/verse-prose-select.component.spec.ts b/src/app/components/verse-prose-select/verse-prose-select.component.spec.ts
new file mode 100644
index 000000000..f5de84a98
--- /dev/null
+++ b/src/app/components/verse-prose-select/verse-prose-select.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
+
+import { VerseProseSelectComponent } from './verse-prose-select.component';
+
+describe('VerseProseSelectComponent', () => {
+  let component: VerseProseSelectComponent;
+  let fixture: ComponentFixture<VerseProseSelectComponent>;
+
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
+      declarations: [ VerseProseSelectComponent ],
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(VerseProseSelectComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/src/app/components/verse-prose-select/verse-prose-select.component.ts b/src/app/components/verse-prose-select/verse-prose-select.component.ts
new file mode 100644
index 000000000..204650562
--- /dev/null
+++ b/src/app/components/verse-prose-select/verse-prose-select.component.ts
@@ -0,0 +1,27 @@
+import { Component, EventEmitter, Output } from '@angular/core';
+import { TextFlow } from 'src/app/app.config';
+import { EvtIconInfo } from 'src/app/ui-components/icon/icon.component';
+
+@Component({
+  selector: 'evt-verse-prose-select',
+  templateUrl: './verse-prose-select.component.html',
+  styleUrls: ['./verse-prose-select.component.scss'],
+})
+
+export class VerseProseSelectComponent {
+
+  @Output() textModeSelectionChange: EventEmitter<TextFlow> = new EventEmitter();
+
+  public textFlowTypes: TextFlow[] = ['prose', 'proseWithVerseNumbers', 'verses'];
+
+  public selectedType: TextFlow = null;
+
+  getProseVersesTogglerIcon(textFlowMode: TextFlow): EvtIconInfo {
+    return { icon: textFlowMode === 'verses' ? 'align-justify' : 'align-left', iconSet: 'fas' };
+  }
+
+  updateSelectedType(textFlowType: TextFlow) {
+    this.textModeSelectionChange.emit(textFlowType);
+  };
+
+}
diff --git a/src/app/panels/text-panel/text-panel.component.html b/src/app/panels/text-panel/text-panel.component.html
index 1220af59d..eb2231ff4 100644
--- a/src/app/panels/text-panel/text-panel.component.html
+++ b/src/app/panels/text-panel/text-panel.component.html
@@ -44,12 +44,7 @@
             [active]="secondaryContent === 'SEARCH_RESULTS'">
         </evt-button>
         <evt-entities-select (selectionChange)="itemsToHighlight$.next($event)"></evt-entities-select>
-        <evt-button *ngIf="enableProseVersesToggler"
-            [iconLeft]="proseVersesTogglerIcon"
-            [label]="textFlow | translate"
-            additionalClasses="ms-1"
-            (btnClick)="toggleProseVerses()">
-        </evt-button>
+        <evt-verse-prose-select *ngIf="enableProseVersesToggler" (textModeSelectionChange)="toggleProseVerses($event)"></evt-verse-prose-select>
         <evt-button *ngIf="enableHideDeletionsToggler"
             [iconLeft]="hideDeletionsTogglerIcon"
             [label]="deletionsText | translate "
diff --git a/src/app/panels/text-panel/text-panel.component.ts b/src/app/panels/text-panel/text-panel.component.ts
index 57ca03797..5386f7a17 100644
--- a/src/app/panels/text-panel/text-panel.component.ts
+++ b/src/app/panels/text-panel/text-panel.component.ts
@@ -160,11 +160,6 @@ export class TextPanelComponent {
 
   public deletionsText: 'hidesDeletions' | 'showsDeletions' = 'showsDeletions';
 
-  public get proseVersesTogglerIcon(): EvtIconInfo {
-
-    return { icon: this.textFlow === 'prose' ? 'align-left' : 'align-justify', iconSet: 'fas' };
-  }
-
   public get hideDeletionsTogglerIcon(): EvtIconInfo {
     return { icon: (this.showDeletions) ? 'eye' : 'eye-slash', iconSet: 'fas' };
   }
@@ -203,8 +198,8 @@ export class TextPanelComponent {
     }
   }
 
-  toggleProseVerses() {
-    this.textFlow = this.textFlow === 'prose' ? 'verses' : 'prose';
+  toggleProseVerses(mode: TextFlow) {
+    this.textFlow = mode;
   }
 
   toggleHideDeletions() {
diff --git a/src/assets/i18n/en.json b/src/assets/i18n/en.json
index f32ac6c6d..149bbefd9 100644
--- a/src/assets/i18n/en.json
+++ b/src/assets/i18n/en.json
@@ -50,6 +50,7 @@
     "missingP": "missing",
     "omitted": "omitted",
     "prose": "Prose",
+    "proseWithVerseNumbers": "Prose with verse numbers",
     "verses": "Verses",
     "page": "Page {{value}}",
     "front": "Front",
@@ -195,7 +196,7 @@
     "asc": "Ascendent",
     "desc": "Descendent",
     "reprintedIn": "Repr. in",
-    "editedBy": "Edited by"
+    "editedBy": "Edited by",
     "corrSeq": "Correction sequence",
     "criticalNote": "Critical note",
     "showsDeletions": "Show deletions",
diff --git a/src/assets/i18n/it.json b/src/assets/i18n/it.json
index a976dd4b1..ba891d95e 100644
--- a/src/assets/i18n/it.json
+++ b/src/assets/i18n/it.json
@@ -49,6 +49,7 @@
   "missingP": "mancanti",
   "omitted": "omissione",
   "prose": "Prosa",
+  "proseWithVerseNumbers": "Prosa con numeri dei versi",
   "verses": "Versi",
   "page": "Pagina {{value}}",
   "front": "Front",
@@ -194,7 +195,7 @@
   "asc": "Crescente",
   "desc": "Decrescente",
   "reprintedIn": "Rist. in",
-  "editedBy": "A cura di"
+  "editedBy": "A cura di",
   "corrSeq": "Sequenza correzioni",
   "criticalNote": "Nota critica",
   "showsDeletions": "Mostra cancellazioni",

From 642aeff17c98ac0bdc0418f5a522fe13a66e1f0a Mon Sep 17 00:00:00 2001
From: davivcu <dav.iv.kovac@gmail.com>
Date: Tue, 9 Jul 2024 22:43:24 +0200
Subject: [PATCH 2/6] Hide verse and lb numbers if plain text is selected as
 text flow mode

---
 src/app/app.config.ts                                       | 2 +-
 src/app/components/lb/lb.component.html                     | 2 +-
 src/app/components/lb/lb.component.ts                       | 4 ++++
 .../verse-prose-select/verse-prose-select.component.html    | 6 +++---
 .../verse-prose-select/verse-prose-select.component.ts      | 4 ++--
 src/app/components/verse/verse.component.html               | 2 +-
 src/app/components/verse/verse.component.ts                 | 4 ++++
 src/assets/i18n/en.json                                     | 4 +++-
 src/assets/i18n/it.json                                     | 4 +++-
 9 files changed, 22 insertions(+), 10 deletions(-)

diff --git a/src/app/app.config.ts b/src/app/app.config.ts
index a85c6bb6f..fb0800330 100644
--- a/src/app/app.config.ts
+++ b/src/app/app.config.ts
@@ -236,4 +236,4 @@ export interface CustomEditorialConvention {
     };
 }
 
-export type TextFlow = 'prose' | 'proseWithVerseNumbers' | 'verses';
+export type TextFlow = 'prose' | 'prose_strict' | 'verses';
diff --git a/src/app/components/lb/lb.component.html b/src/app/components/lb/lb.component.html
index 1f1ceabfb..e4c15bf31 100644
--- a/src/app/components/lb/lb.component.html
+++ b/src/app/components/lb/lb.component.html
@@ -3,7 +3,7 @@
     [attr.id]="data.id" [attr.data-rend]="data.rend || ''" [attr.data-facs]="data.facs || ''">
     <ng-container *ngIf="data">
         <br *ngIf="displayBlock$ | async"/>
-        <span class="lineN" *ngIf="data.n && (displayBlock$ | async)">{{data.n}}</span>
+        <span class="lineN" *ngIf="(data.n && (displayBlock$ | async)) && !plainTextFlow">{{data.n}}</span>
     </ng-container>
     <ng-container *ngIf="displayInline$ | async">&nbsp;</ng-container>
 </span>
diff --git a/src/app/components/lb/lb.component.ts b/src/app/components/lb/lb.component.ts
index 6dd67a27c..afdb4f6cd 100644
--- a/src/app/components/lb/lb.component.ts
+++ b/src/app/components/lb/lb.component.ts
@@ -40,6 +40,10 @@ export class LbComponent {
     );
   }
 
+  get plainTextFlow() {
+    return this.textFlow === 'prose_strict';
+  }
+
   get displayInline$() {
     return this.displayBlock$.pipe(
       map((displayBlock) => !displayBlock),
diff --git a/src/app/components/verse-prose-select/verse-prose-select.component.html b/src/app/components/verse-prose-select/verse-prose-select.component.html
index c43d85cca..e7b91e27d 100644
--- a/src/app/components/verse-prose-select/verse-prose-select.component.html
+++ b/src/app/components/verse-prose-select/verse-prose-select.component.html
@@ -3,20 +3,20 @@
     [multiple]="false" 
     [closeOnSelect]="true" 
     [searchable]="false"
-    [placeholder]="'selectItems' | translate"
+    [placeholder]="'Text Flow' | translate"
     [(ngModel)]="selectedType" 
     [disabled]="textFlowTypes.length === 0"
     [clearable]="false"
     (change)="updateSelectedType($event)">
     <ng-template ng-option-tmp let-item="item" let-item$="item$" let-index="index" let-search="searchTerm">
         <evt-icon [iconInfo]="getProseVersesTogglerIcon(item)"></evt-icon>
-        <span class="ng-value-label"> {{item | translate}}</span>
+        <span class="ng-value-label"> {{'option_' + item | translate}}</span>
     </ng-template>
     <ng-template ng-label-tmp let-item="item">
         <evt-icon
             [iconInfo]="getProseVersesTogglerIcon(item)"
             label-left>
         </evt-icon>
-        {{item | translate}}
+        {{'option_' + item | translate}}
     </ng-template>
 </ng-select>
diff --git a/src/app/components/verse-prose-select/verse-prose-select.component.ts b/src/app/components/verse-prose-select/verse-prose-select.component.ts
index 204650562..46d3eff62 100644
--- a/src/app/components/verse-prose-select/verse-prose-select.component.ts
+++ b/src/app/components/verse-prose-select/verse-prose-select.component.ts
@@ -12,9 +12,9 @@ export class VerseProseSelectComponent {
 
   @Output() textModeSelectionChange: EventEmitter<TextFlow> = new EventEmitter();
 
-  public textFlowTypes: TextFlow[] = ['prose', 'proseWithVerseNumbers', 'verses'];
+  public textFlowTypes: TextFlow[] = ['prose', 'prose_strict', 'verses'];
 
-  public selectedType: TextFlow = null;
+  public selectedType: TextFlow = 'prose';
 
   getProseVersesTogglerIcon(textFlowMode: TextFlow): EvtIconInfo {
     return { icon: textFlowMode === 'verses' ? 'align-justify' : 'align-left', iconSet: 'fas' };
diff --git a/src/app/components/verse/verse.component.html b/src/app/components/verse/verse.component.html
index 24212b46d..f7ca56cf1 100644
--- a/src/app/components/verse/verse.component.html
+++ b/src/app/components/verse/verse.component.html
@@ -1,6 +1,6 @@
 <span class="verse l " [evtHtmlAttributes]="data.attributes"
 	[class.display-block]="displayBlock$ | async" [class]="data.class" >
-	<span class="verse-num" [class.hidden]="(displayBlock$ | async) && showNumber">{{data.n}}</span>
+	<span *ngIf="!plainTextFlow" class="verse-num" [class.hidden]="(displayBlock$ | async) && showNumber">{{data.n}}</span>
 	<evt-source-note *ngIf="data.source !== null || data.analogue !== null" [data]="data"></evt-source-note>
 	<evt-content-viewer *ngFor="let el of data.content" [content]="el" [editionLevel]="editionLevel"
 		[itemsToHighlight]="itemsToHighlight" [evtHighlight]="highlightData" [textFlow]="textFlow" [withDeletions]="withDeletions" [selectedLayer]="selectedLayer">
diff --git a/src/app/components/verse/verse.component.ts b/src/app/components/verse/verse.component.ts
index bd0a1902b..1228e790e 100644
--- a/src/app/components/verse/verse.component.ts
+++ b/src/app/components/verse/verse.component.ts
@@ -45,6 +45,10 @@ export class VerseComponent {
     return !isNaN(num) && num % this.verseNumberPrinter !== 0;
   }
 
+  get plainTextFlow() {
+    return this.textFlow === 'prose_strict';
+  }
+
   constructor(
     private evtModelService: EVTModelService,
   ) {
diff --git a/src/assets/i18n/en.json b/src/assets/i18n/en.json
index 149bbefd9..6de87a7d9 100644
--- a/src/assets/i18n/en.json
+++ b/src/assets/i18n/en.json
@@ -50,8 +50,10 @@
     "missingP": "missing",
     "omitted": "omitted",
     "prose": "Prose",
-    "proseWithVerseNumbers": "Prose with verse numbers",
     "verses": "Verses",
+    "option_prose": "Prose with verse numbers",
+    "option_verses": "Verses",
+    "option_prose_strict": "Plain text",
     "page": "Page {{value}}",
     "front": "Front",
     "mainText": "Main text",
diff --git a/src/assets/i18n/it.json b/src/assets/i18n/it.json
index ba891d95e..8a8be62af 100644
--- a/src/assets/i18n/it.json
+++ b/src/assets/i18n/it.json
@@ -49,8 +49,10 @@
   "missingP": "mancanti",
   "omitted": "omissione",
   "prose": "Prosa",
-  "proseWithVerseNumbers": "Prosa con numeri dei versi",
   "verses": "Versi",
+  "option_prose": "Prose with verse numbers",
+  "option_verses": "Verses",
+  "option_prose_strict": "Plain text",
   "page": "Pagina {{value}}",
   "front": "Front",
   "mainText": "Testo principale",

From c1f8fc71e14d5f4b134d9878b06e2e0fb0c35728 Mon Sep 17 00:00:00 2001
From: davivcu <dav.iv.kovac@gmail.com>
Date: Wed, 10 Jul 2024 20:38:39 +0200
Subject: [PATCH 3/6] Show line breaks number for all options except verses

---
 src/app/components/lb/lb.component.html       | 2 +-
 src/app/components/lb/lb.component.ts         | 4 ----
 src/app/components/verse/verse.component.scss | 3 +++
 src/assets/i18n/en.json                       | 2 +-
 src/assets/i18n/it.json                       | 2 +-
 5 files changed, 6 insertions(+), 7 deletions(-)

diff --git a/src/app/components/lb/lb.component.html b/src/app/components/lb/lb.component.html
index e4c15bf31..55851415e 100644
--- a/src/app/components/lb/lb.component.html
+++ b/src/app/components/lb/lb.component.html
@@ -3,7 +3,7 @@
     [attr.id]="data.id" [attr.data-rend]="data.rend || ''" [attr.data-facs]="data.facs || ''">
     <ng-container *ngIf="data">
         <br *ngIf="displayBlock$ | async"/>
-        <span class="lineN" *ngIf="(data.n && (displayBlock$ | async)) && !plainTextFlow">{{data.n}}</span>
+        <span class="lineN" *ngIf="(data.n && (displayBlock$ | async))">{{data.n}}</span>
     </ng-container>
     <ng-container *ngIf="displayInline$ | async">&nbsp;</ng-container>
 </span>
diff --git a/src/app/components/lb/lb.component.ts b/src/app/components/lb/lb.component.ts
index afdb4f6cd..6dd67a27c 100644
--- a/src/app/components/lb/lb.component.ts
+++ b/src/app/components/lb/lb.component.ts
@@ -40,10 +40,6 @@ export class LbComponent {
     );
   }
 
-  get plainTextFlow() {
-    return this.textFlow === 'prose_strict';
-  }
-
   get displayInline$() {
     return this.displayBlock$.pipe(
       map((displayBlock) => !displayBlock),
diff --git a/src/app/components/verse/verse.component.scss b/src/app/components/verse/verse.component.scss
index ba1a24aae..dc6d50d22 100644
--- a/src/app/components/verse/verse.component.scss
+++ b/src/app/components/verse/verse.component.scss
@@ -12,6 +12,9 @@
         height: 16px;
         color: get-color(versesColor);
         font-size: 0.7em;
+        border: 1px solid #000000b5;
+        border-radius: 8px;
+        padding-bottom: 1rem;
         &:before {
             content: '';
             width: 100%;
diff --git a/src/assets/i18n/en.json b/src/assets/i18n/en.json
index 6de87a7d9..4550b41a8 100644
--- a/src/assets/i18n/en.json
+++ b/src/assets/i18n/en.json
@@ -53,7 +53,7 @@
     "verses": "Verses",
     "option_prose": "Prose with verse numbers",
     "option_verses": "Verses",
-    "option_prose_strict": "Plain text",
+    "option_prose_strict": "Prose",
     "page": "Page {{value}}",
     "front": "Front",
     "mainText": "Main text",
diff --git a/src/assets/i18n/it.json b/src/assets/i18n/it.json
index 8a8be62af..a2b1f7c36 100644
--- a/src/assets/i18n/it.json
+++ b/src/assets/i18n/it.json
@@ -52,7 +52,7 @@
   "verses": "Versi",
   "option_prose": "Prose with verse numbers",
   "option_verses": "Verses",
-  "option_prose_strict": "Plain text",
+  "option_prose_strict": "Prose",
   "page": "Pagina {{value}}",
   "front": "Front",
   "mainText": "Testo principale",

From 3abf4c3a82a2ef6a6ad4061265bed8d8c922d46d Mon Sep 17 00:00:00 2001
From: davivcu <dav.iv.kovac@gmail.com>
Date: Thu, 11 Jul 2024 19:42:11 +0200
Subject: [PATCH 4/6] Change text flow options order

---
 .../verse-prose-select/verse-prose-select.component.ts          | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/app/components/verse-prose-select/verse-prose-select.component.ts b/src/app/components/verse-prose-select/verse-prose-select.component.ts
index 46d3eff62..1fcac2ed7 100644
--- a/src/app/components/verse-prose-select/verse-prose-select.component.ts
+++ b/src/app/components/verse-prose-select/verse-prose-select.component.ts
@@ -12,7 +12,7 @@ export class VerseProseSelectComponent {
 
   @Output() textModeSelectionChange: EventEmitter<TextFlow> = new EventEmitter();
 
-  public textFlowTypes: TextFlow[] = ['prose', 'prose_strict', 'verses'];
+  public textFlowTypes: TextFlow[] = ['prose_strict', 'prose', 'verses'];
 
   public selectedType: TextFlow = 'prose';
 

From 1c073971c6271ba9dc1d725f994cd6881a67898a Mon Sep 17 00:00:00 2001
From: davivcu <dav.iv.kovac@gmail.com>
Date: Thu, 11 Jul 2024 20:46:46 +0200
Subject: [PATCH 5/6] Change verse/prose behaviour

---
 src/app/app.config.ts                                    | 2 +-
 .../verse-prose-select/verse-prose-select.component.ts   | 2 +-
 src/app/components/verse/verse.component.html            | 2 +-
 src/app/components/verse/verse.component.scss            | 9 ++++++---
 src/app/components/verse/verse.component.ts              | 6 +++++-
 src/assets/config/custom-styles.css                      | 4 ----
 src/assets/i18n/en.json                                  | 4 ++--
 src/assets/i18n/it.json                                  | 4 ++--
 8 files changed, 18 insertions(+), 15 deletions(-)

diff --git a/src/app/app.config.ts b/src/app/app.config.ts
index fb0800330..8a29002df 100644
--- a/src/app/app.config.ts
+++ b/src/app/app.config.ts
@@ -236,4 +236,4 @@ export interface CustomEditorialConvention {
     };
 }
 
-export type TextFlow = 'prose' | 'prose_strict' | 'verses';
+export type TextFlow = 'prose' | 'prose_mixed' | 'verses';
diff --git a/src/app/components/verse-prose-select/verse-prose-select.component.ts b/src/app/components/verse-prose-select/verse-prose-select.component.ts
index 1fcac2ed7..a1d7ebd36 100644
--- a/src/app/components/verse-prose-select/verse-prose-select.component.ts
+++ b/src/app/components/verse-prose-select/verse-prose-select.component.ts
@@ -12,7 +12,7 @@ export class VerseProseSelectComponent {
 
   @Output() textModeSelectionChange: EventEmitter<TextFlow> = new EventEmitter();
 
-  public textFlowTypes: TextFlow[] = ['prose_strict', 'prose', 'verses'];
+  public textFlowTypes: TextFlow[] = ['prose', 'prose_mixed', 'verses'];
 
   public selectedType: TextFlow = 'prose';
 
diff --git a/src/app/components/verse/verse.component.html b/src/app/components/verse/verse.component.html
index f7ca56cf1..78f5aaa7d 100644
--- a/src/app/components/verse/verse.component.html
+++ b/src/app/components/verse/verse.component.html
@@ -1,6 +1,6 @@
 <span class="verse l " [evtHtmlAttributes]="data.attributes"
 	[class.display-block]="displayBlock$ | async" [class]="data.class" >
-	<span *ngIf="!plainTextFlow" class="verse-num" [class.hidden]="(displayBlock$ | async) && showNumber">{{data.n}}</span>
+	<span *ngIf="!plainTextFlow" class="verse-num" [class.verse-baloon]="baloon" [class.hidden]="(displayBlock$ | async) && showNumber">{{data.n}}</span>
 	<evt-source-note *ngIf="data.source !== null || data.analogue !== null" [data]="data"></evt-source-note>
 	<evt-content-viewer *ngFor="let el of data.content" [content]="el" [editionLevel]="editionLevel"
 		[itemsToHighlight]="itemsToHighlight" [evtHighlight]="highlightData" [textFlow]="textFlow" [withDeletions]="withDeletions" [selectedLayer]="selectedLayer">
diff --git a/src/app/components/verse/verse.component.scss b/src/app/components/verse/verse.component.scss
index dc6d50d22..fc1ac74e8 100644
--- a/src/app/components/verse/verse.component.scss
+++ b/src/app/components/verse/verse.component.scss
@@ -12,9 +12,6 @@
         height: 16px;
         color: get-color(versesColor);
         font-size: 0.7em;
-        border: 1px solid #000000b5;
-        border-radius: 8px;
-        padding-bottom: 1rem;
         &:before {
             content: '';
             width: 100%;
@@ -41,4 +38,10 @@
             }
         }
     }
+    .verse-baloon {
+        border: 1px solid #000000b5;
+        border-radius: 8px;
+        padding-bottom: 1rem;
+        padding-right: 0.1rem;
+    }
 }
diff --git a/src/app/components/verse/verse.component.ts b/src/app/components/verse/verse.component.ts
index 1228e790e..e9e92b9ff 100644
--- a/src/app/components/verse/verse.component.ts
+++ b/src/app/components/verse/verse.component.ts
@@ -45,8 +45,12 @@ export class VerseComponent {
     return !isNaN(num) && num % this.verseNumberPrinter !== 0;
   }
 
+  get baloon() {
+    return this.textFlow !== 'verses';
+  }
+
   get plainTextFlow() {
-    return this.textFlow === 'prose_strict';
+    return this.textFlow === 'prose';
   }
 
   constructor(
diff --git a/src/assets/config/custom-styles.css b/src/assets/config/custom-styles.css
index c7a165345..efa0aad6e 100644
--- a/src/assets/config/custom-styles.css
+++ b/src/assets/config/custom-styles.css
@@ -32,10 +32,6 @@
     vertical-align: text-bottom;
 }
 
-evt-verse {
-    display: block;
-}
-
 evt-page :not(evt-apparatus-entry-detail) .head {
     font-weight: bold;
     display: inline-block;
diff --git a/src/assets/i18n/en.json b/src/assets/i18n/en.json
index 4550b41a8..9670994aa 100644
--- a/src/assets/i18n/en.json
+++ b/src/assets/i18n/en.json
@@ -51,9 +51,9 @@
     "omitted": "omitted",
     "prose": "Prose",
     "verses": "Verses",
-    "option_prose": "Prose with verse numbers",
+    "option_prose": "Prose",
+    "option_prose_mixed": "Prose with verse numbers",
     "option_verses": "Verses",
-    "option_prose_strict": "Prose",
     "page": "Page {{value}}",
     "front": "Front",
     "mainText": "Main text",
diff --git a/src/assets/i18n/it.json b/src/assets/i18n/it.json
index a2b1f7c36..259a50e42 100644
--- a/src/assets/i18n/it.json
+++ b/src/assets/i18n/it.json
@@ -50,9 +50,9 @@
   "omitted": "omissione",
   "prose": "Prosa",
   "verses": "Versi",
-  "option_prose": "Prose with verse numbers",
+  "option_prose": "Prose",
+  "option_prose_mixed": "Prose with verse numbers",
   "option_verses": "Verses",
-  "option_prose_strict": "Prose",
   "page": "Pagina {{value}}",
   "front": "Front",
   "mainText": "Testo principale",

From c4d2da488f5685e75b2e7b0ad2af62a974a29d56 Mon Sep 17 00:00:00 2001
From: davivcu <dav.iv.kovac@gmail.com>
Date: Sat, 24 Aug 2024 18:09:36 +0200
Subject: [PATCH 6/6] Improve behavior in changes view

---
 src/app/components/verse/verse.component.ts            |  1 +
 .../components/verses-group/verses-group.component.ts  |  1 +
 src/styles.scss                                        | 10 ++++++++++
 3 files changed, 12 insertions(+)

diff --git a/src/app/components/verse/verse.component.ts b/src/app/components/verse/verse.component.ts
index e9e92b9ff..bd5fad5da 100644
--- a/src/app/components/verse/verse.component.ts
+++ b/src/app/components/verse/verse.component.ts
@@ -28,6 +28,7 @@ export class VerseComponent {
         // unless current text flow is prose
         // In critical edition verses are always shown as block items, unless current text flow is prose
         switch (this.editionLevel) {
+          case 'changesView':
           case 'diplomatic':
           case 'interpretative':
             return this.textFlow === 'verses' || !hasLines;
diff --git a/src/app/components/verses-group/verses-group.component.ts b/src/app/components/verses-group/verses-group.component.ts
index 6d97bfaa1..1bbdda300 100644
--- a/src/app/components/verses-group/verses-group.component.ts
+++ b/src/app/components/verses-group/verses-group.component.ts
@@ -25,6 +25,7 @@ export class VersesGroupComponent {
         // In diplomatic and interpretative edition, if the text doesn't have any line, verses group are shown as block items
         // In critical edition verses are always shown as block items
         switch (this.editionLevel) {
+          case 'changesView':
           case 'diplomatic':
           case 'interpretative':
             return !hasLines;
diff --git a/src/styles.scss b/src/styles.scss
index 63faf2d66..f5b60081f 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -334,4 +334,14 @@ evt-mod-detail .tab-content > .active {
 
 evt-main-header .svg-inline--fa {
   height: 0.85em;
+}
+
+evt-page :not(evt-apparatus-entry-detail) .head {
+  font-weight: bold;
+  display: block;
+  padding: 0.5em 0.1em 0.5em 0em;
+}
+
+[ng-reflect-text-flow="verses"] evt-verse {
+  display: block;
 }
\ No newline at end of file