1 files changed, 72 insertions, 0 deletions
diff --git a/www/wiki/extensions/MultimediaViewer/resources/mmv/ui/mmv.ui.reuse.dialog.less b/www/wiki/extensions/MultimediaViewer/resources/mmv/ui/mmv.ui.reuse.dialog.less
new file mode 100644
index 00000000..976a2903
--- /dev/null
+++ b/www/wiki/extensions/MultimediaViewer/resources/mmv/ui/mmv.ui.reuse.dialog.less
@@ -0,0 +1,72 @@
+@import '../mmv.mixins';
+@import '../mmv.globals';
+
+.mw-mmv-reuse-dialog {
+	@divider-border-height: 1px;
+
+	// resetting height (to overwrite .mw-mmv-dialog's bigger height), since the
+	// height may have to change for warnings being added
+	height: initial;
+	// set a standard min-height that should be larger than both panels in
+	// normal circumstances (without warnings) so that the height of the dialog
+	// doesn't change when switching tabs
+	min-height: 300px;
+	// positioned relative to the reuse button
+	bottom: @metadatabar-above-fold-height + @progress-bar-height - 5px;
+
+	.mw-mmv-reuse-tabs {
+		@divider-color: #c8ccd1;
+
+		position: static;
+		box-shadow: none;
+		padding-bottom: 0; // OOUI override
+		border: 0; // OOUI override
+		border-bottom: @divider-border-height solid @divider-color;
+		border-radius: @border-radius @border-radius 0 0;
+
+		.oo-ui-iconedElement-icon.oo-ui-icon-check,
+		.oo-ui-iconElement-icon.oo-ui-icon-check {
+			display: none;
+		}
+
+		.oo-ui-optionWidget {
+			@tab-border-height: 3px;
+			@highlighted-tab-color: #e1f3ff;
+			@selected-tab-color: #2a4b8d;
+
+			display: inline-block;
+			padding: 10px 25px;
+			font-size: 1.2em;
+
+			&.oo-ui-optionWidget-highlighted {
+				border-bottom: ( @tab-border-height - @divider-border-height ) solid @highlighted-tab-color;
+			}
+
+			&.oo-ui-optionWidget-selected,
+			&.oo-ui-optionWidget-highlighted.oo-ui-optionWidget-selected {
+				border-bottom: @tab-border-height solid @selected-tab-color;
+			}
+
+			&:first-child {
+				border-radius: @border-radius 0 0 0;
+			}
+		}
+	}
+
+	.mw-mmv-reuse-pane {
+		display: none;
+		padding: 20px;
+
+		&.active {
+			display: block;
+		}
+	}
+
+	.mw-mmv-dialog-down-arrow {
+		bottom: @metadatabar-above-fold-height + @progress-bar-height + 5px;
+	}
+
+	.mw-mmv-dialog-warning {
+		padding: 15px 30px;
+	}
+}