diff --git a/public/bottom/qrwecom01.png b/public/bottom/qrwecom01.png
index 5d13460..1ef82c6 100644
Binary files a/public/bottom/qrwecom01.png and b/public/bottom/qrwecom01.png differ
diff --git a/public/bottom/qrwecom02.png b/public/bottom/qrwecom02.png
index 8ac8d03..cfda651 100644
Binary files a/public/bottom/qrwecom02.png and b/public/bottom/qrwecom02.png differ
diff --git a/public/bottom/qrwecom03.png b/public/bottom/qrwecom03.png
new file mode 100644
index 0000000..39e91ab
Binary files /dev/null and b/public/bottom/qrwecom03.png differ
diff --git a/src/App.vue b/src/App.vue
index 461a1f5..1a7e01a 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -44,6 +44,9 @@ router.isReady().then(() => {
display: flex;
flex-direction: column;
min-height: 100vh;
+ width: 100%;
+ //裁剪多余区域
+ overflow: hidden;
}
#defaultcontainer{
display: flex;
diff --git a/src/components/Footer.vue b/src/components/Footer.vue
index e89fbb4..a9080b8 100644
--- a/src/components/Footer.vue
+++ b/src/components/Footer.vue
@@ -24,20 +24,22 @@ export default {
display: flex;
background-color: black;
width:100%;
- align-items: center;
+ //align-items: center;
justify-content: left;
@include media-breakpoint-between(xs, md) {
- min-height:806px;
background-image: url('/bottom/bg_wep.png');
padding-left: 32px;
+ padding-top: 66px;
+ padding-bottom: 66px;
}
@include media-breakpoint-between(md,xxl){
- min-height: 759px;
margin-top: 0px;
background-image: url('/bottom/bg_pc.png');
padding-left: 100px;
+ padding-top: 109px;
+ padding-bottom: 109px;
}
@include media-breakpoint-up(xxl) {
@@ -45,6 +47,8 @@ export default {
margin-top: 0px;
background-image: url('/bottom/bg_pc.png');
padding-left: 256px;
+ padding-top: 109px;
+ padding-bottom: 109px;
}
}
diff --git a/src/components/Tools/FooterContent.vue b/src/components/Tools/FooterContent.vue
index 388c950..784c755 100644
--- a/src/components/Tools/FooterContent.vue
+++ b/src/components/Tools/FooterContent.vue
@@ -3,6 +3,37 @@
期待与您共创
+
+
+
扫码添加企业微信
+
+
+
+

+
+ 项目经理
+
+
+
+

+
+ 商务经理
+
+
+
+
+
+
WECHAT / 公众号
+
+
+

+
+ K DESIGN Lab
+
+
+
+
+
EMAIL
@@ -13,14 +44,7 @@
ADDRESS
- 北京市朝阳区华瀚龙门数字艺术创意园
-
-
-
微信扫码,添加商务同事
-
-

-
-

+
北京市朝阳区华瀚龙门数字艺术创意园D08
@@ -35,6 +59,38 @@ export default {
@import "node_modules/bootstrap/scss/_functions.scss";
@import "node_modules/bootstrap/scss/_variables.scss";
@import "node_modules/bootstrap/scss/_mixins.scss";
+.qritem{
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+}
+
+#wechatpublic{
+
+}
+
+#qrcontainer{
+ display: flex;
+ @include media-breakpoint-between(xs, md) {
+ flex-direction: column;
+ }
+
+ @include media-breakpoint-up(md) {
+ flex-direction: row;
+ }
+}
+
+.qrcodeimg{
+ @include media-breakpoint-between(xs, md) {
+ width: 88px;
+ height: 88px;
+ }
+
+ @include media-breakpoint-up(md) {
+ width: 100px;
+ height: 100px;
+ }
+}
#footercontent
{
@@ -42,11 +98,12 @@ export default {
flex-direction: column;
justify-content: flex-start;
color:white;
+ width: 100%;
}
@include media-breakpoint-between(xs, md) {
#footercontent{
- max-width: 304px;
+ //max-width: 304px;
min-height: 614px;
grid-template-columns: repeat(1, 1fr); /* 1列等分 */
grid-template-rows: repeat(8,90px); /* 8行高度120px */
@@ -57,7 +114,7 @@ export default {
@include media-breakpoint-up(md) {
#footercontent
{
- width:714px;
+ //width:714px;
min-height: 338px;
grid-template-columns: repeat(2, 1fr); /* 2列等分 */
grid-template-rows: repeat(4, 90px); /* 4行高度120px */
@@ -81,50 +138,47 @@ export default {
font-size: 48px;
}
}
-#CAL{
- @include media-breakpoint-between(xs, md) {
-
- }
- @include media-breakpoint-up(md) {
-
- }
-}
#EMAIL{
@include media-breakpoint-between(xs, md) {
-
+ padding-top: 24px;
}
@include media-breakpoint-up(md) {
-
- }
-}
-#WECHAT{
- @include media-breakpoint-between(xs, md) {
-
- }
- @include media-breakpoint-up(md) {
-
+ padding-top: 56px;
}
}
#ADDRESS{
@include media-breakpoint-between(xs, md) {
-
+ padding-top: 24px;
}
@include media-breakpoint-up(md) {
-
+ padding-top: 56px;
}
}
#QRCODE{
+ width: 50%;
@include media-breakpoint-between(xs, md) {
-
+ padding-top: 9px;
}
@include media-breakpoint-up(md) {
-
+ padding-top: 47px;
+ }
+}
+#QRCODE2{
+ display: flex;
+ flex-direction: column;
+ width: 50%;
+ @include media-breakpoint-between(xs, md) {
+ padding-top: 9px;
+ justify-content: flex-start;
+ }
+ @include media-breakpoint-up(md) {
+ padding-top: 47px;
+ justify-content: flex-end;
}
}
.itemtitle
{
- width: 179px;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 0.6);
font-size: 16px;