Fixing style issues related to firefox

shared/css/static/modal-permissions.scss

@@ -1,8 +1,11 @@
 permission-editor {
 	display: flex;
 	flex-direction: column;
+
 	flex-grow: 1;
 	flex-shrink: 1;
+
+	min-height: 0;
 }
 
 
@@ -260,6 +263,7 @@ permission-editor {
 
 		flex-grow: 1;
 		flex-shrink: 1;
+		min-height: 0;
 
 		&.container-mode-unset {
 			background-color: lightgray;

shared/css/static/modal-playlist.scss

@@ -155,6 +155,7 @@
 	display: flex;
 	flex-direction: column;
 	justify-content: stretch;
+	min-height: 0;
 
 	.tab-content {
 		padding: 0; /* override tab-content setting */
@@ -228,13 +229,14 @@
 		text-align: center;
 	}
 
-	.tab-content, x-content {
+	x-content {
 		overflow-y: hidden;
 		display: flex;
 		flex-direction: column;
 	}
 
 	.container-songs {
+		width: 100%;
 		display: flex;
 		flex-direction: column;
 		padding: 5px;

shared/css/static/modals.scss

@@ -14,6 +14,8 @@ body {
 modal-body {
 	display: flex;
 	flex-direction: column;
+
+	min-height: 10px;
 }
 
 .modal {
@@ -64,6 +66,7 @@ modal-body {
 
 	.modal-content {
 		/* max-height: 500px; */
+		min-height: 0; /* required for moz */
 		flex-direction: column;
 		justify-content: stretch;
 
@@ -90,6 +93,7 @@ modal-body {
 			flex-shrink: 1;
 			display: flex;
 			flex-direction: column;
+			min-height: 0;
 
 			input.is-invalid {
 				background-image: linear-gradient(0deg, #d50000 2px, rgba(213, 0, 0, 0) 0), linear-gradient(0deg, rgba(241, 1, 1, 0.61) 1px, transparent 0);

shared/css/static/ts/tab.scss

@@ -6,6 +6,8 @@ x-tab { display:none }
     flex-direction: column;
 	display: flex;
 	flex-grow: 1;
+
+    min-height: 220px; /* min the header */
 }
 
 .tab div * {
@@ -25,9 +27,17 @@ x-tab { display:none }
 	flex-grow: 1;
 
     x-content {
+        min-height: 0;
         overflow-y: auto;
+
         width: 100%;
     }
+
+    @-moz-document url-prefix() {
+        x-content {
+            height: 100%;
+        }
+    }
 }
 
 /*

shared/html/templates.html

@@ -1779,7 +1779,7 @@
                             <!-- <small class="form-text text-muted">{{tr "Filter permissions by permission name" /}}</small> -->
                         </div>
                         <div class="form-group bmd-form-group">
-                            <div class="checkbox">
+                            <div class="switch">
                                 <label>
                                     <input type="checkbox" value="" class="filter-granted">
                                     {{tr "Show granted permissions only" /}}

vendor/bbcode

@@ -1 +1 @@
-Subproject commit 5773a1301b6c4b218496da5d04b4dfc2e25a4fa9
+Subproject commit 454f0a8069fd842ff967b0a7f127f2d89e97f2be