site

public/css/common/reset.css

@@ -1,57 +0,0 @@
-/* http://meyerweb.com/eric/tools/css/reset/
-   v2.0 | 20110126
-   License: none (public domain)
-*/
-
-html, body, div, span, applet, object, iframe,
-h1, h2, h3, h4, h5, h6, p, blockquote, pre,
-a, abbr, acronym, address, big, cite, code,
-del, dfn, em, img, ins, kbd, q, s, samp,
-small, strike, strong, sub, sup, tt, var,
-b, u, i, center,
-dl, dt, dd, ol, ul, li,
-fieldset, form, label, legend,
-table, caption, tbody, tfoot, thead, tr, th, td,
-article, aside, canvas, details, embed,
-figure, figcaption, footer, header, hgroup,
-menu, nav, output, ruby, section, summary,
-time, mark, audio, video {
-	margin: 0;
-	padding: 0;
-	border: 0;
-	font-size: 100%;
-	font: inherit;
-	vertical-align: baseline;
-}
-/* HTML5 display-role reset for older browsers */
-article, aside, details, figcaption, figure,
-footer, header, hgroup, menu, nav, section {
-	display: block;
-}
-body {
-	line-height: 1;
-}
-ol, ul {
-	list-style: none;
-}
-blockquote, q {
-	quotes: none;
-}
-blockquote:before, blockquote:after,
-q:before, q:after {
-	content: '';
-	content: none;
-}
-table {
-	border-collapse: collapse;
-	border-spacing: 0;
-}
-
-
-blockquote, body, button, dd, dl, dt, fieldset, form, h1, h2, h3, h4, h5, h6, hr, input, legend, li, ol, p, pre, td, textarea, th, ul {
-  margin: 0;
-  padding: 0;
-}
-body, button, input, select, textarea {
-  font: 12px/1.5 tahoma,arial,"Hiragino Sans GB",宋体,sans-serif;
-}

public/css/common/style.css

@@ -1,88 +0,0 @@
-@charset "UTF-8";
-html,
-body {
-  background-color: #f5f5f5;
-  min-height: 100%;
-}
-
-.left-list {
-  position: absolute;
-  right: calc(100% + 10px);
-  top: 8%;
-  min-width: 50px;
-  padding: 0 10px;
-  line-height: 3;
-  text-align: center;
-  border-right: 1px solid rgba(0, 0, 0, 0.6);
-}
-
-.left-list .item {
-  white-space: nowrap;
-}
-
-.left-list .item a {
-  display: inline-block;
-  text-decoration: none;
-  font-size: 1.2em;
-}
-
-.container {
-  width: 1100px;
-  margin: 0 auto;
-}
-
-.a-flex {
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-}
-
-/*
-图片类样式
-*/
-.img-wrapper {
-  width: 100px;
-  height: 100px;
-  overflow: hidden;
-  -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.6);
-          box-shadow: 0 1px 4px rgba(0, 0, 0, 0.6);
-  border-radius: 50%;
-  display: inline-block;
-  -webkit-box-sizing: border-box;
-          box-sizing: border-box;
-  border: 3px solid #000;
-  /* ============== * 深褐色过滤* ==============*/
-}
-
-.img-wrapper img {
-  width: 100%;
-  height: 100px;
-  -webkit-transition: 0.3s linear;
-  transition: 0.3s linear;
-}
-
-.img-wrapper img:hover {
-  -webkit-transform: scale(1.1);
-          transform: scale(1.1);
-}
-
-.img-wrapper .grayscale-img {
-  -webkit-filter: grayscale(100%);
-  filter: grayscale(100%);
-}
-
-.img-wrapper .grayscale-img:hover {
-  -webkit-filter: grayscale(0);
-  filter: grayscale(0);
-}
-
-.img-wrapper .sepia-img {
-  -webkit-filter: sepia(100%);
-  filter: sepia(100%);
-}
-
-.img-wrapper .sepia-img:hover {
-  -webkit-filter: sepia(0);
-  filter: sepia(0);
-}
-/*# sourceMappingURL=style.css.map */

public/css/common/style.css.map

@@ -1,9 +0,0 @@
-{
-    "version": 3,
-    "mappings": ";AAAA,AAAA,IAAI;AACJ,IAAI,CAAC;EACH,gBAAgB,EAAE,OAAO;EACzB,MAAM,EAAE,IAAI;EACZ,QAAQ,EAAE,MAAM;CACjB;;AAED,AAAA,UAAU,CAAC;EACT,QAAQ,EAAE,QAAQ;EAClB,KAAK,EAAE,iBAAiB;EACxB,GAAG,EAAE,EAAE;EACP,SAAS,EAAE,IAAI;EACf,OAAO,EAAE,MAAM;EACf,WAAW,EAAE,CAAC;EACd,UAAU,EAAE,MAAM;EAClB,YAAY,EAAE,GAAG,CAAC,KAAK,CAAC,kBAAkB;CAS3C;;AAjBD,AASE,UATQ,CASR,KAAK,CAAC;EACJ,WAAW,EAAE,MAAM;CAMpB;;AAhBH,AAWI,UAXM,CASR,KAAK,CAEH,CAAC,CAAA;EACC,OAAO,EAAE,YAAY;EACrB,eAAe,EAAE,IAAI;EACrB,SAAS,EAAE,KAAK;CACjB;;AAIL,AAAA,UAAU,CAAC;EACT,KAAK,EAAE,MAAM;EACb,MAAM,EAAE,MAAM;CACf;;AAED,AAAA,OAAO,CAAC;EACN,OAAO,EAAE,IAAI;CACd;;AAED;;EAEE;AACF,AAAA,YAAY,CAAC;EACX,KAAK,EAAE,KAAK;EACZ,MAAM,EAAE,KAAK;EACb,QAAQ,EAAE,MAAM;EAChB,UAAU,EAAE,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,kBAAkB;EACxC,aAAa,EAAE,GAAG;EAElB,OAAO,EAAE,YAAY;EACrB,UAAU,EAAE,UAAU;EACtB,MAAM,EAAE,cAAc;EAkBpB,gDAAgD;CASnD;;AApCD,AAUE,YAVU,CAUV,GAAG,CAAC;EACF,KAAK,EAAE,IAAI;EACX,MAAM,EAAE,KAAK;EACb,kBAAkB,EAAE,WAAW;EAC/B,UAAU,EAAE,WAAW;CAIxB;;AAlBH,AAeI,YAfQ,CAUV,GAAG,AAKA,MAAM,CAAC;EACN,SAAS,EAAE,UAAU;CACtB;;AAjBL,AAoBE,YApBU,CAoBV,cAAc,CAAC;EACb,cAAc,EAAE,eAAe;EAC/B,MAAM,EAAE,eAAe;CACxB;;AAvBH,AAwBE,YAxBU,CAwBV,cAAc,AAAA,MAAM,CAAC;EACnB,cAAc,EAAE,YAAY;EAC5B,MAAM,EAAE,YAAY;CACrB;;AA3BH,AA4BE,YA5BU,CA4BV,UAAU,CAAC;EACT,cAAc,EAAE,WAAW;EAC3B,MAAM,EAAE,WAAW;CACpB;;AA/BH,AAgCE,YAhCU,CAgCV,UAAU,AAAA,MAAM,CAAC;EACf,cAAc,EAAE,QAAQ;EACxB,MAAM,EAAE,QAAQ;CACjB",
-    "sources": [
-        "style.scss"
-    ],
-    "names": [],
-    "file": "style.css"
-}

public/css/common/style.scss

@@ -1,74 +0,0 @@
-html,
-body {
-  background-color: #f5f5d5;
-  min-height: 100%;
-}
-
-.left-list {
-  position: absolute;
-  right: calc(100% + 10px);
-  top: 8%;
-  min-width: 50px;
-  padding: 0 10px;
-  line-height: 3; // 12*3=36px
-  text-align: center;
-  border-right: 1px solid rgba(0, 0, 0, 0.6);
-  .item {
-    white-space: nowrap;
-    a{
-      display: inline-block;
-      text-decoration: none;
-      font-size: 1.2em;
-    }
-  }
-}
-
-.container {
-  width: 1100px;
-  margin: 0 auto;
-}
-
-.a-flex {
-  display: flex;
-}
-
-/*
-图片类样式
-*/
-.img-wrapper {
-  width: 100px;
-  height: 100px;
-  overflow: hidden;
-  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.6);
-  border-radius: 50%;
-
-  display: inline-block;
-  box-sizing: border-box;
-  border: 3px solid #000;
-  img {
-    width: 100%;
-    height: 100px;
-    -webkit-transition: 0.3s linear;
-    transition: 0.3s linear;
-    &:hover {
-      transform: scale(1.1);
-    }
-  }
-
-  .grayscale-img {
-    -webkit-filter: grayscale(100%);
-    filter: grayscale(100%);
-  }
-  .grayscale-img:hover {
-    -webkit-filter: grayscale(0);
-    filter: grayscale(0);
-  } /* ============== * 深褐色过滤* ==============*/
-  .sepia-img {
-    -webkit-filter: sepia(100%);
-    filter: sepia(100%);
-  }
-  .sepia-img:hover {
-    -webkit-filter: sepia(0);
-    filter: sepia(0);
-  }
-}

public/css/page/a.css

@@ -1,3 +0,0 @@
-body {
-  color: #008000;
-}

public/css/page/a.styl

@@ -1,2 +0,0 @@
-body
-    color: green;

public/css/page/css.css

@@ -1,68 +0,0 @@
-html, body{
-    padding: 0;
-    margin: 0;
-}
-
-*{
-    cursor: pointer;
-    position: relative;
-}
-
-
-.container {
-    width: 900px;
-    margin: 0 auto;
-  }
-
-.title{
-    padding-left: 20px;
-    z-index: 10;
-}
-
-.author:hover::before{
-    content: attr(title);
-    position: absolute;
-    top: 0;
-    left: 0;
-    background-color: yellow;
-    text-indent: 0;
-    font-size: 12px;
-    opacity: .4;
-    padding: 1px 8px;  
-    pointer-events: none;
-}
-.author:hover::after{
-    content: "";
-    position: absolute;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    border: 1px solid yellow;
-    pointer-events: none;
-}
-
-.word{
-    text-indent: 30px;
-    padding: 5px 10px;
-}
-
-.word .comment{
-    display: none;
-    position: relative;
-}
-.word:hover .comment{
-    display: block;
-    position: absolute;
-    left: 100%;
-    top: 0;
-    font-size: 14px;
-    padding: 6px;
-    box-sizing: border-box;
-    text-indent: 0;
-    background-color: rgb(177, 177, 177);
-    max-width: 180px;
-    width: 100%;
-    max-height: 100%;
-    overflow-y: auto;
-}

public/css/page/login copy.css

