|
@@ -6,131 +6,182 @@
|
|
|
name="viewport"
|
|
|
content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"
|
|
|
/>
|
|
|
+ <link rel=icon type=image/png href="data:image/png;base64,iVBORw0KGgo=">
|
|
|
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
|
|
|
<title>{{$title or '阅读福利'}}</title>
|
|
|
<style>
|
|
|
+ body,
|
|
|
html,
|
|
|
- body {
|
|
|
- margin: 0 auto;
|
|
|
- padding: 0.2rem 0.4rem;
|
|
|
- max-width: 450px;
|
|
|
- font-family: -apple-system-font, BlinkMacSystemFont, "Helvetica Neue",
|
|
|
- "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei UI",
|
|
|
- "Microsoft YaHei", Arial, sans-serif;
|
|
|
- }
|
|
|
- a{
|
|
|
- text-decoration: none;
|
|
|
+ p {
|
|
|
+ margin: 0;
|
|
|
+ padding: 0;
|
|
|
}
|
|
|
- .title {
|
|
|
- font-size: 22px;
|
|
|
- line-height: 1.4;
|
|
|
- margin-bottom: 15px;
|
|
|
+
|
|
|
+ html {
|
|
|
+ background: #e6e6e6;
|
|
|
}
|
|
|
|
|
|
- .title .name {
|
|
|
- margin-top: 15px;
|
|
|
- font-size: 16px;
|
|
|
+ i {
|
|
|
+ font-style: normal;
|
|
|
}
|
|
|
|
|
|
- .small_title {
|
|
|
- color: #c00000;
|
|
|
- font-size: 28px;
|
|
|
+ .title-wrap {
|
|
|
text-align: center;
|
|
|
- margin-top: 10px;
|
|
|
- letter-spacing: 5px;
|
|
|
+ margin-top: 25px;
|
|
|
}
|
|
|
|
|
|
- .qrcode_box {
|
|
|
- text-align: center;
|
|
|
- margin-top: 10px;
|
|
|
+ .title-wrap .title {
|
|
|
+ font-size: 20px;
|
|
|
+ color: #1a1a1a;
|
|
|
+ margin-bottom: 10px;
|
|
|
}
|
|
|
|
|
|
- .qrcode {
|
|
|
- width: 300px;
|
|
|
+ .title-wrap span {
|
|
|
+ font-size: 15px;
|
|
|
+ color: #666;
|
|
|
+ padding: 5px 10px;
|
|
|
+ background: rgba(255, 255, 255, 0.3);
|
|
|
+ border-radius: 12px;
|
|
|
}
|
|
|
|
|
|
- .qrcode_tips {
|
|
|
- margin-top: 15px;
|
|
|
+ .title-wrap span i {
|
|
|
+ font-weight: bold;
|
|
|
+ color: #ff6060;
|
|
|
+ font-size: 17px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .qrcode-wrap {
|
|
|
+ font-size: 0;
|
|
|
+ margin-top: 20px;
|
|
|
text-align: center;
|
|
|
- font-size: 18px;
|
|
|
- line-height: 30px;
|
|
|
}
|
|
|
|
|
|
- .add_tips {
|
|
|
- color: red;
|
|
|
- letter-spacing: normal;
|
|
|
- max-width: 100% !important;
|
|
|
+ .qrcode-wrap img {
|
|
|
+ width: 152px;
|
|
|
+ height: 152px;
|
|
|
margin-bottom: 10px;
|
|
|
- font-size: 17px;
|
|
|
}
|
|
|
|
|
|
- .notice {
|
|
|
- font-size: 13px;
|
|
|
+ .qrcode-wrap .qrcode-title {
|
|
|
+ font-size: 14px;
|
|
|
color: #333;
|
|
|
- line-height: 1.5;
|
|
|
- background: #f7f7f7;
|
|
|
- padding: 10px;
|
|
|
+ margin-bottom: 4px;
|
|
|
}
|
|
|
|
|
|
- .notice p {
|
|
|
- margin: 0;
|
|
|
+ .qrcode-wrap span {
|
|
|
+ font-size: 12px;
|
|
|
+ color: #999;
|
|
|
}
|
|
|
|
|
|
- .notice .title {
|
|
|
- font-size: 15px;
|
|
|
- margin-bottom: 10px;
|
|
|
+ .notice-wrap {
|
|
|
+ margin: 35px 10px 40px;
|
|
|
+ background: rgba(255, 255, 255, 0.3);
|
|
|
+ padding: 20px 12px;
|
|
|
}
|
|
|
|
|
|
- .notice i {
|
|
|
- font-style: normal;
|
|
|
- color: #ff6060;
|
|
|
+ .notice-wrap .title {
|
|
|
+ font-size: 16px;
|
|
|
+ color: #333;
|
|
|
+ margin-bottom: 15px;
|
|
|
}
|
|
|
|
|
|
- .ignore {
|
|
|
- text-align: right;
|
|
|
- color: #0094ff;
|
|
|
- font-size: 13px;
|
|
|
- margin-top: 10px;
|
|
|
+ .notice-wrap .line {
|
|
|
+ font-size: 12px;
|
|
|
+ color: #333;
|
|
|
+ line-height: 1.8;
|
|
|
}
|
|
|
- .ignore a{
|
|
|
- color: #0094ff ;
|
|
|
+
|
|
|
+ .notice-wrap .line span {
|
|
|
+ color: #ff6060;
|
|
|
+ font-weight: bold;
|
|
|
font-size: 13px;
|
|
|
}
|
|
|
- /*# sourceMappingURL=jt.css.map */
|
|
|
+
|
|
|
+ .notice-wrap .line i {
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+
|
|
|
+ .operator-wrap {
|
|
|
+ margin: 0 10px 20px;
|
|
|
+ display: -webkit-box;
|
|
|
+ display: -ms-flexbox;
|
|
|
+ display: flex;
|
|
|
+ -webkit-box-pack: justify;
|
|
|
+ -ms-flex-pack: justify;
|
|
|
+ justify-content: space-between;
|
|
|
+ -webkit-box-align: center;
|
|
|
+ -ms-flex-align: center;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .operator-wrap a {
|
|
|
+ color: #666;
|
|
|
+ text-decoration: none;
|
|
|
+ text-align: center;
|
|
|
+ height: 40px;
|
|
|
+ line-height: 40px;
|
|
|
+ border-radius: 4px;
|
|
|
+ border: 1px solid #666;
|
|
|
+ background: #e6e6e6;
|
|
|
+ font-size: 15px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .operator-wrap a:not(:last-child) {
|
|
|
+ margin-right: 12px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .operator-wrap .prev,
|
|
|
+ .operator-wrap .catalog {
|
|
|
+ width: 82px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .operator-wrap .ignore {
|
|
|
+ -webkit-box-flex: 1;
|
|
|
+ -ms-flex: 1;
|
|
|
+ flex: 1;
|
|
|
+ }
|
|
|
+
|
|
|
+ @media screen and (max-width: 320px) {
|
|
|
+ .operator-wrap .prev,
|
|
|
+ .operator-wrap .catalog {
|
|
|
+ width: 62px;
|
|
|
+ }
|
|
|
+ }
|
|
|
</style>
|
|
|
</head>
|
|
|
|
|
|
<body>
|
|
|
-<main class="main_box">
|
|
|
- <strong>
|
|
|
- <div class="small_title">扫一扫 赠送200书币</div>
|
|
|
- </strong>
|
|
|
- <div class="qrcode_box">
|
|
|
- <img
|
|
|
- src="{{$img}}"
|
|
|
- class="qrcode"
|
|
|
- />
|
|
|
- </div>
|
|
|
- <div class="qrcode_tips">
|
|
|
- <p>客服号微信</p>
|
|
|
- <p>(长按图片,识别二维码)</p>
|
|
|
- </div>
|
|
|
- <div class="notice">
|
|
|
- <p class="title">我是微信小管家:</p>
|
|
|
- <p class="line">
|
|
|
- 1. <i>免费书币</i>:成功添加微信好友即可赠送200书币;
|
|
|
- </p>
|
|
|
- <p class="line">
|
|
|
- 2. <i>优先答疑</i>:找不到看过的书啦?看书没钱啦?我都可以帮您哦!
|
|
|
- </p>
|
|
|
- <p class="line">
|
|
|
- 3.
|
|
|
- <i>帮您找书</i
|
|
|
- >:总裁豪门、婚恋出轨、甜蜜宠文等,提供最新最优质小说,拒绝书荒!
|
|
|
- </p>
|
|
|
- <p class="line">4. <i>书币福利</i>:每月获得免费书币,不要钱!</p>
|
|
|
- </div>
|
|
|
- <div class="ignore"><a href="{{$link}}">点击忽略,继续阅读下一章>></a></div>
|
|
|
-</main>
|
|
|
+<div class="title-wrap">
|
|
|
+ <p class="title">恭喜您获得微信VIP专属福利</p>
|
|
|
+ <span>扫一扫赠送<i>200</i>书币</span>
|
|
|
+</div>
|
|
|
+<div class="qrcode-wrap">
|
|
|
+ <img
|
|
|
+ src="{{$img}}"
|
|
|
+ alt=""
|
|
|
+ />
|
|
|
+ <p class="qrcode-title">微信阅读小管家</p>
|
|
|
+ <span>(长按图片,识别二维码添加微信好友,不会打扰您哦~)</span>
|
|
|
+</div>
|
|
|
+<div class="notice-wrap">
|
|
|
+ <p class="title">我是微信阅读小管家</p>
|
|
|
+ <p class="line">
|
|
|
+ 1. <i>免费书币</i>:成功添加微信好友即可赠送<span>200</span>书币;
|
|
|
+ </p>
|
|
|
+ <p class="line">
|
|
|
+ 2. <i>优先答疑</i>:找不到看过的书啦?看书没钱啦?我都可以帮您哦!
|
|
|
+ </p>
|
|
|
+ <p class="line">
|
|
|
+ 3.
|
|
|
+ <i>帮您找书</i
|
|
|
+ >:总裁豪门、婚恋出轨、甜蜜宠文等,提供最新最优质小说,拒绝书荒!
|
|
|
+ </p>
|
|
|
+ <p class="line">4. <i>书币福利</i>:每月获得免费书币,不要钱!</p>
|
|
|
+</div>
|
|
|
+<div class="operator-wrap">
|
|
|
+ <a href="{{$link['prev']}}" class="operator-item prev">上一章</a>
|
|
|
+ <a href="{{$link['catalog']}}" class="operator-item catalog">目录</a>
|
|
|
+ <a href="{{$link['next']}}" class="operator-item ignore">点击忽略,继续阅读></a>
|
|
|
+</div>
|
|
|
</body>
|
|
|
</html>
|