fit newFileMenu to css guidelines

Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>
nextcloud · Jan 17, 2017 · e5cfd7b · e5cfd7b
1 parent b1a8296
commit e5cfd7b
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 39 deletions.
diff --git a/apps/files/css/files.css b/apps/files/css/files.css
@@ -768,36 +768,9 @@ html.ie8 #controls .button.new {
 }
 
 .newFileMenu {
-	width: 200px;
-	margin-left: -56px;
-	margin-top: 25px;
-	z-index: 1001;
-}
-
-.newFileMenu .menuitem {
-	white-space: nowrap;
-	overflow: hidden;
-}
-.newFileMenu.popovermenu a.menuitem,
-.newFileMenu.popovermenu label.menuitem,
-.newFileMenu.popovermenu .menuitem {
-	padding: 0;
-	margin: 0;
-}
-
-.newFileMenu.popovermenu a.menuitem.active {
-	opacity: 1;
-	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
-	filter: alpha(opacity=100);
-}
-
-.newFileMenu.bubble:after {
-	left: 75px;
-	right: auto;
-}
-.newFileMenu.bubble:before {
-	left: 75px;
-	right: auto;
+	font-weight: 300;
+	top: 100%;
+	margin-top: 4px;
 }
 
 .newFileMenu .filenameform {
@@ -835,6 +808,9 @@ html.ie8 #controls .button.new {
 	height: 15px;
 }
 
+.app-files .actions .button.new {
+	position: relative;
+}
 .app-files .actions .button.new .icon {
 	margin-bottom: 2px;
 }

diff --git a/apps/files/js/filelist.js b/apps/files/js/filelist.js
@@ -2943,7 +2943,7 @@
 				this._newFileMenu = new OCA.Files.NewFileMenu({
 					fileList: this
 				});
-				$('body').append(this._newFileMenu.$el);
+				this._newButton.append(this._newFileMenu.$el);
 			}
 			this._newFileMenu.showAt($target);
 

diff --git a/apps/files/js/newfilemenu.js b/apps/files/js/newfilemenu.js
@@ -38,7 +38,8 @@
 	 */
 	var NewFileMenu = OC.Backbone.View.extend({
 		tagName: 'div',
-		className: 'newFileMenu popovermenu bubble hidden open menu',
+		// Menu is opened by default because it's rendered on "add-button" click
+		className: 'newFileMenu popovermenu bubble menu open menu-center',
 
 		events: {
 			'click .menuitem': '_onClickAction'
@@ -235,13 +236,6 @@
 		 */
 		showAt: function($target) {
 			this.render();
-			var targetOffset = $target.offset();
-			this.$el.css({
-				left: targetOffset.left,
-				top: targetOffset.top + $target.height()
-			});
-			this.$el.removeClass('hidden');
-
 			OC.showMenu(null, this.$el);
 		}
 	});