@@ -1,252 +0,0 @@
-
-@import url('https://fonts.googleapis.com/css?family=Montserrat:400,800');
-
-* {
-	box-sizing: border-box;
-}
-
-body {
-	background: #f6f5f7;
-	display: flex;
-	justify-content: center;
-	align-items: center;
-	flex-direction: column;
-	font-family: 'Montserrat', sans-serif;
-	height: 100vh;
-	/* margin: -20px 0 50px; */
-}
-
-h1 {
-	font-weight: bold;
-	margin: 0;
-}
-
-h2 {
-	text-align: center;
-}
-
-p {
-	font-size: 14px;
-	font-weight: 100;
-	line-height: 20px;
-	letter-spacing: 0.5px;
-	margin: 20px 0 30px;
-}
-
-span {
-	font-size: 12px;
-}
-
-a {
-	color: #333;
-	font-size: 14px;
-	text-decoration: none;
-	margin: 15px 0;
-}
-
-button {
-	border-radius: 20px;
-	border: 1px solid #FF4B2B;
-	background-color: #FF4B2B;
-	color: #FFFFFF;
-	font-size: 12px;
-	font-weight: bold;
-	padding: 12px 45px;
-	letter-spacing: 1px;
-	text-transform: uppercase;
-	transition: transform 80ms ease-in;
-}
-
-button:active {
-	transform: scale(0.95);
-}
-
-button:focus {
-	outline: none;
-}
-
-button.ghost {
-	background-color: transparent;
-	border-color: #FFFFFF;
-}
-
-form {
-	background-color: #FFFFFF;
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	flex-direction: column;
-	padding: 0 50px;
-	height: 100%;
-	text-align: center;
-}
-
-input {
-	background-color: #eee;
-	border: none;
-	padding: 12px 15px;
-	margin: 8px 0;
-	width: 100%;
-}
-
-.container {
-	background-color: #fff;
-	border-radius: 10px;
-  	box-shadow: 0 14px 28px rgba(0,0,0,0.25),
-			0 10px 10px rgba(0,0,0,0.22);
-	position: relative;
-	overflow: hidden;
-	width: 768px;
-	max-width: 100%;
-	min-height: 480px;
-}
-
-.form-container {
-	position: absolute;
-	top: 0;
-	height: 100%;
-	transition: all 0.6s ease-in-out;
-}
-
-.sign-in-container {
-	left: 0;
-	width: 50%;
-	z-index: 2;
-}
-
-.container.right-panel-active .sign-in-container {
-	transform: translateX(100%);
-}
-
-.sign-up-container {
-	left: 0;
-	width: 50%;
-	opacity: 0;
-	z-index: 1;
-}
-
-.container.right-panel-active .sign-up-container {
-	transform: translateX(100%);
-	opacity: 1;
-	z-index: 5;
-	animation: show 0.6s;
-}
-
-@keyframes show {
-	0%, 49.99% {
-		opacity: 0;
-		z-index: 1;
-	}
-
-	50%, 100% {
-		opacity: 1;
-		z-index: 5;
-	}
-}
-
-.overlay-container {
-	position: absolute;
-	top: 0;
-	left: 50%;
-	width: 50%;
-	height: 100%;
-	overflow: hidden;
-	transition: transform 0.6s ease-in-out;
-	z-index: 100;
-}
-
-.container.right-panel-active .overlay-container{
-	transform: translateX(-100%);
-}
-
-.overlay {
-	background: #FF416C;
-	background: -webkit-linear-gradient(to right, #FF4B2B, #FF416C);
-	background: linear-gradient(to right, #FF4B2B, #FF416C);
-	background-repeat: no-repeat;
-	background-size: cover;
-	background-position: 0 0;
-	color: #FFFFFF;
-	position: relative;
-	left: -100%;
-	height: 100%;
-	width: 200%;
-  	transform: translateX(0);
-	transition: transform 0.6s ease-in-out;
-}
-
-.container.right-panel-active .overlay {
-  	transform: translateX(50%);
-}
-
-.overlay-panel {
-	position: absolute;
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	flex-direction: column;
-	padding: 0 40px;
-	text-align: center;
-	top: 0;
-	height: 100%;
-	width: 50%;
-	transform: translateX(0);
-	transition: transform 0.6s ease-in-out;
-}
-
-.overlay-left {
-	transform: translateX(-20%);
-}
-
-.container.right-panel-active .overlay-left {
-	transform: translateX(0);
-}
-
-.overlay-right {
-	right: 0;
-	transform: translateX(0);
-}
-
-.container.right-panel-active .overlay-right {
-	transform: translateX(20%);
-}
-
-.social-container {
-	margin: 20px 0;
-}
-
-.social-container a {
-	border: 1px solid #DDDDDD;
-	border-radius: 50%;
-	display: inline-flex;
-	justify-content: center;
-	align-items: center;
-	margin: 0 5px;
-	height: 40px;
-	width: 40px;
-}
-
-footer {
-    background-color: #222;
-    color: #fff;
-    font-size: 14px;
-    bottom: 0;
-    position: fixed;
-    left: 0;
-    right: 0;
-    text-align: center;
-    z-index: 999;
-}
-
-footer p {
-    margin: 10px 0;
-}
-
-footer i {
-    color: red;
-}
-
-footer a {
-    color: #3c97bf;
-    text-decoration: none;
-}

public/css/tool/_tool.scss

@@ -1,36 +0,0 @@
-@mixin media($type...) {
-  @each $screen in $type {
-    @if $screen == xs {
-      @media (max-width: 768px) {
-        @content;
-      }
-    } @else if $screen == sm {
-      @media (max-width: 920px) {
-        @content;
-      }
-    } @else if $screen == md {
-      @media (max-width: 1200px) {
-        @content;
-      }
-    } @else if $screen == lg {
-      @media (max-width: 1366px) {
-        @content;
-      }
-    }
-  }
-}
-
-@mixin ellipsis($lines: 1) {
-  @if ($lines==1) {
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-  } @else {
-    display: -webkit-box;
-    -webkit-box-orient: vertical;
-    -webkit-line-clamp: $lines;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    word-break: break-all;
-  }
-}

public/css/views/404.css

@@ -1,320 +0,0 @@
-body{
-  margin: 0;
-  padding: 0;
-}
-
-#app {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  height: 100vh;
-  perspective: 1400px;
-  background: #fff;
-  font-family: 'Helvetica';
-}
-#app #outer {
-  width: 100vw;
-  height: 100vh;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  height: 100vh;
-  perspective: 1400px;
-  background: #fff;
-  transform: scale(0.75);
-}
-#app .wrap {
-  position: absolute;
-  width: 750px;
-  height: 400px;
-  -webkit-animation: squiggly-anim 0.3s infinite;
-          animation: squiggly-anim 0.3s infinite;
-}
-@-webkit-keyframes squiggly-anim {
-  0% {
-    filter: url("#squiggly-0");
-  }
-  25% {
-    filter: url("#squiggly-1");
-  }
-  50% {
-    -webkit-filter: url("#squiggly-2");
-  }
-  75% {
-    filter: url("#squiggly-3");
-  }
-  100% {
-    filter: url("#squiggly-4");
-  }
-}
-@keyframes squiggly-anim {
-  0% {
-    filter: url("#squiggly-0");
-  }
-  25% {
-    filter: url("#squiggly-1");
-  }
-  50% {
-    -webkit-filter: url("#squiggly-2");
-  }
-  75% {
-    filter: url("#squiggly-3");
-  }
-  100% {
-    filter: url("#squiggly-4");
-  }
-}
-#app .wrap .ghost {
-  position: absolute;
-  width: 50px;
-  height: 100px;
-  display: none;
-  overflow: hidden;
-}
-#app .wrap .ghost:nth-of-type(3) {
-  width: 200px;
-  height: 200px;
-  display: block;
-  left: 240px;
-  -webkit-clip-path: polygon(100% 0, 100% 67%, 82% 100%, 0 100%, 0 0);
-          clip-path: polygon(100% 0, 100% 67%, 82% 100%, 0 100%, 0 0);
-}
-#app .wrap .ghost:nth-of-type(3) .inner {
-  width: 50px;
-  height: 75px;
-  left: 100px;
-  transform-origin: 200% 100%;
-  box-shadow: inset 0 0 0 2px #ccc;
-  -webkit-animation: swing 10s ease-in-out infinite alternate;
-          animation: swing 10s ease-in-out infinite alternate;
-  transform: rotate(-90deg) translateY(75px);
-}
-#app .wrap .ghost:nth-of-type(3) .inner:before {
-  content: '';
-  position: absolute;
-  width: 4px;
-  height: 4px;
-  background: #ccc;
-  border-radius: 100%;
-  top: 10px;
-  right: 10px;
-  box-shadow: -15px 5px 0 0 #ccc;
-  -webkit-animation: blink2 2s ease-in-out infinite alternate;
-          animation: blink2 2s ease-in-out infinite alternate;
-}
-@-webkit-keyframes blink2 {
-  to {
-    transform: translateX(-10px) translateY(5px);
-    box-shadow: -15px -5px 0 0 #ccc;
-  }
-}
-@keyframes blink2 {
-  to {
-    transform: translateX(-10px) translateY(5px);
-    box-shadow: -15px -5px 0 0 #ccc;
-  }
-}
-@-webkit-keyframes swing {
-  68% {
-    transform: rotate(-90deg) translateY(75px);
-  }
-  70% {
-    transform: rotate(0deg) translateY(0px);
-  }
-  100% {
-    transform: rotate(0deg) translateY(0px);
-  }
-}
-@keyframes swing {
-  68% {
-    transform: rotate(-90deg) translateY(75px);
-  }
-  70% {
-    transform: rotate(0deg) translateY(0px);
-  }
-  100% {
-    transform: rotate(0deg) translateY(0px);
-  }
-}
-#app .wrap .ghost:nth-of-type(3) .inner:after {
-  content: '';
-  position: absolute;
-  width: 200px;
-  height: 125px;
-  bottom: -120px;
-  left: 0;
-  background: radial-gradient(circle at top, rgba(0, 0, 0, 0) 50px, #cccccc 50px, #cccccc 52px, #ffffff 52px, #ffffff 98px, #cccccc 98px, #cccccc 100px, rgba(0, 0, 0, 0) 100px);
-}
-#app .wrap .ghost:nth-of-type(2) {
-  display: block;
-  top: 80px;
-  right: 150px;
-}
-#app .wrap .ghost:nth-of-type(2) .inner {
-  -webkit-animation: peek1 10s ease-in-out infinite alternate;
-          animation: peek1 10s ease-in-out infinite alternate;
-  -webkit-animation-delay: 0.5s;
-          animation-delay: 0.5s;
-  transform: translateY(100%);
-}
-#app .wrap .ghost:nth-of-type(2) .inner:before {
-  content: '';
-  position: absolute;
-  width: 4px;
-  height: 4px;
-  background: #ccc;
-  border-radius: 100%;
-  top: 10px;
-  right: 10px;
-  box-shadow: -15px 5px 0 0 #ccc;
-  -webkit-animation: blink 4s linear infinite;
-          animation: blink 4s linear infinite;
-  -webkit-animation-delay: 5s;
-          animation-delay: 5s;
-}
-#app .wrap .ghost:first-of-type {
-  top: 65px;
-  left: 50px;
-  transform: rotate(-35deg);
-  display: block;
-}
-#app .wrap .ghost:first-of-type .inner {
-  -webkit-animation: peek1 10s ease-in-out infinite alternate;
-          animation: peek1 10s ease-in-out infinite alternate;
-  transform: translateY(100%);
-}
-#app .wrap .ghost:first-of-type .inner:before {
-  content: '';
-  position: absolute;
-  width: 4px;
-  height: 4px;
-  background: #ccc;
-  border-radius: 100%;
-  top: 10px;
-  left: 10px;
-  box-shadow: 15px 5px 0 0 #ccc;
-  -webkit-animation: blink 4s linear infinite;
-          animation: blink 4s linear infinite;
-  -webkit-animation-delay: 3s;
-          animation-delay: 3s;
-}
-@-webkit-keyframes blink {
-  90% {
-    transform: scaleY(1);
-  }
-  92% {
-    transform: scaleY(0);
-  }
-  94% {
-    transform: scaleY(1);
-  }
-  96% {
-    transform: scaleY(0);
-  }
-  98% {
-    transform: scaleY(1);
-  }
-}
-@keyframes blink {
-  90% {
-    transform: scaleY(1);
-  }
-  92% {
-    transform: scaleY(0);
-  }
-  94% {
-    transform: scaleY(1);
-  }
-  96% {
-    transform: scaleY(0);
-  }
-  98% {
-    transform: scaleY(1);
-  }
-}
-@-webkit-keyframes peek1 {
-  78% {
-    transform: translateY(100%);
-  }
-  80% {
-    transform: translateY(0%);
-  }
-  100% {
-    transform: translateY(0%);
-  }
-}
-@keyframes peek1 {
-  78% {
-    transform: translateY(100%);
-  }
-  80% {
-    transform: translateY(0%);
-  }
-  100% {
-    transform: translateY(0%);
-  }
-}
-#app .wrap .ghost .inner {
-  position: absolute;
-  width: 100%;
-  height: 100%;
-  box-shadow: inset 0 0 0 2px #ccc, inset 0 -10px 20px rgba(0, 0, 0, 0.05);
-  border-radius: 100px 100px 0 0;
-  top: 3px;
-  transform-style: preserve-3d;
-  background: #fff;
-}
-#app h1 {
-  z-index: -1;
-  font-size: 500px;
-  margin: 0px;
-  color: #fff;
-  transform-style: preserve-3d;
-  transform: rotateY(-30deg) rotateX(50deg);
-  text-shadow: 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #fafafa, 0px 0px 0 #fafafa, 0px 0px 0 #fafafa, 0px 0px 0 #fafafa, 0px 0px 0 #fafafa, 0px 0px 0 #fafafa, 0px 0px 0 #fafafa, 0px 0px 0 #fafafa, 0px 0px 0 #fafafa, 0px 0px 0 #fafafa, 0px 0px 0 #fafafa, 0px 0px 0 #fafafa, 0px 0px 0 #fafafa, 0px 0px 0 #fafafa, 0px 0px 0 #fafafa, 0px 0px 0 #fafafa, 0px 0px 0 #fbfbfb, 0px 0px 0 #fbfbfb, 0px 0px 0 #fbfbfb, 0px 0px 0 #fbfbfb, 0px 0px 0 #fbfbfb, 0px 0px 0 #fbfbfb, 0px 0px 0 #fbfbfb, 0px 0px 0 #fbfbfb, 0px 0px 0 #fbfbfb, 0px 0px 0 #fbfbfb, 0px 0px 0 #fbfbfb, 0px 0px 0 #fbfbfb, 0px 0px 0 #fbfbfb, 0px 0px 0 #fbfbfb, 0px 0px 0 #fbfbfb, 0px 0px 0 #fbfbfb, 0px 0px 0 #fbfbfb, 0px 0px 0 #fcfcfc, 0px 0px 0 #fcfcfc, 0px 0px 0 #fcfcfc, 0px 0px 0 #fcfcfc, 0px 0px 0 #fcfcfc, 0px 0px 0 #fcfcfc, 0px 0px 0 #fcfcfc, 0px 0px 0 #fcfcfc, 0px 0px 0 #fcfcfc, 0px 0px 0 #fcfcfc, 0px 0px 0 #fcfcfc, 0px 0px 0 #fcfcfc, 0px 0px 0 #fcfcfc, 0px 0px 0 #fcfcfc, 0px 0px 0 #fcfcfc, 0px 0px 0 #fcfcfc, 0px 0px 0 #fcfcfc, 0px 0px 0 #fdfdfd, 0px 0px 0 #fdfdfd, 0px 0px 0 #fdfdfd, 0px 0px 0 #fdfdfd, 0px 0px 0 #fdfdfd, 0px 0px 0 #fdfdfd, 0px 0px 0 #fdfdfd, 0px 0px 0 #fdfdfd, 0px 0px 0 #fdfdfd, 0px 0px 0 #fdfdfd, 0px 0px 0 #fdfdfd, 0px 0px 0 #fdfdfd, 0px 0px 0 #fdfdfd, 0px 0px 0 #fdfdfd, 0px 0px 0 #fdfdfd, 0px 0px 0 #fdfdfd, 0px 0px 0 #fefefe, 0px 0px 0 #fefefe, 0px 0px 0 #fefefe, 0px 0px 0 #fefefe, 0px 0px 0 #fefefe, 0px 0px 0 #fefefe, 0px 0px 0 #fefefe, 0px 0px 0 #fefefe, 0px 0px 0 #fefefe, 0px 0px 0 #fefefe, 0px 0px 0 #fefefe, 0px 0px 0 #fefefe, 0px 0px 0 #fefefe, 0px 0px 0 #fefefe, 0px 0px 0 #fefefe, 0px 0px 0 #fefefe, 0px 0px 0 #fefefe, 0px 0px 0 white, 0px 0px 0 white, 0px 0px 0 white, 0px 0px 0 white, 0px 0px 0 white, 0px 0px 0 white, 0px 0px 0 white, 0px 0px 0 white, 0px 0px 0 white;
-  transition: 0.2s ease-in-out;
-  -webkit-animation: shadow 10s ease-in-out infinite alternate;
-          animation: shadow 10s ease-in-out infinite alternate;
-  margin-right: -50px;
-  will-change: text-shadow;
-}
-#app h1:nth-of-type(1) {
-  -webkit-animation-delay: 0.33333s;
-          animation-delay: 0.33333s;
-}
-#app h1:nth-of-type(2) {
-  -webkit-animation-delay: 0.66667s;
-          animation-delay: 0.66667s;
-}
-#app h1:nth-of-type(3) {
-  -webkit-animation-delay: 1s;
-          animation-delay: 1s;
-}
-@-webkit-keyframes shadow {
-  15% {
-    transform: rotateY(-30deg) rotateX(50deg) translateY(0px) translateX(0px);
-    text-shadow: 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9;
-  }
-  25% {
-    transform: rotateY(-30deg) rotateX(50deg) translateY(-75px) translateX(-50px);
-    text-shadow: 0.52992px 0.84805px 0 #ececec, 1.05984px 1.6961px 0 #ececec, 1.58976px 2.54414px 0 #ebebeb, 2.11968px 3.39219px 0 #ebebeb, 2.6496px 4.24024px 0 #ebebeb, 3.17952px 5.08829px 0 #ebebeb, 3.70943px 5.93634px 0 #eaeaea, 4.23935px 6.78438px 0 #eaeaea, 4.76927px 7.63243px 0 #eaeaea, 5.29919px 8.48048px 0 #eaeaea, 5.82911px 9.32853px 0 #e9e9e9, 6.35903px 10.17658px 0 #e9e9e9, 6.88895px 11.02463px 0 #e9e9e9, 7.41887px 11.87267px 0 #e9e9e9, 7.94879px 12.72072px 0 #e8e8e8, 8.47871px 13.56877px 0 #e8e8e8, 9.00863px 14.41682px 0 #e8e8e8, 9.53855px 15.26487px 0 #e8e8e8, 10.06847px 16.11291px 0 #e7e7e7, 10.59839px 16.96096px 0 #e7e7e7, 11.1283px 17.80901px 0 #e7e7e7, 11.65822px 18.65706px 0 #e7e7e7, 12.18814px 19.50511px 0 #e6e6e6, 12.71806px 20.35315px 0 #e6e6e6, 13.24798px 21.2012px 0 #e6e6e6, 13.7779px 22.04925px 0 #e6e6e6, 14.30782px 22.8973px 0 #e5e5e5, 14.83774px 23.74535px 0 #e5e5e5, 15.36766px 24.59339px 0 #e5e5e5, 15.89758px 25.44144px 0 #e5e5e5, 16.4275px 26.28949px 0 #e4e4e4, 16.95742px 27.13754px 0 #e4e4e4, 17.48734px 27.98559px 0 #e4e4e4, 18.01725px 28.83364px 0 #e4e4e4, 18.54717px 29.68168px 0 #e3e3e3, 19.07709px 30.52973px 0 #e3e3e3, 19.60701px 31.37778px 0 #e3e3e3, 20.13693px 32.22583px 0 #e3e3e3, 20.66685px 33.07388px 0 #e2e2e2, 21.19677px 33.92192px 0 #e2e2e2, 21.72669px 34.76997px 0 #e2e2e2, 22.25661px 35.61802px 0 #e2e2e2, 22.78653px 36.46607px 0 #e1e1e1, 23.31645px 37.31412px 0 #e1e1e1, 23.84637px 38.16216px 0 #e1e1e1, 24.37629px 39.01021px 0 #e1e1e1, 24.90621px 39.85826px 0 #e0e0e0, 25.43612px 40.70631px 0 #e0e0e0, 25.96604px 41.55436px 0 #e0e0e0, 26.49596px 42.4024px 0 #e0e0e0, 27.02588px 43.25045px 0 #dfdfdf, 27.5558px 44.0985px 0 #dfdfdf, 28.08572px 44.94655px 0 #dfdfdf, 28.61564px 45.7946px 0 #dfdfdf, 29.14556px 46.64265px 0 #dedede, 29.67548px 47.49069px 0 #dedede, 30.2054px 48.33874px 0 #dedede, 30.73532px 49.18679px 0 #dedede, 31.26524px 50.03484px 0 #dddddd, 31.79516px 50.88289px 0 #dddddd, 32.32508px 51.73093px 0 #dddddd, 32.85499px 52.57898px 0 #dddddd, 33.38491px 53.42703px 0 gainsboro, 33.91483px 54.27508px 0 gainsboro, 34.44475px 55.12313px 0 gainsboro, 34.97467px 55.97117px 0 gainsboro, 35.50459px 56.81922px 0 #dbdbdb, 36.03451px 57.66727px 0 #dbdbdb, 36.56443px 58.51532px 0 #dbdbdb, 37.09435px 59.36337px 0 #dbdbdb, 37.62427px 60.21141px 0 #dadada, 38.15419px 61.05946px 0 #dadada, 38.68411px 61.90751px 0 #dadada, 39.21403px 62.75556px 0 #dadada, 39.74394px 63.60361px 0 #d9d9d9, 40.27386px 64.45166px 0 #d9d9d9, 40.80378px 65.2997px 0 #d9d9d9, 41.3337px 66.14775px 0 #d9d9d9, 41.86362px 66.9958px 0 #d8d8d8, 42.39354px 67.84385px 0 #d8d8d8, 42.92346px 68.6919px 0 #d8d8d8, 43.45338px 69.53994px 0 #d8d8d8, 43.9833px 70.38799px 0 #d7d7d7, 44.51322px 71.23604px 0 #d7d7d7, 45.04314px 72.08409px 0 #d7d7d7, 45.57306px 72.93214px 0 #d7d7d7, 46.10298px 73.78018px 0 #d6d6d6, 46.6329px 74.62823px 0 #d6d6d6, 47.16281px 75.47628px 0 #d6d6d6, 47.69273px 76.32433px 0 #d6d6d6, 48.22265px 77.17238px 0 #d5d5d5, 48.75257px 78.02042px 0 #d5d5d5, 49.28249px 78.86847px 0 #d5d5d5, 49.81241px 79.71652px 0 #d5d5d5, 50.34233px 80.56457px 0 #d4d4d4, 50.87225px 81.41262px 0 #d4d4d4, 51.40217px 82.26067px 0 #d4d4d4, 51.93209px 83.10871px 0 #d4d4d4, 52.46201px 83.95676px 0 lightgray, 52.99193px 84.80481px 0 lightgray;
-  }
-  100% {
-    transform: rotateY(-30deg) rotateX(50deg) translateY(-75px) translateX(-50px);
-    text-shadow: 0.52992px 0.84805px 0 #ececec, 1.05984px 1.6961px 0 #ececec, 1.58976px 2.54414px 0 #ebebeb, 2.11968px 3.39219px 0 #ebebeb, 2.6496px 4.24024px 0 #ebebeb, 3.17952px 5.08829px 0 #ebebeb, 3.70943px 5.93634px 0 #eaeaea, 4.23935px 6.78438px 0 #eaeaea, 4.76927px 7.63243px 0 #eaeaea, 5.29919px 8.48048px 0 #eaeaea, 5.82911px 9.32853px 0 #e9e9e9, 6.35903px 10.17658px 0 #e9e9e9, 6.88895px 11.02463px 0 #e9e9e9, 7.41887px 11.87267px 0 #e9e9e9, 7.94879px 12.72072px 0 #e8e8e8, 8.47871px 13.56877px 0 #e8e8e8, 9.00863px 14.41682px 0 #e8e8e8, 9.53855px 15.26487px 0 #e8e8e8, 10.06847px 16.11291px 0 #e7e7e7, 10.59839px 16.96096px 0 #e7e7e7, 11.1283px 17.80901px 0 #e7e7e7, 11.65822px 18.65706px 0 #e7e7e7, 12.18814px 19.50511px 0 #e6e6e6, 12.71806px 20.35315px 0 #e6e6e6, 13.24798px 21.2012px 0 #e6e6e6, 13.7779px 22.04925px 0 #e6e6e6, 14.30782px 22.8973px 0 #e5e5e5, 14.83774px 23.74535px 0 #e5e5e5, 15.36766px 24.59339px 0 #e5e5e5, 15.89758px 25.44144px 0 #e5e5e5, 16.4275px 26.28949px 0 #e4e4e4, 16.95742px 27.13754px 0 #e4e4e4, 17.48734px 27.98559px 0 #e4e4e4, 18.01725px 28.83364px 0 #e4e4e4, 18.54717px 29.68168px 0 #e3e3e3, 19.07709px 30.52973px 0 #e3e3e3, 19.60701px 31.37778px 0 #e3e3e3, 20.13693px 32.22583px 0 #e3e3e3, 20.66685px 33.07388px 0 #e2e2e2, 21.19677px 33.92192px 0 #e2e2e2, 21.72669px 34.76997px 0 #e2e2e2, 22.25661px 35.61802px 0 #e2e2e2, 22.78653px 36.46607px 0 #e1e1e1, 23.31645px 37.31412px 0 #e1e1e1, 23.84637px 38.16216px 0 #e1e1e1, 24.37629px 39.01021px 0 #e1e1e1, 24.90621px 39.85826px 0 #e0e0e0, 25.43612px 40.70631px 0 #e0e0e0, 25.96604px 41.55436px 0 #e0e0e0, 26.49596px 42.4024px 0 #e0e0e0, 27.02588px 43.25045px 0 #dfdfdf, 27.5558px 44.0985px 0 #dfdfdf, 28.08572px 44.94655px 0 #dfdfdf, 28.61564px 45.7946px 0 #dfdfdf, 29.14556px 46.64265px 0 #dedede, 29.67548px 47.49069px 0 #dedede, 30.2054px 48.33874px 0 #dedede, 30.73532px 49.18679px 0 #dedede, 31.26524px 50.03484px 0 #dddddd, 31.79516px 50.88289px 0 #dddddd, 32.32508px 51.73093px 0 #dddddd, 32.85499px 52.57898px 0 #dddddd, 33.38491px 53.42703px 0 gainsboro, 33.91483px 54.27508px 0 gainsboro, 34.44475px 55.12313px 0 gainsboro, 34.97467px 55.97117px 0 gainsboro, 35.50459px 56.81922px 0 #dbdbdb, 36.03451px 57.66727px 0 #dbdbdb, 36.56443px 58.51532px 0 #dbdbdb, 37.09435px 59.36337px 0 #dbdbdb, 37.62427px 60.21141px 0 #dadada, 38.15419px 61.05946px 0 #dadada, 38.68411px 61.90751px 0 #dadada, 39.21403px 62.75556px 0 #dadada, 39.74394px 63.60361px 0 #d9d9d9, 40.27386px 64.45166px 0 #d9d9d9, 40.80378px 65.2997px 0 #d9d9d9, 41.3337px 66.14775px 0 #d9d9d9, 41.86362px 66.9958px 0 #d8d8d8, 42.39354px 67.84385px 0 #d8d8d8, 42.92346px 68.6919px 0 #d8d8d8, 43.45338px 69.53994px 0 #d8d8d8, 43.9833px 70.38799px 0 #d7d7d7, 44.51322px 71.23604px 0 #d7d7d7, 45.04314px 72.08409px 0 #d7d7d7, 45.57306px 72.93214px 0 #d7d7d7, 46.10298px 73.78018px 0 #d6d6d6, 46.6329px 74.62823px 0 #d6d6d6, 47.16281px 75.47628px 0 #d6d6d6, 47.69273px 76.32433px 0 #d6d6d6, 48.22265px 77.17238px 0 #d5d5d5, 48.75257px 78.02042px 0 #d5d5d5, 49.28249px 78.86847px 0 #d5d5d5, 49.81241px 79.71652px 0 #d5d5d5, 50.34233px 80.56457px 0 #d4d4d4, 50.87225px 81.41262px 0 #d4d4d4, 51.40217px 82.26067px 0 #d4d4d4, 51.93209px 83.10871px 0 #d4d4d4, 52.46201px 83.95676px 0 lightgray, 52.99193px 84.80481px 0 lightgray;
-  }
-}
-@keyframes shadow {
-  15% {
-    transform: rotateY(-30deg) rotateX(50deg) translateY(0px) translateX(0px);
-    text-shadow: 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9, 0px 0px 0 #f9f9f9;
-  }
-  25% {
-    transform: rotateY(-30deg) rotateX(50deg) translateY(-75px) translateX(-50px);
-    text-shadow: 0.52992px 0.84805px 0 #ececec, 1.05984px 1.6961px 0 #ececec, 1.58976px 2.54414px 0 #ebebeb, 2.11968px 3.39219px 0 #ebebeb, 2.6496px 4.24024px 0 #ebebeb, 3.17952px 5.08829px 0 #ebebeb, 3.70943px 5.93634px 0 #eaeaea, 4.23935px 6.78438px 0 #eaeaea, 4.76927px 7.63243px 0 #eaeaea, 5.29919px 8.48048px 0 #eaeaea, 5.82911px 9.32853px 0 #e9e9e9, 6.35903px 10.17658px 0 #e9e9e9, 6.88895px 11.02463px 0 #e9e9e9, 7.41887px 11.87267px 0 #e9e9e9, 7.94879px 12.72072px 0 #e8e8e8, 8.47871px 13.56877px 0 #e8e8e8, 9.00863px 14.41682px 0 #e8e8e8, 9.53855px 15.26487px 0 #e8e8e8, 10.06847px 16.11291px 0 #e7e7e7, 10.59839px 16.96096px 0 #e7e7e7, 11.1283px 17.80901px 0 #e7e7e7, 11.65822px 18.65706px 0 #e7e7e7, 12.18814px 19.50511px 0 #e6e6e6, 12.71806px 20.35315px 0 #e6e6e6, 13.24798px 21.2012px 0 #e6e6e6, 13.7779px 22.04925px 0 #e6e6e6, 14.30782px 22.8973px 0 #e5e5e5, 14.83774px 23.74535px 0 #e5e5e5, 15.36766px 24.59339px 0 #e5e5e5, 15.89758px 25.44144px 0 #e5e5e5, 16.4275px 26.28949px 0 #e4e4e4, 16.95742px 27.13754px 0 #e4e4e4, 17.48734px 27.98559px 0 #e4e4e4, 18.01725px 28.83364px 0 #e4e4e4, 18.54717px 29.68168px 0 #e3e3e3, 19.07709px 30.52973px 0 #e3e3e3, 19.60701px 31.37778px 0 #e3e3e3, 20.13693px 32.22583px 0 #e3e3e3, 20.66685px 33.07388px 0 #e2e2e2, 21.19677px 33.92192px 0 #e2e2e2, 21.72669px 34.76997px 0 #e2e2e2, 22.25661px 35.61802px 0 #e2e2e2, 22.78653px 36.46607px 0 #e1e1e1, 23.31645px 37.31412px 0 #e1e1e1, 23.84637px 38.16216px 0 #e1e1e1, 24.37629px 39.01021px 0 #e1e1e1, 24.90621px 39.85826px 0 #e0e0e0, 25.43612px 40.70631px 0 #e0e0e0, 25.96604px 41.55436px 0 #e0e0e0, 26.49596px 42.4024px 0 #e0e0e0, 27.02588px 43.25045px 0 #dfdfdf, 27.5558px 44.0985px 0 #dfdfdf, 28.08572px 44.94655px 0 #dfdfdf, 28.61564px 45.7946px 0 #dfdfdf, 29.14556px 46.64265px 0 #dedede, 29.67548px 47.49069px 0 #dedede, 30.2054px 48.33874px 0 #dedede, 30.73532px 49.18679px 0 #dedede, 31.26524px 50.03484px 0 #dddddd, 31.79516px 50.88289px 0 #dddddd, 32.32508px 51.73093px 0 #dddddd, 32.85499px 52.57898px 0 #dddddd, 33.38491px 53.42703px 0 gainsboro, 33.91483px 54.27508px 0 gainsboro, 34.44475px 55.12313px 0 gainsboro, 34.97467px 55.97117px 0 gainsboro, 35.50459px 56.81922px 0 #dbdbdb, 36.03451px 57.66727px 0 #dbdbdb, 36.56443px 58.51532px 0 #dbdbdb, 37.09435px 59.36337px 0 #dbdbdb, 37.62427px 60.21141px 0 #dadada, 38.15419px 61.05946px 0 #dadada, 38.68411px 61.90751px 0 #dadada, 39.21403px 62.75556px 0 #dadada, 39.74394px 63.60361px 0 #d9d9d9, 40.27386px 64.45166px 0 #d9d9d9, 40.80378px 65.2997px 0 #d9d9d9, 41.3337px 66.14775px 0 #d9d9d9, 41.86362px 66.9958px 0 #d8d8d8, 42.39354px 67.84385px 0 #d8d8d8, 42.92346px 68.6919px 0 #d8d8d8, 43.45338px 69.53994px 0 #d8d8d8, 43.9833px 70.38799px 0 #d7d7d7, 44.51322px 71.23604px 0 #d7d7d7, 45.04314px 72.08409px 0 #d7d7d7, 45.57306px 72.93214px 0 #d7d7d7, 46.10298px 73.78018px 0 #d6d6d6, 46.6329px 74.62823px 0 #d6d6d6, 47.16281px 75.47628px 0 #d6d6d6, 47.69273px 76.32433px 0 #d6d6d6, 48.22265px 77.17238px 0 #d5d5d5, 48.75257px 78.02042px 0 #d5d5d5, 49.28249px 78.86847px 0 #d5d5d5, 49.81241px 79.71652px 0 #d5d5d5, 50.34233px 80.56457px 0 #d4d4d4, 50.87225px 81.41262px 0 #d4d4d4, 51.40217px 82.26067px 0 #d4d4d4, 51.93209px 83.10871px 0 #d4d4d4, 52.46201px 83.95676px 0 lightgray, 52.99193px 84.80481px 0 lightgray;
-  }
-  100% {
-    transform: rotateY(-30deg) rotateX(50deg) translateY(-75px) translateX(-50px);
-    text-shadow: 0.52992px 0.84805px 0 #ececec, 1.05984px 1.6961px 0 #ececec, 1.58976px 2.54414px 0 #ebebeb, 2.11968px 3.39219px 0 #ebebeb, 2.6496px 4.24024px 0 #ebebeb, 3.17952px 5.08829px 0 #ebebeb, 3.70943px 5.93634px 0 #eaeaea, 4.23935px 6.78438px 0 #eaeaea, 4.76927px 7.63243px 0 #eaeaea, 5.29919px 8.48048px 0 #eaeaea, 5.82911px 9.32853px 0 #e9e9e9, 6.35903px 10.17658px 0 #e9e9e9, 6.88895px 11.02463px 0 #e9e9e9, 7.41887px 11.87267px 0 #e9e9e9, 7.94879px 12.72072px 0 #e8e8e8, 8.47871px 13.56877px 0 #e8e8e8, 9.00863px 14.41682px 0 #e8e8e8, 9.53855px 15.26487px 0 #e8e8e8, 10.06847px 16.11291px 0 #e7e7e7, 10.59839px 16.96096px 0 #e7e7e7, 11.1283px 17.80901px 0 #e7e7e7, 11.65822px 18.65706px 0 #e7e7e7, 12.18814px 19.50511px 0 #e6e6e6, 12.71806px 20.35315px 0 #e6e6e6, 13.24798px 21.2012px 0 #e6e6e6, 13.7779px 22.04925px 0 #e6e6e6, 14.30782px 22.8973px 0 #e5e5e5, 14.83774px 23.74535px 0 #e5e5e5, 15.36766px 24.59339px 0 #e5e5e5, 15.89758px 25.44144px 0 #e5e5e5, 16.4275px 26.28949px 0 #e4e4e4, 16.95742px 27.13754px 0 #e4e4e4, 17.48734px 27.98559px 0 #e4e4e4, 18.01725px 28.83364px 0 #e4e4e4, 18.54717px 29.68168px 0 #e3e3e3, 19.07709px 30.52973px 0 #e3e3e3, 19.60701px 31.37778px 0 #e3e3e3, 20.13693px 32.22583px 0 #e3e3e3, 20.66685px 33.07388px 0 #e2e2e2, 21.19677px 33.92192px 0 #e2e2e2, 21.72669px 34.76997px 0 #e2e2e2, 22.25661px 35.61802px 0 #e2e2e2, 22.78653px 36.46607px 0 #e1e1e1, 23.31645px 37.31412px 0 #e1e1e1, 23.84637px 38.16216px 0 #e1e1e1, 24.37629px 39.01021px 0 #e1e1e1, 24.90621px 39.85826px 0 #e0e0e0, 25.43612px 40.70631px 0 #e0e0e0, 25.96604px 41.55436px 0 #e0e0e0, 26.49596px 42.4024px 0 #e0e0e0, 27.02588px 43.25045px 0 #dfdfdf, 27.5558px 44.0985px 0 #dfdfdf, 28.08572px 44.94655px 0 #dfdfdf, 28.61564px 45.7946px 0 #dfdfdf, 29.14556px 46.64265px 0 #dedede, 29.67548px 47.49069px 0 #dedede, 30.2054px 48.33874px 0 #dedede, 30.73532px 49.18679px 0 #dedede, 31.26524px 50.03484px 0 #dddddd, 31.79516px 50.88289px 0 #dddddd, 32.32508px 51.73093px 0 #dddddd, 32.85499px 52.57898px 0 #dddddd, 33.38491px 53.42703px 0 gainsboro, 33.91483px 54.27508px 0 gainsboro, 34.44475px 55.12313px 0 gainsboro, 34.97467px 55.97117px 0 gainsboro, 35.50459px 56.81922px 0 #dbdbdb, 36.03451px 57.66727px 0 #dbdbdb, 36.56443px 58.51532px 0 #dbdbdb, 37.09435px 59.36337px 0 #dbdbdb, 37.62427px 60.21141px 0 #dadada, 38.15419px 61.05946px 0 #dadada, 38.68411px 61.90751px 0 #dadada, 39.21403px 62.75556px 0 #dadada, 39.74394px 63.60361px 0 #d9d9d9, 40.27386px 64.45166px 0 #d9d9d9, 40.80378px 65.2997px 0 #d9d9d9, 41.3337px 66.14775px 0 #d9d9d9, 41.86362px 66.9958px 0 #d8d8d8, 42.39354px 67.84385px 0 #d8d8d8, 42.92346px 68.6919px 0 #d8d8d8, 43.45338px 69.53994px 0 #d8d8d8, 43.9833px 70.38799px 0 #d7d7d7, 44.51322px 71.23604px 0 #d7d7d7, 45.04314px 72.08409px 0 #d7d7d7, 45.57306px 72.93214px 0 #d7d7d7, 46.10298px 73.78018px 0 #d6d6d6, 46.6329px 74.62823px 0 #d6d6d6, 47.16281px 75.47628px 0 #d6d6d6, 47.69273px 76.32433px 0 #d6d6d6, 48.22265px 77.17238px 0 #d5d5d5, 48.75257px 78.02042px 0 #d5d5d5, 49.28249px 78.86847px 0 #d5d5d5, 49.81241px 79.71652px 0 #d5d5d5, 50.34233px 80.56457px 0 #d4d4d4, 50.87225px 81.41262px 0 #d4d4d4, 51.40217px 82.26067px 0 #d4d4d4, 51.93209px 83.10871px 0 #d4d4d4, 52.46201px 83.95676px 0 lightgray, 52.99193px 84.80481px 0 lightgray;
-  }
-}

