Skip to content

B
breast-feeding-ai-demo-web
Commit 748b9b11 authored by 朱国瑞's avatar 朱国瑞
Browse files
Options

pc 样式调整为375*667

parent 17449d5e
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 130 additions and 126 deletions
src/common/util.js
View file @ 748b9b11
...@@ -49,8 +49,8 @@ export const getSystemInfo = () => { ...@@ -49,8 +49,8 @@ export const getSystemInfo = () => {
let width = 0; let width = 0;
let height = 0; let height = 0;
if (!isMobile()) { if (!isMobile()) {
width = 750; width = 375;
height = document.body.clientHeight > 1334 ? document.body.clientHeight : 1334; height = document.body.clientHeight > 667 ? document.body.clientHeight : 667;
} else { } else {
width = document.body.clientWidth; width = document.body.clientWidth;
height = document.body.clientHeight; height = document.body.clientHeight;
...@@ -59,7 +59,7 @@ export const getSystemInfo = () => { ...@@ -59,7 +59,7 @@ export const getSystemInfo = () => {
if (height === 0) { if (height === 0) {
height = window.innerHeight; height = window.innerHeight;
if (!isMobile()) { if (!isMobile()) {
height = window.innerHeight > 1334 ? window.innerHeight : 1334; height = window.innerHeight > 667 ? window.innerHeight : 667;
} }
} }
let scale = height / width; let scale = height / width;
......
src/components/lightButton.vue
View file @ 748b9b11
...@@ -46,9 +46,9 @@ export default { ...@@ -46,9 +46,9 @@ export default {
top: 0; top: 0;
} }
&.pc { &.pc {
width: 436px; width: 218px;
height: 77.7px; height: 38.85px;
line-height: 77.7px; line-height: 38.85px;
} }
&.mobile { &.mobile {
width: 5.8133rem; width: 5.8133rem;
...@@ -60,11 +60,11 @@ export default { ...@@ -60,11 +60,11 @@ export default {
.btn-text { .btn-text {
width: 100%; width: 100%;
text-align: center; text-align: center;
font-size: 44px; font-size: 22px;
letter-spacing: 0.2em; letter-spacing: 0.2em;
font-weight: bold; font-weight: bold;
&.len { &.len {
font-size: 24px; font-size: 12px;
} }
} }
.btn-img { .btn-img {
......
src/views/complete.vue
View file @ 748b9b11
...@@ -33,9 +33,9 @@ const calcCoord = function () { ...@@ -33,9 +33,9 @@ const calcCoord = function () {
let width = 0; let width = 0;
let height = 0; let height = 0;
if (!isMobile()) { if (!isMobile()) {
width = 750; width = 375;
height = height =
document.body.clientHeight > 1334 ? document.body.clientHeight : 1334; document.body.clientHeight > 667 ? document.body.clientHeight : 667;
} else { } else {
width = document.body.clientWidth; width = document.body.clientWidth;
height = document.body.clientHeight; height = document.body.clientHeight;
...@@ -43,7 +43,7 @@ const calcCoord = function () { ...@@ -43,7 +43,7 @@ const calcCoord = function () {
if (height === 0) { if (height === 0) {
height = window.innerHeight; height = window.innerHeight;
if (!isMobile()) { if (!isMobile()) {
height = window.innerHeight > 1334 ? window.innerHeight : 1334; height = window.innerHeight > 667 ? window.innerHeight : 667;
} }
} }
scale = height / width; scale = height / width;
...@@ -107,9 +107,11 @@ export default { ...@@ -107,9 +107,11 @@ export default {
height: 100%; height: 100%;
} }
.pc { .pc {
height: 100vh;
align-items: center;
.main_content { .main_content {
width: 750px; width: 375px;
min-height: 1334px; height: 667px;
background: #ffffff; background: #ffffff;
position: relative; position: relative;
display: flex; display: flex;
...@@ -120,72 +122,72 @@ export default { ...@@ -120,72 +122,72 @@ export default {
position: absolute; position: absolute;
left: 0; left: 0;
top: 0; top: 0;
width: 750px; width: 375px;
z-index: 0; z-index: 0;
} }
} }
.massage-complete-modal { .massage-complete-modal {
box-sizing: border-box; box-sizing: border-box;
width: 660px; width: 330px;
min-height: 620px; min-height: 310px;
padding: 80px 0 125px; padding: 40px 0 62.5px;
background: #fff; background: #fff;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
border-radius: 14px 14px; border-radius: 7px 7px;
margin: 0 auto; margin: 0 auto;
position: relative; position: relative;
z-index: 1; z-index: 1;
&.noBaby { &.noBaby {
height: 420px; height: 210px;
.bottom { .bottom {
margin-top: 100px; margin-top: 50px;
} }
} }
.nickname { .nickname {
font-size: 46px; font-size: 23px;
color: #fb7c76; color: #fb7c76;
font-family: "Gotham-Book"; font-family: "Gotham-Book";
text-shadow: 2px 2px 4px #ffffff; text-shadow: 1px 1px 2px #ffffff;
span { span {
font-size: 60px; font-size: 30px;
} }
} }
.title { .title {
margin-top: 41px; margin-top: 20.5px;
color: #fb7c76; color: #fb7c76;
font-size: 46px; font-size: 23px;
height: 53px; line-height: 26.5012px;
font-weight: bolder; font-weight: bolder;
.icon { .icon {
width: 69px; width: 34.5px;
height: 45px; height: 22.5px;
} }
} }
.subTitle { .subTitle {
width: 100%; width: 100%;
text-align: center; text-align: center;
color: #fb7c76; color: #fb7c76;
font-size: 26px; font-size: 13px;
margin-top: 20px; margin-top: 10px;
font-weight: bolder; font-weight: bolder;
&.underline { &.underline {
text-decoration: underline; text-decoration: underline;
} }
} }
.record { .record {
margin-top: 100px; margin-top: 50px;
margin-bottom: 100px; margin-bottom: 50px;
width: 559px; width: 280px;
height: 96px; height: 48px;
line-height: 96px; line-height: 48px;
border-radius: 48px 48px; border-radius: 24px 24px;
font-size: 34.67px; font-size: 17.3362px;
color: #999999; color: #999999;
background-color: #f5f5f5; background-color: #f5f5f5;
text-align: center; text-align: center;
text-shadow: 2px 2px 4px #ffffff; text-shadow: 1px 1px 2px #ffffff;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
justify-content: center; justify-content: center;
......
src/views/index.vue
View file @ 748b9b11
This diff is collapsed.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment