Home Explore Help
Register Sign In
huJunBin
/
friendship-front
Watch 1
Star 0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Browse Source

update:新增友期下载页

hu89757 4 years ago
parent
139c6205d2
commit
ac08267f1e
17 changed files with 425 additions and 2 deletions
Unified View Show Diff Stats
  1. 117 0
      friendship-downloadPage/css/index.css
  2. 158 0
      friendship-downloadPage/css/reset.css
  3. BIN
      friendship-downloadPage/favicon.ico
  4. BIN
      friendship-downloadPage/img/banner.png
  5. BIN
      friendship-downloadPage/img/logo.png
  6. BIN
      friendship-downloadPage/img/pic01.png
  7. BIN
      friendship-downloadPage/img/pic02.png
  8. BIN
      friendship-downloadPage/img/pic03.png
  9. BIN
      friendship-downloadPage/img/pic04.png
  10. BIN
      friendship-downloadPage/img/title.png
  11. 68 0
      friendship-downloadPage/index.html
  12. 60 0
      friendship-downloadPage/js/index.js
  13. 2 0
      friendship-downloadPage/js/jquery-3.3.1.min.js
  14. 16 0
      youyujian/src/components/Footer.vue
  15. 2 0
      youyujian/src/components/Header.vue
  16. 1 1
      youyujian/src/pages/Youqi.vue
  17. 1 1
      友期官网/src/views/Home.vue

+ 117 - 0
friendship-downloadPage/css/index.css
View File 

@@ -0,0 +1,117 @@
 
+@import "./reset.css";
 
+
 
+body {
 
+    font-family: PingFangSC-Semibold;
 
+    font-weight: bold;
 
+}
 
+
 
+.banner {
 
+    width: 100%;
 
+    height: 23.8125rem;
 
+}
 
+
 
+.banner>img {
 
+    width: 100%;
 
+}
 
+
 
+
 
+.container {
 
+    padding: 0 0.9375rem 1.5625rem;
 
+    box-sizing: border-box;
 
+    background: #3600A5;
 
+}
 
+
 
+.item {
 
+    display: flex;
 
+    flex-direction: column;
 
+    align-items: center;
 
+    margin-bottom: 2.1875rem;
 
+    position: relative;
 
+    top: -3.3125rem;
 
+}
 
+
 
+.item:nth-child(4) {
 
+    margin: 0;
 
+}
 
+
 
+.item-content {
 
+    width: 100%;
 
+    display: flex;
 
+    flex-direction: column;
 
+    align-items: center;
 
+    background-color: #663BF6;
 
+    border: 1px solid #4979FF;
 
+    border-radius: 0.625rem;
 
+    box-sizing: border-box;
 
+    padding: 1.25rem 1.4063rem 1.6875rem;
 
+}
 
+
 
+.item-content span {
 
+    font-size: 1.1875rem;
 
+    line-height: 1.6563rem;
 
+    color: #ffffff;
 
+}
 
+
 
+
 
+
 
+.title {
 
+    width: 15.3125rem;
 
+    height: 2.6875rem;
 
+    color: #ffffff;
 
+    font-size: 1.25rem;
 
+    line-height: 1.75rem;
 
+    display: flex;
 
+    justify-content: center;
 
+    align-items: center;
 
+    background: url("../img/title.png") no-repeat center/100%;
 
+    margin-bottom: 0.625rem;
 
+}
 
+
 
+.img-wrap {
 
+    margin-top: 0.9375rem;
 
+    width: 18.75rem;
 
+    box-sizing: border-box;
 
+    border-radius: 0.3125rem;
 
+    padding: 0.9375rem 1.25rem;
 
+    background: #DCD1FF;
 
+}
 
+
 
+.img-wrap>img {
 
+    width: 100%;
 
+}
 
+
 
+.bar {
 
+    width: 100%;
 
+    box-sizing: border-box;
 
+    padding: 8px 15px;
 
+    background: #ffffff;
 
+    display: flex;
 
+    justify-content: space-between;
 
+    align-items: center;
 
+    position: fixed;
 
+    bottom: 0;
 
+}
 
+
 
+.bar>img {
 
+    width: 90px;
 
+    height: 33px;
 
+}
 
+
 
+.bar>a {
 
+    width: 6.875rem;
 
+    height: 2.25rem;
 
+    background-image: linear-gradient(90deg, #9C6CFA, #4979FF);
 
+    border-radius: 1.25rem;
 
+    color: #ffffff;
 
+    display: flex;
 
+    justify-content: center;
 
+    align-items: center;
 
+    text-decoration: none;
 
+    font-size: 14px;
 
+}
 
+
 
+.iphoneX {
 
+    display: none;
 
+    width: 100%;
 
+    height: 34px;
 
+}

+ 158 - 0
friendship-downloadPage/css/reset.css
View File 

@@ -0,0 +1,158 @@
 
+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;
 
+}
 
+
 
+* {
 
+	margin: 0;
 
+	padding: 0;
 
+}
 
+
 