public/css/views/color.css

@@ -1,95 +0,0 @@
-.page {
-  min-height: 100%;
-  padding-top: 20px;
-  position: relative;
-}
-
-.color_list {
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  -ms-flex-wrap: wrap;
-      flex-wrap: wrap;
-}
-
-.color_list .color_item {
-  position: relative;
-  display: inline-block;
-  border-radius: 5px;
-  overflow: hidden;
-  padding: 5px 10px;
-  cursor: pointer;
-  width: 100px;
-  height: 125px;
-}
-
-.color_list .color_item:hover .color_add {
-  -webkit-transform: translate(-50%, -50%) scale(1.3);
-          transform: translate(-50%, -50%) scale(1.3);
-}
-
-.color_list .color_item .color_add {
-  width: 50px;
-  height: 50px;
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  -webkit-transition: -webkit-transform .3s linear;
-  transition: -webkit-transform .3s linear;
-  transition: transform .3s linear;
-  transition: transform .3s linear, -webkit-transform .3s linear;
-  -webkit-transform: translate(-50%, -50%);
-          transform: translate(-50%, -50%);
-}
-
-.color_list .color_item:hover {
-  background-color: rgba(0, 0, 0, 0.041);
-}
-
-.color_list .color_item:hover .color_toggle_list {
-  max-height: 99px;
-}
-
-.color_list .color_item .color_toggle_list {
-  overflow: hidden;
-  position: absolute;
-  bottom: 0;
-  left: 0;
-  right: 0;
-  width: 100%;
-  max-height: 0;
-  -webkit-transition: max-height .5s linear;
-  transition: max-height .5s linear;
-  background-color: rgba(180, 180, 180, 0.274);
-}
-
-.color_list .color_item .color_toggle_list .color_toggle_item {
-  display: inline-block;
-  padding: 2px 6px;
-}
-
-.color_list .color_item .color_toggle_list .color_toggle_item:hover {
-  background-color: rgba(0, 0, 0, 0.185);
-}
-
-.color_list .color_item .color_item_bg {
-  height: 50px;
-  background-color: red;
-  position: relative;
-}
-
-.color_list .color_item .color_item_content .color_item_title {
-  font-size: 1.2em;
-  font-weight: bold;
-}
-
-.color_list .color_item .color_item_content .color_item_desc {
-  color: #a7a6a6;
-  display: -webkit-box;
-  -webkit-box-orient: vertical;
-  -webkit-line-clamp: 2;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  word-break: break-all;
-}
-/*# sourceMappingURL=color.css.map */

