From e8999cfb8f7ccb38a2bd29c3b5069ff9240be68a Mon Sep 17 00:00:00 2001
From: Samuele Locatelli <samuele@steamware.net>
Date: Tue, 24 Feb 2026 16:48:39 +0100
Subject: [PATCH] Update con testo scrolling

---
 MP.SPEC/Components/Fermate/ProdStopMan.razor  |   8 +-
 .../Components/Fermate/ProdStopMan.razor.css  | 117 +++++++++++++++++
 .../Components/Fermate/ProdStopMan.razor.less | 121 ++++++++++++++++++
 MP.SPEC/Pages/RepStop.razor                   |   4 +-
 MP.SPEC/compilerconfig.json                   |   4 +
 5 files changed, 248 insertions(+), 6 deletions(-)
 create mode 100644 MP.SPEC/Components/Fermate/ProdStopMan.razor.css
 create mode 100644 MP.SPEC/Components/Fermate/ProdStopMan.razor.less

diff --git a/MP.SPEC/Components/Fermate/ProdStopMan.razor b/MP.SPEC/Components/Fermate/ProdStopMan.razor
index 6756e9e6..a3dd0245 100644
--- a/MP.SPEC/Components/Fermate/ProdStopMan.razor
+++ b/MP.SPEC/Components/Fermate/ProdStopMan.razor
@@ -1,12 +1,12 @@
-<div class="col-4 col-sm-4 col-md-4 col-lg-2 flex-fill2">
-    <div class="p-2 h-100 w-100">
+<div class="col-6 col-sm-4 col-md-3">
+    <div class="p-2 px-1 h-100 w-100">
         <div class="@objCss text-center card w-100 h-100" @onclick="() => ReportSelected()">
             <div class="card-body text-light">
-                <i class="@objIcon" style="font-size: 8vw"></i>
+                <i class="@objIcon" style="font-size: 5vw"></i>
             </div>
             <div class="card-footer text-center h-100 bg-dark text-light opacity-75 p-1">
                 @* <span class="d-inline-block text-center text-nowrap text-truncate mw-100 scroll-left" style="font-size: 1.3rem;">@objTxt</span> *@
-                <div class="d-inline-block @textCss(objTxt)" style="font-size: 1.3rem;">
+                <div class="d-inline-block @textCss(objTxt) fs-6">
                     <span>@objTxt</span>
                 </div>
             </div>
