i am using summernote in vue2 and importing whole html that i exported from google docs so that i can use inside summernote but the problem is when i pass html inside summernote then the styles that present in html head is also applying to my whole project so how to scope scc so that it will only apply css to summernote only.
this is the code that i am importing
<html>
<head>
<meta content="text/html; charset=UTF-8" http-equiv="content-type" />
<style type="text/css">
@import url(https://themes.googleusercontent.com/fonts/css?kit=fvyYZ8D_r6q1snYdb-tnF6Gq3fd52zrAS7XUuAmYWWrfafIhEfIK7qKoSRr-Fsqy96xlbbE5D7Gw2o7jubnkMA);
body {
background-color: #ee0000;
}
</style>
</head>
<body class="c20 doc-content">
<h1>hii</h1>
</body>
</html>
$('#summernote-editor').summernote('code', updatedHtmlContent);
i tried using iframe but i can only use to render my html inside div but i want to edit that html also.