You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
SDMS/out/artifacts/LogisticsSystem_war_exploded/css/xadmin.css

771 lines
19 KiB

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

/* 设置字符集为UTF-8确保页面可以正确显示中文等字符 */
@charset "utf-8";
/* 导入layui框架的CSS文件layui是一个前端UI框架 */
@import url(../lib/layui/css/layui.css);
/* 全局样式重置,移除所有元素的默认外边距和内边距,并设置默认字体 */
* {
margin: 0px;
padding: 0px;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}
/* 移除所有链接的下划线 */
a {
text-decoration: none;
}
/* 设置HTML元素的宽高为100%,并隐藏水平滚动条,允许垂直滚动条 */
html {
width: 100%;
height: 100%;
overflow-x: hidden;
overflow-y: auto;
}
/* 设置body元素的宽度和最小高度确保内容可以填满整个视口 */
body {
width: 100%;
min-height: 100%;
}
/* 容器样式,为页面内容提供内边距 */
.x-body {
padding: 20px;
}
/* 导航栏样式设置内边距、相对定位、z-index、边框、行高和高度 */
.x-nav {
padding: 0 20px;
position: relative;
z-index: 99;
border-bottom: 1px solid #e5e5e5;
line-height: 39px;
height: 39px;
overflow: hidden;
}
/* 错误xblock应该是 .x-block块级元素样式设置显示类型、外边距、内边距、行高、边框和背景颜色 */
.x-block {
display: block;
margin-bottom: 10px;
padding: 5px;
line-height: 22px;
/* border-left: 5px solid #009688; */ /* 注释掉的边框样式 */
border-radius: 0 2px 2px 0;
background-color: #f2f2f2;
}
/* 右浮动样式,用于将元素向右浮动 */
.x-right {
float: right;
}
/* 搜索栏样式,设置下外边距 */
.x-so {
margin-bottom: 20px;
/*text-align: center;*/ /* 注释掉的文本居中样式 */
/*background: #f2f2f2 url() 0 0 no-repeat;*/ /* 注释掉的背景样式 */
}
/* 搜索栏中的layui输入框样式设置宽度 */
.x-so input.layui-input {
width: 150px;
}
/* 搜索栏中的layui表单标签样式设置显示类型为行内块级元素 */
.x-so .layui-form-label {
display: inline-block;
}
/* 搜索栏中的layui输入框和按钮样式设置显示类型为行内块级元素 */
.x-so input.layui-input, .x-so input.layui-btn {
display: inline-block;
}
/* 红色文本样式 */
.x-red {
color: red;
}
/* 链接文本颜色样式 */
.x-a {
color: #1AA093;
}
/* 链接悬停时的文本颜色样式 */
.x-a:hover {
color: #127F74;
}
/* 排序操作的高度样式 */
.x-sort {
height: 30px;
}
/* 显示操作的可点击样式 */
.x-show {
cursor: pointer;
}
/* layui表单开关的顶部外边距样式 */
.layui-form-switch {
margin-top: 0px;
}
/* layui输入框和文本域获得焦点时的边框颜色样式 */
.layui-input:focus, .layui-textarea:focus {
border-color: #189f92!important;
}
/* 分页容器的样式 */
.page {
margin-top: 20px;
/* 上外边距 */
text-align: center;
/* 文本居中 */
}
/* 分页链接的样式 */
.page a {
display: inline-block;
/* 显示为行内块级元素 */
background: #fff url(#) 0 0 no-repeat;
/* 背景图片,这里没有指定图片,所以不会显示 */
color: #888;
/* 文本颜色 */
padding: 10px;
/* 内边距 */
min-width: 15px;
/* 最小宽度 */
border: 1px solid #E2E2E2;
/* 边框样式 */
}
/* 分页数字的样式 */
.page span {
display: inline-block;
/* 显示为行内块级元素 */
padding: 10px;
/* 内边距 */
min-width: 15px;
/* 最小宽度 */
border: 1px solid #E2E2E2;
/* 边框样式 */
}
/* 当前页码的样式 */
.page span.current {
display: inline-block;
/* 显示为行内块级元素 */
background: #009688 url(#) 0 0 no-repeat;
/* 背景颜色和图片 */
color: #fff;
/* 文本颜色 */
padding: 10px;
/* 内边距 */
min-width: 15px;
/* 最小宽度 */
border: 1px solid #009688;
/* 边框样式 */
}
/* 分页器列表项的样式 */
.page .pagination li {
display: inline-block;
/* 显示为行内块级元素 */
margin-right: 5px;
/* 右外边距 */
text-align: center;
/* 文本居中 */
}
/* 激活状态下的分页器列表项的样式 */
.page .pagination li.active span {
background: #009688 url(#) 0 0 no-repeat;
/* 背景颜色和图片 */
color: #fff;
/* 文本颜色 */
border: 1px solid #009688;
/* 边框样式 */
}
/*登录样式*/
/*头部*/
/* 容器样式,通常用于页面的顶部导航 */
.container {
width: 100%;
/* 设置容器宽度为100% */
height: 45px;
/* 设置容器高度为45像素 */
background-color: #222;
/* 设置容器背景颜色为深灰色 */
border-bottom: 1px solid rgba(255, 255, 255, 0.2);
/* 设置容器底部边框为半透明的白色 */
}
/* 容器内logo链接的样式 */
.container .logo a {
float: left;
/* 设置元素左浮动 */
color: #fff;
/* 设置文本颜色为白色 */
font-size: 18px;
/* 设置字体大小为18像素 */
padding-left: 20px;
/* 设置左侧内边距为20像素 */
line-height: 45px;
/* 设置行高为45像素与容器高度一致实现垂直居中 */
width: 200px;
/* 设置元素宽度为200像素 */
}
/* 容器右侧内容的样式 */
.container .right {
background-color: rgba(0, 0, 0, 0);
/* 设置背景颜色为透明 */
float: right;
/* 设置元素右浮动 */
}
/* 容器左侧打开按钮的样式 */
.container .left_open {
height: 45px;
/* 设置高度为45像素 */
float: left;
/* 设置元素左浮动 */
}
/* 容器左侧打开按钮图标的样式 */
.container .left_open i {
display: block;
/* 设置为块级元素 */
background: rgba(255, 255, 255, 0.1) url(#) 0 0 no-repeat;
/* 设置背景颜色和图片,这里没有指定图片,所以不会显示 */
color: #fff;
/* 设置文本颜色为白色 */
width: 32px;
/* 设置宽度为32像素 */
height: 32px;
/* 设置高度为32像素 */
line-height: 32px;
/* 设置行高为32像素实现垂直居中 */
border-radius: 3px;
/* 设置边框圆角 */
text-align: center;
/* 设置文本居中 */
margin-top: 7px;
/* 设置顶部外边距为7像素 */
cursor: pointer;
/* 设置鼠标悬停时为指针形状 */
}
/* 容器左侧打开按钮图标悬停时的样式 */
.container .left_open i:hover {
background: rgba(255, 255, 255, 0.3) url(#) 0 0 no-repeat;
/* 设置悬停时的背景颜色和图片 */
}
/* 容器左侧内容的样式 */
.container .left {
background-color: rgba(0, 0, 0, 0);
/* 设置背景颜色为透明 */
float: left;
/* 设置元素左浮动 */
}
/* 容器导航项的样式 */
.container .layui-nav-item {
line-height: 45px;
/* 设置行高为45像素与容器高度一致实现垂直居中 */
}
/* 容器导航项下拉三角的样式 */
.container .layui-nav-more {
top: 20px;
/* 设置下拉三角的顶部位置 */
}
/* 容器导航子菜单的样式 */
.container .layui-nav-child {
top: 50px;
/* 设置子菜单的顶部位置 */
}
/* 容器导航子菜单项图标的样式 */
.container .layui-nav-child i {
margin-right: 10px;
/* 设置图标右侧外边距为10像素 */
}
/* layui导航项链接的样式 */
.layui-nav .layui-nav-item a {
color: #fff;
/* 设置文本颜色为白色 */
cursor: pointer;
/* 设置鼠标悬停时为指针形状 */
}
/* layui导航子菜单链接的样式 */
.layui-nav .layui-nav-child a {
color: #333;
/* 设置文本颜色为深灰色 */
cursor: pointer;
/* 设置鼠标悬停时为指针形状 */
}
/* 左侧导航栏的样式 */
.left-nav {
position: absolute;
/* 绝对定位 */
top: 46px;
/* 顶部距离为46像素 */
bottom: 42px;
/* 底部距离为42像素 */
left: 0;
/* 左侧距离为0 */
z-index: 2;
/* 设置堆叠顺序为2 */
padding-top: 10px;
/* 顶部内边距为10像素 */
background-color: #EEEEEE;
/* 设置背景颜色为浅灰色 */
width: 220px;
/* 设置宽度为220像素 */
max-width: 220px;
/* 设置最大宽度为220像素 */
overflow: auto;
/* 当内容超出时显示滚动条 */
overflow-x: hidden;
/* 隐藏水平滚动条 */
border-right: 1px solid #e5e5e5;
/* 设置右侧边框为浅灰色 */
}
/* 左侧导航栏列表项的样式 */
.left-nav #nav li {
border-bottom: 1px solid #e5e5e5;
/* 设置底部边框为浅灰色 */
}
/* 左侧导航栏列表项悬停时的样式(注释掉的部分) */
.left-nav #nav li:hover > a {
/*color: blue;*/ /* 设置悬停时文本颜色为蓝色(注释掉) */
}
/* 当前激活的左侧导航栏列表项的样式 */
.left-nav #nav .current {
background-color: rgba(0, 0, 0, 0.3);
/* 设置背景颜色为半透明的黑色 */
}
/* 左侧导航栏列表项链接的样式 */
.left-nav #nav li a {
font-size: 14px;
/* 设置字体大小为14像素 */
padding: 10px 15px 10px 20px;
/* 设置内边距 */
display: block;
/* 显示为块级元素 */
cursor: pointer;
/* 设置鼠标悬停时为指针形状 */
}
/* 左侧导航栏列表项链接的标题样式 */
.left-nav #nav li a cite {
font-size: 14px;
/* 设置字体大小为14像素 */
}
/* 左侧导航栏子菜单的默认样式(隐藏) */
.left-nav #nav li .sub-menu {
display: none;
/* 隐藏子菜单 */
}
/* 左侧导航栏展开的子菜单样式 */
.left-nav #nav li .opened {
display: block;
/* 显示子菜单 */
}
/* 左侧导航栏展开的子菜单悬停时的样式(注释掉的部分) */
.left-nav #nav li .opened:hover {
/*background: #fff url() 0 0 no-repeat;*/
/* 设置悬停时背景颜色和图片(注释掉) */
}
/* 左侧导航栏展开的子菜单中当前激活的列表项样式(未设置样式) */
/* 左侧导航栏子菜单列表项悬停时的样式(注释掉的部分) */
.left-nav #nav li .sub-menu li:hover {
/*color: blue;*/ /* 设置悬停时文本颜色为蓝色(注释掉) */
/*background: #fff url() 0 0 no-repeat;*/
/* 设置悬停时背景颜色和图片(注释掉) */
}
/* 左侧导航栏子菜单列表项链接的样式 */
.left-nav #nav li .sub-menu li a {
padding: 12px 15px 12px 30px;
/* 设置内边距 */
font-size: 14px;
/* 设置字体大小为14像素 */
cursor: pointer;
/* 设置鼠标悬停时为指针形状 */
}
/* 左侧导航栏更深层次的子菜单列表项链接的样式 */
.left-nav #nav li .sub-menu li .sub-menu li a {
padding-left: 45px;
/* 设置左侧内边距为45像素 */
}
/* 左侧导航栏子菜单列表项链接悬停时的样式 */
.left-nav #nav li .sub-menu li a:hover {
color: #148cf1;
/* 设置悬停时文本颜色为蓝色 */
}
/* 左侧导航栏子菜单列表项链接图标的样式 */
.left-nav #nav li .sub-menu li a i {
font-size: 12px;
/* 设置图标字体大小为12像素 */
}
/* 左侧导航栏列表项链接图标的样式 */
.left-nav #nav li a i {
padding-right: 10px;
/* 设置图标右侧外边距为10像素 */
line-height: 14px;
/* 设置图标行高为14像素 */
}
/* 左侧导航栏列表项右侧内容的样式 */
.left-nav #nav li .nav_right {
float: right;
/* 设置内容浮动到右侧 */
font-size: 16px;
/* 设置字体大小为16像素 */
}
/* 左侧滑动按钮的样式 */
.x-slide_left {
width: 17px;
/* 设置宽度为17像素 */
height: 61px;
/* 设置高度为61像素 */
background: url(#) 0 0 no-repeat;
/* 设置背景图片,目前为空 */
position: absolute;
/* 绝对定位 */
top: 200px;
/* 顶部距离为200像素 */
left: 221px;
/* 左侧距离为221像素 */
cursor: pointer;
/* 设置鼠标悬停时为指针形状 */
z-index: 3;
/* 设置堆叠顺序为3 */
}
/* 页面内容的样式 */
.page-content {
position: absolute;
/* 绝对定位 */
top: 46px;
/* 顶部距离为46像素 */
right: 0;
/* 右侧距离为0 */
bottom: 42px;
/* 底部距离为42像素 */
left: 221px;
/* 左侧距离为221像素 */
overflow: hidden;
/* 隐藏溢出的内容 */
z-index: 1;
/* 设置堆叠顺序为1 */
}
/* 页面内容背景的样式 */
.page-content-bg {
position: absolute;
/* 绝对定位 */
top: 46px;
/* 顶部距离为46像素 */
right: 0;
/* 右侧距离为0 */
bottom: 42px;
/* 底部距离为42像素 */
left: 221px;
/* 左侧距离为221像素 */
background: rgba(0,0,0,0.5);
/* 设置半透明的黑色背景 */
url() 0 0 no-repeat;
/* 设置背景图片,目前为空 */
overflow: hidden;
/* 隐藏溢出的内容 */
z-index: 100;
/* 设置堆叠顺序为100 */
display: none;
/* 默认不显示 */
}
/* 页面内容中标签页的样式 */
.page-content .tab {
height: 100%;
/* 设置高度为100% */
width: 100%;
/* 设置宽度为100% */
background: #EFEEF0 url(#) 0 0 no-repeat;
/* 设置背景颜色和图片,目前为空 */
margin: 0px;
/* 移除默认外边距 */
}
/* 页面内容中标签页标题的样式 */
.page-content .layui-tab-title {
/*padding-top: 5px;*/
/* 注释掉的顶部内边距 */
height: 35px;
/* 设置高度为35像素 */
background: #EFEEF0 url(#) 0 0 no-repeat;
/* 设置背景颜色和图片,目前为空 */
position: relative;
/* 相对定位 */
z-index: 100;
/* 设置堆叠顺序为100 */
}
/* 页面内容中标签页标题的首页图标样式 */
.page-content .layui-tab-title li.home i {
padding-right: 5px;
/* 设置图标右侧外边距为5像素 */
}
/* 页面内容中标签页标题的首页关闭按钮样式 */
.page-content .layui-tab-title li.home .layui-tab-close {
display: none;
/* 不显示关闭按钮 */
}
/* 页面内容中标签页标题列表项的样式 */
.page-content .layui-tab-title li {
line-height: 35px;
/* 设置行高为35像素确保文本垂直居中 */
}
/* 页面内容中当前激活标签页标题的下划线样式 */
.page-content .layui-tab-title .layui-this:after {
height: 36px;
/* 设置下划线高度为36像素 */
}
/* 页面内容中标签页标题的关闭按钮样式 */
.page-content .layui-tab-title li .layui-tab-close {
border-radius: 50%;
/* 设置关闭按钮为圆形 */
}
/* 页面内容中当前激活标签页标题的样式 */
.page-content .layui-tab-title .layui-this {
background: #fff url(#) 0 0 no-repeat;
/* 设置背景颜色和图片,目前为空 */
}
/* 页面内容中标签页标题的水平滚动条样式 */
.page-content .layui-tab-bar {
height: 34px;
/* 设置高度为34像素 */
line-height: 35px;
/* 设置行高为35像素确保滚动条垂直居中 */
}
/* 页面内容中标签页内容的样式 */
.page-content .layui-tab-content {
position: absolute;
/* 绝对定位 */
top: 36px;
/* 顶部距离为36像素 */
bottom: 0px;
/* 底部距离为0像素 */
width: 100%;
/* 宽度为100% */
background: #fff url(#) 0 0 no-repeat;
/* 设置背景颜色和图片,目前为空 */
padding: 0px;
/* 移除内边距 */
overflow: hidden;
/* 隐藏溢出的内容 */
}
/* 页面内容中单个标签页项的样式 */
.page-content .layui-tab-content .layui-tab-item {
width: 100%;
/* 宽度为100% */
height: 100%;
/* 高度为100% */
}
/* 页面内容中单个标签页项内iframe的样式 */
.page-content .layui-tab-content .layui-tab-item iframe {
width: 100%;
/* 宽度为100% */
height: 100%;
/* 高度为100% */
}
/* 设置轮播图及其子项的背景颜色 */
.x-admin-carousel, .layui-carousel, .x-admin-carousel>[carousel-item]>* {
background-color: #fff;
/* 白色背景 */
}
/* 设置后台管理面板中待办事项的样式 */
.x-admin-backlog .x-admin-backlog-body {
display: block;
/* 块级显示 */
padding: 10px 15px;
/* 内边距 */
background-color: #f8f8f8;
/* 浅灰色背景 */
color: #999;
/* 深灰色文本 */
border-radius: 2px;
/* 边框圆角 */
transition: all .3s;
/* 过渡效果所有属性变化在0.3秒内完成 */
-webkit-transition: all .3s;
/* 兼容旧版Webkit浏览器所有属性变化在0.3秒内完成 */
}
/* 待办事项标题样式 */
.x-admin-backlog-body h3 {
padding-bottom: 10px;
/* 底部内边距 */
font-size: 12px;
/* 字体大小 */
}
/* 待办事项数字样式 */
.x-admin-backlog-body p cite {
font-style: normal;
/* 正常字体样式 */
font-size: 30px;
/* 字体大小 */
font-weight: 300;
/* 字体粗细 */
color: #009688;
/* 绿色文本 */
}
/* 待办事项鼠标悬停时的样式 */
.x-admin-backlog-body:hover {
background-color: #CFCFCF;
/* 悬停时背景颜色 */
color: #888;
/* 悬停时文本颜色 */
}
/* 页脚样式 */
.welcome-footer {
padding: 30px 0;
/* 顶部和底部内边距 */
line-height: 30px;
/* 行高 */
text-align: center;
/* 文本居中 */
background-color: #eee;
/* 浅灰色背景 */
color: #666;
/* 深灰色文本 */
font-weight: 300;
/* 字体粗细 */
}
/* 后台管理布局页脚的样式 */
body .layui-layout-admin .footer-demo {
height: auto;
/* 高度自适应 */
padding: 15px 0;
/* 顶部和底部内边距 */
line-height: 26px;
/* 行高 */
}
/* 页脚链接样式 */
.welcome-footer a {
padding: 0 5px;
/* 左右内边距 */
}
/* 表格单元格样式,确保内容不会超出单元格 */
table th, table td {
word-break: break-all;
/* 允许在单词内部进行断行 */
}
/* 页脚样式 */
.footer {
position: fixed;
/* 固定定位,相对于视口 */
bottom: 0px;
/* 距离视口底部0像素 */
width: 100%;
/* 宽度为100% */
background-color: #222;
/* 深灰色背景 */
border-top: 1px solid rgba(255, 255, 255, 0.2);
/* 上边框为半透明白色 */
line-height: 41px;
/* 行高为41像素 */
color: #fff;
/* 文本颜色为白色 */
/*padding-left: 10px;*/
/* 左侧内边距,已注释掉 */
}
.footer .copyright {
margin-left: 10px;
/* 左侧外边距为10像素 */
}
/* 响应式设计针对屏幕宽度小于或等于768像素的设备 */
@media screen and (max-width: 768px) {
.fast-add {
display: none;
/* 隐藏快速添加按钮 */
}
.layui-nav .to-index {
display: none;
/* 隐藏返回首页的导航项 */
}
.container .logo a {
width: 140px;
/* 调整logo宽度 */
}
.container .left_open {
/*float: right;*/ /* 已注释掉,可能用于调整左侧菜单按钮位置 */
}
.left-nav {
left: -221px;
/* 将左侧导航栏隐藏在视口左侧 */
}
.page-content {
left: 0px;
/* 将页面内容区域左对齐 */
}
.page-content .layui-tab-content .layui-tab-item {
-webkit-overflow-scrolling: touch;
/* 在iOS设备上启用硬件加速滚动 */
overflow-y: scroll;
/* 启用垂直滚动条 */
}
.x-so input.layui-input {
width: 100%;
/* 搜索输入框宽度为100% */
margin: 10px;
/* 搜索输入框的外边距 */
}
}