feat: 🌸 support a demo page

.gitignore

@@ -1,3 +1 @@
-node_modules/
-index.html
-demo/
+node_modules/

demo/css/index.css

@@ -0,0 +1,130 @@
+body,
+html {
+  -ms-text-size-adjust: 100%;
+  -webkit-text-size-adjust: 100%;
+  zoom: 1;
+}
+body {
+  height: 100vh;
+  overflow-y: auto;
+}
+@media screen and (min-width: 1400px) {
+  .container,
+  .container-lg,
+  .container-md,
+  .container-sm,
+  .container-xl,
+  .container-xxl {
+    max-width: 1560px;
+  }
+}
+
+@keyframes uploading {
+  from { transform: scale(1); }
+  to { transform: scale(1.3); }
+}
+
+@keyframes octocat-wave {
+  0%,
+  100% {
+    transform: rotate(0);
+  }
+  20%,
+  60% {
+    transform: rotate(-25deg);
+  }
+  40%,
+  80% {
+    transform: rotate(10deg);
+  }
+}
+@media (max-width: 500px) {
+  .github-corner:hover .octo-arm {
+    animation: none;
+  }
+  .github-corner .octo-arm {
+    animation: octocat-wave 560ms ease-in-out;
+  }
+}
+@font-face {
+  font-family: font-letter;
+  src: url('../font/font-letter.otf');
+}
+.github-corner:hover .octo-arm {
+  animation: octocat-wave 560ms ease-in-out;
+}
+.font-letter {
+  font-family: font-letter;
+}
+.require-flag::before {
+  content: '*';
+  color: red;
+  margin-right: 3px;
+}
+.over-poiner {
+  cursor: pointer;
+}
+input[type='file']:disabled {
+  cursor: not-allowed;
+}
+input::placeholder {
+  font-size: 14px;
+}
+.uploaded-img {
+  width: 150px;
+  height: 200px;
+  margin-right: 5px;
+  background: rgba(0,0,0,0.08);
+  object-fit: cover;
+}
+.pdt-3 {
+  padding-top: 3px;
+}
+.ls-label {
+  letter-spacing: 0.1em;
+}
+.copy-btn {
+  cursor: pointer;
+  padding: 0;
+  margin-left: 3px;
+  border: none;
+  background: 0 0;
+}
+.uploaded-link {
+  word-wrap: break-word;
+  max-width: 100%;
+}
+[v-cloak] {
+  display: none;
+}
+
+.upload-loading {
+  width: 100vw;
+  height: 100vh;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  position: fixed;
+  left: 0;
+  top: 0;
+  z-index: 1000;
+  background: rgba(255, 255, 255, 0.6);
+}
+
+.logo{
+  margin-right: 10px;
+}
+
+.uploading {
+  animation: uploading 0.8s ease-in-out 0s infinite alternate;
+}
+
+.uploaded-gellery-container{
+  width: 100%;
+  overflow-x: scroll;
+  display: flex;
+}
+
+.uploaded-gellery-container a {
+  flex-shrink: 0;
+}