Merge pull request #19121 from owncloud/sidebar-design-details

fix Files sidebar layout of Versions and Sharing

apps/files_sharing/css/sharetabview.css

@@ -12,11 +12,10 @@
 }
 
 .shareTabView .shareWithRemoteInfo {
-	padding: 11px 0 11px 10px
+	padding: 11px 20px;
 }
 
 .shareTabView label {
-	font-weight:400;
 	white-space: nowrap;
 }
 
@@ -25,9 +24,13 @@
 	vertical-align: middle;
 }
 
-.shareTabView input[type="text"], .shareTabView input[type="password"] {
-	width: 91%;
-	margin-left: 7px;
+.shareTabView input[type="text"],
+.shareTabView input[type="password"] {
+	width: 94%;
+	margin-left: 0;
+}
+.shareTabView #shareWith {
+	width: 80%;
 }
 
 .shareTabView form {
@@ -38,14 +41,13 @@
 
 #shareWithList {
 	list-style-type: none;
-	padding:8px;
+	padding: 0 0 16px;
 }
 
 #shareWithList li {
-	padding-top: 10px;
-	padding-bottom: 10px;
+	padding-top: 5px;
+	padding-bottom: 5px;
 	font-weight: bold;
-	line-height: 21px;
 	white-space: normal;
 }
 

apps/files_versions/css/versions.css

@@ -13,9 +13,7 @@
 }
 
 .versionsTabView li > * {
-	padding: 7px;
-	float: left;
-	vertical-align: top;
+	vertical-align: middle;
 	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
 	filter: alpha(opacity=50);
 	opacity: .5;
@@ -23,7 +21,7 @@
 
 .versionsTabView li > a,
 .versionsTabView li > span {
-	padding: 17px 7px;
+	padding: 15px 10px 11px;
 }
 
 .versionsTabView li > *:hover,
@@ -43,16 +41,13 @@
 	opacity: 1;
 }
 
-.versionsTabView .versionDate {
+.versionsTabView .versiondate {
 	min-width: 100px;
-	vertical-align: text-bottom;
+	vertical-align: super;
 }
 
 .versionsTabView .revertVersion {
 	cursor: pointer;
 	float: right;
-	max-width: 130px;
-	text-overflow: ellipsis;
-	overflow: hidden;
+	margin-right: -10px;
 }
-

apps/files_versions/js/versionstabview.js

@@ -15,7 +15,7 @@
 		'<a href="{{downloadUrl}}" class="downloadVersion"><img src="{{downloadIconUrl}}" />' +
 		'<span class="versiondate has-tooltip" title="{{formattedTimestamp}}">{{relativeTimestamp}}</span>' +
 		'</a>' +
-		'<a href="#" class="revertVersion"><img src="{{revertIconUrl}}" />{{revertLabel}}</a>' +
+		'<a href="#" class="revertVersion" title="{{revertLabel}}"><img src="{{revertIconUrl}}" /></a>' +
 		'</li>';
 
 	var TEMPLATE =
@@ -195,4 +195,3 @@
 
 	OCA.Versions.VersionsTabView = VersionsTabView;
 })();
-

core/css/share.css

@@ -41,10 +41,6 @@
 	display: none !important;
 }
 
-.shareTabView .shareWithRemoteInfo {
-	padding: 11px 20px;
-}
-
 .shareTabView .avatar {
 	margin-right: 8px;
 	display: inline-block;
@@ -106,8 +102,9 @@ a.unshare {
 	display:inline;
 	float:right;
 	opacity:.5;
-	padding:5px 0 0 5px !important;
+	padding: 10px;
 	margin-top: -5px;
+	margin-right: -10px;
 }
 
 #link {
@@ -115,17 +112,10 @@ a.unshare {
 	padding-top:8px;
 }
 
-.shareTabView input[type="text"],
-.shareTabView input[type="password"],
 .shareTabView input[type="submit"] {
 	margin-left: 7px;
 }
 
-.shareTabView input[type="text"],
-.shareTabView input[type="password"] {
-	width: 86%;
-}
-
 .shareTabView form {
 	font-size: 100%;
 	margin-left: 0;