121 lines
2.5 KiB
Vue
121 lines
2.5 KiB
Vue
<script setup lang="ts">
|
|
</script>
|
|
|
|
<template>
|
|
<div class="m">
|
|
<slot />
|
|
</div>
|
|
</template>
|
|
|
|
<style lang="scss" scoped>
|
|
.m {
|
|
width: 100%;
|
|
height: 100%;
|
|
background-color: #f8f8f8;
|
|
}
|
|
</style>
|
|
|
|
<style lang="scss" scoped>
|
|
/* 移动端样式重置 - 只在移动端布局中生效 */
|
|
.m {
|
|
/* 重置 body 的最小宽度限制 */
|
|
:global(body) {
|
|
min-width: unset !important;
|
|
width: 100% !important;
|
|
max-width: 100% !important;
|
|
background-color: #f8f8f8;
|
|
}
|
|
|
|
/* 重置 #__nuxt 容器的样式 */
|
|
:global(#__nuxt) {
|
|
min-width: unset !important;
|
|
width: 100% !important;
|
|
max-width: 100% !important;
|
|
|
|
// .page-content {
|
|
// padding: 0 !important;
|
|
// overflow-x: hidden !important;
|
|
|
|
// .page-table-wrap {
|
|
// padding: 8px !important;
|
|
// }
|
|
|
|
// .page-card {
|
|
// padding: 8px !important;
|
|
// }
|
|
// }
|
|
}
|
|
|
|
/* 移动端优化滚动条 */
|
|
:global(::-webkit-scrollbar) {
|
|
width: 4px !important;
|
|
height: 4px !important;
|
|
}
|
|
|
|
/* 移动端表格优化 */
|
|
:global(.el-table) {
|
|
font-size: 12px !important;
|
|
|
|
th .cell {
|
|
font-size: 12px !important;
|
|
}
|
|
|
|
td .cell {
|
|
font-size: 12px !important;
|
|
}
|
|
}
|
|
|
|
/* 移动端按钮优化 */
|
|
:global(.el-button) {
|
|
padding: 6px 8px !important;
|
|
font-size: 13px !important;
|
|
}
|
|
|
|
/* 移动端表单优化 */
|
|
:global(.el-form-item) {
|
|
margin-bottom: 12px !important;
|
|
}
|
|
|
|
:global(.el-form-item__label) {
|
|
font-size: 13px !important;
|
|
}
|
|
|
|
:global(.el-input__inner) {
|
|
height: 32px !important;
|
|
font-size: 13px !important;
|
|
}
|
|
|
|
/* 移动端对话框优化 */
|
|
:global(.el-dialog) {
|
|
width: 95% !important;
|
|
margin: 0 auto !important;
|
|
}
|
|
|
|
:global(.el-dialog__body) {
|
|
padding: 12px !important;
|
|
max-height: calc(100vh - 200px) !important;
|
|
}
|
|
|
|
/* 移动端分页器优化 */
|
|
:global(.el-pagination) {
|
|
--el-pagination-font-size: 11px !important;
|
|
--el-pagination-font-size-small: 11px !important;
|
|
--el-pagination-button-height: 24px !important;
|
|
--el-pagination-button-width: 24px !important;
|
|
--el-pagination-button-height-small: 24px !important;
|
|
--el-pagination-button-width-small: 24px !important;
|
|
}
|
|
|
|
/* 移动端标签页优化 */
|
|
:global(.el-tabs__item) {
|
|
padding: 0 12px 6px 0 !important;
|
|
font-size: 13px !important;
|
|
}
|
|
|
|
/* 移动端徽章优化 */
|
|
:global(.el-badge) {
|
|
--el-badge-size: 14px !important;
|
|
--el-badge-padding: 3px !important;
|
|
}
|
|
}
|
|
</style> |