SAK-32458 Signup tool not responsive (sakaiproject#4410)

DaweiXia · May 12, 2017 · 15faa94 · 15faa94
1 parent b14f50f
commit 15faa94
Show file tree

Hide file tree

Showing 6 changed files with 876 additions and 540 deletions.
diff --git a/library/src/morpheus-master/sass/modules/tool/signup/_signup.scss b/library/src/morpheus-master/sass/modules/tool/signup/_signup.scss
@@ -79,7 +79,6 @@
 
 	#userdef-add{
 		position:relative;
-		top: -40px;
 	}
 
 	.calendarImageIcon{

diff --git a/signup/tool/src/webapp/css/signupStyle.css b/signup/tool/src/webapp/css/signupStyle.css
@@ -45,11 +45,30 @@ table.userDefineTsTable th {
 }
 
 .titleColumn {
-	vertical-align: top;
 	text-align: right;
 	font-weight: bold;
 	padding: 0.2em 1em;
-	white-space: nowrap;
+}
+
+#meeting .form, #meetingInfoDetails, #showMeetingTitleOnly {
+	padding: 1px;
+}
+
+@media (max-width: 991px) {
+	#meeting .form .titleColumn {
+		text-align: left;
+		margin-top: 10px;
+	}
+	#meetingInfoDetails .titleColumn, #showMeetingTitleOnly .titleColumn {
+		text-align: left;
+		margin-top: 5px;
+	}
+	#meeting .form .valueColumn {
+		margin-bottom: 10px;
+	}
+	#meetingInfoDetails .valueColumn, #showMeetingTitleOnly .valueColumn {
+		margin-bottom: 5px;
+	}
 }
 
 .plainTitleColumn {
@@ -233,7 +252,7 @@ table.organizer td {
 .mi {
 	vertical-align: top;
 	margin-left: 30px;	
-	width: 350px;
+	max-width: 650px;
 }
 
 .greyed_mi{
@@ -244,18 +263,14 @@ table.organizer td {
 	color:#A3A3A3;
 }
 
-.longtext_red{
-	color:#b11;
-}
-
 .greyed_mi input, .greyed_si label, .greyed_mi longtext_red{
 	color:#A3A3A3;
 }
 
 .si {
 	vertical-align: top;
 	margin-left: 30px;	
-	width: 350px;
+	max-width: 650px;
 }
 
 .greyed_si{
@@ -318,6 +333,14 @@ table.organizer td {
 	color: #e7eef5;
 }
 
+#multiple.mi .row, #single.si .row {
+	margin-top: 5px;
+}
+
+#multiple.mi .row:first-of-type, #single.si .row:first-of-type {
+	margin-top: 0;
+}
+
 .displaySites {
 	background: #c12;
 	background-color: #c12;
@@ -360,6 +383,8 @@ table.sitegroup td {
 .published_sitetitle {
 	margin: 10px 0px;
 	line-height: 100%;
+	word-wrap: break-word;
+	white-space: normal;
 }
 
 table.published_sitegroup td {
@@ -407,10 +432,6 @@ table.instruction td.desc{
 	padding: 3px 3px 3px 25px;
 }
 
-.noMeetingsWarn {
-	margin-left: 2em;
-}
-
 .organizerToplevelTable {
 	width: 100%;
 }
@@ -504,4 +525,12 @@ table.emailTable td.valueColumn {
 .dateExact {
 	color: #888;
 	margin-left: 10px;
-}
+}
+@media (max-width: 991px) {
+	.form-group label {
+		margin-top: 10px;
+	}
+	.form-group label:first-of-type {
+		margin-top: 0;
+	}
+}