Use the color-primary-element* variables

Signed-off-by: Simon L <szaimen@e.mail.de>
nextcloud · May 15, 2023 · 5c0658a · 5c0658a
1 parent 3eda95a
commit 5c0658a
Show file tree

Hide file tree

Showing 6 changed files with 13 additions and 13 deletions.
diff --git a/src/components/Albums/AlbumPicker.vue b/src/components/Albums/AlbumPicker.vue
@@ -160,14 +160,14 @@ export default {
 				border-radius: var(--border-radius);
 
 				&--placeholder {
-					background: var(--color-primary-light);
+					background: var(--color-primary-element-light);
 
 					:deep .material-design-icon {
 						width: 100%;
 						height: 100%;
 
 						.material-design-icon__svg {
-							fill: var(--color-primary);
+							fill: var(--color-primary-element);
 						}
 					}
 				}

diff --git a/src/components/Collection/CollectionCover.vue b/src/components/Collection/CollectionCover.vue
@@ -104,14 +104,14 @@ export default {
 		}
 
 		&--placeholder {
-			background: var(--color-primary-light);
+			background: var(--color-primary-element-light);
 
 			:deep .material-design-icon {
 				width: 100%;
 				height: 100%;
 
 				.material-design-icon__svg {
-					fill: var(--color-primary);
+					fill: var(--color-primary-element);
 				}
 			}
 		}

diff --git a/src/components/File.vue b/src/components/File.vue
@@ -222,7 +222,7 @@ export default {
 
 <style lang="scss" scoped>
 .file-container {
-	background: var(--color-primary-light);
+	background: var(--color-primary-element-light);
 	position: relative;
 	height: 100%;
 	width: 100%;
@@ -239,7 +239,7 @@ export default {
 			width: 100%;
 			height: 100%;
 			content: '';
-			outline: var(--color-primary) solid 4px;
+			outline: var(--color-primary-element) solid 4px;
 			outline-offset: -4px;
 			pointer-events: none;
 		}
@@ -337,7 +337,7 @@ export default {
 			// Add a background to the checkbox so we do not see the image through it.
 			&::after {
 				content: '';
-				background: var(--color-primary-light);
+				background: var(--color-primary-element-light);
 				width: 16px;
 				height: 16px;
 				position: absolute;
@@ -368,7 +368,7 @@ export default {
 			fill: #FC0;
 
 			path {
-				stroke: var(--color-primary-light);
+				stroke: var(--color-primary-element-light);
 				stroke-width: 1px;
 			}
 		}

diff --git a/src/components/FilesListViewer.vue b/src/components/FilesListViewer.vue
@@ -271,7 +271,7 @@ export default {
 	position: relative;
 
 	&__placeholder {
-		background: var(--color-primary-light);
+		background: var(--color-primary-element-light);
 		width: 100%;
 		height: 100%;
 		border: 2px solid var(--color-main-background); // Use border so create a separation between images.

diff --git a/src/components/FilesPicker.vue b/src/components/FilesPicker.vue
@@ -207,7 +207,7 @@ export default {
 		}
 
 		&--placeholder {
-			background: var(--color-primary-light);
+			background: var(--color-primary-element-light);
 			border-radius: var(--border-radius-large);
 		}
 
@@ -239,7 +239,7 @@ export default {
 		height: 100%;
 
 		&--placeholder {
-			background: var(--color-primary-light);
+			background: var(--color-primary-element-light);
 			border-radius: var(--border-radius-large);
 		}
 

diff --git a/src/components/TagCover.vue b/src/components/TagCover.vue
@@ -143,14 +143,14 @@ export default {
 		}
 
 		&--placeholder {
-			background: var(--color-primary-light);
+			background: var(--color-primary-element-light);
 
 			:deep .material-design-icon {
 				width: 100%;
 				height: 100%;
 
 				.material-design-icon__svg {
-					fill: var(--color-primary);
+					fill: var(--color-primary-element);
 				}
 			}
 		}