feat: remove screen adaptation prompt
This commit is contained in:
wswmsword
parent
2b76317c7c
commit
4b700eb8c7
|
|
@ -1,140 +0,0 @@
|
||||||
<script setup lang="ts">
|
|
||||||
const { t } = useI18n()
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<van-cell
|
|
||||||
class="notice"
|
|
||||||
>
|
|
||||||
<template #title>
|
|
||||||
<i18n-t keypath="menus.adaptation-info" tag="p">
|
|
||||||
<template #min>
|
|
||||||
<code>min()</code>
|
|
||||||
</template>
|
|
||||||
<template #max>
|
|
||||||
<code>max()</code>
|
|
||||||
</template>
|
|
||||||
<template #option>
|
|
||||||
<code>maxDisplayWidth</code>
|
|
||||||
</template>
|
|
||||||
</i18n-t>
|
|
||||||
|
|
||||||
<i18n-t keypath="menus.compatibility-info" tag="p">
|
|
||||||
<template #documentation>
|
|
||||||
<a target="_blank" href="https://easy-temps.github.io/easy-docs/vue3-vant-mobile/browser-adaptation">{{ t("menus.doc") }}</a>
|
|
||||||
</template>
|
|
||||||
</i18n-t>
|
|
||||||
|
|
||||||
<ul>
|
|
||||||
<i18n-t keypath="menus.browser-support.min-max-clamp" tag="li">
|
|
||||||
<template #compat_min>
|
|
||||||
<span class="yes-min">{{ t("menus.browser-support.compat") }}</span><span class="no-min">{{ t("menus.browser-support.not-compat") }}</span>
|
|
||||||
</template>
|
|
||||||
<template #min>
|
|
||||||
<code>min()</code>
|
|
||||||
</template>
|
|
||||||
<template #max>
|
|
||||||
<code>max()</code>
|
|
||||||
</template>
|
|
||||||
<template #clamp>
|
|
||||||
<code>clamp()</code>
|
|
||||||
</template>
|
|
||||||
</i18n-t>
|
|
||||||
<i18n-t keypath="menus.browser-support.calc" tag="li">
|
|
||||||
<template #compat_calc>
|
|
||||||
<span class="yes-calc">{{ t("menus.browser-support.compat") }}</span><span class="no-calc">{{ t("menus.browser-support.not-compat") }}</span>
|
|
||||||
</template>
|
|
||||||
<template #calc>
|
|
||||||
<code>calc()</code>
|
|
||||||
</template>
|
|
||||||
</i18n-t>
|
|
||||||
<i18n-t keypath="menus.browser-support.vw" tag="li">
|
|
||||||
<template #compat_vw>
|
|
||||||
<span class="yes-vw">{{ t("menus.browser-support.compat") }}</span><span class="no-vw">{{ t("menus.browser-support.not-compat") }}</span>
|
|
||||||
</template>
|
|
||||||
<template #vw>
|
|
||||||
<code>vw</code>
|
|
||||||
</template>
|
|
||||||
</i18n-t>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
<p class="show">
|
|
||||||
{{ t('menus.consider-compatibility') }}
|
|
||||||
</p>
|
|
||||||
</template>
|
|
||||||
</van-cell>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
.notice {
|
|
||||||
font-size: 11px;
|
|
||||||
line-height: 17px;
|
|
||||||
}
|
|
||||||
code {
|
|
||||||
background: rgba(142, 150, 170, 0.14);
|
|
||||||
padding: 2px 6px;
|
|
||||||
color: #51a13c;
|
|
||||||
border-radius: 4px;
|
|
||||||
}
|
|
||||||
p {
|
|
||||||
margin: 9px 0;
|
|
||||||
}
|
|
||||||
a {
|
|
||||||
text-decoration: underline;
|
|
||||||
color: #51a13c;
|
|
||||||
text-underline-offset: 3px;
|
|
||||||
}
|
|
||||||
.yes-min,
|
|
||||||
.yes-vw,
|
|
||||||
.yes-calc {
|
|
||||||
color: green;
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
.no-min,
|
|
||||||
.no-vw,
|
|
||||||
.no-calc {
|
|
||||||
color: red;
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.show {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
@supports (left: min(1px, 2px)) {
|
|
||||||
.yes-min {
|
|
||||||
display: inline;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@supports not (left: min(1px, 2px)) {
|
|
||||||
.no-min {
|
|
||||||
display: inline;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@supports (left: calc(1px + 2px)) {
|
|
||||||
.yes-calc {
|
|
||||||
display: inline;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@supports not (left: calc(1px + 2px)) {
|
|
||||||
.no-calc {
|
|
||||||
display: inline;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@supports (left: 1vw) {
|
|
||||||
.yes-vw {
|
|
||||||
display: inline;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@supports not (left: 1vw) {
|
|
||||||
.no-vw {
|
|
||||||
display: inline;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@supports (left: min(1px, 2px)) and (left: calc(1px + 2px)) and (left: 1vw) {
|
|
||||||
.show {
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
@ -15,19 +15,7 @@
|
||||||
"settings": "Settings",
|
"settings": "Settings",
|
||||||
"basicSettings": "Basic Settings",
|
"basicSettings": "Basic Settings",
|
||||||
"exampleComponents": "Example components",
|
"exampleComponents": "Example components",
|
||||||
"forgot-password": "Forgot Password",
|
"forgot-password": "Forgot Password"
|
||||||
"prompt": "Prompt",
|
|
||||||
"adaptation-info": "Screen adaptation is implemented using {min} and {max}. If style issues occur due to compatibility problems, open the vite.config.ts file, remove the {option} option, and disable desktop adaptation.",
|
|
||||||
"compatibility-info": "If you need to meet both compatibility and desktop adaptation requirements, please refer to the {documentation} for detailed information.",
|
|
||||||
"doc": "documentation",
|
|
||||||
"browser-support": {
|
|
||||||
"min-max-clamp": "The current browser is {compat_min} with {min}, {max}, and {clamp}.",
|
|
||||||
"calc": "The current browser is {compat_calc} with {calc}.",
|
|
||||||
"vw": "The current browser is {compat_vw} with {vw}.",
|
|
||||||
"compat": "compatible",
|
|
||||||
"not-compat": "not compatible"
|
|
||||||
},
|
|
||||||
"consider-compatibility": "Please consider whether the actual deployment scenario of the application requires compatibility adjustments."
|
|
||||||
},
|
},
|
||||||
"mock": {
|
"mock": {
|
||||||
"fromAsyncData": "Data from asynchronous requests",
|
"fromAsyncData": "Data from asynchronous requests",
|
||||||
|
|
|
||||||
|
|
@ -15,19 +15,7 @@
|
||||||
"settings": "设置",
|
"settings": "设置",
|
||||||
"basicSettings": "基本设置",
|
"basicSettings": "基本设置",
|
||||||
"exampleComponents": "示例组件",
|
"exampleComponents": "示例组件",
|
||||||
"forgot-password": "忘记密码",
|
"forgot-password": "忘记密码"
|
||||||
"prompt": "提示",
|
|
||||||
"adaptation-info": "屏幕适配通过 {min} 和 {max} 实现，若兼容性导致了样式错乱，请打开 vite.config.ts 文件，删除 {option} 选项，关闭桌面端适配。",
|
|
||||||
"compatibility-info": "若需同时满足兼容性和桌面端适配，请查看{documentation}了解详细信息。",
|
|
||||||
"doc": "文档",
|
|
||||||
"browser-support": {
|
|
||||||
"min-max-clamp": "当前浏览器{compat_min} {min}、{max} 和 {clamp}。",
|
|
||||||
"calc": "当前浏览器{compat_calc} {calc}。",
|
|
||||||
"vw": "当前浏览器{compat_vw} {vw}。",
|
|
||||||
"compat": "已兼容",
|
|
||||||
"not-compat": "未兼容"
|
|
||||||
},
|
|
||||||
"consider-compatibility": "请考虑应用的真实投放场景是否需要考虑兼容性。"
|
|
||||||
},
|
},
|
||||||
"mock": {
|
"mock": {
|
||||||
"fromAsyncData": "来自异步请求的数据",
|
"fromAsyncData": "来自异步请求的数据",
|
||||||
|
|
|
||||||
|
|
@ -62,10 +62,6 @@ const menuItems = computed(() => ([
|
||||||
</template>
|
</template>
|
||||||
</VanCellGroup>
|
</VanCellGroup>
|
||||||
|
|
||||||
<VanCellGroup :title="t('menus.prompt')" :inset="true">
|
|
||||||
<Notice />
|
|
||||||
</VanCellGroup>
|
|
||||||
|
|
||||||
<van-popup v-model:show="showLanguagePicker" position="bottom">
|
<van-popup v-model:show="showLanguagePicker" position="bottom">
|
||||||
<van-picker
|
<van-picker
|
||||||
v-model="languageValues"
|
v-model="languageValues"
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue