Skip to content

A
ant-design-pro-vue
Commit d710c6ae by Sendya
Options

fix: #45 height overflow

parent 4a0506dd
Showing with 704 additions and 702 deletions
src/App.vue
<template> <template>
<a-locale-provider :locale="locale"> <a-locale-provider :locale="locale">
<div id="app"> <div id="app">
<router-view/> <router-view/>
</div> </div>
</a-locale-provider> </a-locale-provider>
</template> </template>
<script> <script>
import zhCN from 'ant-design-vue/lib/locale-provider/zh_CN' import zhCN from 'ant-design-vue/lib/locale-provider/zh_CN'
import { deviceEnquire, DEVICE_TYPE } from '@/utils/device' import { deviceEnquire, DEVICE_TYPE } from '@/utils/device'
import { version } from 'ant-design-vue' import { version } from 'ant-design-vue'
export default { export default {
data () { data () {
return { return {
locale: zhCN, locale: zhCN,
version version
} }
}, },
mounted () { mounted () {
const { $store } = this const { $store } = this
console.log('use Ant-Design Of Vue:', version) console.log('use Ant-Design Of Vue:', version)
deviceEnquire(deviceType => { deviceEnquire(deviceType => {
switch (deviceType) { switch (deviceType) {
case DEVICE_TYPE.DESKTOP: case DEVICE_TYPE.DESKTOP:
$store.commit('TOGGLE_DEVICE', 'desktop') $store.commit('TOGGLE_DEVICE', 'desktop')
$store.dispatch('setSidebar', true) $store.dispatch('setSidebar', true)
break break
case DEVICE_TYPE.TABLET: case DEVICE_TYPE.TABLET:
console.log('tablet') console.log('tablet')
$store.dispatch('ToggleDevice', 'tablet') $store.dispatch('ToggleDevice', 'tablet')
$store.dispatch('setSidebar', false) $store.dispatch('setSidebar', false)
break break
case DEVICE_TYPE.MOBILE: case DEVICE_TYPE.MOBILE:
default: default:
$store.commit('TOGGLE_DEVICE', 'mobile') $store.commit('TOGGLE_DEVICE', 'mobile')
$store.dispatch('setSidebar', false) $store.dispatch('setSidebar', false)
break break
} }
console.log('deviceType', deviceType) console.log('deviceType', deviceType)
}) })
} }
} }
</script> </script>
\ No newline at end of file <style>
#app {
height: 100%;
}
</style>
\ No newline at end of file
src/components/page/GlobalFooter.vue
<template> <template>
<div class="footer"> <div class="footer">
<div class="links"> <div class="links">
<a href="https://pro.ant.design/" target="_blank">Pro 首页</a> <a href="https://pro.ant.design/" target="_blank">Pro 首页</a>
<a href="https://github.com/ant-design/ant-design-pro" target="_blank"> <a href="https://github.com/ant-design/ant-design-pro" target="_blank">
<a-icon type="github"/> <a-icon type="github"/>
</a> </a>
<a href="https://ant.design/">Ant Design</a> <a href="https://ant.design/">Ant Design</a>
<a href="https://vuecomponent.github.io/ant-design-vue/docs/vue/introduce-cn/">Vue Antd</a> <a href="https://vuecomponent.github.io/ant-design-vue/docs/vue/introduce-cn/">Vue Antd</a>
<a>Antd-Vue Version@{{ version }}</a> </div>
</div> <div class="copyright">
<div class="copyright"> Copyright
Copyright <a-icon type="copyright"/>
<a-icon type="copyright"/> 2018 <span>白鹭学园技术组出品</span>
2018 <span>白鹭学园技术组出品</span> </div>
</div> </div>
</div> </template>
</template>
<script>
<script> export default {
import { version } from 'ant-design-vue' name: 'LayoutFooter',
export default { data () {
name: 'LayoutFooter', return {
data () { }
return { }
version }
} </script>
}
} <style lang="scss" scoped>
</script> .footer {
padding: 0 16px;
<style lang="scss" scoped> margin: 48px 0 24px;
.footer { text-align: center;
padding: 0 16px;
margin: 48px 0 24px; .links {
text-align: center; margin-bottom: 8px;
.links { a {
margin-bottom: 8px; color: rgba(0, 0, 0, .45);
a { &:hover {
color: rgba(0, 0, 0, .45); color: rgba(0, 0, 0, .65);
}
&:hover {
color: rgba(0, 0, 0, .65); &:not(:last-child) {
} margin-right: 40px;
}
&:not(:last-child) { }
margin-right: 40px; }
} .copyright {
} color: rgba(0, 0, 0, .45);
} font-size: 14px;
.copyright { }
color: rgba(0, 0, 0, .45); }
font-size: 14px;
}
}
</style> </style>
\ No newline at end of file
src/components/page/GlobalLayout.vue
<template> <template>
<a-layout class="layout" :class="[device]"> <a-layout class="layout" :class="[device]">
<template v-if="isSideMenu()"> <template v-if="isSideMenu()">
<a-drawer <a-drawer
v-if="isMobile()" v-if="isMobile()"
:wrapClassName="'drawer-sider ' + navTheme" :wrapClassName="'drawer-sider ' + navTheme"
:closable="false" :closable="false"
:visible="collapsed" :visible="collapsed"
placement="left" placement="left"
@close="() => this.collapsed = false" @close="() => this.collapsed = false"
> >
<side-menu <side-menu
:menus="menus" :menus="menus"
:theme="navTheme" :theme="navTheme"
:collapsed="false" :collapsed="false"
:collapsible="true" :collapsible="true"
mode="inline" mode="inline"
@menuSelect="menuSelect"></side-menu> @menuSelect="menuSelect"></side-menu>
</a-drawer> </a-drawer>
<side-menu <side-menu
v-else v-else
mode="inline" mode="inline"
:menus="menus" :menus="menus"
:theme="navTheme" :theme="navTheme"
:collapsed="collapsed" :collapsed="collapsed"
:collapsible="true"></side-menu> :collapsible="true"></side-menu>
</template> </template>
<!-- 下次优化这些代码 --> <!-- 下次优化这些代码 -->
<template v-else> <template v-else>
<a-drawer <a-drawer
v-if="isMobile()" v-if="isMobile()"
:wrapClassName="'drawer-sider ' + navTheme" :wrapClassName="'drawer-sider ' + navTheme"
placement="left" placement="left"
@close="() => this.collapsed = false" @close="() => this.collapsed = false"
:closable="false" :closable="false"
:visible="collapsed" :visible="collapsed"
> >
<side-menu <side-menu
:menus="menus" :menus="menus"
:theme="navTheme" :theme="navTheme"
:collapsed="false" :collapsed="false"
:collapsible="true" :collapsible="true"
mode="inline" mode="inline"
@menuSelect="menuSelect"></side-menu> @menuSelect="menuSelect"></side-menu>
</a-drawer> </a-drawer>
</template> </template>
<a-layout :class="[layoutMode, `content-width-${contentWidth}`]" :style="{ paddingLeft: fixSiderbar && isDesktop() ? `${sidebarOpened ? 256 : 80}px` : '0' }"> <a-layout :class="[layoutMode, `content-width-${contentWidth}`]" :style="{ paddingLeft: fixSiderbar && isDesktop() ? `${sidebarOpened ? 256 : 80}px` : '0', minHeight: '100vh' }">
<!-- layout header --> <!-- layout header -->
<global-header <global-header
:mode="layoutMode" :mode="layoutMode"
:menus="menus" :menus="menus"
:theme="navTheme" :theme="navTheme"
:collapsed="collapsed" :collapsed="collapsed"
:device="device" :device="device"
@toggle="toggle" @toggle="toggle"
/> />
<!-- layout content --> <!-- layout content -->
<a-layout-content :style="{ margin: '24px 24px 0', height: '100%', paddingTop: fixedHeader ? '64px' : '0' }"> <a-layout-content :style="{ margin: '24px 24px 0', height: '100%', paddingTop: fixedHeader ? '64px' : '0' }">
<slot></slot> <slot></slot>
</a-layout-content> </a-layout-content>
<!-- layout footer --> <!-- layout footer -->
<a-layout-footer style="padding: 0px"> <a-layout-footer style="padding: 0px">
<global-footer /> <global-footer />
</a-layout-footer> </a-layout-footer>
<setting-drawer></setting-drawer> <setting-drawer></setting-drawer>
</a-layout> </a-layout>
</a-layout> </a-layout>
</template> </template>
<script> <script>
import SideMenu from '@/components/menu/SideMenu' import SideMenu from '@/components/menu/SideMenu'
import GlobalHeader from '@/components/page/GlobalHeader' import GlobalHeader from '@/components/page/GlobalHeader'
import GlobalFooter from '@/components/page/GlobalFooter' import GlobalFooter from '@/components/page/GlobalFooter'
import SettingDrawer from '@/components/setting/SettingDrawer' import SettingDrawer from '@/components/setting/SettingDrawer'
import { triggerWindowResizeEvent } from '@/utils/util' import { triggerWindowResizeEvent } from '@/utils/util'
import { mapState, mapActions } from 'vuex' import { mapState, mapActions } from 'vuex'
import { mixin, mixinDevice } from '@/utils/mixin.js' import { mixin, mixinDevice } from '@/utils/mixin.js'
export default { export default {
name: 'GlobalLayout', name: 'GlobalLayout',
components: { components: {
SideMenu, SideMenu,
GlobalHeader, GlobalHeader,
GlobalFooter, GlobalFooter,
SettingDrawer SettingDrawer
}, },
mixins: [mixin, mixinDevice], mixins: [mixin, mixinDevice],
data () { data () {
return { return {
collapsed: false, collapsed: false,
menus: [] menus: []
} }
}, },
computed: { computed: {
...mapState({ ...mapState({
// 主路由 // 主路由
mainMenu: state => state.permission.addRouters, mainMenu: state => state.permission.addRouters,
}) })
}, },
watch: { watch: {
sidebarOpened(val) { sidebarOpened(val) {
console.log('sidebarOpened', val) console.log('sidebarOpened', val)
this.collapsed = !val this.collapsed = !val
}, },
}, },
created() { created() {
this.menus = this.mainMenu.find((item) => item.path === '/').children this.menus = this.mainMenu.find((item) => item.path === '/').children
console.log('created/sidebarOpened', this.sidebarOpened) console.log('created/sidebarOpened', this.sidebarOpened)
this.collapsed = !this.sidebarOpened this.collapsed = !this.sidebarOpened
}, },
methods: { methods: {
...mapActions(['setSidebar']), ...mapActions(['setSidebar']),
toggle() { toggle() {
this.collapsed = !this.collapsed this.collapsed = !this.collapsed
this.setSidebar(!this.collapsed) this.setSidebar(!this.collapsed)
triggerWindowResizeEvent() triggerWindowResizeEvent()
}, },
menuSelect() { menuSelect() {
if (!this.isDesktop()) { if (!this.isDesktop()) {
this.collapsed = false this.collapsed = false
} }
} }
}, },
} }
</script> </script>
<style lang="scss"> <style lang="scss">
body { body {
// 打开滚动条固定显示 // 打开滚动条固定显示
overflow-y: scroll; overflow-y: scroll;
&.colorWeak { &.colorWeak {
filter: invert(80%); filter: invert(80%);
} }
} }
.layout.ant-layout { .layout.ant-layout {
height: 100%; overflow-x: hidden;
min-height: 100vh;
overflow-x: hidden; &.mobile,&.tablet {
&.mobile,&.tablet { .ant-layout-content {
.ant-layout-content { .content {
margin: 24px 0 0;
.content { }
margin: 24px 0 0; }
}
} /**
* ant-table-wrapper
/** * 覆盖的表格手机模式样式，如果想修改在手机上表格最低宽度，可以在这里改动
* ant-table-wrapper */
* 覆盖的表格手机模式样式，如果想修改在手机上表格最低宽度，可以在这里改动 .ant-table-wrapper {
*/ .ant-table-content {
.ant-table-wrapper { overflow-y: auto;
.ant-table-content { }
overflow-y: auto; .ant-table-body {
} min-width: 800px;
.ant-table-body { }
min-width: 800px; }
} .sidemenu {
} .ant-header-fixedHeader {
.sidemenu {
.ant-header-fixedHeader { &.ant-header-side-opened, &.ant-header-side-closed {
width: 100%
&.ant-header-side-opened, &.ant-header-side-closed { }
width: 100% }
} }
}
} .topmenu {
/* 必须为 topmenu 才能启用流式布局 */
.topmenu { &.content-width-Fluid {
/* 必须为 topmenu 才能启用流式布局 */ .header-index-wide {
&.content-width-Fluid { margin-left: 0;
.header-index-wide { }
margin-left: 0; }
} }
} }
}
} &.ant-layout-has-sider {
flex-direction: row;
&.ant-layout-has-sider { }
flex-direction: row;
} .trigger {
font-size: 20px;
.trigger { line-height: 64px;
font-size: 20px; padding: 0 24px;
line-height: 64px; cursor: pointer;
padding: 0 24px; transition: color .3s;
cursor: pointer; &:hover {
transition: color .3s; background: rgba(0, 0, 0, 0.025);
&:hover { }
background: rgba(0, 0, 0, 0.025); }
}
} .topmenu {
.ant-header-fixedHeader {
.topmenu { position: fixed;
.ant-header-fixedHeader { top: 0;
position: fixed; right: 0;
top: 0; z-index: 9;
right: 0; width: 100%;
z-index: 9; transition: width .2s;
width: 100%;
transition: width .2s; &.ant-header-side-opened {
width: 100%;
&.ant-header-side-opened { }
width: 100%;
} &.ant-header-side-closed {
width: 100%;
&.ant-header-side-closed { }
width: 100%; }
} /* 必须为 topmenu 才能启用流式布局 */
} &.content-width-Fluid {
/* 必须为 topmenu 才能启用流式布局 */ .header-index-wide {
&.content-width-Fluid { max-width: unset;
.header-index-wide { margin-left: 24px;
max-width: unset; }
margin-left: 24px;
} .page-header-index-wide {
max-width: unset;
.page-header-index-wide { }
max-width: unset; }
}
} }
} .sidemenu {
.ant-header-fixedHeader {
.sidemenu { position: fixed;
.ant-header-fixedHeader { top: 0;
position: fixed; right: 0;
top: 0; z-index: 9;
right: 0; width: 100%;
z-index: 9; transition: width .2s;
width: 100%;
transition: width .2s; &.ant-header-side-opened {
width: calc(100% - 256px)
&.ant-header-side-opened { }
width: calc(100% - 256px)
} &.ant-header-side-closed {
width: calc(100% - 80px)
&.ant-header-side-closed { }
width: calc(100% - 80px) }
} }
}
}
.header {
height: 64px;
.header { padding: 0 12px 0 0;
height: 64px; background: #fff;
padding: 0 12px 0 0; box-shadow: 0 1px 4px rgba(0, 21, 41, .08);
background: #fff; position: relative;
box-shadow: 0 1px 4px rgba(0, 21, 41, .08); }
position: relative;
} .header, .top-nav-header-index {
.header, .top-nav-header-index { .user-wrapper {
float: right;
.user-wrapper { height: 100%;
float: right;
height: 100%; .action {
cursor: pointer;
.action { padding: 0 12px;
cursor: pointer; display: inline-block;
padding: 0 12px; transition: all .3s;
display: inline-block; height: 100%;
transition: all .3s;
height: 100%; &:hover {
background: rgba(0, 0, 0, 0.025);
&:hover { }
background: rgba(0, 0, 0, 0.025);
} .avatar {
margin: 20px 8px 20px 0;
.avatar { color: #1890ff;
margin: 20px 8px 20px 0; background: hsla(0, 0%, 100%, .85);
color: #1890ff; vertical-align: middle;
background: hsla(0, 0%, 100%, .85); }
vertical-align: middle;
}
.icon {
font-size: 16px;
.icon { padding: 4px;
font-size: 16px; }
padding: 4px; }
} }
}
} &.dark {
.user-wrapper {
&.dark {
.user-wrapper { .action {
color: rgba(255, 255, 255, 0.85);
.action {
color: rgba(255, 255, 255, 0.85); &:hover {
background: rgba(255, 255, 255, 0.16);
&:hover { }
background: rgba(255, 255, 255, 0.16); }
} }
} }
} }
}
} &.mobile,&.tablet {
.top-nav-header-index {
&.mobile,&.tablet {
.top-nav-header-index { .header-index-wide {
.header-index-wide { .header-index-left {
.header-index-left { .trigger {
color: rgba(255, 255, 255, 0.85);
.trigger { padding: 0 12px;
color: rgba(255, 255, 255, 0.85); }
padding: 0 12px;
} .logo.top-nav-header {
text-align: center;
.logo.top-nav-header { width: 56px;
text-align: center; line-height: 58px;
width: 56px; }
line-height: 58px; }
} }
}
} &.light {
&.light { .header-index-wide {
.header-index-wide { .header-index-left {
.trigger {
.header-index-left { color: rgba(0, 0, 0, 0.65);
.trigger { }
color: rgba(0, 0, 0, 0.65); }
} }
} //
} }
// }
} }
}
} &.tablet {
// overflow: hidden; text-overflow:ellipsis; white-space: nowrap;
&.tablet { .top-nav-header-index {
// overflow: hidden; text-overflow:ellipsis; white-space: nowrap;
.top-nav-header-index { .header-index-wide {
.header-index-wide { .header-index-left {
.logo > a {
.header-index-left { overflow: hidden;
.logo > a { text-overflow:ellipsis;
overflow: hidden; white-space: nowrap;
text-overflow:ellipsis; }
white-space: nowrap; }
} }
} }
}
} }
}
.top-nav-header-index {
box-shadow: 0 1px 4px rgba(0,21,41,.08);
.top-nav-header-index { position: relative;
box-shadow: 0 1px 4px rgba(0,21,41,.08); transition: background .3s,width .2s;
position: relative;
transition: background .3s,width .2s; .header-index-wide {
max-width: 1200px;
.header-index-wide { margin: auto;
max-width: 1200px; padding-left: 0;
margin: auto; display: flex;
padding-left: 0; height: 64px;
display: flex;
height: 64px; .ant-menu.ant-menu-horizontal {
border: none;
.ant-menu.ant-menu-horizontal { height: 64px;
border: none; line-height: 64px;
height: 64px; }
line-height: 64px;
} .header-index-left {
flex: 1 1;
.header-index-left { display: flex;
flex: 1 1;
display: flex; .logo.top-nav-header {
width: 165px;
.logo.top-nav-header { height: 64px;
width: 165px; position: relative;
height: 64px; line-height: 64px;
position: relative; transition: all .3s;
line-height: 64px; overflow: hidden;
transition: all .3s;
overflow: hidden; img {
display: inline-block;
img { vertical-align: middle;
display: inline-block; height: 32px;
vertical-align: middle; }
height: 32px;
} h1 {
color: #fff;
h1 { display: inline-block;
color: #fff; vertical-align: top;
display: inline-block; font-size: 16px;
vertical-align: top; margin: 0 0 0 12px;
font-size: 16px; font-weight: 400;
margin: 0 0 0 12px; }
font-weight: 400; }
} }
}
} .header-index-right {
float: right;
.header-index-right { height: 64px;
float: right; overflow: hidden;
height: 64px; }
overflow: hidden; }
}
} &.light {
background-color: #fff;
&.light {
background-color: #fff; .header-index-wide {
.header-index-left {
.header-index-wide { .logo {
.header-index-left { h1 {
.logo { color: #002140;
h1 { }
color: #002140; }
} }
} }
} }
} }
}
}
// 内容区
.layout-content {
// 内容区 margin: 24px 24px 0px;
.layout-content { height: 100%;
margin: 24px 24px 0px; height: 64px;
height: 100%; padding: 0 12px 0 0;
height: 64px; }
padding: 0 12px 0 0;
} }
} .topmenu {
.page-header-index-wide {
.topmenu { max-width: 1200px;
.page-header-index-wide { margin: 0 auto;
max-width: 1200px; }
margin: 0 auto; }
}
} // drawer-sider 自定义
.ant-drawer.drawer-sider {
// drawer-sider 自定义 .sider {
.ant-drawer.drawer-sider { box-shadow: none;
.sider { }
box-shadow: none;
} &.dark {
.ant-drawer-content {
&.dark { background-color: rgb(0, 21, 41);
.ant-drawer-content { }
background-color: rgb(0, 21, 41); }
} &.light {
} box-shadow: none;
&.light { .ant-drawer-content {
box-shadow: none; background-color: #fff;
.ant-drawer-content { }
background-color: #fff; }
}
} .ant-drawer-body {
padding: 0
.ant-drawer-body { }
padding: 0 }
}
} // 菜单样式
.sider {
// 菜单样式 box-shadow: 2px 0 6px rgba(0, 21, 41, .35);
.sider { position: relative;
box-shadow: 2px 0 6px rgba(0, 21, 41, .35); z-index: 10;
position: relative;
z-index: 10; &.ant-fixed-sidemenu {
position: fixed;
&.ant-fixed-sidemenu { height: 100%;
position: fixed; }
height: 100%;
} .logo {
height: 64px;
.logo { position: relative;
height: 64px; line-height: 64px;
position: relative; padding-left: 24px;
line-height: 64px; -webkit-transition: all .3s;
padding-left: 24px; transition: all .3s;
-webkit-transition: all .3s; background: #002140;
transition: all .3s; overflow: hidden;
background: #002140;
overflow: hidden; img, h1 {
display: inline-block;
img, h1 { vertical-align: middle;
display: inline-block; }
vertical-align: middle;
} img {
height: 32px;
img { }
height: 32px;
} h1 {
color: #fff;
h1 { font-size: 20px;
color: #fff; margin: 0 0 0 12px;
font-size: 20px; font-family: "Chinese Quote", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
margin: 0 0 0 12px; font-weight: 600;
font-family: "Chinese Quote", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; }
font-weight: 600; }
}
} &.light {
background-color: #fff;
&.light { box-shadow: 2px 0px 8px 0px rgba(29, 35, 41, 0.05);
background-color: #fff;
box-shadow: 2px 0px 8px 0px rgba(29, 35, 41, 0.05); .logo {
background: #fff;
.logo { box-shadow: 1px 1px 0px 0px #e8e8e8;
background: #fff;
box-shadow: 1px 1px 0px 0px #e8e8e8; h1 {
color: unset;
h1 { }
color: unset; }
}
} .ant-menu-light {
border-right-color: transparent;
.ant-menu-light { }
border-right-color: transparent; }
}
} }
} // 外置的样式控制
.user-dropdown-menu-wrapper.ant-dropdown-menu {
// 外置的样式控制 padding: 4px 0;
.user-dropdown-menu-wrapper.ant-dropdown-menu {
padding: 4px 0; .ant-dropdown-menu-item {
width: 160px;
.ant-dropdown-menu-item { }
width: 160px;
} .ant-dropdown-menu-item > .anticon:first-child,
.ant-dropdown-menu-item > a > .anticon:first-child,
.ant-dropdown-menu-item > .anticon:first-child, .ant-dropdown-menu-submenu-title > .anticon:first-child
.ant-dropdown-menu-item > a > .anticon:first-child, .ant-dropdown-menu-submenu-title > a > .anticon:first-child {
.ant-dropdown-menu-submenu-title > .anticon:first-child min-width: 12px;
.ant-dropdown-menu-submenu-title > a > .anticon:first-child { margin-right: 8px;
min-width: 12px; }
margin-right: 8px;
} }
} // 数据列表 样式
.table-alert {
// 数据列表 样式 margin-bottom: 16px;
.table-alert { }
margin-bottom: 16px;
} .table-page-search-wrapper {
.table-page-search-wrapper { .ant-form-inline {
.ant-form-inline { .ant-form-item {
display: flex;
.ant-form-item { margin-bottom: 24px;
display: flex; margin-right: 0;
margin-bottom: 24px;
margin-right: 0; .ant-form-item-control-wrapper {
flex: 1 1;
.ant-form-item-control-wrapper { display: inline-block;
flex: 1 1; vertical-align: middle;
display: inline-block; }
vertical-align: middle;
} >.ant-form-item-label {
line-height: 32px;
>.ant-form-item-label { padding-right: 8px;
line-height: 32px; width: auto;
padding-right: 8px; }
width: auto; .ant-form-item-control {
} height: 32px;
.ant-form-item-control { line-height: 32px;
height: 32px; }
line-height: 32px; }
} }
}
} .table-page-search-submitButtons {
display: block;
.table-page-search-submitButtons { margin-bottom: 24px;
display: block; white-space: nowrap;
margin-bottom: 24px; }
white-space: nowrap;
} }
} .content {
.content { .table-operator {
margin-bottom: 18px;
.table-operator {
margin-bottom: 18px; button {
margin-right: 8px;
button { }
margin-right: 8px; }
} }
}
}
</style> </style>
\ No newline at end of file
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