updated incoming share modal to new style and fixed bugs regarding dialogs

Signed-off-by: fnuesse <felix.nuesse@t-online.de>

7 files changed, 77 insertions, 22 deletions

diff --git a/js/app/controllers/credential.js b/js/app/controllers/credential.js
index 0dc3f4b1..037bfd02 100644
--- a/js/app/controllers/credential.js
+++ b/js/app/controllers/credential.js
@@ -127,8 +127,9 @@
 						if (shareRequests.length > 0) {
 							$scope.incoming_share_requests = shareRequests;
 							jQuery('.share_popup').dialog({
-								width: 600,
-								position: ['center', 90]
+								width: 800,
+								modal: true,
+								dialogClass: 'shareincoming-dialog'
 							});
 						}
 					});
diff --git a/js/app/directives/iconpicker.js b/js/app/directives/iconpicker.js
index dda10fdb..2cc60594 100644
--- a/js/app/directives/iconpicker.js
+++ b/js/app/directives/iconpicker.js
@@ -152,6 +152,7 @@
             $('#iconPicker').dialog({
               width: 800,
               height: 380,
+			  modal: true,
               dialogClass: 'iconpicker-dialog',
               close: function() {
                 $(this).dialog('destroy');
diff --git a/sass/app.scss b/sass/app.scss
index ceb83803..6b24e663 100644
--- a/sass/app.scss
+++ b/sass/app.scss
@@ -27,6 +27,7 @@
 @import 'partials/tabs';
 @import 'partials/pwgen';
 @import 'partials/icon-picker';
+@import 'partials/share-incoming';
 @import 'vaults';
 @import 'credentials';
 @import 'menu';
diff --git a/sass/partials/icon-picker.scss b/sass/partials/icon-picker.scss
index f7c46042..ad5ad2d2 100644
--- a/sass/partials/icon-picker.scss
+++ b/sass/partials/icon-picker.scss
@@ -20,7 +20,7 @@
  */
 
 .iconpicker-dialog{
-  border-radius: var(--border-radius-large);
+  border-radius: var(--border-radius-large) !important;
   box-shadow: 0 0 30px var(--color-box-shadow);
   .ui-dialog{
     border-radius: var(--border-radius-large);
@@ -45,6 +45,9 @@
   .ui-state-default {background: white !important;}
   .ui-button {background: white !important;}
 
+
+  //This moves the modal from tbe background to the foreground so that it is actually visible
+  z-index: 9999 !important;
 }
 
 #iconPicker {
@@ -90,9 +93,4 @@
   .content_show {
     display: block;
   }
-
-}
-//This moves the modal from tbe background to the foreground so that it is actually visible
-.ui-front{
-  z-index: 9999 !important;
 }
\ No newline at end of file
diff --git a/sass/partials/share-incoming.scss b/sass/partials/share-incoming.scss
new file mode 100644
index 00000000..9625d2f1
--- /dev/null
+++ b/sass/partials/share-incoming.scss
@@ -0,0 +1,57 @@
+/**
+ * Nextcloud - passman
+ *
+ * @copyright Copyright (c) 2019, Felix Nüsse (felix.nuesse@t-online.de)
+ * @license GNU AGPL version 3 or any later version
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as
+ * published by the Free Software Foundation, either version 3 of the
+ * License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ *
+ */
+
+.shareincoming-dialog{
+  border-radius: var(--border-radius-large) !important;
+  box-shadow: 0 0 30px var(--color-box-shadow);
+
+  .ui-dialog{
+    border-radius: var(--border-radius-large);
+    box-shadow: 0 0 30px var(--color-box-shadow);
+  }
+  .ui-widget-header {
+    background: none !important;
+  }
+
+  .ui-icon-closethick {
+    background-position: inherit;
+  }
+
+  .ui-button .ui-icon {
+    background-image: var(--icon-close-000);
+  }
+
+  .ui-button:hover .ui-icon {
+    background-image: var(--icon-close-000);
+    cursor: pointer !important;
+  }
+
+  .ui-button-icon {border: none !important;}
+  .ui-icon {border: none !important;}
+  .ui-icon-closethick {border: none !important;}
+  .ui-corner-all {border: none !important;}
+  .ui-state-default {background: white !important;}
+  .ui-button {background: white !important;}
+
+
+  //This moves the modal from tbe background to the foreground so that it is actually visible
+  z-index: 9999 !important;
+}
diff --git a/sass/searchboxexpander.scss b/sass/searchboxexpander.scss
index aeab2506..5de24cae 100644
--- a/sass/searchboxexpander.scss
+++ b/sass/searchboxexpander.scss
@@ -41,6 +41,10 @@
     background: none;
   }
 
+  //This moves the modal from tbe background to the foreground so that it is actually visible
+  z-index: 9999 !important;
+
+
   //closebutton top right
   .ui-icon-closethick {
     background-position: inherit;
@@ -69,8 +73,3 @@
   }
   //bottom line end
 }
-
-//This moves the modal from tbe background to the foreground so that it is actually visible
-.ui-front{
-  z-index: 9999 !important;
-}
\ No newline at end of file
diff --git a/templates/views/show_vault.html b/templates/views/show_vault.html
index 016d81c5..c80ff9f9 100644
--- a/templates/views/show_vault.html
+++ b/templates/views/show_vault.html
@@ -195,17 +195,15 @@
     </div>
 </div>
 
-<div class="share_popup" style="display: none">
-	{{ 'sharereq.title' | translate}}<br/>
-	<p>{{ 'sharereq.line1' | translate}}</p>
-	{{active_vault.vault_id}}
+<div class="share_popup" style="display: none" title="{{ 'sharereq.title' | translate }}">
+	<p>{{ 'sharereq.line1' | translate}}</p>{{active_vault.vault_id}}
 	<table class="table">
 		<thead>
 		<tr>
-			<td>{{ 'label' | translate}}</td>
-			<td>{{ 'permissions' | translate}}</td>
-			<td>{{ 'received.from' | translate}}</td>
-			<td>{{ 'date' | translate}}</td>
+			<td><b>{{ 'label' | translate}}</b></td>
+			<td><b>{{ 'permissions' | translate}}</b></td>
+			<td><b>{{ 'received.from' | translate}}</b></td>
+			<td><b>{{ 'date' | translate}}</b></td>
 		</tr>
 		</thead>
 		<tr ng-repeat="share_request in incoming_share_requests"
@@ -223,7 +221,7 @@
 				{{share_request.created * 1000 | date:'dd-MM-yyyy @	HH:mm:ss'}}
 			</td>
 			<td>
-				<span class="link" ng-click="acceptShareRequest(share_request)">{{ 'accept' | translate}}</span>
+				<span class="link" ng-click="acceptShareRequest(share_request)"><b>{{ 'accept' | translate}}</b></span>
 				| <span class="link" ng-click="declineShareRequest(share_request)">{{ 'decline' | translate}}</span>
 			</td>
 		</tr>