add main.css

3 years ago · 24768237e2
parent a664651865
commit 24768237e2
2 changed files with 34 additions and 1 deletions
--- a/share/index.html
+++ b/share/index.html
@ -4,14 +4,16 @@
 		<meta charset="utf-8">
 		<title>Share</title>
 		<script src="./vue.js"></script>
 		<link rel="stylesheet" href="./main.css" />
 	</head>
 	<body>
 		<div id="app">
 			<button @click="cl">{{ message }}</button>
 			<p>Count is: {{ count }}</p>
 		</div>
 		<div id="square"><div v-html="rawHtml">loading...</div></div>
 		<script>
-			const { createApp, ref } = Vue
+			const { createApp, ref, onMounted } = Vue
 			const app = createApp({
 			  setup(){
 				  const message = ref('Hello Vue!')
@ -26,7 +28,25 @@
 				  }
 			  }
 			  })
 			const square = createApp({
 				setup(){
 					let rawHtml = ''
 					let start = 0
 					for(let i = 1; i < 101; i++){
 						for(let j = 1; j < 101; j++){
 							start ++
 							rawHtml += `<div style="background:rgba(${i},${j},${Math.random()*255},.5)">${start}</div>`
 						}
 					}
 					return {
 						rawHtml
 					}
 				}
 			})
 			app.mount('#app')
 			square.mount('#square')
 		</script>
 	</body>
 </html>
--- a/share/main.css
+++ b/share/main.css
@ -0,0 +1,13 @@
 #square>div{
 	display: flex;
 	flex-wrap: wrap;
 }
 #square>div>div{
 	width: 100px;
 	height: 100px;
 	/* margin-right: 10px; */
 	/* margin-bottom: 10px; */
 	border: 1px solid #f1f1f1;
 	transform: rotate(1deg);
 }