2 files changed, 19 insertions, 7 deletions
diff --git a/MatrixRoomUtils.Web/Shared/ModalWindow.razor b/MatrixRoomUtils.Web/Shared/ModalWindow.razor
index 216f1f3..b40d246 100644
--- a/MatrixRoomUtils.Web/Shared/ModalWindow.razor
+++ b/MatrixRoomUtils.Web/Shared/ModalWindow.razor
@@ -1,12 +1,12 @@
 <div class="r-modal" style="top: @(_y)px; left: @(_x)px;">
     <div class="titlebar" @onmousedown="MouseDown" @onmouseup="MouseUp" @onmousemove="MouseMove" @onmouseleave="MouseMove">
-        <b class="title">@Title</b>
+        <b class="title" @ref="_titleRef">@Title</b>
         <button class="btnclose" @onclick="OnCloseClicked">X</button>
         <button class="btncollapse" @onclick="@(() => Collapsed = !Collapsed)">_</button>
     </div>
-        <div class="content" style="@(Collapsed ? "height: 0px;" : "")">
-            @ChildContent
-        </div>
+    <div class="r-modal-content" style="@((Collapsed ? "height: 0px;" : "") + $"min-width: {MinWidth}px;")">
+        @ChildContent
+    </div>
 </div>
 
 @code {
@@ -24,17 +24,29 @@
     public double Y { get; set; } = 60;
 
     [Parameter]
+    public double MinWidth { get; set; } = 100;
+
+    [Parameter]
     public Action OnCloseClicked { get; set; }
 
     [Parameter]
     public bool Collapsed { get; set; } = false;
 
+    private ElementReference _titleRef;
+
     private double _x = 60;
     private double _y = 60;
 
-    protected override void OnInitialized() {
+    protected override async Task OnInitializedAsync() {
         _x = X;
         _y = Y;
+        await base.OnInitializedAsync();
+    }
+
+    protected override async Task OnAfterRenderAsync(bool firstRender) {
+    //set minwidth to title width
+        MinWidth = await JSRuntime.InvokeAsync<int>("getWidth", _titleRef) + 75;
+        await base.OnAfterRenderAsync(firstRender);
     }
 
     private void WindowDrag(DragEventArgs obj) {
diff --git a/MatrixRoomUtils.Web/Shared/ModalWindow.razor.css b/MatrixRoomUtils.Web/Shared/ModalWindow.razor.css
index b25ab0e..6d08114 100644
--- a/MatrixRoomUtils.Web/Shared/ModalWindow.razor.css
+++ b/MatrixRoomUtils.Web/Shared/ModalWindow.razor.css
@@ -24,6 +24,7 @@
     top: 0;
     left: 0;
     width: fit-content;
+    text-wrap: nowrap;
     height: 100%;
     line-height: 25px;
     padding-left: 10px;
@@ -55,14 +56,13 @@
     cursor: pointer;
 }
 
-.r-modal > .content {
+.r-modal > .r-modal-content {
     position: relative;
     top: 25px;
     left: 0;
     width: fit-content;
     height: fit-content;
     min-width: 150px;
-    min-height: 5px;
     max-width: 75vw;
     max-height: 75vh;
     overflow: auto;