public/css/views/color.css.map

@@ -1,10 +0,0 @@
-{
-    "version": 3,
-    "mappings": "AAEA,AAAA,KAAK,CAAC;EACJ,UAAU,EAAE,IAAI;EAChB,WAAW,EAAE,IAAI;EACjB,QAAQ,EAAE,QAAQ;CACnB;;AAED,AAAA,WAAW,CAAC;EACV,OAAO,EAAE,IAAI;EACb,SAAS,EAAE,IAAI;CAgEhB;;AAlED,AAGE,WAHS,CAGT,WAAW,CAAC;EACV,QAAQ,EAAE,QAAQ;EAClB,OAAO,EAAE,YAAY;EACrB,aAAa,EAAE,GAAG;EAClB,QAAQ,EAAE,MAAM;EAChB,OAAO,EAAE,QAAQ;EACjB,MAAM,EAAE,OAAO;EACf,KAAK,EAAE,KAAK;EACZ,MAAM,EAAE,KAAK;CAsDd;;AAjEH,AAaM,WAbK,CAGT,WAAW,AASR,MAAM,CACL,UAAU,CAAA;EACR,SAAS,EAAE,qBAAoB,CAAC,UAAU;CAC3C;;AAfP,AAiBI,WAjBO,CAGT,WAAW,CAcT,UAAU,CAAA;EACR,KAAK,EAAE,IAAI;EACX,MAAM,EAAE,IAAI;EACZ,QAAQ,EAAE,QAAQ;EAClB,GAAG,EAAE,GAAG;EACR,IAAI,EAAE,GAAG;EACT,UAAU,EAAE,oBAAoB;EAChC,SAAS,EAAE,qBAAoB;CAChC;;AAzBL,AA0BI,WA1BO,CAGT,WAAW,AAuBR,MAAM,CAAC;EACN,gBAAgB,EAAE,oBAAoB;CAIvC;;AA/BL,AA4BM,WA5BK,CAGT,WAAW,AAuBR,MAAM,CAEL,kBAAkB,CAAC;EACjB,UAAU,EAAE,IAAI;CACjB;;AA9BP,AAgCI,WAhCO,CAGT,WAAW,CA6BT,kBAAkB,CAAC;EACjB,QAAQ,EAAE,MAAM;EAChB,QAAQ,EAAE,QAAQ;EAClB,MAAM,EAAE,CAAC;EACT,IAAI,EAAE,CAAC;EACP,KAAK,EAAE,CAAC;EACR,KAAK,EAAE,IAAI;EACX,UAAU,EAAE,CAAC;EACb,UAAU,EAAE,qBAAqB;EACjC,gBAAgB,EAAE,0BAA0B;CAQ7C;;AAjDL,AA0CM,WA1CK,CAGT,WAAW,CA6BT,kBAAkB,CAUhB,kBAAkB,CAAC;EACjB,OAAO,EAAE,YAAY;EACrB,OAAO,EAAE,OAAO;CAIjB;;AAhDP,AA6CQ,WA7CG,CAGT,WAAW,CA6BT,kBAAkB,CAUhB,kBAAkB,AAGf,MAAM,CAAC;EACN,gBAAgB,EAAE,oBAAoB;CACvC;;AA/CT,AAkDI,WAlDO,CAGT,WAAW,CA+CT,cAAc,CAAC;EACb,MAAM,EAAE,IAAI;EACZ,gBAAgB,EAAE,GAAG;EACrB,QAAQ,EAAE,QAAQ;CACnB;;AAtDL,AAwDM,WAxDK,CAGT,WAAW,CAoDT,mBAAmB,CACjB,iBAAiB,CAAC;EAChB,SAAS,EAAE,KAAK;EAChB,WAAW,EAAE,IAAI;CAClB;;AA3DP,AA4DM,WA5DK,CAGT,WAAW,CAoDT,mBAAmB,CAKjB,gBAAgB,CAAC;EACf,KAAK,EAAE,OAAkB;ECzC7B,OAAO,EAAE,WAAW;EACpB,kBAAkB,EAAE,QAAQ;EAC5B,kBAAkB,EDwCI,CAAC;ECvCvB,QAAQ,EAAE,MAAM;EAChB,aAAa,EAAE,QAAQ;EACvB,UAAU,EAAE,SAAS;CDsClB",
-    "sources": [
-        "color.scss",
-        "../tool/_tool.scss"
-    ],
-    "names": [],
-    "file": "color.css"
-}