+/* 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;
 
+}
 
+
 
+html,
 
+body {
 
+	color: #333333;
 
+	font-family: "pingfang SC", "MicrosoftYaHei";
 
+	font-size: 16px;
 
+	-webkit-font-smoothing: antialiased;
 
+}
 
+
 
+* {
 
+	-webkit-tap-highlight-color: transparent;
 
+	margin: 0;
 
+	padding: 0;
 
+}
 
+
 
+input,
 
+textarea {
 
+	-webkit-appearance: none;
 
+}
 
+
 
+*::-webkit-scrollbar {
 
+	display: none;
 
+}

BIN
friendship-downloadPage/favicon.ico
View File


BIN
friendship-downloadPage/img/banner.png
View File


BIN
friendship-downloadPage/img/logo.png
View File


BIN
friendship-downloadPage/img/pic01.png
View File


BIN
friendship-downloadPage/img/pic02.png
View File


BIN
friendship-downloadPage/img/pic03.png
View File


BIN
friendship-downloadPage/img/pic04.png
View File


BIN
friendship-downloadPage/img/title.png
View File


+ 68 - 0
friendship-downloadPage/index.html
View File 

@@ -0,0 +1,68 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+
 
+<head>
 
+    <meta charset="UTF-8">
 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
+    <title>友期APP</title>
 
+    <link rel="stylesheet" href="./css/index.css">
 
+    <link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
 
+</head>
 
+
 
+<body>
 
+    <div class="banner">
 
+        <img src="./img/banner.png">
 
+    </div>
 
+    <div class="container">
 
+        <div class="item">
 
+            <div class="title">智能推荐</div>
 
+            <div class="item-content">
 
+                <span>AI智能精准的推荐</span>
 
+                <span>快速找到你喜欢的人</span>
 
+                <div class="img-wrap">
 
+                    <img src="./img/pic01.png">
 
+                </div>
 
+            </div>
 
+        </div>
 
+        <div class="item">
 
+            <div class="title">语音交友</div>
 
+            <div class="item-content">
 
+                <span>语音畅聊 诉说心情</span>
 
+                <span>匹配聆听你故事的人</span>
 
+                <div class="img-wrap">
 
+                    <img src="./img/pic02.png">
 
+                </div>
 
+            </div>
 
+        </div>
 
+        <div class="item">
 
+            <div class="title">话题群聊</div>
 
+            <div class="item-content">
 
+                <span>按兴趣进入聊天室 </span>
 
+                <span>多人互动畅聊嗨翻天</span>
 
+                <div class="img-wrap">
 
+                    <img src="./img/pic03.png">
 
+                </div>
 
+            </div>
 
+        </div>
 
+        <div class="item">
 
+            <div class="title">直播互动</div>
 
+            <div class="item-content">
 
+                <span>找游戏大神来陪你玩游戏</span>
 
+                <span>找懂你的人和你一起直播</span>
 
+                <div class="img-wrap">
 
+                    <img src="./img/pic04.png">
 
+                </div>
 
+            </div>
 
+        </div>
 
+        <div class="iphoneX"></div>
 
+    </div>
 
+    <div class="bar">
 
+        <img src="./img/logo.png">
 
+        <a href="https://uqchat.oss-cn-shenzhen.aliyuncs.com/package/uqchat.apk" class="btn">下载友期APP</a>
 
+    </div>
 
+</body>
 
+<script src="http://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
 
+<script src="./js/jquery-3.3.1.min.js"></script>
 
+<script src="./js/index.js"></script>
 
+
 
+</html>

+ 60 - 0
friendship-downloadPage/js/index.js
View File 

@@ -0,0 +1,60 @@
 
+const baseSize = 16
 
+
 
+function setRem() {
 
+    const scale = document.documentElement.clientWidth / 375
 
+    document.documentElement.style.fontSize = baseSize * scale + 'px'
 
+}
 
+setRem()
 
+window.onresize = function () {
 
+    setRem()
 
+}
 
+
 
+function isIPhoneX() {
 
+    var u = navigator.userAgent,
 
+        isX;
 
+    var isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
 
+    if (isIOS) {
 
+        if (screen.height == 812 && screen.width == 375) {
 
+            isX = true
 
+        } else {
 
+            isX = false
 
+        }
 
+    }
 
+    return isX
 
+}
 
+
 
+if (isIPhoneX()) {
 
+    document.querySelector('.bar').style.padding = "8px 15px 42px"
 
+    document.querySelector('.iphoneX').style.display = "block"
 
+}
 
+let u = navigator.userAgent,
 
+    ios = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/),
 
+    a = document.querySelector('.bar>a');
 
+if (ios) {
 
+    a.setAttribute("href", "https://itunes.apple.com/app/id1511863353");
 
+}
 
+// $.get("/h5/wxjsapi/signature", {
 
+//         url: encodeURIComponent(window.location.href)
 
+//     },
 
+//     function (res) {
 
+//         wx.config({
 
+//             debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
 
+//             appId: res.data.appid, // 必填，公众号的唯一标识
 
+//             timestamp: res.data.timestamp, // 必填，生成签名的时间戳
 
+//             nonceStr: res.data.noncestr, // 必填，生成签名的随机串
 
+//             signature: res.data.signature, // 必填，签名
 
+//             jsApiList: ["updateAppMessageShareData"] // 必填，需要使用的JS接口列表
 
+//         });
 
+//         wx.error(function (res) {
 
+//             console.log(res);
 
+//         });
 
+//         wx.ready(function () {
 
+//             wx.updateAppMessageShareData({
 
+//                 title: "友期app", // 分享标题
 
+//                 desc: "真人短视频匹配交友，游戏开黑陪玩就在友期", // 分享描述
 
+//                 link: "http://front.test.uqchat.cn/download  ", // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
 
+//                 imgUrl: "http://www.xsbanruo.com/xsbanruo-logo.png", // 分享图标
 
+//             });
 
+//         });
 
+//     },
 
+// );

File diff suppressed because it is too large
+ 2 - 0
friendship-downloadPage/js/jquery-3.3.1.min.js


+ 16 - 0
youyujian/src/components/Footer.vue
View File 

@@ -1,7 +1,10 @@
 
 <template>
 
 <template>
 
   <div class="container">
 
   <div class="container">
 
     <p>重庆友遇见科技有限公司 2019©版权所有</p>
 
     <p>重庆友遇见科技有限公司 2019©版权所有</p>
 
+    <!-- <p>河南闪聊网络科技有限公司 2019©版权所有</p> -->
 
+    <!-- <a href="http://www.beian.miit.gov.cn/">备案号：豫ICP备20016932号</a> -->
 
     <a href="http://www.beian.miit.gov.cn/">备案号：渝ICP备19016272号</a>
 
     <a href="http://www.beian.miit.gov.cn/">备案号：渝ICP备19016272号</a>
 
+    <!-- <a href="http://gs.ccm.mct.gov.cn/lic/ac5b403b03b145b2a644faff1018cea8" class="haveicon">豫网文〔2020〕0113-010号</a> -->
 
     <a href="http://www.beian.miit.gov.cn/">信息产业部备案管理系统</a>
 
     <a href="http://www.beian.miit.gov.cn/">信息产业部备案管理系统</a>
 
   </div>
 
   </div>
 
 </template>
 
 </template>
 
@@ -31,4 +34,17 @@ a {
 
   text-decoration: none;
 
   text-decoration: none;
 
   color: #fff;
 
   color: #fff;
 
 }
 
 }
 
+.haveicon{
 
+  position: relative;
 
+}
 
+.haveicon::after{
 
+    content: "";
 
+    position: absolute;
 
+    top: 2px;
 
+    right: -20px;
 
+    width: 20px;
 
+    height: 20px;
 
+    background: url("../static/imgs/wenhuajingying.png") no-repeat;
 
+    background-size: 100% 100%;
 
+}
 
 </style>
 
 </style>

+ 2 - 0
youyujian/src/components/Header.vue
View File 

@@ -2,10 +2,12 @@
 
   <header>
 
   <header>
 
     <div class="first">
 
     <div class="first">
 
       <div class="wrap">欢迎来到重庆友遇见科技有限公司</div>
 
       <div class="wrap">欢迎来到重庆友遇见科技有限公司</div>
 
+      <!-- <div class="wrap">欢迎来到河南闪聊网络科技有限公司</div> -->
 
     </div>
 
     </div>
 
     <div class="second">
 
     <div class="second">
 
       <div class="wrap">
 
       <div class="wrap">
 
         <span>重庆友遇见科技有限公司</span>
 
         <span>重庆友遇见科技有限公司</span>
 
+        <!-- <span>河南闪聊网络科技有限公司</span> -->
 
         <ul>
 
         <ul>
 
           <router-link
 
           <router-link
 
             tag="li"
 
             tag="li"

+ 1 - 1
youyujian/src/pages/Youqi.vue
View File 

@@ -65,7 +65,7 @@
 
         <img src="../static/imgs/tupian_4.png" />
 
         <img src="../static/imgs/tupian_4.png" />
 
         <div class="desc">
 
         <div class="desc">
 
           <div>
 
           <div>
 
-            <span>直播互动</span>
 
+            <span>语音互动</span>
 
             <div class="line"></div>
 
             <div class="line"></div>
 
           </div>
 
           </div>
 
           <p>找懂你的人和你一起聊天</p>
 
           <p>找懂你的人和你一起聊天</p>

+ 1 - 1
友期官网/src/views/Home.vue
View File 

@@ -60,7 +60,7 @@
 
         <img src="../../static/imgs/tupian_4.png" />
 
         <img src="../../static/imgs/tupian_4.png" />
 
         <div class="desc">
 
         <div class="desc">
 
           <div>
 
           <div>
 
-            <span>直播互动</span>
 
+            <span>语音互动</span>
 
             <div class="line"></div>
 
             <div class="line"></div>
 
           </div>
 
           </div>
 
           <p>找懂你的人和你一起聊天</p>
 
           <p>找懂你的人和你一起聊天</p>