refactor(styles): Adjust code style in SCSS sources to match our stylelint config

Signed-off-by: Ferdinand Thiessen <opensource@fthiessen.de>

14 files changed, 21 insertions, 20 deletions

diff --git a/apps/settings/src/components/AppStoreSidebar/AppDetailsTab.vue b/apps/settings/src/components/AppStoreSidebar/AppDetailsTab.vue
index f70696f4100..e66f712c1aa 100644
--- a/apps/settings/src/components/AppStoreSidebar/AppDetailsTab.vue
+++ b/apps/settings/src/components/AppStoreSidebar/AppDetailsTab.vue
@@ -427,6 +427,7 @@ export default {
 	border-color: var(--color-error);
 	background: var(--color-main-background);
 }
+
 .force:hover,
 .force:active {
 	color: var(--color-main-background);
diff --git a/apps/settings/src/components/BasicSettings/BackgroundJob.vue b/apps/settings/src/components/BasicSettings/BackgroundJob.vue
index 4924014b78a..291be810944 100644
--- a/apps/settings/src/components/BasicSettings/BackgroundJob.vue
+++ b/apps/settings/src/components/BasicSettings/BackgroundJob.vue
@@ -185,6 +185,7 @@ export default {
 	background-color: var(--color-error);
 	width: initial;
 }
+
 .warning {
 	margin-top: 8px;
 	padding: 5px;
@@ -193,6 +194,7 @@ export default {
 	background-color: var(--color-warning);
 	width: initial;
 }
+
 .ajaxSwitch {
 	margin-top: 1rem;
 }
diff --git a/apps/settings/src/components/BasicSettings/ProfileSettings.vue b/apps/settings/src/components/BasicSettings/ProfileSettings.vue
index 86126c16b29..910a02ab454 100644
--- a/apps/settings/src/components/BasicSettings/ProfileSettings.vue
+++ b/apps/settings/src/components/BasicSettings/ProfileSettings.vue
@@ -80,6 +80,3 @@ export default {
 	},
 }
 </script>
-
-<style lang="scss" scoped>
-</style>
diff --git a/apps/settings/src/components/Markdown.vue b/apps/settings/src/components/Markdown.vue
index c22bf389585..36535e46763 100644
--- a/apps/settings/src/components/Markdown.vue
+++ b/apps/settings/src/components/Markdown.vue
@@ -100,7 +100,7 @@ export default {
 </script>
 
 <style scoped lang="scss">
-.settings-markdown::v-deep {
+.settings-markdown :deep {
 	a {
 		text-decoration: underline;
 		&::after {
diff --git a/apps/settings/src/components/PersonalInfo/AvatarSection.vue b/apps/settings/src/components/PersonalInfo/AvatarSection.vue
index 79eba665cd4..b75efaf6fb3 100644
--- a/apps/settings/src/components/PersonalInfo/AvatarSection.vue
+++ b/apps/settings/src/components/PersonalInfo/AvatarSection.vue
@@ -257,6 +257,7 @@ section {
 	grid-row: 1/3;
 	padding: 10px 10px;
 }
+
 .avatar {
 	&__container {
 		margin: calc(var(--default-grid-baseline) * 2) auto 0 auto;
@@ -296,7 +297,7 @@ section {
 			justify-content: space-between;
 		}
 
-		&::v-deep .cropper-view-box {
+		:deep(.cropper-view-box) {
 			border-radius: 50%;
 		}
 	}
diff --git a/apps/settings/src/components/PersonalInfo/BirthdaySection.vue b/apps/settings/src/components/PersonalInfo/BirthdaySection.vue
index 633794d9d5d..f5171d388b7 100644
--- a/apps/settings/src/components/PersonalInfo/BirthdaySection.vue
+++ b/apps/settings/src/components/PersonalInfo/BirthdaySection.vue
@@ -118,7 +118,7 @@ export default {
 section {
 	padding: 10px 10px;
 
-	&::v-deep button:disabled {
+	:deep(button:disabled) {
 		cursor: default;
 	}
 
diff --git a/apps/settings/src/components/PersonalInfo/ProfileSection/ProfilePreviewCard.vue b/apps/settings/src/components/PersonalInfo/ProfileSection/ProfilePreviewCard.vue
index 094b3bacc04..58a3d609866 100644
--- a/apps/settings/src/components/PersonalInfo/ProfileSection/ProfilePreviewCard.vue
+++ b/apps/settings/src/components/PersonalInfo/ProfileSection/ProfilePreviewCard.vue
@@ -104,7 +104,7 @@ export default {
 		box-shadow: 0 0 3px var(--color-box-shadow);
 
 		& *,
-		&::v-deep * {
+		&:deep(*) {
 			cursor: default;
 		}
 	}
diff --git a/apps/settings/src/components/PersonalInfo/ProfileSection/ProfileSection.vue b/apps/settings/src/components/PersonalInfo/ProfileSection/ProfileSection.vue
index f5f71eed075..22c03f72697 100644
--- a/apps/settings/src/components/PersonalInfo/ProfileSection/ProfileSection.vue
+++ b/apps/settings/src/components/PersonalInfo/ProfileSection/ProfileSection.vue
@@ -82,7 +82,7 @@ export default {
 section {
 	padding: 10px 10px;
 
-	&::v-deep button:disabled {
+	&:deep(button:disabled) {
 		cursor: default;
 	}
 }
diff --git a/apps/settings/src/components/PersonalInfo/ProfileVisibilitySection/ProfileVisibilitySection.vue b/apps/settings/src/components/PersonalInfo/ProfileVisibilitySection/ProfileVisibilitySection.vue
index a780883eade..8acec883842 100644
--- a/apps/settings/src/components/PersonalInfo/ProfileVisibilitySection/ProfileVisibilitySection.vue
+++ b/apps/settings/src/components/PersonalInfo/ProfileVisibilitySection/ProfileVisibilitySection.vue
@@ -118,7 +118,7 @@ section {
 			pointer-events: none;
 
 			& *,
-			&::v-deep * {
+			&:deep(*) {
 				cursor: default;
 				pointer-events: none;
 			}
diff --git a/apps/settings/src/components/PersonalInfo/ProfileVisibilitySection/VisibilityDropdown.vue b/apps/settings/src/components/PersonalInfo/ProfileVisibilitySection/VisibilityDropdown.vue
index 51c0203eb7f..15a98ca528f 100644
--- a/apps/settings/src/components/PersonalInfo/ProfileVisibilitySection/VisibilityDropdown.vue
+++ b/apps/settings/src/components/PersonalInfo/ProfileVisibilitySection/VisibilityDropdown.vue
@@ -142,7 +142,7 @@ export default {
 		pointer-events: none;
 
 		& *,
-		&::v-deep * {
+		&:deep(*) {
 			cursor: default;
 			pointer-events: none;
 		}
diff --git a/apps/settings/src/components/UserList.vue b/apps/settings/src/components/UserList.vue
index 228ead554e2..f6f694f1a0e 100644
--- a/apps/settings/src/components/UserList.vue
+++ b/apps/settings/src/components/UserList.vue
@@ -398,7 +398,7 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-@import './Users/shared/styles.scss';
+@use './Users/shared/styles' as *;
 
 .empty {
 	:deep {
diff --git a/apps/settings/src/components/Users/UserListFooter.vue b/apps/settings/src/components/Users/UserListFooter.vue
index 9095e67b764..d3667a38580 100644
--- a/apps/settings/src/components/Users/UserListFooter.vue
+++ b/apps/settings/src/components/Users/UserListFooter.vue
@@ -84,11 +84,11 @@ export default Vue.extend({
 </script>
 
 <style lang="scss" scoped>
-@import './shared/styles.scss';
+@use './shared/styles';
 
 .footer {
-	@include row;
-	@include cell;
+	@include styles.row;
+	@include styles.cell;
 
 	&__cell {
 		position: sticky;
diff --git a/apps/settings/src/components/Users/UserListHeader.vue b/apps/settings/src/components/Users/UserListHeader.vue
index 93a0582c8a4..99a4126924f 100644
--- a/apps/settings/src/components/Users/UserListHeader.vue
+++ b/apps/settings/src/components/Users/UserListHeader.vue
@@ -140,12 +140,12 @@ export default Vue.extend({
 </script>
 
 <style lang="scss" scoped>
-@import './shared/styles.scss';
+@use './shared/styles';
 
 .header {
 	border-bottom: 1px solid var(--color-border);
 
-	@include row;
-	@include cell;
+	@include styles.row;
+	@include styles.cell;
 }
 </style>
diff --git a/apps/settings/src/components/Users/UserRow.vue b/apps/settings/src/components/Users/UserRow.vue
index af0879573c9..7dea5091f3b 100644
--- a/apps/settings/src/components/Users/UserRow.vue
+++ b/apps/settings/src/components/Users/UserRow.vue
@@ -907,10 +907,10 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-@import './shared/styles.scss';
+@use './shared/styles';
 
 .user-list__row {
-	@include row;
+	@include styles.row;
 
 	&:hover {
 		background-color: var(--color-background-hover);
@@ -927,7 +927,7 @@ export default {
 }
 
 .row {
-	@include cell;
+	@include styles.cell;
 
 	&__cell {
 		border-bottom: 1px solid var(--color-border);