191 lines
4.1 KiB
CSS
Executable File
191 lines
4.1 KiB
CSS
Executable File
:root {
|
|
--gembox-black-1: #2D2D2D;
|
|
--gembox-black-2: #383838;
|
|
--gembox-black-3: #2D2D2D;
|
|
--gembox-gray-1: #ddd;
|
|
--gembox-gray-2: #484644;
|
|
--gembox-pink-1: pink;
|
|
--gembox-yellow-1: #D2B48C;
|
|
--gembox-yellow-2: #564D3E;
|
|
--gembox-white-1: #fff;
|
|
--gembox-white-2: #ddd;
|
|
--gembox-purple-1: #47344A;
|
|
--gembox-red-1: #CB3647;
|
|
--gembox-red-2: #733D5C;
|
|
|
|
--main-1: #3498db; /* 主要色,大面积 */
|
|
--sub-1: var(--gembox-red-2); /* 次要色,中亮 */
|
|
--key-1: var(--gembox-yellow-1); /* 强调色,高亮 */
|
|
--key-2: var(--gembox-pink-1);
|
|
--back-1: var(--gembox-black-2); /* 铺垫色,低亮,接近背景 */
|
|
--back-2: var(--gembox-black-3); /* 铺垫色 */
|
|
--back-3: var(--gembox-gray-2); /* 铺垫色 */
|
|
--background-1: var(--gembox-black-1); /* 背景色 */
|
|
--text-1: var(--gembox-white-1); /* 文字颜色 */
|
|
--text-2: var(--gembox-white-2); /* 文字颜色 */
|
|
}
|
|
|
|
.foot {
|
|
height:100px;
|
|
}
|
|
|
|
* {
|
|
font-size: 12px; /* 设置所有元素的字体大小为 12 像素 */
|
|
color: var(--text-1);
|
|
font-family: Arial, sans-serif;
|
|
}
|
|
|
|
body {
|
|
//font-family: Arial, sans-serif;
|
|
margin: 0;
|
|
//padding: 20px;
|
|
background-color:var(--background-1);
|
|
text-align: center; /* 使内容居中 */
|
|
}
|
|
|
|
|
|
a {
|
|
text-decoration: none;
|
|
font-size: 12px;
|
|
color: var(--text-2);
|
|
}
|
|
|
|
a:hover {
|
|
color: var(--key-1);
|
|
}
|
|
|
|
.aHover {
|
|
color: var(--key-1);
|
|
}
|
|
|
|
.btn-1 {
|
|
background-color: var(--back-1); /* 按钮背景色 */
|
|
color: var(--text-2); /* 按钮文字颜色 */
|
|
//border: none; /* 去掉边框 */
|
|
border-color: var(--key-1);
|
|
padding: 5px 15px; /* 内边距 */
|
|
text-align: center; /* 文字居中 */
|
|
text-decoration: none; /* 去掉下划线 */
|
|
display: inline-block; /* 使按钮在行内显示 */
|
|
margin: 0px 2px; /* 按钮间距 */
|
|
cursor: pointer; /* 鼠标悬停时显示手型 */
|
|
border-radius: 10px; /* 按钮圆角 */
|
|
font-size:12px;
|
|
}
|
|
|
|
.btn-1:hover {
|
|
background-color: var(--back-3);
|
|
}
|
|
|
|
table {
|
|
margin: 0 auto; /* 表格居中 */
|
|
}
|
|
|
|
.listTable {
|
|
margin: 0 auto; /* 表格居中 */
|
|
border-collapse: collapse; /* 合并边框 */
|
|
width: auto; /* 设置表格宽度 */
|
|
border-radius: 5px; /* 添加圆角 */
|
|
overflow: hidden; /* 确保圆角效果 */
|
|
border: 0px;
|
|
font-size:12px;
|
|
}
|
|
.listTable th, td {
|
|
border: 0px solid #ddd; /* 边框样式 */
|
|
padding: 8px; /* 内边距 */
|
|
text-align: left;
|
|
}
|
|
.listTable th {
|
|
padding-top:12px;
|
|
padding-bottom:12px;
|
|
background-color: var(--sub-1); /* 表头背景色 */
|
|
color: var(--text-1); /* 表头文字颜色 */
|
|
}
|
|
.listTable td {
|
|
padding-top:12px;
|
|
padding-bottom:12px;
|
|
}
|
|
.listTable tr:nth-child(even) {
|
|
background-color: var(--back-1); /* 偶数行背景色 */
|
|
}
|
|
|
|
.listTable td:first-child, th:first-child {
|
|
padding-left:20px;
|
|
}
|
|
|
|
.listTable td:last-child, th:last-child {
|
|
padding-right:20px;
|
|
}
|
|
|
|
.pagination {
|
|
display: flex; /* 使用 flexbox 进行横向排列 */
|
|
justify-content: center; /* 水平居中对齐 */
|
|
align-items: center; /* 垂直居中对齐 */
|
|
margin-top: 10px; /* 上边距 */
|
|
}
|
|
|
|
.pagination button {
|
|
//margin: 0 5px; /* 按钮之间的水平间距 */
|
|
}
|
|
|
|
.btn-page {
|
|
border-radius: 10px;
|
|
margin:0 3px;
|
|
padding: 3px 10px;
|
|
}
|
|
|
|
.pagination .page-num {
|
|
letter-spacing:2px;
|
|
padding-left:6px;
|
|
padding-right:2px;
|
|
color:var(--text-2);
|
|
}
|
|
|
|
.pagination .page-more {
|
|
letter-spacing:0px;
|
|
color:var(--text-2);
|
|
}
|
|
|
|
.page-on {
|
|
color: var(--key-1);
|
|
font-weight:bold;
|
|
}
|
|
|
|
.ui-dialog-body {
|
|
color:var(--gembox-black-1);
|
|
}
|
|
|
|
.ui-dialog-body textarea {
|
|
color:var(--gembox-black-1);
|
|
width: 300px;
|
|
height: 100px;
|
|
}
|
|
|
|
.ui-dialog-button button {
|
|
font-size:12px !important;
|
|
padding: 7px 15px !important;
|
|
padding-bottom: 5px !important;
|
|
display: inline-block !important;
|
|
}
|
|
|
|
.ui-dialog-autofocus {
|
|
background-color: var(--gembox-red-1) !important;
|
|
border-color:#CB5C56 !important;
|
|
}
|
|
|
|
.ui-dialog-autofocus:hover {
|
|
background-color: #FF5F56 !important;
|
|
}
|
|
|
|
.head {
|
|
margin-bottom:30px;
|
|
margin-top:4px;
|
|
}
|
|
select {
|
|
color: #000;
|
|
}
|
|
|
|
.mtop {
|
|
margin-top:20px;
|
|
}
|