From 7a2e19553f57e9d7792adf0e4d3913a00ffca30e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Daniel=20Calvi=C3=B1o=20S=C3=A1nchez?= <danxuliu@gmail.com>
Date: Mon, 26 Aug 2019 00:08:48 +0200
Subject: Move password from its own menu to the room moderation menu
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The password input is no longer the only element of the menu so pressing
"Esc" does not close the menu.

There is no longer a password button in the CallInfoView, so now the
acceptance tests need to open the room moderation menu to know if the
conversation is password protected or not.

Signed-off-by: Daniel Calviño Sánchez <danxuliu@gmail.com>
---
 css/style.scss | 75 ++++++++++++++++++++++++++++++++++++++++------------------
 1 file changed, 52 insertions(+), 23 deletions(-)

(limited to 'css')

diff --git a/css/style.scss b/css/style.scss
index 493f12761..7533e8a98 100644
--- a/css/style.scss
+++ b/css/style.scss
@@ -999,30 +999,59 @@ body:not(#body-public) .participantWithList > li > span:not(.currentUser):not(.g
 	.share-link-options {
 		display: flex;
 		align-items: center;
-		.password-button {
-			position: relative;
+	}
+
+	.room-moderation-button .menu {
+		/* Values copied from apps.scss in server. */
+		$popoveritem-height: 44px;
+		$popovericon-size: 16px;
+		$outter-margin: ($popoveritem-height - $popovericon-size) / 2;
+
+		/* The server sets a top/bottom margin to forms and inputs of the
+		 * first/last item in a menu, but that misaligns the left icon; this
+		 * sets the top/bottom margin to the whole item instead of only to the
+		 * forms or inputs. */
+		li:first-of-type {
+			> .menuitem.password-option {
+
+				margin-top: $outter-margin - 2px; // minus the input margin
+
+				> form, > input {
+					margin-top: 0;
+				}
+			}
+		}
+		li:last-of-type {
+			> .menuitem.password-option {
+
+				margin-bottom: $outter-margin - 2px; // minus the input margin
+
+				> form, > input {
+					margin-bottom: 0;
+				}
+			}
+		}
+
+		.menuitem.password-option {
+			/* Override rule for menu items from server, as in this case
+			 * only the button in the password field is clickable, so the
+			 * pointer cursor should not be used for the whole item. */
+			cursor: default;
+
+			.password-form {
+				position: relative;
+
+				.password-confirm,
+				.password-loading {
+					/* Inputs in menu items do not have a right margin, so
+					 * it does not need to be compensated. */
+					right: 0;
+				}
 
-			.menuitem {
-				/* Override rule for menu items from server, as in this case
-				 * only the button in the password field is clickable, so the
-				 * pointer cursor should not be used for the whole item. */
-				cursor: default;
-
-				.password-form {
-					position: relative;
-
-					.password-confirm,
-					.password-loading {
-						/* Inputs in menu items do not have a right margin, so
-						 * it does not need to be compensated. */
-						right: 0;
-					}
-
-					.password-confirm {
-						/* Needed to override an important rule set in the
-						 * server. */
-						background-color: transparent !important;
-					}
+				.password-confirm {
+					/* Needed to override an important rule set in the
+					 * server. */
+					background-color: transparent !important;
 				}
 			}
 		}
-- 
cgit v1.2.3