encore_entry_link_tags allows to use <style scoped> in vue files

src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/App.vue

@@ -12,7 +12,6 @@
 
 <script>
 import { mapState } from 'vuex'
-
 import AccompanyingCourse from './components/AccompanyingCourse.vue';
 import PersonsAssociated from './components/PersonsAssociated.vue';
 import Requestor from './components/Requestor.vue';
@@ -41,3 +40,24 @@ export default {
    ])
 };
 </script>
+
+<style lang="scss" scoped>
+   div.vue-component {
+      padding: 1.5em;
+      margin: 2em 0;
+      border: 2px dashed grey;
+      position: relative;
+      &:before { 
+         content: "vuejs component";
+         position: absolute;
+         left: 1.5em;
+         top: -0.9em;
+         background-color: white;
+         color: grey;
+         padding: 0 0.3em;
+      }
+      dd { 
+         margin-left: 1em; 
+      }
+   }
+</style>

src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/ToggleFlags.vue

@@ -66,3 +66,17 @@ export default {
    }
 }
 </script>
+
+<style lang="scss" scoped>
+   a.flag-toggle {
+      color: white;
+      padding: 0 10px;
+      cursor: pointer;
+      &:hover {
+         color: white;
+         //border: 1px solid rgba(255,255,255,0.2);
+         text-decoration: underline;
+         border-radius: 20px;
+      }
+   }
+</style>