fix scoped styles

docs/src/demos/Guide/NodeViews/JavaScript/index.vue

@@ -42,7 +42,7 @@ export default {
 }
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 /* Basic editor styles */
 .ProseMirror {
   > * + * {
@@ -50,14 +50,15 @@ export default {
   }
 }
 
-.node-view {
+::v-deep {
+  .node-view {
     border: 1px solid #adb5bd;
     border-radius: 0.5rem;
     margin: 1rem 0;
     position: relative;
-}
+  }
 
-.label {
+  .label {
     margin-left: 1rem;
     background-color: #adb5bd;
     font-size: 0.6rem;
@@ -69,9 +70,10 @@ export default {
     top: 0;
     padding: 0.25rem 0.75rem;
     border-radius: 0 0 0.5rem 0.5rem;
-}
+  }
 
-.content {
+  .content {
     margin: 2.5rem 1rem 1rem;
+  }
 }
 </style>

docs/src/demos/Guide/NodeViews/VueComponent/Component.vue

@@ -30,7 +30,7 @@ export default {
 }
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 .vue-component {
   border: 1px solid #adb5bd;
   border-radius: 0.5rem;

docs/src/demos/Guide/NodeViews/VueComponentContent/Component.vue

@@ -19,7 +19,7 @@ export default {
 }
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 .vue-component {
   border: 1px solid #adb5bd;
   border-radius: 0.5rem;