style: 格式化项目代码
- 根据prettier配置格式化整个项目的代码
This commit is contained in:
@ -4,39 +4,39 @@
|
||||
<!-- Logo 和公司信息 -->
|
||||
<div class="footer-section">
|
||||
<div class="footer-logo">
|
||||
<img src="/jinshen-logo.png" alt="Jinshen Logo" class="logo-image">
|
||||
<h3>{{ $t("company-name") }}</h3>
|
||||
<img src="/jinshen-logo.png" alt="Jinshen Logo" class="logo-image" />
|
||||
<h3>{{ $t('company-name') }}</h3>
|
||||
</div>
|
||||
<p class="company-description">
|
||||
{{ $t("company-description") }}
|
||||
{{ $t('company-description') }}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- 快速链接 -->
|
||||
<div class="footer-section">
|
||||
<h4>{{ $t("quick-links") }}</h4>
|
||||
<h4>{{ $t('quick-links') }}</h4>
|
||||
<ul class="footer-links">
|
||||
<li>
|
||||
<NuxtLinkLocale to="/">{{ $t("navigation.home") }}</NuxtLinkLocale>
|
||||
<NuxtLinkLocale to="/">{{ $t('navigation.home') }}</NuxtLinkLocale>
|
||||
</li>
|
||||
<li>
|
||||
<NuxtLink :to="$localePath('/productions')">{{
|
||||
$t("navigation.productions")
|
||||
$t('navigation.productions')
|
||||
}}</NuxtLink>
|
||||
</li>
|
||||
<li>
|
||||
<NuxtLink :to="$localePath('/solutions')">{{
|
||||
$t("navigation.solutions")
|
||||
$t('navigation.solutions')
|
||||
}}</NuxtLink>
|
||||
</li>
|
||||
<li>
|
||||
<NuxtLink :to="$localePath('/support')">{{
|
||||
$t("navigation.support")
|
||||
$t('navigation.support')
|
||||
}}</NuxtLink>
|
||||
</li>
|
||||
<li>
|
||||
<NuxtLink :to="$localePath('/about')">{{
|
||||
$t("navigation.about-us")
|
||||
$t('navigation.about-us')
|
||||
}}</NuxtLink>
|
||||
</li>
|
||||
</ul>
|
||||
@ -44,24 +44,24 @@
|
||||
|
||||
<!-- 联系信息 -->
|
||||
<div class="footer-section">
|
||||
<h4>{{ $t("contact-info") }}</h4>
|
||||
<h4>{{ $t('contact-info') }}</h4>
|
||||
<div class="contact-item">
|
||||
<el-icon><Phone /></el-icon>
|
||||
<span>{{ $t("telephone") }}: 0573-88187988</span>
|
||||
<span>{{ $t('telephone') }}: 0573-88187988</span>
|
||||
</div>
|
||||
<div class="contact-item">
|
||||
<el-icon><Message /></el-icon>
|
||||
<span>{{ $t("email") }}: jinshen@wzjinshen.com</span>
|
||||
<span>{{ $t('email') }}: jinshen@wzjinshen.com</span>
|
||||
</div>
|
||||
<div class="contact-item">
|
||||
<el-icon><Location /></el-icon>
|
||||
<span>{{ $t("address") }}: {{ $t("company-address") }}</span>
|
||||
<span>{{ $t('address') }}: {{ $t('company-address') }}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 社交媒体 -->
|
||||
<div class="footer-section">
|
||||
<h4>{{ $t("follow-us") }}</h4>
|
||||
<h4>{{ $t('follow-us') }}</h4>
|
||||
<div class="social-links">
|
||||
<a href="#" class="social-link" aria-label="WeChat">
|
||||
<el-icon size="20"><ChatDotRound /></el-icon>
|
||||
@ -84,21 +84,21 @@
|
||||
<div class="footer-container">
|
||||
<div class="copyright">
|
||||
<p>
|
||||
© {{ currentYear }} {{ $t("company-name") }}.
|
||||
{{ $t("all-rights-reserved") }}
|
||||
© {{ currentYear }} {{ $t('company-name') }}.
|
||||
{{ $t('all-rights-reserved') }}
|
||||
</p>
|
||||
<p>备案号: 浙ICP备12003709号-5</p>
|
||||
</div>
|
||||
<div class="footer-links-bottom">
|
||||
<NuxtLink :to="$localePath('/privacy')">{{
|
||||
$t("privacy-policy")
|
||||
$t('privacy-policy')
|
||||
}}</NuxtLink>
|
||||
<span class="separator">|</span>
|
||||
<NuxtLink :to="$localePath('/terms')">{{
|
||||
$t("terms-of-service")
|
||||
$t('terms-of-service')
|
||||
}}</NuxtLink>
|
||||
<span class="separator">|</span>
|
||||
<NuxtLink :to="$localePath('/sitemap')">{{ $t("sitemap") }}</NuxtLink>
|
||||
<NuxtLink :to="$localePath('/sitemap')">{{ $t('sitemap') }}</NuxtLink>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -106,185 +106,185 @@
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import {
|
||||
Phone,
|
||||
Message,
|
||||
Location,
|
||||
ChatDotRound,
|
||||
Star,
|
||||
Link,
|
||||
} from "@element-plus/icons-vue";
|
||||
import {
|
||||
Phone,
|
||||
Message,
|
||||
Location,
|
||||
ChatDotRound,
|
||||
Star,
|
||||
Link,
|
||||
} from '@element-plus/icons-vue';
|
||||
|
||||
const currentYear = new Date().getFullYear();
|
||||
const currentYear = new Date().getFullYear();
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.jinshen-footer {
|
||||
background: var(--el-bg-color-page);
|
||||
border-top: 1px solid var(--el-border-color);
|
||||
margin-top: auto;
|
||||
}
|
||||
|
||||
.footer-container {
|
||||
max-width: 1200px;
|
||||
margin: 0 auto;
|
||||
padding: 2rem 1rem;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
|
||||
gap: 2rem;
|
||||
}
|
||||
|
||||
.footer-section h3,
|
||||
.footer-section h4 {
|
||||
color: var(--el-text-color-primary);
|
||||
margin-bottom: 1rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.footer-logo {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.75rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.logo-image {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
.company-description {
|
||||
color: var(--el-text-color-regular);
|
||||
line-height: 1.6;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.footer-links {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.footer-links li {
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.footer-links a {
|
||||
color: var(--el-text-color-regular);
|
||||
text-decoration: none;
|
||||
transition: color 0.3s ease;
|
||||
}
|
||||
|
||||
.footer-links a:hover {
|
||||
color: var(--el-color-primary);
|
||||
}
|
||||
|
||||
.contact-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
margin-bottom: 0.75rem;
|
||||
color: var(--el-text-color-regular);
|
||||
}
|
||||
|
||||
.contact-item .el-icon {
|
||||
color: var(--el-color-primary);
|
||||
}
|
||||
|
||||
.social-links {
|
||||
display: flex;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.social-link {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
background: var(--el-fill-color-light);
|
||||
border-radius: 50%;
|
||||
color: var(--el-text-color-regular);
|
||||
text-decoration: none;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.social-link:hover {
|
||||
background: var(--el-color-primary);
|
||||
color: white;
|
||||
transform: translateY(-2px);
|
||||
}
|
||||
|
||||
.footer-bottom {
|
||||
background: var(--el-fill-color-light);
|
||||
border-top: 1px solid var(--el-border-color-lighter);
|
||||
padding: 1rem 0;
|
||||
}
|
||||
|
||||
.footer-bottom .footer-container {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 0 1rem;
|
||||
grid-template-columns: none;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.copyright p {
|
||||
margin: 0;
|
||||
color: var(--el-text-color-regular);
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
|
||||
.footer-links-bottom {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
}
|
||||
|
||||
.footer-links-bottom a {
|
||||
color: var(--el-text-color-regular);
|
||||
text-decoration: none;
|
||||
font-size: 0.875rem;
|
||||
transition: color 0.3s ease;
|
||||
}
|
||||
|
||||
.footer-links-bottom a:hover {
|
||||
color: var(--el-color-primary);
|
||||
}
|
||||
|
||||
.separator {
|
||||
color: var(--el-text-color-placeholder);
|
||||
}
|
||||
|
||||
/* 响应式设计 */
|
||||
@media (max-width: 768px) {
|
||||
.footer-container {
|
||||
grid-template-columns: 1fr;
|
||||
padding: 1.5rem 1rem;
|
||||
.jinshen-footer {
|
||||
background: var(--el-bg-color-page);
|
||||
border-top: 1px solid var(--el-border-color);
|
||||
margin-top: auto;
|
||||
}
|
||||
|
||||
.footer-bottom .footer-container {
|
||||
flex-direction: column;
|
||||
text-align: center;
|
||||
.footer-container {
|
||||
max-width: 1200px;
|
||||
margin: 0 auto;
|
||||
padding: 2rem 1rem;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
|
||||
gap: 2rem;
|
||||
}
|
||||
|
||||
.footer-section h3,
|
||||
.footer-section h4 {
|
||||
color: var(--el-text-color-primary);
|
||||
margin-bottom: 1rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.footer-logo {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.75rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.logo-image {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
.company-description {
|
||||
color: var(--el-text-color-regular);
|
||||
line-height: 1.6;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.footer-links {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.footer-links li {
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.footer-links a {
|
||||
color: var(--el-text-color-regular);
|
||||
text-decoration: none;
|
||||
transition: color 0.3s ease;
|
||||
}
|
||||
|
||||
.footer-links a:hover {
|
||||
color: var(--el-color-primary);
|
||||
}
|
||||
|
||||
.contact-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
margin-bottom: 0.75rem;
|
||||
color: var(--el-text-color-regular);
|
||||
}
|
||||
|
||||
.contact-item .el-icon {
|
||||
color: var(--el-color-primary);
|
||||
}
|
||||
|
||||
.social-links {
|
||||
display: flex;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.footer-links-bottom {
|
||||
flex-wrap: wrap;
|
||||
.social-link {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
background: var(--el-fill-color-light);
|
||||
border-radius: 50%;
|
||||
color: var(--el-text-color-regular);
|
||||
text-decoration: none;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
}
|
||||
|
||||
/* 暗色模式适配 */
|
||||
@media (prefers-color-scheme: dark) {
|
||||
.jinshen-footer {
|
||||
background: var(--el-bg-color-page);
|
||||
.social-link:hover {
|
||||
background: var(--el-color-primary);
|
||||
color: white;
|
||||
transform: translateY(-2px);
|
||||
}
|
||||
|
||||
.footer-bottom {
|
||||
background: var(--el-fill-color-darker);
|
||||
background: var(--el-fill-color-light);
|
||||
border-top: 1px solid var(--el-border-color-lighter);
|
||||
padding: 1rem 0;
|
||||
}
|
||||
|
||||
.footer-bottom .footer-container {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 0 1rem;
|
||||
grid-template-columns: none;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.copyright p {
|
||||
margin: 0;
|
||||
color: var(--el-text-color-regular);
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
|
||||
.footer-links-bottom {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
}
|
||||
|
||||
.footer-links-bottom a {
|
||||
color: var(--el-text-color-regular);
|
||||
text-decoration: none;
|
||||
font-size: 0.875rem;
|
||||
transition: color 0.3s ease;
|
||||
}
|
||||
|
||||
.footer-links-bottom a:hover {
|
||||
color: var(--el-color-primary);
|
||||
}
|
||||
|
||||
.separator {
|
||||
color: var(--el-text-color-placeholder);
|
||||
}
|
||||
|
||||
/* 响应式设计 */
|
||||
@media (max-width: 768px) {
|
||||
.footer-container {
|
||||
grid-template-columns: 1fr;
|
||||
padding: 1.5rem 1rem;
|
||||
}
|
||||
|
||||
.footer-bottom .footer-container {
|
||||
flex-direction: column;
|
||||
text-align: center;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.footer-links-bottom {
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
|
||||
/* 暗色模式适配 */
|
||||
@media (prefers-color-scheme: dark) {
|
||||
.jinshen-footer {
|
||||
background: var(--el-bg-color-page);
|
||||
}
|
||||
|
||||
.footer-bottom {
|
||||
background: var(--el-fill-color-darker);
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user