Merge pull request nextcloud#6372 from nextcloud/scss-normalization

Scss normalization
wiprich · Sep 25, 2017 · 9080976 · 9080976
2 parents 3bd4e7e + ab1c34c
commit 9080976
Show file tree

Hide file tree

Showing 20 changed files with 1,342 additions and 1,466 deletions.
diff --git a/apps/files/css/detailsView.scss b/apps/files/css/detailsView.scss
@@ -122,7 +122,6 @@
 	top: 0;
 	right: 0;
 	padding: 15px;
-	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
 	opacity: .5;
 	z-index: 1;
 }
diff --git a/apps/files/css/files.scss b/apps/files/css/files.scss
@@ -32,8 +32,8 @@
 }
 
 .newFileMenu .error, #fileList .error {
-	color: #e9322d;
-	border-color: #e9322d;
+	color: $color-error;
+	border-color: $color-error;
 	-webkit-box-shadow: 0 0 6px #f8b9b7;
 	-moz-box-shadow: 0 0 6px #f8b9b7;
 	box-shadow: 0 0 6px #f8b9b7;
@@ -58,7 +58,6 @@
 }
 
 #filestable tbody tr {
-	background-color: #fff;
 	height: 51px;
 }
 
@@ -134,7 +133,6 @@
 
 #filestable tbody tr {
 	transition: background-color 0.3s ease;
-	background-color: #fff;
 	height: 40px;
 }
 #filestable tbody tr:hover,
@@ -147,16 +145,14 @@
 #filestable tbody tr.searchresult,
 table tr.mouseOver td {
 	transition: background-color 0.3s ease;
-	background-color: #f8f8f8;
+	background-color: nc-darken($color-main-background, 3%);
 }