diff --git a/MP.SPEC/Components/Fermate/ProdStopMan.razor.css b/MP.SPEC/Components/Fermate/ProdStopMan.razor.css
new file mode 100644
index 00000000..20669e4f
--- /dev/null
+++ b/MP.SPEC/Components/Fermate/ProdStopMan.razor.css
@@ -0,0 +1,117 @@
+/* gestione scroll testo A: 100% */
+.scroll-left-a {
+    height: 1.5em;
+    overflow: hidden;
+    position: relative;
+    width: 100%;
+    white-space: nowrap;
+}
+
+    .scroll-left-a span {
+        /*display: inline-block;*/
+        position: absolute;
+        width: 100%;
+        height: 100%;
+        margin: 0;
+        line-height: 1.5em;
+        /* Starting position */
+        -moz-transform: translateX(-50%);
+        -webkit-transform: translateX(-50%);
+        transform: translateX(-50%);
+        /* Apply animation to this element */
+        -moz-animation: scroll-left-a 8s ease infinite;
+        -webkit-animation: scroll-left-a 8s ease infinite;
+        animation: scroll-left-a 8s ease infinite;
+    }
+/* Move it (define the animation) */
+@keyframes scroll-left-a {
+    0% {
+        transform: translateX(-50%);
+    }
+
+    30% {
+        transform: translateX(-50%);
+    }
+
+    80% {
+        transform: translateX(-80%);
+    }
+}
+/* gestione scroll testo B: 120% */
+.scroll-left-b {
+    height: 1.5em;
+    overflow: hidden;
+    position: relative;
+    width: 100%;
+    white-space: nowrap;
+}
+
+    .scroll-left-b span {
+        /*display: inline-block;*/
+        position: absolute;
+        width: 100%;
+        height: 100%;
+        margin: 0;
+        line-height: 1.5em;
+        /* Starting position */
+        -moz-transform: translateX(-50%);
+        -webkit-transform: translateX(-50%);
+        transform: translateX(-50%);
+        /* Apply animation to this element */
+        -moz-animation: scroll-left-b 8s ease infinite;
+        -webkit-animation: scroll-left-b 8s ease infinite;
+        animation: scroll-left-b 8s ease infinite;
+    }
+/* Move it (define the animation) */
+@keyframes scroll-left-b {
+    0% {
+        transform: translateX(-50%);
+    }
+
+    30% {
+        transform: translateX(-50%);
+    }
+
+    80% {
+        transform: translateX(-120%);
+    }
+}
+/* gestione scroll testo C: 150% */
+.scroll-left-c {
+    height: 1.5em;
+    overflow: hidden;
+    position: relative;
+    width: 100%;
+    white-space: nowrap;
+}
+
+    .scroll-left-c span {
+        /*display: inline-block;*/
+        position: absolute;
+        width: 100%;
+        height: 100%;
+        margin: 0;
+        line-height: 1.5em;
+        /* Starting position */
+        -moz-transform: translateX(-50%);
+        -webkit-transform: translateX(-50%);
+        transform: translateX(-50%);
+        /* Apply animation to this element */
+        -moz-animation: scroll-left-c 8s ease infinite;
+        -webkit-animation: scroll-left-c 8s ease infinite;
+        animation: scroll-left-c 8s ease infinite;
+    }
+/* Move it (define the animation) */
+@keyframes scroll-left-c {
+    0% {
+        transform: translateX(-50%);
+    }
+
+    30% {
+        transform: translateX(-50%);
+    }
+
+    80% {
+        transform: translateX(-150%);
+    }
+}
diff --git a/MP.SPEC/Components/Fermate/ProdStopMan.razor.less b/MP.SPEC/Components/Fermate/ProdStopMan.razor.less
new file mode 100644
index 00000000..759ab10e
--- /dev/null
+++ b/MP.SPEC/Components/Fermate/ProdStopMan.razor.less
@@ -0,0 +1,121 @@
+
+
+/* gestione scroll testo A: 100% */
+.scroll-left-a {
+    height: 1.5em;
+    overflow: hidden;
+    position: relative;
+    width: 100%;
+    white-space: nowrap;
+}
+
+.scroll-left-a span {
+    /*display: inline-block;*/
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    margin: 0;
+    line-height: 1.5em;
+    /* Starting position */
+    -moz-transform: translateX(-50%);
+    -webkit-transform: translateX(-50%);
+    transform: translateX(-50%);
+    /* Apply animation to this element */
+    -moz-animation: scroll-left-a 8s ease infinite;
+    -webkit-animation: scroll-left-a 8s ease infinite;
+    animation: scroll-left-a 8s ease infinite;
+}
+/* Move it (define the animation) */
+@keyframes scroll-left-a {
+    0% {
+        transform: translateX(-50%);
+    }
+
+    30% {
+        transform: translateX(-50%);
+    }
+
+    80% {
+        transform: translateX(-80%);
+    }
+}
+
+/* gestione scroll testo B: 120% */
+.scroll-left-b {
+    height: 1.5em;
+    overflow: hidden;
+    position: relative;
+    width: 100%;
+    white-space: nowrap;
+}
+
+.scroll-left-b span {
+    /*display: inline-block;*/
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    margin: 0;
+    line-height: 1.5em;
+    /* Starting position */
+    -moz-transform: translateX(-50%);
+    -webkit-transform: translateX(-50%);
+    transform: translateX(-50%);
+    /* Apply animation to this element */
+    -moz-animation: scroll-left-b 8s ease infinite;
+    -webkit-animation: scroll-left-b 8s ease infinite;
+    animation: scroll-left-b 8s ease infinite;
+}
+/* Move it (define the animation) */
+@keyframes scroll-left-b {
+    0% {
+        transform: translateX(-50%);
+    }
+
+    30% {
+        transform: translateX(-50%);
+    }
+
+    80% {
+        transform: translateX(-120%);
+    }
+}
+
+/* gestione scroll testo C: 150% */
+.scroll-left-c {
+    height: 1.5em;
+    overflow: hidden;
+    position: relative;
+    width: 100%;
+    white-space: nowrap;
+}
+
+.scroll-left-c span {
+    /*display: inline-block;*/
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    margin: 0;
+    line-height: 1.5em;
+    /* Starting position */
+    -moz-transform: translateX(-50%);
+    -webkit-transform: translateX(-50%);
+    transform: translateX(-50%);
+    /* Apply animation to this element */
+    -moz-animation: scroll-left-c 8s ease infinite;
+    -webkit-animation: scroll-left-c 8s ease infinite;
+    animation: scroll-left-c 8s ease infinite;
+}
+/* Move it (define the animation) */
+@keyframes scroll-left-c {
+    0% {
+        transform: translateX(-50%);
+    }
+
+    30% {
+        transform: translateX(-50%);
+    }
+
+    80% {
+        transform: translateX(-150%);
+    }
+}
diff --git a/MP.SPEC/Pages/RepStop.razor b/MP.SPEC/Pages/RepStop.razor
index ef9d9de1..3f5d58e2 100644
--- a/MP.SPEC/Pages/RepStop.razor
+++ b/MP.SPEC/Pages/RepStop.razor
@@ -23,10 +23,10 @@
         else
         {
             <div class="row">
-                <div class="col-6">
+                <div class="col-5">
                     <ListMacc ListMSE="@SearchMacchine" EC_Selected="CheckSelection"></ListMacc>
                 </div>
-                <div class="col-6">
+                <div class="col-7">
                     @if (showFermate)
                     {
                         <ListFerm ListaFermate="SearchFermate"></ListFerm>
diff --git a/MP.SPEC/compilerconfig.json b/MP.SPEC/compilerconfig.json
index f66d0b9d..b113c3ca 100644
--- a/MP.SPEC/compilerconfig.json
+++ b/MP.SPEC/compilerconfig.json
@@ -10,5 +10,9 @@
   {
     "outputFile": "Shared/MainLayout.razor.css",
     "inputFile": "Shared/MainLayout.razor.less"
+  },
+  {
+    "outputFile": "Components/Fermate/ProdStopMan.razor.css",
+    "inputFile": "Components/Fermate/ProdStopMan.razor.less"
   }
 ]
\ No newline at end of file