print: add eslint-plugin-vue-scoped-css

The plugin found some issues in the frontend. It might also be helpful in print.
BacLuc · May 12, 2024 · 2bc2da2 · 2bc2da2
1 parent 690f237
commit 2bc2da2
Show file tree

Hide file tree

Showing 7 changed files with 237 additions and 12 deletions.
diff --git a/print/components/PicassoChunk.vue b/print/components/PicassoChunk.vue
@@ -156,6 +156,8 @@ export default {
 }
 </script>
 
+<!-- these styles seem to effect the whole picasso, thus we don't want the vue-scoped-css/enforce-style-type warning here -->
+<!-- eslint-disable-next-line -->
 <style lang="scss">
 $portrait-content-width: 680; /* 794px minus 114px (=2*15mm margin) */
 $portrait-content-height: 1009; /* 1123px minus 114px (=2*15mm margin) */

diff --git a/print/components/generic/CategoryLabel.vue b/print/components/generic/CategoryLabel.vue
@@ -31,7 +31,7 @@ export default {
 }
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 .category-label {
   font-size: 80%;
   letter-spacing: 0.05em;

diff --git a/print/components/scheduleEntry/contentNode/ColumnLayoutColumn.vue b/print/components/scheduleEntry/contentNode/ColumnLayoutColumn.vue
@@ -53,7 +53,7 @@ export default defineNuxtComponent({
 })
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 .ec-col {
   flex: 0 0 100%;
 }

diff --git a/print/components/scheduleEntry/contentNode/Material.vue b/print/components/scheduleEntry/contentNode/Material.vue
@@ -53,11 +53,6 @@ export default {
 </script>
 
 <style scoped lang="scss">
-.material-row {
-  display: flex;
-  flex-direction: row;
-}
-
 .item {
   flex-basis: 7000px;
   padding-right: 4px;
@@ -66,9 +61,4 @@ export default {
     padding-right: 4px;
   }
 }
-
-.list-name {
-  flex-basis: 3000px;
-  padding-left: 4px;
-}
 </style>
diff --git a/print/package-lock.json b/print/package-lock.json
diff --git a/print/package.json b/print/package.json
@@ -48,6 +48,7 @@
     "eslint-plugin-local-rules": "2.0.1",
     "eslint-plugin-prettier": "5.1.3",
     "eslint-plugin-vue": "9.26.0",
+    "eslint-plugin-vue-scoped-css": "2.8.0",
     "nuxt": "3.11.2",
     "prettier": "3.2.5",
     "sass": "1.69.4",
@@ -62,6 +63,7 @@
     },
     "extends": [
       "plugin:vue/vue3-recommended",
+      "plugin:vue-scoped-css/vue3-recommended",
       "@nuxt/eslint-config",
       "eslint:recommended",
       "plugin:prettier/recommended"

diff --git a/print/pages/index.vue b/print/pages/index.vue
@@ -36,6 +36,8 @@ const { data: camp, error } = await useAsyncData(
 )
 </script>
 
+<!-- these styles should be global, thus we don't want the vue-scoped-css/enforce-style-type warning here -->
+<!-- eslint-disable-next-line -->
 <style>
 :root {
   --tw-prose-body: #000 !important;