Add scroll bar to print monitor if content is overflowing

Fixes https://github.com/Ultimaker/Cura/issues/11629

CURA-8980

plugins/USBPrinting/MonitorItem.qml

@@ -21,7 +21,10 @@ Component
 
             Cura.PrintMonitor
             {
-                anchors.fill: parent
+                anchors.top: parent.top
+                anchors.left: parent.left
+                anchors.right: parent.right
+                anchors.bottom: footerSeparator.top
             }
 
             Rectangle

resources/qml/PrintMonitor.qml

@@ -3,17 +3,33 @@
 
 import QtQuick 2.7
 import QtQuick.Layouts 1.1
+import QtQuick.Controls 2.15
 
-import UM 1.2 as UM
+import UM 1.5 as UM
 import Cura 1.0 as Cura
 
 import "PrinterOutput"
 
-
-Item
+ScrollView
 {
     id: base
-    UM.I18nCatalog { id: catalog; name: "cura"}
+    width: parent.width
+    height: parent.height
+
+    contentHeight: printMonitor.height
+
+    ScrollBar.vertical: UM.ScrollBar
+    {
+        id: scrollbar
+        parent: base
+        anchors
+        {
+            right: parent.right
+            top: parent.top
+            bottom: parent.bottom
+        }
+    }
+    clip: true
 
     function showTooltip(item, position, text)
     {
@@ -51,7 +67,9 @@ Item
     {
         id: printMonitor
 
-        anchors.fill: parent
+        UM.I18nCatalog { id: catalog; name: "cura" }
+
+        width: parent.width - scrollbar.width
 
         property var extrudersModel: CuraApplication.getExtrudersModel()