Skip to content

S
saas
提交 0b44e8a4 authored 作者: 王鹏飞's avatar 王鹏飞
浏览文件
操作

add footer

上级 3dae3c3d
显示空白字符变更
内嵌 并排
正在显示 包含 170 行增加 和 14 行删除
index.html
浏览文件 @ 0b44e8a4
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
<link rel="icon" href="https://zws-imgs-pub.ezijing.com/pc/base/favicon.ico" /> <link rel="icon" href="https://zws-imgs-pub.ezijing.com/pc/base/favicon.ico" />
<meta name="theme-color" content="#3276fc" /> <meta name="theme-color" content="#3276fc" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>紫荆教育SAAS平台</title> <title>紫荆教育e-SAAS平台</title>
</head> </head>
<body> <body>
<div id="app"></div> <div id="app"></div>
......
src/assets/css/base.css
浏览文件 @ 0b44e8a4
...@@ -70,7 +70,6 @@ a { ...@@ -70,7 +70,6 @@ a {
color: inherit; color: inherit;
text-decoration: none; text-decoration: none;
} }
input, input,
button, button,
select, select,
...@@ -84,3 +83,6 @@ textarea { ...@@ -84,3 +83,6 @@ textarea {
textarea:focus { textarea:focus {
outline: 0; outline: 0;
} }
body {
font-size: 14px;
}
src/components/layout/Footer.vue 0 → 100644
浏览文件 @ 0b44e8a4
<template>
<footer class="app-footer">
<div class="app-footer-inner">
<div class="app-footer-left">
<router-link to="/" class="app-footer-logo">
<img src="https://zws-imgs-pub.ezijing.com/pc/base/ezijing-logo-white.svg" height="56" />
<h1 class="app-name">e-SAAS平台</h1>
</router-link>
<div class="app-footer-link">
<ul class="app-footer-link-item">
<li><a href="https://www.ezijing.com" target="_blank">清控紫荆教育</a></li>
<li><a href="https://www.ezijing.com/services/college" target="_blank">核心能力</a></li>
<li><a href="https://www.ezijing.com/services/major" target="_blank">专业共建</a></li>
</ul>
<ul class="app-footer-link-item">
<li><a href="https://www.ezijing.com/services/employment" target="_blank">实习就业</a></li>
<li><a href="https://x.ezijing.com" target="_blank">1+X</a></li>
<li><a href="https://www.ezijing.com/services/job" target="_blank">职业证书</a></li>
</ul>
<ul class="app-footer-link-item">
<li><a href="https://marywood-plus.ezijing.com" target="_blank">国际硕士1+1</a></li>
<li><a href="https://marywood.ezijing.com" target="_blank">MBA项目</a></li>
</ul>
</div>
</div>
<div class="app-footer-contact">
<h2>联系我们</h2>
<dl>
<dt>地址</dt>
<dd>北京市海淀区中关村东路1号院清华科技园7号楼威盛大厦5层</dd>
</dl>
<dl>
<dt>联系电话</dt>
<dd><a href="tel:010-62793299">010-62793299</a></dd>
</dl>
<dl>
<dt>邮箱</dt>
<dd><a href="mailto:service@ezijing.com" class="mail">service@ezijing.com</a></dd>
</dl>
</div>
<div class="app-footer-qrcode">
<img src="https://webapp-pub.ezijing.com/project/marywood/officialAccount.jpeg" width="120" />
<div class="app-footer-qrcode-content">
<img src="https://zws-imgs-pub.ezijing.com/static/public/184235d9f6edbb39d52fc6f77339ff5b.png" width="20" />
<span>微信公众号</span>
</div>
</div>
</div>
</footer>
<div class="app-copyright">
<div class="app-copyright-inner">
<span>Copyright © 2017 Zijing Education. All rights reserved. 清控紫荆（北京）教育科技股份有限公司</span>
<a target="_blank" href="https://tsm.miit.gov.cn/dxxzsp/">京ICP证150431号 </a>
<a target="_blank" href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=11010802023681">
<img src="https://zws-imgs-pub.ezijing.com/e0a0ec47dfdfc1e0797b1d5254021d00.png" />
安备 11010802023681号
</a>
<a target="_blank" href="https://beian.miit.gov.cn/#/Integrated/index">京ICP备15016866号-1</a>
</div>
</div>
</template>
<style lang="scss">
.app-footer {
background-color: #aa1941;
}
.app-footer-inner {
width: 1200px;
margin: 0 auto;
padding: 50px 0;
display: flex;
color: rgba(237, 237, 237, 0.7);
}
.app-footer-left {
flex: 1;
.app-footer-logo {
display: flex;
align-items: center;
margin-bottom: 30px;
}
.app-name {
margin-left: 14px;
padding: 0 14px;
font-size: 23px;
color: #fff;
line-height: 26px;
font-weight: 500;
letter-spacing: 2px;
border-left: 1px solid #fff;
}
}
.app-footer-link {
display: flex;
}
.app-footer-link-item {
flex: 1;
font-size: 14px;
line-height: 30px;
letter-spacing: 3px;
}
.app-footer-link-item + .app-footer-link-item {
padding-left: 50px;
border-left: 1px solid #cc9d9d;
}
.app-footer-contact {
h2 {
font-size: 20px;
font-weight: normal;
line-height: 56px;
margin-bottom: 30px;
}
dl {
display: flex;
line-height: 30px;
}
dt {
width: 60px;
text-align-last: justify;
white-space: nowrap;
}
dd {
&::before {
content: '：';
}
}
}
.app-footer-qrcode {
margin-left: 80px;
}
.app-footer-qrcode-content {
display: flex;
align-items: center;
justify-content: center;
margin-top: 20px;
span {
margin-left: 10px;
}
}
.app-copyright {
background-color: #fff;
}
.app-copyright-inner {
max-width: 1200px;
margin: 0 auto;
font-size: 12px;
line-height: 40px;
color: #999;
text-align: center;
a {
margin-left: 10px;
}
}
</style>
src/components/layout/Header.vue
浏览文件 @ 0b44e8a4
...@@ -16,10 +16,10 @@ function handleLogout() { ...@@ -16,10 +16,10 @@ function handleLogout() {
<header class="app-header"> <header class="app-header">
<div class="app-header-inner"> <div class="app-header-inner">
<div class="app-header-left"> <div class="app-header-left">
<div class="logo"> <router-link to="/" class="logo">
<router-link to="/"><img src="https://zws-imgs-pub.ezijing.com/pc/base/ezijing-logo.svg" /></router-link> <img src="https://zws-imgs-pub.ezijing.com/pc/base/ezijing-logo.svg" height="60" />
</div> <h1 class="app-name">紫荆教育e-SAAS平台</h1>
<div class="app-name">紫荆教育SAAS平台</div> </router-link>
</div> </div>
<div class="app-header-right"> <div class="app-header-right">
<template v-if="user.isLogin"> <template v-if="user.isLogin">
...@@ -39,12 +39,9 @@ function handleLogout() { ...@@ -39,12 +39,9 @@ function handleLogout() {
box-shadow: 0px 0px 29px rgba(0, 0, 0, 0.1); box-shadow: 0px 0px 29px rgba(0, 0, 0, 0.1);
border-top: 10px solid #aa1941; border-top: 10px solid #aa1941;
z-index: 1000; z-index: 1000;
.logo {
width: 180px;
}
} }
.app-header-inner { .app-header-inner {
max-width: 1440px; width: 1440px;
margin: 0 auto; margin: 0 auto;
padding: 0 60px; padding: 0 60px;
display: flex; display: flex;
...@@ -54,15 +51,17 @@ function handleLogout() { ...@@ -54,15 +51,17 @@ function handleLogout() {
color: #aa1941; color: #aa1941;
} }
.app-header-left { .app-header-left {
.logo {
display: flex; display: flex;
align-items: center; align-items: center;
}
.app-name { .app-name {
margin-left: 40px; margin-left: 40px;
padding: 0 40px; padding: 0 40px;
font-size: 23px; font-size: 23px;
line-height: 26px; line-height: 26px;
font-weight: 500; font-weight: 500;
letter-spacing: 4px; letter-spacing: 2px;
border-left: 1px solid #707070; border-left: 1px solid #707070;
} }
} }
......
src/components/layout/Index.vue
浏览文件 @ 0b44e8a4
<template> <template>
<div class="app-layout"> <div class="app-layout">
<AppHeader></AppHeader> <AppHeader></AppHeader>
<div class="app-layout-container"> <section class="app-layout-container">
<router-view></router-view> <router-view></router-view>
</div> </section>
<AppFooter></AppFooter>
</div> </div>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import AppHeader from './Header.vue' import AppHeader from './Header.vue'
import AppFooter from './Footer.vue'
</script> </script>
<style> <style>
......
src/modules/home/views/Index.vue
浏览文件 @ 0b44e8a4
...@@ -284,7 +284,7 @@ const rows = [ ...@@ -284,7 +284,7 @@ const rows = [
<style lang="scss"> <style lang="scss">
.home { .home {
max-width: 1200px; width: 1200px;
margin: 50px auto 0; margin: 50px auto 0;
overflow: hidden; overflow: hidden;
} }
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论