public/css/views/color.scss

@@ -1,75 +0,0 @@
-@import "../tool/tool";
-
-.page {
-  min-height: 100%;
-  padding-top: 20px;
-  position: relative;
-}
-
-.color_list {
-  display: flex;
-  flex-wrap: wrap;
-  .color_item {
-    position: relative;
-    display: inline-block;
-    border-radius: 5px;
-    overflow: hidden;
-    padding: 5px 10px;
-    cursor: pointer;
-    width: 100px;
-    height: 125px;
-    &:hover{
-      .color_add{
-        transform: translate(-50%,-50%) scale(1.3);
-      }
-    }
-    .color_add{
-      width: 50px;
-      height: 50px;
-      position: absolute;
-      top: 50%;
-      left: 50%;
-      transition: transform .3s linear;
-      transform: translate(-50%,-50%);
-    }
-    &:hover {
-      background-color: rgba(0, 0, 0, 0.041);
-      .color_toggle_list {
-        max-height: 99px;
-      }
-    }
-    .color_toggle_list {
-      overflow: hidden;
-      position: absolute;
-      bottom: 0;
-      left: 0;
-      right: 0;
-      width: 100%;
-      max-height: 0;
-      transition: max-height .5s linear;
-      background-color: rgba(180, 180, 180, 0.274);
-      .color_toggle_item {
-        display: inline-block;
-        padding: 2px 6px;
-        &:hover {
-          background-color: rgba(0, 0, 0, 0.185);
-        }
-      }
-    }
-    .color_item_bg {
-      height: 50px;
-      background-color: red;
-      position: relative;
-    }
-    .color_item_content {
-      .color_item_title {
-        font-size: 1.2em;
-        font-weight: bold;
-      }
-      .color_item_desc {
-        color: rgb(167, 166, 166);
-        @include ellipsis(2);
-      }
-    }
-  }
-}

public/css/views/index.css

@@ -1,60 +0,0 @@
-@charset "UTF-8";
-.avatar {
-  width: 100px;
-  height: 100px;
-  border-radius: 50%;
-}
-
-.page {
-  min-height: 100%;
-  padding-top: 20px;
-  position: relative;
-}
-
-/*
-  用户信息样式
-*/
-.userinfo {
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-align: center;
-      -ms-flex-align: center;
-          align-items: center;
-  width: 500px;
-}
-
-@media (max-width: 768px) {
-  .userinfo {
-    width: 100%;
-  }
-}
-
-@media (max-width: 920px) {
-  .userinfo {
-    width: 100%;
-  }
-}
-
-.userinfo .user_detail {
-  -webkit-box-flex: 1;
-      -ms-flex: 1;
-          flex: 1;
-  margin-left: 10px;
-}
-
-.userinfo .user_detail .user_name {
-  font-size: 1.67em;
-}
-
-.userinfo .user_detail .user_desc {
-  text-indent: 10px;
-  padding-top: 5px;
-  display: -webkit-box;
-  -webkit-box-orient: vertical;
-  -webkit-line-clamp: 3;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  word-break: break-all;
-}
-/*# sourceMappingURL=index.css.map */

public/css/views/index.css.map

@@ -1,10 +0,0 @@
-{
-    "version": 3,
-    "mappings": ";AAOA,AAAA,OAAO,CAAA;EACL,KAAK,EAAE,KAAK;EACZ,MAAM,EAAE,KAAK;EACb,aAAa,EAAE,GAAG;CACnB;;AAED,AAAA,KAAK,CAAA;EACH,UAAU,EAAE,IAAI;EAChB,WAAW,EAAE,IAAI;EACjB,QAAQ,EAAE,QAAQ;CACnB;;AAED;;EAEE;AACF,AAAA,SAAS,CAAA;EACP,OAAO,EAAE,IAAI;EACb,WAAW,EAAE,MAAM;EACnB,KAAK,EAAE,KAAK;CAgBb;;ACtCK,MAAM,EAAE,SAAS,EAAE,KAAK;EDmB9B,AAAA,SAAS,CAAA;IAKL,KAAK,EAAE,IAAI;GAcd;;;AClCK,MAAM,EAAE,SAAS,EAAE,KAAK;EDe9B,AAAA,SAAS,CAAA;IAKL,KAAK,EAAE,IAAI;GAcd;;;AAnBD,AAOE,SAPO,CAOP,YAAY,CAAA;EACV,IAAI,EAAE,CAAC;EACP,WAAW,EAAE,IAAI;CASlB;;AAlBH,AAUI,SAVK,CAOP,YAAY,CAGV,UAAU,CAAA;EACR,SAAS,EAAE,MAAM;CAClB;;AAZL,AAaI,SAbK,CAOP,YAAY,CAMV,UAAU,CAAA;EACR,WAAW,EAAE,IAAI;EACjB,WAAW,EAAE,GAAG;ECTlB,OAAO,EAAE,WAAW;EACpB,kBAAkB,EAAE,QAAQ;EAC5B,kBAAkB,EDQE,CAAC;ECPrB,QAAQ,EAAE,MAAM;EAChB,aAAa,EAAE,QAAQ;EACvB,UAAU,EAAE,SAAS;CDMpB",
-    "sources": [
-        "index.scss",
-        "../tool/_tool.scss"
-    ],
-    "names": [],
-    "file": "index.css"
-}

public/css/views/index.scss

@@ -1,43 +0,0 @@
-@import "../tool/tool";
-
-// body{
-//   background-image: url(/public/image/gezi.png);
-//   background-size: 20px 20px;
-// }
-
-.avatar{
-  width: 100px;
-  height: 100px;
-  border-radius: 50%;
-}
-
-.page{
-  min-height: 100%;
-  padding-top: 20px;
-  position: relative;
-}
-
-/*
-  用户信息样式
-*/
-.userinfo{
-  display: flex;
-  align-items: center;
-  width: 500px;
-  @include media(xs,sm) {
-    width: 100%;
-  }
-  .user_detail{
-    flex: 1;
-    margin-left: 10px;
-    .user_name{
-      font-size: 1.67em; // 20px/12
-    }
-    .user_desc{
-      text-indent: 10px; //
-      padding-top: 5px;
-      @include ellipsis(3)
-    }
-  }
-}
-

public/image/icons/error.svg

@@ -1 +0,0 @@
-<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1663034594471" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1381" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M512 0C229.23 0 0 229.23 0 512s229.23 512 512 512 512-229.23 512-512S794.77 0 512 0z m169.71 568.57a80 80 0 0 1-113.14 113.14L512 625.14l-56.57 56.57a80 80 0 1 1-113.14-113.14L398.86 512l-56.57-56.57a80 80 0 1 1 113.14-113.14L512 398.86l56.57-56.57a80 80 0 1 1 113.14 113.14L625.14 512z" p-id="1382" fill="#d81e06"></path></svg>

public/js/common/main.js

@@ -0,0 +1,38 @@
+document.addEventListener("DOMContentLoaded", () => {
+    // Get all "navbar-burger" elements
+    const $navbarBurgers = Array.prototype.slice.call(document.querySelectorAll(".navbar-burger"), 0)
+
+    // Add a click event on each of them
+    $navbarBurgers.forEach(el => {
+        el.addEventListener("click", () => {
+            // Get the target from the "data-target" attribute
+            const target = el.dataset.target
+            const $target = document.getElementById(target)
+
+            // Toggle the "is-active" class on both the "navbar-burger" and the "navbar-menu"
+            el.classList.toggle("is-active")
+            $target.classList.toggle("is-active")
+        })
+    })
+
+    const $messages = Array.prototype.slice.call(document.querySelectorAll(".message-container .message button.delete"), 0)
+    $messages.forEach((el, index) => {
+        let timeID;
+        function click() {
+          // Get the target from the "data-target" attribute
+          const target = el.dataset.target
+          const $target = document.getElementById(target)
+          el.removeEventListener("click", click)
+          $target.remove()
+          clearTimeout(timeID)
+        }
+        timeID = setTimeout(() => {
+          const target = el.dataset.target
+          const $target = document.getElementById(target)
+          el.removeEventListener("click", click)
+          $target.remove()
+        }, (index + 1) * 6000);
+        el.addEventListener("click", click)
+    })
+})
+

public/style/common/normalize.css

@@ -8,344 +8,342 @@
  * 2. Prevent adjustments of font size after orientation changes in iOS.
  */
 
