Merge pull request #8820 from owncloud/design-details

Design details

apps/files/css/files.css

@@ -116,6 +116,12 @@
 	width: 230px;
 }
 
+/* move Deleted Files to bottom of sidebar */
+.nav-trashbin {
+	position: absolute !important;
+	bottom: 0;
+}
+
 .app-files #app-settings {
 	width: 229px; /* DUH */
 }
@@ -155,8 +161,9 @@ tr:hover span.extension {
 	color: #777;
 }
 
-table tr.mouseOver td { background-color:#eee; }
+table tr.mouseOver td {
-table th { height:24px; padding:0 8px; }
+	background-color: #eee;
+}
 table th, table th a {
 	color: #999;
 }
@@ -179,7 +186,7 @@ table th .columntitle.name {
 }
 /* hover effect on sortable column */
 table th a.columntitle:hover {
-	background-color: #F0F0F0;
+	color: #000;
 }
 table th .sort-indicator {
 	width: 10px;
@@ -266,7 +273,7 @@ table td.filename .nametext, .uploadtext, .modified { float:left; padding:14px 0
 
 .modified {
 	position: relative;
-	padding-left: 8px;
+	padding-left: 15px;
 	overflow: hidden;
 	text-overflow: ellipsis;
 	width: 90%;

apps/files_external/css/settings.css

@@ -20,3 +20,8 @@ tr:hover>td.remove>img { visibility:visible; cursor:pointer; }
 	position: relative;
 	top: 3px;
 }
+
+
+#externalStorage td.status .success {
+	border-radius: 50%;
+}

core/css/apps.css

@@ -19,6 +19,7 @@
 	padding-bottom: 44px;
 }
 #app-navigation > ul {
+	position: relative;
 	height: 100%;
 	overflow: auto;
 	-moz-box-sizing: border-box; box-sizing: border-box;

core/css/fixes.css

@@ -7,7 +7,7 @@
 
 /* fix height of select boxes for OS X */
 select {
-	min-height: 29px;
+	height: 32px;
 }
 
 .lte8 .delete-icon { background-image: url('../img/actions/delete.png'); }

core/css/mobile.css

@@ -111,11 +111,14 @@
 
 
 
-/* shift to account for missing navigation */
+/* shift to account for missing app list */
 #body-user #controls,
 #body-settings #controls {
 	padding-left: 0;
 }
+#body-user .app-files #controls {
+	left: 230px !important; /* sidebar only */
+}
 
 /* don’t require a minimum width for controls bar */
 #controls {

core/js/js.js

@@ -183,7 +183,8 @@ var OC={
 	appConfig: window.oc_appconfig || {},
 	theme: window.oc_defaults || {},
 	coreApps:['', 'admin','log','search','settings','core','3rdparty'],
-	
+	menuSpeed: 100,
+
 	/**
 	 * Get an absolute url to a file in an app
 	 * @param {string} app the id of the app the file belongs to
@@ -531,7 +532,7 @@ var OC={
 		$toggle.addClass('menutoggle');
 		$toggle.on('click.menu', function(event) {
 			if ($menuEl.is(OC._currentMenu)) {
-				$menuEl.hide();
+				$menuEl.slideUp(OC.menuSpeed);
 				OC._currentMenu = null;
 				OC._currentMenuToggle = null;
 				return false;
@@ -541,7 +542,7 @@ var OC={
 				// close it
 				OC._currentMenu.hide();
 			}
-			$menuEl.show();
+			$menuEl.slideToggle(OC.menuSpeed);
 			OC._currentMenu = $menuEl;
 			OC._currentMenuToggle = $toggle;
 			return false;
@@ -554,7 +555,7 @@ var OC={
 	unregisterMenu: function($toggle, $menuEl) {
 		// close menu if opened
 		if ($menuEl.is(OC._currentMenu)) {
-			$menuEl.hide();
+			$menuEl.slideUp(OC.menuSpeed);
 			OC._currentMenu = null;
 			OC._currentMenuToggle = null;
 		}
@@ -1068,7 +1069,7 @@ function initCore() {
 		}
 	});
 	$('#settings #expand').click(function(event) {
-		$('#settings #expanddiv').slideToggle(200);
+		$('#settings #expanddiv').slideToggle(OC.menuSpeed);
 		event.stopPropagation();
 	});
 	$('#settings #expanddiv').click(function(event){
@@ -1076,7 +1077,7 @@ function initCore() {
 	});
 	//hide the user menu when clicking outside it
 	$(document).click(function(){
-		$('#settings #expanddiv').slideUp(200);
+		$('#settings #expanddiv').slideUp(OC.menuSpeed);
 	});
 
 	// all the tipsy stuff needs to be here (in reverse order) to work
@@ -1097,7 +1098,7 @@ function initCore() {
 			return false;
 		}
 		if (OC._currentMenu) {
-			OC._currentMenu.hide();
+			OC._currentMenu.slideUp(OC.menuSpeed);
 		}
 		OC._currentMenu = null;
 		OC._currentMenuToggle = null;

core/js/tests/specs/coreSpec.js

@@ -359,8 +359,10 @@ describe('Core base tests', function() {
 		var oldMatchMedia;
 		var $toggle;
 		var $navigation;
+		var clock;
 
 		beforeEach(function() {
+			clock = sinon.useFakeTimers();
 			oldMatchMedia = OC._matchMedia;
 			// a separate method was needed because window.matchMedia
 			// cannot be stubbed due to a bug in PhantomJS:
@@ -376,6 +378,7 @@ describe('Core base tests', function() {
 
 		afterEach(function() {
 			OC._matchMedia = oldMatchMedia;
+			clock.restore();
 		});
 		it('Sets up menu toggle in mobile mode', function() {
 			OC._matchMedia.returns({matches: true});
@@ -413,8 +416,10 @@ describe('Core base tests', function() {
 			$navigation.hide(); // normally done through media query triggered CSS
 			expect($navigation.is(':visible')).toEqual(false);
 			$toggle.click();
+			clock.tick(1 * 1000);
 			expect($navigation.is(':visible')).toEqual(true);
 			$toggle.click();
+			clock.tick(1 * 1000);
 			expect($navigation.is(':visible')).toEqual(false);
 		});
 		it('Clicking menu toggle does not toggle navigation in desktop mode', function() {
@@ -448,6 +453,7 @@ describe('Core base tests', function() {
 			window.initCore();
 			expect($navigation.is(':visible')).toEqual(false);
 			$toggle.click();
+			clock.tick(1 * 1000);
 			expect($navigation.is(':visible')).toEqual(true);
 			mq.matches = false;
 			$(window).trigger('resize');
@@ -456,6 +462,7 @@ describe('Core base tests', function() {
 			$(window).trigger('resize');
 			expect($navigation.is(':visible')).toEqual(false);
 			$toggle.click();
+			clock.tick(1 * 1000);
 			expect($navigation.is(':visible')).toEqual(true);
 		});
 	});

settings/css/settings.css

@@ -158,6 +158,10 @@ table.shareAPI .indent { padding-left: 2em; }
 	vertical-align: text-bottom;
 }
 
+.cronstatus.success {
+	border-radius: 50%;
+}
+
 #selectGroups select {
 	-moz-box-sizing: border-box;
 	-webkit-box-sizing: border-box;