-tbody a { color:#000; }
+tbody a { color: $color-main-text; }
 
 span.conflict-path, span.extension, span.uploading, td.date {
 	color: #999;
 }
 span.conflict-path, span.extension {
-	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
-	filter: alpha(opacity=70);
 	opacity: .7;
 	-webkit-transition: opacity 300ms;
 	-moz-transition: opacity 300ms;
@@ -168,8 +164,6 @@ tr:hover span.conflict-path,
 tr:focus span.conflict-path,
 tr:hover span.extension,
 tr:focus span.extension {
-	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
-	filter: alpha(opacity=100);
 	opacity: 1;
 	color: #777;
 }
@@ -200,8 +194,6 @@ table th .sort-indicator {
 	margin-left: 5px;
 	display: inline-block;
 	vertical-align: text-bottom;
-	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
-	filter: alpha(opacity=30);
 	opacity: .3;
 }
 .sort-indicator.hidden,
@@ -220,7 +212,7 @@ table th:focus .sort-indicator.hidden {
 
 table th,
 table td {
-	border-bottom: 1px solid #eee;
+	border-bottom: 1px solid $color-border;
 	text-align: left;
 	font-weight: normal;
 }
@@ -270,9 +262,6 @@ table.multiselect thead {
 	left: 250px; /* sidebar */
 }
 
-table thead th {
-	background-color: #fff;
-}
 table.multiselect thead th {
 	background-color: rgba(255, 255, 255, 0.95); /* like controls bar */
 	color: #000;
@@ -307,11 +296,19 @@ table td.filename a.name {
 	line-height: 50px;
 	padding: 0;
 }
+table td.filename label.icon-loading-small {
+	&:after {
+		z-index: 10;
+	}
+	.thumbnail {
+		opacity: 0.2;
+	}
+}
 table td.filename .thumbnail {
 	display: inline-block;
 	width: 32px;
 	height: 32px;
-	margin-left: 8px;
+	margin-left: 9px;
 	margin-top: 9px;
 	cursor: pointer;
 	float: left;
@@ -439,8 +436,6 @@ table td.filename .uploadtext {
 	height: 20px;
 	padding: 10px 0;
 	font-size: 11px;
-	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
-	filter: alpha(opacity=50);
 	opacity: .5;
 }
 
@@ -536,8 +531,6 @@ table td.filename .uploadtext {
 
 /* force show the loading icon, not only on hover */
 #fileList .icon-loading-small {
-	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
-	filter:alpha(opacity=100);
 	opacity: 1 !important;
 	display: inline !important;
 }
@@ -580,8 +573,6 @@ a.action > img {
 	display: inline;
 	padding: 17px 8px;
 	line-height: 50px;
-	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
-	filter: alpha(opacity=0);
 	opacity: 0;
 }
 #fileList a.action.action-share {
@@ -602,8 +593,6 @@ a.action > img {
 #fileList a.action.disabled:hover,
 #fileList a.action.disabled:focus,
 #fileList a.action.disabled img {
-	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
-	filter: alpha(opacity=30);
 	opacity: .3;
 }
 
@@ -615,8 +604,6 @@ a.action > img {
 #fileList .fileActionsMenu a.action,
 /* show share action of shared items darker to distinguish from non-shared */
 #fileList a.action.action-share.shared-style {
-	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
-	filter: alpha(opacity=70);
 	opacity: .7;
 }
 
@@ -631,8 +618,6 @@ a.action > img {
 }
 
 #fileList .action.action-favorite.permanent {
-	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
-	filter: alpha(opacity=100);
 	opacity: 1;
 }
 
@@ -641,8 +626,6 @@ a.action > img {
 /* show share action of shared items darker to distinguish from non-shared */
 #fileList a.action.action-share.shared-style:hover,
 #fileList a.action.action-share.shared-style:focus {
-	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
-	filter: alpha(opacity=100);
 	opacity: 1;
 }
 
@@ -660,8 +643,6 @@ a.action > img {
 }
 
 .summary {
-	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
-	filter: alpha(opacity=30);
 	opacity: .3;
 	/* add whitespace to bottom of files list to correctly show dropdowns */
 	height: 300px;
@@ -702,11 +683,10 @@ table.dragshadow td.size {
 	left: 0;
 	right: 0;
 	bottom: 0;
-	background-color: #fff;
+	background-color: $color-main-background;
 	background-repeat: no-repeat no-repeat;
 	background-position: 50%;
 	opacity: 0.7;
-	filter: alpha(opacity=70);
 	transition: opacity 100ms;
 	-moz-transition: opacity 100ms;
 	-o-transition: opacity 100ms;
@@ -734,10 +714,6 @@ table.dragshadow td.size {
 	margin: 2px 0;
 }
 
-#fileList .popovermenu .action {
-	color: #000;
-}
-
 #filestable .filename .action .icon,
 #filestable .selectedActions a .icon,
 #controls .actions .button .icon {

diff --git a/apps/files/css/mobile.scss b/apps/files/css/mobile.scss
@@ -51,11 +51,9 @@ table td.filename .nametext {
 	display: none !important;
 }
 #fileList a.action.action-favorite {
-	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)" !important;
 	opacity: .7 !important;
 }
 #fileList a.action.action-favorite {
-	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)" !important;
 	opacity: .3 !important;
 }
 

diff --git a/apps/files/js/filelist.js b/apps/files/js/filelist.js
@@ -2540,11 +2540,9 @@
 				$tr.toggleClass('busy', state);
 
 				if (state) {
-					$thumbEl.attr('data-oldimage', $thumbEl.css('background-image'));
-					$thumbEl.css('background-image', 'url('+ OC.imagePath('core', 'loading.gif') + ')');
+					$thumbEl.parent().addClass('icon-loading-small');
 				} else {
-					$thumbEl.css('background-image', $thumbEl.attr('data-oldimage'));
-					$thumbEl.removeAttr('data-oldimage');
+					$thumbEl.parent().removeClass('icon-loading-small');
 				}
 			});
 		},