-html {
-    line-height: 1.15; /* 1 */
-    -webkit-text-size-adjust: 100%; /* 2 */
+ html {
+  line-height: 1.15; /* 1 */
+  -webkit-text-size-adjust: 100%; /* 2 */
 }
 
 /* Sections
-     ========================================================================== */
+   ========================================================================== */
 
 /**
-   * Remove the margin in all browsers.
-   */
+ * Remove the margin in all browsers.
+ */
 
 body {
-    margin: 0;
+  margin: 0;
 }
 
 /**
-   * Render the `main` element consistently in IE.
-   */
+ * Render the `main` element consistently in IE.
+ */
 
 main {
-    display: block;
+  display: block;
 }
 
 /**
-   * Correct the font size and margin on `h1` elements within `section` and
-   * `article` contexts in Chrome, Firefox, and Safari.
-   */
+ * Correct the font size and margin on `h1` elements within `section` and
+ * `article` contexts in Chrome, Firefox, and Safari.
+ */
 
 h1 {
-    font-size: 2em;
-    margin: 0.67em 0;
+  font-size: 2em;
+  margin: 0.67em 0;
 }
 
 /* Grouping content
-     ========================================================================== */
+   ========================================================================== */
 
 /**
-   * 1. Add the correct box sizing in Firefox.
-   * 2. Show the overflow in Edge and IE.
-   */
+ * 1. Add the correct box sizing in Firefox.
+ * 2. Show the overflow in Edge and IE.
+ */
 
 hr {
-    box-sizing: content-box; /* 1 */
-    height: 0; /* 1 */
-    overflow: visible; /* 2 */
+  box-sizing: content-box; /* 1 */
+  height: 0; /* 1 */
+  overflow: visible; /* 2 */
 }
 
 /**
-   * 1. Correct the inheritance and scaling of font size in all browsers.
-   * 2. Correct the odd `em` font sizing in all browsers.
-   */
+ * 1. Correct the inheritance and scaling of font size in all browsers.
+ * 2. Correct the odd `em` font sizing in all browsers.
+ */
 
 pre {
-    font-family: monospace, monospace; /* 1 */
-    font-size: 1em; /* 2 */
+  font-family: monospace, monospace; /* 1 */
+  font-size: 1em; /* 2 */
 }
 
 /* Text-level semantics
-     ========================================================================== */
+   ========================================================================== */
 
 /**
-   * Remove the gray background on active links in IE 10.
-   */
+ * Remove the gray background on active links in IE 10.
+ */
 
 a {
-    background-color: transparent;
+  background-color: transparent;
 }
 
 /**
-   * 1. Remove the bottom border in Chrome 57-
-   * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
-   */
+ * 1. Remove the bottom border in Chrome 57-
+ * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
+ */
 
 abbr[title] {
-    border-bottom: none; /* 1 */
-    text-decoration: underline; /* 2 */
-    text-decoration: underline dotted; /* 2 */
+  border-bottom: none; /* 1 */
+  text-decoration: underline; /* 2 */
+  text-decoration: underline dotted; /* 2 */
 }
 
 /**
-   * Add the correct font weight in Chrome, Edge, and Safari.
-   */
+ * Add the correct font weight in Chrome, Edge, and Safari.
+ */
 
 b,
 strong {
-    font-weight: bolder;
+  font-weight: bolder;
 }
 
 /**
-   * 1. Correct the inheritance and scaling of font size in all browsers.
-   * 2. Correct the odd `em` font sizing in all browsers.
-   */
+ * 1. Correct the inheritance and scaling of font size in all browsers.
+ * 2. Correct the odd `em` font sizing in all browsers.
+ */
 
 code,
 kbd,
 samp {
-    font-family: monospace, monospace; /* 1 */
-    font-size: 1em; /* 2 */
+  font-family: monospace, monospace; /* 1 */
+  font-size: 1em; /* 2 */
 }
 
 /**
-   * Add the correct font size in all browsers.
-   */
+ * Add the correct font size in all browsers.
+ */
 
 small {
-    font-size: 80%;
+  font-size: 80%;
 }
 
 /**
-   * Prevent `sub` and `sup` elements from affecting the line height in
-   * all browsers.
-   */
+ * Prevent `sub` and `sup` elements from affecting the line height in
+ * all browsers.
+ */
 
 sub,
 sup {
-    font-size: 75%;
-    line-height: 0;
-    position: relative;
-    vertical-align: baseline;
+  font-size: 75%;
+  line-height: 0;
+  position: relative;
+  vertical-align: baseline;
 }
 
 sub {
-    bottom: -0.25em;
+  bottom: -0.25em;
 }
 
 sup {
-    top: -0.5em;
+  top: -0.5em;
 }
 
 /* Embedded content
-     ========================================================================== */
+   ========================================================================== */
 
 /**
-   * Remove the border on images inside links in IE 10.
-   */
+ * Remove the border on images inside links in IE 10.
+ */
 
 img {
-    border-style: none;
+  border-style: none;
 }
 
 /* Forms
-     ========================================================================== */
+   ========================================================================== */
 
 /**
-   * 1. Change the font styles in all browsers.
-   * 2. Remove the margin in Firefox and Safari.
-   */
+ * 1. Change the font styles in all browsers.
+ * 2. Remove the margin in Firefox and Safari.
+ */
 
 button,
 input,
 optgroup,
 select,
 textarea {
-    font-family: inherit; /* 1 */
-    font-size: 100%; /* 1 */
-    line-height: 1.15; /* 1 */
-    margin: 0; /* 2 */
+  font-family: inherit; /* 1 */
+  font-size: 100%; /* 1 */
+  line-height: 1.15; /* 1 */
+  margin: 0; /* 2 */
 }
 
 /**
-   * Show the overflow in IE.
-   * 1. Show the overflow in Edge.
-   */
+ * Show the overflow in IE.
+ * 1. Show the overflow in Edge.
+ */
 
 button,
-input {
-    /* 1 */
-    overflow: visible;
+input { /* 1 */
+  overflow: visible;
 }
 
 /**
-   * Remove the inheritance of text transform in Edge, Firefox, and IE.
-   * 1. Remove the inheritance of text transform in Firefox.
-   */
+ * Remove the inheritance of text transform in Edge, Firefox, and IE.
+ * 1. Remove the inheritance of text transform in Firefox.
+ */
 
 button,
-select {
-    /* 1 */
-    text-transform: none;
+select { /* 1 */
+  text-transform: none;
 }
 
 /**
-   * Correct the inability to style clickable types in iOS and Safari.
-   */
+ * Correct the inability to style clickable types in iOS and Safari.
+ */
 
 button,
 [type="button"],
 [type="reset"],
 [type="submit"] {
-    -webkit-appearance: button;
+  -webkit-appearance: button;
 }
 
 /**
-   * Remove the inner border and padding in Firefox.
-   */
+ * Remove the inner border and padding in Firefox.
+ */
 
 button::-moz-focus-inner,
 [type="button"]::-moz-focus-inner,
 [type="reset"]::-moz-focus-inner,
 [type="submit"]::-moz-focus-inner {
-    border-style: none;
-    padding: 0;
+  border-style: none;
+  padding: 0;
 }
 
 /**
-   * Restore the focus styles unset by the previous rule.
-   */
+ * Restore the focus styles unset by the previous rule.
+ */
 
 button:-moz-focusring,
 [type="button"]:-moz-focusring,
 [type="reset"]:-moz-focusring,
 [type="submit"]:-moz-focusring {
-    outline: 1px dotted ButtonText;
+  outline: 1px dotted ButtonText;
 }
 
 /**
-   * Correct the padding in Firefox.
-   */
+ * Correct the padding in Firefox.
+ */
 
 fieldset {
-    padding: 0.35em 0.75em 0.625em;
+  padding: 0.35em 0.75em 0.625em;
 }
 
 /**
-   * 1. Correct the text wrapping in Edge and IE.
-   * 2. Correct the color inheritance from `fieldset` elements in IE.
-   * 3. Remove the padding so developers are not caught out when they zero out
-   *    `fieldset` elements in all browsers.
-   */
+ * 1. Correct the text wrapping in Edge and IE.
+ * 2. Correct the color inheritance from `fieldset` elements in IE.
+ * 3. Remove the padding so developers are not caught out when they zero out
+ *    `fieldset` elements in all browsers.
+ */
 
 legend {
-    box-sizing: border-box; /* 1 */
-    color: inherit; /* 2 */
-    display: table; /* 1 */
-    max-width: 100%; /* 1 */
-    padding: 0; /* 3 */
-    white-space: normal; /* 1 */
+  box-sizing: border-box; /* 1 */
+  color: inherit; /* 2 */
+  display: table; /* 1 */
+  max-width: 100%; /* 1 */
+  padding: 0; /* 3 */
+  white-space: normal; /* 1 */
 }
 
 /**
-   * Add the correct vertical alignment in Chrome, Firefox, and Opera.
-   */
+ * Add the correct vertical alignment in Chrome, Firefox, and Opera.
+ */
 
 progress {
-    vertical-align: baseline;
+  vertical-align: baseline;
 }
 
 /**
-   * Remove the default vertical scrollbar in IE 10+.
-   */
+ * Remove the default vertical scrollbar in IE 10+.
+ */
 
 textarea {
-    overflow: auto;
+  overflow: auto;
 }
 
 /**
-   * 1. Add the correct box sizing in IE 10.
-   * 2. Remove the padding in IE 10.
-   */
+ * 1. Add the correct box sizing in IE 10.
+ * 2. Remove the padding in IE 10.
+ */
 
 [type="checkbox"],
 [type="radio"] {
-    box-sizing: border-box; /* 1 */
-    padding: 0; /* 2 */
+  box-sizing: border-box; /* 1 */
+  padding: 0; /* 2 */
 }
 
 /**
-   * Correct the cursor style of increment and decrement buttons in Chrome.
-   */
+ * Correct the cursor style of increment and decrement buttons in Chrome.
+ */
 
 [type="number"]::-webkit-inner-spin-button,
 [type="number"]::-webkit-outer-spin-button {
-    height: auto;
+  height: auto;
 }
 
 /**
-   * 1. Correct the odd appearance in Chrome and Safari.
-   * 2. Correct the outline style in Safari.
-   */
+ * 1. Correct the odd appearance in Chrome and Safari.
+ * 2. Correct the outline style in Safari.
+ */
 
 [type="search"] {
-    -webkit-appearance: textfield; /* 1 */
-    outline-offset: -2px; /* 2 */
+  -webkit-appearance: textfield; /* 1 */
+  outline-offset: -2px; /* 2 */
 }
 
 /**
-   * Remove the inner padding in Chrome and Safari on macOS.
-   */
+ * Remove the inner padding in Chrome and Safari on macOS.
+ */
 
 [type="search"]::-webkit-search-decoration {
-    -webkit-appearance: none;
+  -webkit-appearance: none;
 }
 
 /**
-   * 1. Correct the inability to style clickable types in iOS and Safari.
-   * 2. Change font properties to `inherit` in Safari.
-   */
+ * 1. Correct the inability to style clickable types in iOS and Safari.
+ * 2. Change font properties to `inherit` in Safari.
+ */
 
 ::-webkit-file-upload-button {
-    -webkit-appearance: button; /* 1 */
-    font: inherit; /* 2 */
+  -webkit-appearance: button; /* 1 */
+  font: inherit; /* 2 */
 }
 
 /* Interactive
-     ========================================================================== */
+   ========================================================================== */
 
 /*
-   * Add the correct display in Edge, IE 10+, and Firefox.
-   */
+ * Add the correct display in Edge, IE 10+, and Firefox.
+ */
 
 details {
-    display: block;
+  display: block;
 }
 
 /*
-   * Add the correct display in all browsers.
-   */
+ * Add the correct display in all browsers.
+ */
 
 summary {
-    display: list-item;
+  display: list-item;
 }
 
 /* Misc
-     ========================================================================== */
+   ========================================================================== */
 
 /**
-   * Add the correct display in IE 10+.
-   */
+ * Add the correct display in IE 10+.
+ */
 
 template {
-    display: none;
+  display: none;
 }
 
 /**
-   * Add the correct display in IE 10.
-   */
+ * Add the correct display in IE 10.
+ */
 
 [hidden] {
-    display: none;
+  display: none;
 }

public/style/common/style.css

@@ -1,6 +1,21 @@
+html{
+  overflow-y: auto
+}
 
-/* html,
-body {
-    background-color: #f5f5f5;
-    min-height: 100%;
-} */
+.message-container{
+  position: fixed;
+  right: 0;
+  top: 0;
+  z-index: 999;
+  overflow: auto;
+  height: 100vh;
+}
+.message-container::-webkit-scrollbar{
+  display: none;
+}
+.message-container .message{
+  min-width: 250px;
+  max-width: 250px;
+  margin: 25px;
+  box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
+}

route.txt

@@ -1,4 +1,4 @@
-D:\1XYX\demo\hapi-demo\source\route\api对应路径：
+D:\@code\project\hapi-demo\source\route\api对应路径：
  不需权限             ：  GET        /api/{path*}
  需要权限             ：  GET        /api/v1/upload
  需要权限             ：  POST       /api/v1/upload/upload
@@ -7,7 +7,7 @@ D:\1XYX\demo\hapi-demo\source\route\api对应路径：
  不需权限             ：  POST       /api/v1/user/login
  需要权限             ：  DELETE     /api/v1/user/del
  需要权限             ：  GET        /api/v1/user/userinfo
-D:\1XYX\demo\hapi-demo\source\route\views对应路径：
+D:\@code\project\hapi-demo\source\route\views对应路径：
  不需权限(提供无需验证)：  GET        /404
  不需权限             ：  GET        /css
  不需权限(提供无需验证)：  GET        /

source/plugins/index.ts

@@ -40,7 +40,7 @@ export default [
                 // 需要设置auth是try或者true才行
                 const isLogin = request.auth.isAuthenticated;
                 console.log("是否登录：",isLogin, request.path);
-                
+
                 // @ts-ignore
                 // console.log(isLogin, request.path, request.response.variety);
                 let user;
@@ -58,7 +58,7 @@ export default [
                     // @ts-ignore
                     request.response.source.context = Hoek.applyToDefaults(
                         {
-                            flash: flash,
+                            flash: !!Object.keys(flash).length?flash:false,
                             isLogin: isLogin,
                             user: user
                         },

source/route/views/index.ts

@@ -12,7 +12,7 @@ export default class {
   @method("GET")
   async login_GET(request: Req, h: Res): ReturnValue {
     if (request.auth.isAuthenticated) {
-      request.yar.flash('error', '您已经登陆');
+      request.yar.flash('warning', '您已经登陆');
       return h.redirect("/")
     } else {
       logger.debug("未登录");
@@ -36,14 +36,14 @@ export default class {
       return h.redirect("/login");
     }
     request.cookieAuth.set({ id: account.id });
-
+    request.yar.flash('success', '用户已登录');
     return h.redirect(referrer ? referrer : "/");
   }
 
   @method("GET")
   @auth()
   async logout(request: Req, h: Res): ReturnValue {
-    request.yar.flash('error', '用户已退出');
+    request.yar.flash('success', '用户已退出');
     request.cookieAuth.clear();
     return h.redirect('/');
   }
@@ -53,7 +53,7 @@ export default class {
   @method("GET")
   async registerView(request: Req, h: Res): ReturnValue {
     if (request.auth.isAuthenticated) {
-      request.yar.flash('error', '您已经登陆');
+      request.yar.flash('warning', '您已经登陆');
       return h.redirect("/")
     } else {
       logger.debug("未登录");

template/404.pug

@@ -4,32 +4,5 @@ block head
   link(rel="stylesheet", href="/public/css/views/404.css")
 
 block content
-  #app
-    #outer
-      h1 4
-      h1 0
-      h1 4
-      .wrap
-        .ghost
-          .inner
-        .ghost
-          .inner
-        .ghost
-          .inner
-        svg(xmlns='http://www.w3.org/2000/svg' version='1.1' style='display: none')
-          defs
-            filter#squiggly-0
-              feturbulence#turbulence(baseFrequency='0.03' numOctaves='3' result='noise' seed='0')
-              fedisplacementmap#displacement(in='SourceGraphic' in2='noise' scale='2')
-            filter#squiggly-1
-              feturbulence#turbulence(baseFrequency='0.02' numOctaves='3' result='noise' seed='1')
-              fedisplacementmap(in='SourceGraphic' in2='noise' scale='3')
-            filter#squiggly-2
-              feturbulence#turbulence(baseFrequency='0.02' numOctaves='3' result='noise' seed='2')
-              fedisplacementmap(in='SourceGraphic' in2='noise' scale='0.5')
-            filter#squiggly-3
-              feturbulence#turbulence(baseFrequency='0.02' numOctaves='3' result='noise' seed='3')
-              fedisplacementmap(in='SourceGraphic' in2='noise' scale='3')
-            filter#squiggly-4
-              feturbulence#turbulence(baseFrequency='0.05' numOctaves='2' result='noise' seed='4')
-              fedisplacementmap(in='SourceGraphic' in2='noise' scale='1')
+  div(style="text-align: center")
+    span.text404 404

template/helper/flush.pug

@@ -1,15 +1,53 @@
 //- 服务器反馈UI
-if flash&&flash.error
-    .toast-container.top-0.end-0.p-3
+if flash
+  .message-container
+    - index = 0
+    if flash.error
       each item in flash.error
-        .toast.show(role='alert', aria-live='assertive', aria-atomic='true')
-          .toast-header
-            img.rounded.me-2(src='/public/image/icons/error.svg', alt='错误' style="width:20px;height: 20px;")
-            strong.me-auto 提示
-            //- small.text-muted just now
-            button.btn-close(type='button', data-bs-dismiss='toast', aria-label='Close')
-          .toast-body.
-            #{item}
+        - index++
+        .message.is-danger(id="message"+index)
+          .message-header
+            p 错误
+            button.delete(aria-label='delete' data-target="message"+index)
+          .message-body
+            | #{item}
+    if flash.success
+      each item in flash.success
+        - index++
+        .message.is-success(id="message"+index)
+          .message-header
+            p 成功
+            button.delete(aria-label='delete' data-target="message"+index)
+          .message-body
+            | #{item}
+    if flash.info
+      each item in flash.info
+        - index++
+        .message.is-info(id="message"+index)
+          .message-header
+            p 信息
+            button.delete(aria-label='delete' data-target="message"+index)
+          .message-body
+            | #{item}
+    if flash.warning
+      each item in flash.warning
+        - index++
+        .message.is-warning(id="message"+index)
+          .message-header
+            p 警告
+            button.delete(aria-label='delete' data-target="message"+index)
+          .message-body
+            | #{item}
+    //- .toast-container.top-0.end-0.p-3
+    //-   each item in flash.error
+    //-     .toast.show(role='alert', aria-live='assertive', aria-atomic='true')
+    //-       .toast-header
+    //-         img.rounded.me-2(src='/public/image/icons/error.svg', alt='错误' style="width:20px;height: 20px;")
+    //-         strong.me-auto 提示
+    //-         //- small.text-muted just now
+    //-         button.btn-close(type='button', data-bs-dismiss='toast', aria-label='Close')
+    //-       .toast-body.
+    //-         #{item}
     //- .toast-container.position-fixed.bottom-0.end-0.p-3
     //-   #liveToast.toast(role='alert', aria-live='assertive', aria-atomic='true')
     //-     .toast-header

template/helper/helper.pug

@@ -2,3 +2,7 @@ mixin css(href)
     link(rel="stylesheet" href="/public/"+href)
 mixin script(src)
     script(src="/public/"+src)
+
+mixin security
+    include ./form_security.pug
+

template/helper/rain.pug

@@ -1,42 +0,0 @@
-//- 下雨UI
-canvas(id="snow") 不支持canvas
-style
-    | canvas#snow { position: absolute; z-index: -1; top: 0; left: 0; opacity: 0.5; }
-script(type="text/javascript", src="https://code.jquery.com/jquery-3.6.0.min.js")
-script
-    | $(function () {
-    |   var W = $(window).width(),
-    |       H = $(window).height(),
-    |       x2 = -15, len = 30, count = 100;
-    |   var canvas = document.getElementById("snow");
-    |   canvas.width = W;
-    |   canvas.height = H;
-    |   var ctx = canvas.getContext('2d');
-    |
-    |   setInterval(clearCanvas,100);
-    |   function clearCanvas() {
-    |       ctx.clearRect(0, 0, W, H);
-    |       draws();
-    |   }
-    |
-    |   function draw(x, y) {
-    |       //canvas写渐变：createLinearGradient（startX,startY,endX,endY）
-    |       var grd = ctx.createLinearGradient(x, y, x + x2, y + len);
-    |       grd.addColorStop(0, "rgba(0,0,0,0)");
-    |       grd.addColorStop(0.5, "rgba(105,105,105,1)");
-    |       grd.addColorStop(1, "rgba(255,255,255,1)");
-    |       ctx.strokeStyle = grd;
-    |
-    |       ctx.beginPath();
-    |       ctx.moveTo(x, y);
-    |       ctx.lineTo(x + x2, y + len);
-    |       ctx.lineWidth = 2;
-    |       ctx.stroke();
-    |       ctx.closePath();
-    |   }
-    |   function draws() {
-    |       for (var i = 1; i <= count; i++) {
-    |           draw(Math.random() * W, Math.random() * H);
-    |       }
-    |   }
-    |});

template/helper/ui.pug

@@ -1,26 +0,0 @@
-//- 站点导航栏
-mixin header()
-    nav.navbar.navbar-expand-lg.bg-light
-      .container
-        a.navbar-brand(href='/') 飘雨
-        button.navbar-toggler(type='button', data-bs-toggle='collapse', data-bs-target='#navbarSupportedContent', aria-controls='navbarSupportedContent', aria-expanded='false', aria-label='Toggle navigation')
-            span.navbar-toggler-icon
-        .collapse.navbar-collapse#navbarSupportedContent
-            ul.navbar-nav.me-auto.mb-2.mb-lg-0
-              li.nav-item
-                a.nav-link.active(aria-current='page', href='/util') 工具
-              li.nav-item
-                a.nav-link.active(aria-current='page', href='/about') 关于
-            .navbar-text
-              if !isLogin
-                a(href="/login")
-                  .btn.btn-sm.btn-outline-secondary 登陆
-                a(href="/login")
-                  .btn.btn-sm.btn-outline-secondary 注册
-              else
-                div #{user.username}
-                a(href="/logout")
-                  .btn.btn-sm.btn-outline-secondary 退出
-                //- form(action="/login/logout", method="post")
-                //-   include @/helper/form_security.pug
-                //-   button.btn.btn-sm.btn-outline-secondary(type="submit") 退出

template/layout/layout.pug

@@ -1,24 +1,21 @@
 doctype html
 include @/helper/helper.pug
-include @/helper/ui.pug
 
-html(lang="zh-cn")
-  block var
+block var
+html(lang="zh-cn" class=hideHeader?"":"has-navbar-fixed-top")
   head
     meta(charset="UTF-8")
     meta(http-equiv="X-UA-Compatible", content="IE=edge")
     link(rel="shortcut  icon" href="/public/favicon.ico" type="image/x-icon")
     meta(name="viewport", content="width=device-width, initial-scale=1.0")
     title #{title || 'WEB'}
-    link(rel="stylesheet", href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/css/bootstrap.min.css", integrity="sha384-gH2yIJqKdNHPEq0n4Mqa/HGKIhSkIHeL5AyhkYV8i59U5AR6csBvApHHNl/vI1Bx", crossorigin="anonymous")
-    link(rel="stylesheet", href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css")
+    link(rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.9.4/css/bulma.min.css")
     +css("style/common/style.css")
     block head
   body
     include @/helper/flush.pug
     if !hideHeader
-        +header()
+        include @/ui/header.pug
     block content
-    script(src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/js/bootstrap.bundle.min.js", integrity="sha384-A3rJD856KowSb7dwlZdYEkO39Gagi7vIsF0jrRAoQmDKKtQBHUuLZ9AsSv4jD4Xa", crossorigin="anonymous")
+    +script("js/common/main.js")
     block script
-    //- include @/helper/rain.pug

template/ui/header.pug

@@ -0,0 +1,38 @@
+nav.is-fixed-top.navbar(role='navigation', aria-label='main navigation')
+      .navbar-brand
+        a.navbar-item(href='/')
+          img(src='https://bulma.io/images/bulma-logo.png', width='112', height='28')
+        a.navbar-burger(role='button', aria-label='menu', aria-expanded='false', data-target='navbarBasicExample')
+          span(aria-hidden='true')
+          span(aria-hidden='true')
+          span(aria-hidden='true')
+      #navbarBasicExample.navbar-menu
+        .navbar-start
+          a.navbar-item
+            | 文档
+          .navbar-item.has-dropdown.is-hoverable
+            a.navbar-link
+              | 更多
+            .navbar-dropdown
+              a.navbar-item(href="/about")
+                | 关于本站
+              a.navbar-item
+                | 关于作者
+              hr.navbar-divider
+              a.navbar-item
+                | 报告问题
+        .navbar-end
+          if !isLogin
+            .navbar-item
+              .buttons
+                a.button.is-primary(href="/register")
+                  strong 注册
+                a.button.is-light(href="/login")
+                  | 登录
+          else
+            .navbar-item
+              .buttons
+                button.button.is-white
+                  | #{user.username}
+                a.button.is-danger.is-light(href="/logout")
+                  | 退出

template/views/about.pug

@@ -1,58 +1,12 @@
 extends /layout/layout
 
 block var
-  -title="关于我" // 网页标题
-//-   -hideHeader=true
+  -title="关于"
 
 block head
-//-   +css("style/views/index.css")
 
 block content
-    .container(style="margin-top: 20px;")
-      include:markdown-it @/md/about.md
-      div!= md
-        //-   .row.overflow-hidden
-        //-     .col-12.p-2.col-md-6.col-lg-3
-        //-         .card(style='margin: 0 auto;')
-        //-             .card-body
-        //-                 h5.card-title Card title
-        //-                 h6.card-subtitle.mb-2.text-muted Card subtitle
-        //-                 p.card-text Some quick example text to build on the card title and make up the bulk of the card's content.
-        //-                 a.card-link(href='#') Card link
-        //-                 a.card-link(href='#') Another link
-        //-     .col-12.p-2.col-md-6.col-lg-3
-        //-         .card(style='margin: 0 auto;')
-        //-             .card-body
-        //-                 h5.card-title Card title
-        //-                 h6.card-subtitle.mb-2.text-muted Card subtitle
-        //-                 p.card-text Some quick example text to build on the card title and make up the bulk of the card's content.
-        //-                 a.card-link(href='#') Card link
-        //-                 a.card-link(href='#') Another link
-        //-     .col-12.p-2.col-md-6.col-lg-3
-        //-         .card(style='margin: 0 auto;')
-        //-             .card-body
-        //-                 h5.card-title Card title
-        //-                 h6.card-subtitle.mb-2.text-muted Card subtitle
-        //-                 p.card-text Some quick example text to build on the card title and make up the bulk of the card's content.
-        //-                 a.card-link(href='#') Card link
-        //-                 a.card-link(href='#') Another link
-        //-     .col-12.p-2.col-md-6.col-lg-3
-        //-         .card(style='margin: 0 auto;')
-        //-             .card-body
-        //-                 h5.card-title Card title
-        //-                 h6.card-subtitle.mb-2.text-muted Card subtitle
-        //-                 p.card-text Some quick example text to build on the card title and make up the bulk of the card's content.
-        //-                 a.card-link(href='#') Card link
-        //-                 a.card-link(href='#') Another link
-        //- ul
-        //-     li: a(href="https://cloud.tencent.com/developer/article/1793543" target="_blank") 15个最优秀的响应式CSS框架
-        //-     li https://getbootstrap.com/docs/5.2/components/collapse/
-        //-     li https://getbase.org/
-        //-     li https://tooltt.com/html2pug/
-        //-     li https://www.pugjs.cn/language/conditionals.html
-        //-     li https://bulma.io/
-        //- https://picturepan2.github.io/spectre/index.html
-        //- http://v3.getuikit.work/doc/v3/components/offcanvas.html
-        //- https://github.com/pure-css/pure
-        //- https://semantic-ui.com/
-        //- https://github.com/transitive-bullshit/check-links/blob/master/lib/check-link.js
+  section.section
+    .container.content!= md
+
+block script

template/views/color.pug

@@ -1,52 +0,0 @@
-extends /layout/layout
-
-block var
-  -title="颜色表" // 网页标题
-
-block head
-  link(rel="stylesheet", href="/public/css/common/reset.css")
-  link(rel="stylesheet", href="/public/css/views/color.css")
-
-block content
-  div(class="container page")
-    div(class="color_list")
-      -
-        var list=[
-          {  color:"#999999",title: "辅助色",describe:"灰色灰色灰色灰色灰色灰色灰色灰色灰色灰色灰色灰色灰色灰色灰色"},
-          {  color:"#999999",title: "辅助色",describe:"灰色灰色灰色灰色灰色灰色灰色灰色灰色灰色灰色灰色灰色灰色灰色"},
-          {  color:"#999999",title: "辅助色",describe:"灰色灰色灰色灰色灰色灰色灰色灰色灰色灰色灰色灰色灰色灰色灰色"},
-          {  color:"#000000",title: "辅助色",describe:""},
-          {  color:"#999999",title: "辅助色",describe:""},
-          {  color:"#999999",title: "辅助色",describe:""},
-          {  color:"#999999",title: "辅助色",describe:""},
-          {  color:"#999999",title: "辅助色",describe:""},
-          {  color:"#999999",title: "辅助色",describe:""},
-          {  color:"#999999",title: "辅助色",describe:""},
-          {  color:"#999999",title: "辅助色",describe:""},
-          {  color:"#999999",title: "辅助色",describe:""},
-          {  color:"#999999",title: "辅助色",describe:""},
-          {  color:"#999999",title: "辅助色",describe:""},
-          {  color:"#999999",title: "辅助色",describe:""},
-          {  color:"#999999",title: "辅助色",describe:""},
-          {  color:"#999999",title: "辅助色",describe:""},
-          {  color:"#999999",title: "辅助色",describe:""},
-          {  color:"#999999",title: "辅助色",describe:""},
-          {  color:"#999999",title: "辅助色",describe:""},
-        ]
-      each item in list
-        div(class="color_item")
-          div(class="color_item_bg" style=`background: ${item.color}`)
-            div(class="color_toggle_list")
-              div(class="color_toggle_item") hex
-              div(class="color_toggle_item") rgba
-          div(class="color_item_name") #{item.color}
-          div(class="color_item_content")
-            div(class="color_item_title") #{item.title}
-            div(class="color_item_desc") #{item.describe || "暂无描述"}
-      div(class="color_item")
-        img(src="/public/image/add.png", alt="添加" title="添加" class="color_add")
-      div
-        form(action="POST" method="post")
-          div(class=".wrapper_input"): input(type="text" tabindex="1" value="sadsa" name="a")
-          div(class=".wrapper_input"): input(type="text" tabindex="3" value="sadsa" name="b")
-          button(type="submit" tabindex="2") 提交

template/views/css.pug

@@ -1,27 +0,0 @@
-extends /layout/layout
-
-block var
-  -title="终是无缘一别两欢" // 网页标题
-
-block head
-  //- link(rel="stylesheet", href="/public/css/common/reset.css")
-  link(rel="stylesheet", href="/public/css/page/css.css")
-
-block content
-  .container
-    h1.title.author.word(title="xyx") 终是无缘一别两欢
-      .comment 为啥要写这个文章 
-    div.author.word(title="xyx") 昨天看了我初中喜欢的人在空间发的一篇关于怀念初中的短篇小说吧，记录了他对一些记忆深刻的人的评价，而我也看到了我明明一直清楚，却不肯打心底接受的真相，他喜欢另外一个人，过往那么多的蛛丝马迹，那么多明明一件事就能看出他喜欢的人是她的真相，可我却是宁愿找借口自欺欺人，而今他给出坦白答案，他是放下了，才说出来，我是不是也该放下了，直到今日才明白我一个人自以为刻骨铭心的回忆，他也许早就忘怀，他的短篇小说故事中我没有丝言片语，也许若干年后他回想起来的只是我的名字，我只是个戏子，在他的故事中流着自己的泪，一个于他青春年华中不曾使他掀起过一丝波澜的模糊影子，而他不知道也永远不会知道，我的故事里他出现的很多，占了很多篇幅，我把他写进我的故事，因为他路过我心上，他踏着万千星河而来，又乘舟奔赴远方，我与春风皆过客，你携秋水揽星河。如今看来万般故事不过情伤，易水人去，明月如霜。
-      .comment 我记得我无数次点开对话框，却只好失望的再关掉。我好多时候都想着万一他真的喜欢是她，我应该狠下心割舍这份感情，毕竟我不想太黯然神伤，我总是假装不在意远离他，不是因为讨厌陌生，而是太喜欢，又怕表现的明显，明知道没有什么可能不想陷入的更深。有那么一些瞬间，我假装不在意的擦肩而过，恰好离他很近，几分毫之差，却像是我们之间隔了银河的距离。走不进他的世界，却不想退出，现在想想初中三年除了开始在一个小组过，就没有再怎么交集过多少，毕业后反倒可以频繁的交集，我很珍惜，也行对他而言不过尔尔，充其量我只能算是他一个普通朋友。
-    div.author.word(title="xyx") 他是无意穿堂风，却偏偏孤据引山洪。我是垂眉摆渡翁，却独独偏爱哝。
-      .comment sada 
-    div.author.word(title="xyx") 忽然想起那年夏日毕业之际，我送他的藏头巧妙情诗，还有在QQ的匿名坦白说，还有我第一次鼓起勇气隐晦的告白，毕业后我想着也许在我们笑着说再见时候深知再见遥遥无期，我想过叫他一起来学习预习新课，如今想想对我而言珍贵如斯，因为整整初中三年我都喜欢他，从始至终，从一开始和他一个组，就喜欢他。可是我也心里早已隐隐知道他喜欢的是另外一个人，我怕喜欢被他知道，也怕他不知道，又怕他装作不知道，总是假装不在意他，却总是留意他的消息，其实也是只要他没有说出来证实那个我知道他喜欢另外一个人的猜想，我就还抱着一丝期待，才没办法停止喜欢。这世上最安慰人的童话是，你挖空心思暗恋的人，他也挖空心思暗恋你，可惜这只是童话。
-    div.author.word(title="xyx") 我记得我无数次点开对话框，却只好失望的再关掉。我好多时候都想着万一他真的喜欢是她，我应该狠下心割舍这份感情，毕竟我不想太黯然神伤，我总是假装不在意远离他，不是因为讨厌陌生，而是太喜欢，又怕表现的明显，明知道没有什么可能不想陷入的更深。有那么一些瞬间，我假装不在意的擦肩而过，恰好离他很近，几分毫之差，却像是我们之间隔了银河的距离。走不进他的世界，却不想退出，现在想想初中三年除了开始在一个小组过，就没有再怎么交集过多少，毕业后反倒可以频繁的交集，我很珍惜，也行对他而言不过尔尔，充其量我只能算是他一个普通朋友。
-    div.author.word(title="xyx") 犹记得那次初三模考后不好，本来就难受从未那么差过，可是他在安慰另外一个人，我就更难过。多少次狠下心不想喜欢，却是告终。
-    div.author.word(title="xyx") 比如毕业后，我开着玩笑跟他要生日礼物，终究是一纸空话，而我也知道也许他是不想给也就罢了，毕竟我什么都算不上吧，还有我那次想叫他去看电影，看最好的我们，我是有目的，听说电影的最后彩蛋是告白带来这里一起看电影的人是为了对他告白，可惜他没去，我和我一个很好的闺蜜去了电影院。
-    div.author.word(title="xyx") 其实毕业后，我有过暗示，他懂了，懂了后是沉默，我早该明白的，沉默就是答案，躲闪就是答案，不过是留一个情面给我，互相都不要太过难堪，他也不知道，我很多说说日志写着是希望他能看到的，虽然有些不是我的原创，却带着我的心声，他不曾懂过。也不需要去懂了，从始至终感动的只有我自己。海底月捞不起，心上人不可及，向来心是看客心，奈何人是局中人。
-    div.author.word(title="xyx") 这世间最难不过徒手摘月，喜欢而不得。
-    div.author.word(title="xyx") 但我也想明白了，当我不能将一个人彻底忘却，就好好珍藏，封存在某个不易察觉的角落，午夜阑珊的时候悄悄想去。生不逢时，喜欢不逢人，所得之处皆是命数。白茶清欢无别事，我在等风也等你，苦酒折留今相离，无风无月也无你。
-    div.author.word(title="xyx") 当年我说的凤囚凰那首诗也许他早已忘记，有美人兮，见之不忘，一日不见兮，思之如狂。凤飞遨翔兮，四海求凰，无奈佳人兮，不在东墙。将琴代语兮，聊写衷肠，愿言配德兮，携手相将。何时见许兮，慰我旁徨，不得于飞兮，使我沦亡，使我沦亡。本想暗示他我喜欢过他，终是没有说出口下阙。
-    div.author.word(title="xyx") 蝴蝶很美，终究飞不过沧海，某些性质上我和他一样，都是内心远没有看起来的风平浪静，实则是波涛起伏，曾想过愿我如星君如月，夜夜流光相皎洁。
-    div.author.word(title="xyx") 所谓执念，不过求而不得，不过难以割舍，不想错过，可终究情深是我，缘浅是我们，落花有意，流水无情，竟是付诸东流，若是如此，就这样吧，从此山水不相逢，愿若干年后的我们是最好的我们，蝴蝶很美，终究飞不过沧海，生生的两端，我们彼此站成岸。何来人间一惊鸿，不过人间一俗人。从此相忘江湖，若许不相识，也愿我遇到比你更好的人，说了那么多轻松多了，写下这些也是为了忘记放下他，虽然以前想过有时候放不下是最好的放下，无论他是否看得到，就这样吧，至此纪念我初中的喜欢，你是年少的欢喜，但也是过去时。我也要努力学习，考的比他更好。

template/views/demo.ejs

@@ -1,58 +0,0 @@
-<form action="/api/upload/upload" method="post" enctype="multipart/form-data">
-  <input type="file" name="file" id="file" multiple />
-  <button type="submit" id="upload">上传</button>
-</form>
-<div id="filelist"></div>
-
-<script>
-  function $(selector) {
-    return document.querySelector(selector);
-  }
-  var uploadEl = $("#upload");
-  var filelistEl = $("#filelist");
-  var fileEl = $("#file");
-
-  uploadEl.addEventListener("click", function (e) {
-    e.preventDefault();
-
-    var xmlhttp;
-    if (window.XMLHttpRequest) {
-      // code for IE7+, Firefox, Chrome, Opera, Safari
-      xmlhttp = new XMLHttpRequest();
-    } else {
-      // code for IE6, IE5
-      xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
-    }
-    xmlhttp.open("POST", "/api/upload/upload", true);
-    // 这里不需要自己加，会自己处理
-    // xmlhttp.setRequestHeader("Content-Type", "multipart/form-data");
-
-    if (xmlhttp.upload) {
-      //监听上传属性的上传事件,每次上传事件都会执行 progressHandlingFunction
-      xmlhttp.upload.addEventListener(
-        "progress",
-        function (evt) {
-          var loaded = evt.loaded;
-          var tot = evt.total;
-          var per = Math.floor((100 * loaded) / tot); //已经上传的百分比
-        },
-        false
-      );
-      //xmlhttp.upload.progress = function(){}            也可以
-    }
-
-    var formData = new FormData();
-    for (let i = 0; i < fileEl.files.length; i++) {
-      const file = fileEl.files[i];
-      formData.append("file", file);
-    }
-    xmlhttp.send(formData);
-
-    xmlhttp.onreadystatechange = function () {
-      if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
-        // console.log(xmlhttp.responseText);
-        alert("success");
-      }
-    };
-  });
-</script>

template/views/include/footer.ejs

@@ -1,2 +0,0 @@
-</body>
-</html>

template/views/include/header.ejs

@@ -1,9 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title><%- title || "WEB" %></title>
-  </head>
-  <body>

template/views/index.ejs

@@ -1,3 +0,0 @@
-index
-
-<a href="/login">login</a>

template/views/index.pug

@@ -5,8 +5,13 @@ block var
 //-   -hideHeader=true
 
 block head
-  +css("style/views/index.css")
 
 block content
+  section.section
     .container
-        div(class="animated bounce") asda
+      h1.title
+        | Hello World
+      p.subtitle
+        | My first website with
+        strong Bulma
+        | !

template/views/login copy.pug

@@ -1,56 +0,0 @@
-extends /layout/layout
-
-block var
-  -title="登陆" // 网页标题
-  -hideHeader=true
-
-block head
-    +css("css/page/login.css")
-
-block content
-    .container#container
-        .form-container.sign-up-container
-            form(action='/login/register' method='post')
-                h1 创建账户
-                .social-container
-                    a.social(href='#')
-                        i.fab.fa-facebook-f
-                    a.social(href='#')
-                        i.fab.fa-google-plus-g
-                    a.social(href='#')
-                        i.fab.fa-linkedin-in
-                span 使用您的邮箱注册
-                input(type='text', name="username", placeholder='请输入用户名')
-                input(type='email', name="email",placeholder='请输入邮箱')
-                input(type='password', name="password",placeholder='请输入密码')
-                include @/helper/form_security.pug
-                button 注册
-        .form-container.sign-in-container
-            form(action='/login' method='post')
-                h1 登录
-                .social-container
-                    a.social(href='#')
-                        i.fab.fa-facebook-f
-                    a.social(href='#')
-                        i.fab.fa-google-plus-g
-                    a.social(href='#')
-                        i.fab.fa-linkedin-in
-                span 填写您的账户
-                input(type='text',name="username" , placeholder='请输入邮箱')
-                input(type='password',name="password" , placeholder='请输入密码')
-                include @/helper/form_security.pug
-                a(href='#') 忘记密码?
-                button 登录
-        .overlay-container
-            .overlay
-                .overlay-panel.overlay-left
-                    h1 欢迎回来!
-                    p 填写您的账户，与我们保持亲密联系吧！
-                    button.ghost#signIn 登录
-                .overlay-panel.overlay-right
-                    h1 你好朋友!
-                    p 创建您的个人账户，随我们遨游于此吧！
-                    button.ghost#signUp 注册
-
-block script
-    +script("js/page/login.js")

template/views/login.pug

@@ -5,17 +5,18 @@ block var
   -hideHeader=true
 
 block head
-    +css("css/page/login.css")
+    +css("style/views/login.css")
 
 block content
     .login
-      h1 登录
+      h1.title.is-1 登录
       form(action='/login' method='post')
         input(id="referrer" type="text" name="referrer" class="form-control" style="display:none;")
         input(type='text', name='username', placeholder='用户名', required)
         input(type='password', name='password', placeholder='密码', required)
-        include @/helper/form_security.pug
+        +security
         button.btn.btn-primary.btn-block.btn-large(type='submit') 现在登录！
+        a(href="/register" style="margin-top: 8px;color: white;font-size: 14px;display: inline-block;float: right") 前往注册
 
 block script
     +script("js/page/login.js")

template/views/upload.ejs

@@ -1,3 +0,0 @@
-<div>
-  uploadsuccess
-</div>

template/views/user.pug

@@ -1,41 +0,0 @@
-extends /layout/layout
-
-block var
-  -title="时间就是金钱" // 网页标题
-
-block head
-  link(rel="stylesheet", href="/public/css/common/reset.css")
-  link(rel="stylesheet", href="/public/css/views/index.css")
-
-block content
-  div(class="container page")
-    ul(class="left-list")
-      li(class="item"): a(href="/login" ) 登录/注册
-    div(class="userinfo")
-      div(class="img-wrapper user_avatar"): img(object-fit="scale-down" src="https://scpic.chinaz.net/files/pic/pic9/202106/apic33329.jpg")
-      div(class="user_detail")
-        -username = "谢亚昕"
-        -
-          describe = `
-              来自南方的小城，喜爱悠闲
-              来自南方的小城，喜爱悠闲
-              来自南方的小城，喜爱悠闲
-              来自南方的小城，喜爱悠闲
-              来自南方的小城，喜爱悠闲
-              来自南方的小城，喜爱悠闲
-              来自南方的小城，喜爱悠闲
-              来自南方的小城，喜爱悠闲
-              来自南方的小城，喜爱悠闲
-              来自南方的小城，喜爱悠闲
-              来自南方的小城，喜爱悠闲
-            `
-        .user_name #{username}
-        div(class="user_desc" title=describe )
-          |#{describe}
-
-  //- script(src='https://cdn.jsdelivr.net/npm/darkmode-js@1.5.7/lib/darkmode-js.min.js')
-  //- script.
-  //-   function addDarkmodeWidget() {
-  //-   new Darkmode().showWidget();
-  //-   }
-  //-   window.addEventListener('load', addDarkmodeWidget);