Version 0.0.15: improve the notebook component

Author: synw

README.md

@@ -7,7 +7,7 @@ Edit and run Python code in Vuejs 3
 Based on [usepython](https://github.com/synw/usepython): the Python code runs in 
 a [Pyodide](https://github.com/pyodide/pyodide) service worker, leaving the main ui thread alone
 
-[Demo](https://synw.github.io/vuepython/) - [Example](example/)
+[Documentation](https://synw.github.io/vuepython/)
 
 ## Install
 
@@ -69,27 +69,15 @@ the code block. [Themes preview](https://highlightjs.org/static/demo/)
 
 ## Css
 
-The styling of the widgets is made with Tailwind css classes. If you don't have
-Tailwind installed import the necessary css manualy:
+Import the necessary css
 
 ```ts
-import "vuepython/twstyle.css"
-```
-
-If you use Tailwind css add this to your *tailwind.config.js* file:
-
-```js
-  content: [
-    // ...
-    './node_modules/vuepython/**/*.{vue,js,ts}',
-  ],
+import "vuepython/style.css"
 ```
 
 ## Example
 
-An [example](example/README.md) is available
-
-Basic example code:
+Example code:
 
 ```vue
 <template>

docs/assets/_...all_-651ce884.js

@@ -0,0 +1,5 @@
+import{d as o,o as n,c as t,b as s,a as c,u as e,p as _,s as l}from"./index-aeae53b3.js";const r={class:"prosed"},p=s("h1",null,"Code block example",-1),m={class:"not-prose"},h=o({__name:"code_block",setup(d){const a=`first_name = "Bob"
+last_name = "Miller"
+name = f"{first_name} {last_name}"
+print("The name is", name)
+name`;return(i,f)=>(n(),t("div",r,[p,s("p",m,[c(e(l),{id:"1",code:a,py:e(_),namespace:"codeblock"},null,8,["py"])])]))}});export{h as default};

docs/assets/code_block-c08e2817.js

@@ -0,0 +1,4 @@
+import{d as n,o,c as s,a as c,u as e,p as t,x as p}from"./index-aeae53b3.js";const r={class:"container mx-auto"},d=n({__name:"notebook",setup(l){const a=[`a=1
+b=2
+c=a+b
+c`,"c"];return(_,m)=>(o(),s("div",r,[c(e(p),{py:e(t),namespace:"example",cells:a},null,8,["py"])]))}});export{d as default};

docs/assets/index-8668586b.css

@@ -0,0 +1,13 @@
+pre code.hljs{display:block;overflow-x:auto;padding:1em}code.hljs{padding:3px 5px}/*!
+  Theme: StackOverflow Light
+  Description: Light theme as used on stackoverflow.com
+  Author: stackoverflow.com
+  Maintainer: @Hirse
+  Website: https://github.com/StackExchange/Stacks
+  License: MIT
+  Updated: 2021-05-15
+
+  Updated for @stackoverflow/stacks v0.64.0
+  Code Blocks: /blob/v0.64.0/lib/css/components/_stacks-code-blocks.less
+  Colors: /blob/v0.64.0/lib/css/exports/_stacks-constants-colors.less
+*/.hljs{color:#2f3337;background:#f6f6f6}.hljs-subst{color:#2f3337}.hljs-comment{color:#656e77}.hljs-attr,.hljs-doctag,.hljs-keyword,.hljs-meta .hljs-keyword,.hljs-section,.hljs-selector-tag{color:#015692}.hljs-attribute{color:#803378}.hljs-name,.hljs-number,.hljs-quote,.hljs-selector-id,.hljs-template-tag,.hljs-type{color:#b75501}.hljs-selector-class{color:#015692}.hljs-link,.hljs-regexp,.hljs-selector-attr,.hljs-string,.hljs-symbol,.hljs-template-variable,.hljs-variable{color:#54790d}.hljs-meta,.hljs-selector-pseudo{color:#015692}.hljs-built_in,.hljs-literal,.hljs-title{color:#b75501}.hljs-bullet,.hljs-code{color:#535a60}.hljs-meta .hljs-string{color:#54790d}.hljs-deletion{color:#c02d2e}.hljs-addition{color:#2f6f44}.hljs-emphasis{font-style:italic}.hljs-strong{font-weight:700}