diff --git a/apps/files/tests/js/filelistSpec.js b/apps/files/tests/js/filelistSpec.js
@@ -749,8 +749,8 @@ describe('OCA.Files.FileList tests', function() {
 		it('Restores thumbnail when rename was cancelled', function() {
 			doRename();
 
-			expect(OC.TestUtil.getImageUrl(fileList.findFileEl('Tu_after_three.txt').find('.thumbnail')))
-				.toEqual(OC.imagePath('core', 'loading.gif'));
+			expect(fileList.findFileEl('Tu_after_three.txt').find('.thumbnail').parent().attr('class'))
+				.toEqual('icon-loading-small');
 
 			deferredRename.reject(409);
 
@@ -837,8 +837,8 @@ describe('OCA.Files.FileList tests', function() {
 		it('Restores thumbnail if a file could not be moved', function() {
 			fileList.move('One.txt', '/somedir');
 
-			expect(OC.TestUtil.getImageUrl(fileList.findFileEl('One.txt').find('.thumbnail')))
-				.toEqual(OC.imagePath('core', 'loading.gif'));
+			expect(fileList.findFileEl('One.txt').find('.thumbnail').parent().attr('class'))
+				.toEqual('icon-loading-small');
 
 			expect(moveStub.calledOnce).toEqual(true);
 
@@ -934,8 +934,8 @@ describe('OCA.Files.FileList tests', function() {
 		it('Restores thumbnail if a file could not be copied', function() {
 			fileList.copy('One.txt', '/somedir');
 
-			expect(OC.TestUtil.getImageUrl(fileList.findFileEl('One.txt').find('.thumbnail')))
-				.toEqual(OC.imagePath('core', 'loading.gif'));
+			expect(fileList.findFileEl('One.txt').find('.thumbnail').parent().attr('class'))
+				.toEqual('icon-loading-small');
 
 			expect(copyStub.calledOnce).toEqual(true);
 
@@ -3149,8 +3149,9 @@ describe('OCA.Files.FileList tests', function() {
 		it('shows spinner on busy rows', function() {
 			fileList.showFileBusyState('Two.jpg', true);
 			expect($tr.hasClass('busy')).toEqual(true);
-			expect(OC.TestUtil.getImageUrl($tr.find('.thumbnail')))
-				.toEqual(OC.imagePath('core', 'loading.gif'));
+			expect($tr.find('.thumbnail').parent().attr('class'))
+				.toEqual('icon-loading-small');
+
 
 			fileList.showFileBusyState('Two.jpg', false);
 			expect($tr.hasClass('busy')).toEqual(false);

diff --git a/apps/files_sharing/css/public.scss b/apps/files_sharing/css/public.scss
@@ -97,8 +97,6 @@ thead {
 
 .directLink label {
 	font-weight: normal;
-	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
-	filter: alpha(opacity=50);
 	opacity: .5;
 }
 .directLink input {

diff --git a/apps/files_trashbin/css/trash.css → apps/files_trashbin/css/trash.scss b/apps/files_trashbin/css/trash.css → apps/files_trashbin/css/trash.scss
diff --git a/apps/files_versions/css/versions.css b/apps/files_versions/css/versions.css
@@ -16,8 +16,6 @@
 .versionsTabView a,
 .versionsTabView div > span {
 	vertical-align: middle;
-	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
-	filter: alpha(opacity=50);
 	opacity: .5;
 }
 
@@ -27,8 +25,6 @@
 
 .versionsTabView a:hover,
 .versionsTabView a:focus {
-	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
-	filter: alpha(opacity=100);
 	opacity: 1;
 }
 

diff --git a/apps/systemtags/css/systemtagsfilelist.css b/apps/systemtags/css/systemtagsfilelist.css
@@ -12,18 +12,6 @@
 	margin-left: 10px;
 }
 
-#app-content-systemtagsfilter .select2-choices {
-	white-space: nowrap;
-	text-overflow: ellipsis;
-	background: #fff;
-	color: #555;
-	box-sizing: content-box;
-	border-radius: 3px;
-	border: 1px solid #ddd;
-	padding: 0;
-	min-height: auto;
-}
-
 .nav-icon-systemtagsfilter {
 	background-image: url('../img/tag.svg');
 }