|
|
@@ -14,27 +14,45 @@
|
|
|
padding: 3px;
|
|
|
}
|
|
|
div span a{
|
|
|
- color:orange;
|
|
|
+ color:#862930;
|
|
|
text-decoration: none;
|
|
|
|
|
|
}
|
|
|
div span a::before{
|
|
|
- color:orangered;
|
|
|
+ color:#862930;
|
|
|
+ }
|
|
|
+ div span a::hover{
|
|
|
+ color:#121929;
|
|
|
}
|
|
|
/* div span a::linked{
|
|
|
color:orange;
|
|
|
} */
|
|
|
div span a::after{
|
|
|
- color:orange;
|
|
|
+ color:#862930;
|
|
|
}
|
|
|
dialog{
|
|
|
border-radius: 15px;
|
|
|
|
|
|
}
|
|
|
dialog::backdrop{
|
|
|
- background-color: bisque;
|
|
|
+ background-color: #121929;
|
|
|
backdrop-filter: blur(1px);
|
|
|
}
|
|
|
+ .approve{
|
|
|
+ color:#862930;
|
|
|
+ background-color:#DED8D4 ;
|
|
|
+ font-size: 25px;
|
|
|
+ line-height: 30px;
|
|
|
+ display: inline-block;
|
|
|
+ padding: 2px;
|
|
|
+ border-radius: 5px;
|
|
|
+ border: 1px solid #862930;
|
|
|
+ }
|
|
|
+ .approve::hover{
|
|
|
+ color:#121929;
|
|
|
+ background-color:#862930 ;
|
|
|
+ border: 1px solid #121929;
|
|
|
+ }
|
|
|
</style>
|
|
|
</head>
|
|
|
<body>
|
|
|
@@ -46,6 +64,8 @@
|
|
|
<h5 style="color:oranged">{{number}}</h5>
|
|
|
<About>this is About</About>
|
|
|
<test></test>-->
|
|
|
+ <h3>{{$t('messages.app')}}</h3>
|
|
|
+ <h3>{{$t('messages.philosophy')}}</h3>
|
|
|
<div>
|
|
|
<span><a :href="$t('messages.pages.index_link')">{{$t('messages.pages.index')}}</a></span>
|
|
|
<span><a :href="$t('messages.pages.sample_link')">{{$t('messages.pages.sample')}}</a></span>
|
|
|
@@ -74,8 +94,10 @@
|
|
|
<br/>
|
|
|
<!--避免使用单标签，组件按照双标签规范用； js代码相对位置导入后可以直接使用 -->
|
|
|
<!-- <p>before i18n label</p> -->
|
|
|
- <div v-t="'messages.username'"></div>
|
|
|
- {{$t('messages.login')}}
|
|
|
+
|
|
|
+ <div class="approve" onclick="dialog.showModal()">{{$t('messages.component.approve.login')}}</div>
|
|
|
+ <div class="approve" v-t="'messages.component.approve.register'" onclick="dialog.showModal()"></div>
|
|
|
+
|
|
|
<!--
|
|
|
<p>after i18n label</p>
|
|
|
<label @click="changelang('zh')">中文</label>
|
