|
@@ -18,6 +18,34 @@
|
|
|
transition: all 0.3s ease; /* 过渡动画 */
|
|
|
}
|
|
|
|
|
|
+/*证件类型前面的小input*/
|
|
|
+.styled-input.short {
|
|
|
+ /*display: block; /* 使其独占一行 */
|
|
|
+ width: 80px; /* 宽度为容器宽度 */
|
|
|
+ height: 30px;
|
|
|
+ padding: 6px; /* 内边距 */
|
|
|
+ font-size: 14px; /* 字体大小 */
|
|
|
+ color: #333; /* 字体颜色 */
|
|
|
+ /*background-color: #fff; !* 背景颜色 *!*/
|
|
|
+ border: 1px solid #ccc; /* 边框 */
|
|
|
+ border-radius: 4px; /* 圆角边框 */
|
|
|
+ outline: none; /* 移除轮廓 */
|
|
|
+ transition: all 0.3s ease; /* 过渡动画 */
|
|
|
+}
|
|
|
+.customize-form-group .styled-input.edit_inputs {
|
|
|
+ /*display: block; /* 使其独占一行 */
|
|
|
+ width: 480px; /* 宽度为容器宽度 */
|
|
|
+ height: 30px;
|
|
|
+ padding: 6px; /* 内边距 */
|
|
|
+ font-size: 14px; /* 字体大小 */
|
|
|
+ color: #333; /* 字体颜色 */
|
|
|
+ /*background-color: #fff; !* 背景颜色 *!*/
|
|
|
+ border: 1px solid #ccc; /* 边框 */
|
|
|
+ border-radius: 4px; /* 圆角边框 */
|
|
|
+ outline: none; /* 移除轮廓 */
|
|
|
+ transition: all 0.3s ease; /* 过渡动画 */
|
|
|
+}
|
|
|
+
|
|
|
/* 聚焦时的效果 */
|
|
|
.styled-input:focus {
|
|
|
border-color: #55acee; /* 聚焦时边框颜色 */
|
|
@@ -47,6 +75,51 @@
|
|
|
box-shadow: 0 0 5px rgba(85, 170, 238, 0.5); /* 改变过的阴影 */
|
|
|
background-color: rgb(232, 240, 254);
|
|
|
}
|
|
|
+/* 名字后面的勾的状态*/
|
|
|
+.customize-form-group .fa {
|
|
|
+ position: relative;
|
|
|
+ top: -7px; /* 根据需要调整这个值 */
|
|
|
+}
|
|
|
+/*判断为1的数据显示红色*/
|
|
|
+.customize-form-group .fa-check {
|
|
|
+ color: red;
|
|
|
+}
|
|
|
+/*勾后面字的位置*/
|
|
|
+.customize-form-group .status {
|
|
|
+ position: relative;
|
|
|
+ top: -5px; /* 根据需要调整这个值 */
|
|
|
+ width: 50px;
|
|
|
+ border: none;
|
|
|
+}
|
|
|
+/*用于一行显示 数据不够填充长度*/
|
|
|
+.span_line{
|
|
|
+ width: 66px;
|
|
|
+}
|
|
|
+
|
|
|
+.input-groups {
|
|
|
+ display: inline-flex; /* 使用inline-flex布局 */
|
|
|
+ flex-wrap: nowrap; /* 防止单选按钮换行 */
|
|
|
+ white-space: nowrap; /* 防止文字换行 */
|
|
|
+ overflow: hidden; /* 当内容超出时隐藏多余部分 */
|
|
|
+ text-overflow: ellipsis; /* 显示省略号表示被截断的内容 */
|
|
|
+ width:480px;
|
|
|
+ height: 30px;
|
|
|
+ transform: translateY(20%); /* 向上移动一半的高度 */
|
|
|
+ vertical-align: middle; /* 垂直居中对齐 */
|
|
|
+}
|
|
|
+
|
|
|
+.form-check-radio {
|
|
|
+ margin-right: 0.5em; /* 调整单选按钮与文字间的距离 */
|
|
|
+ margin: 1px 5px 10px 10px !important;
|
|
|
+ margin-top: 1px;
|
|
|
+ line-height: normal;
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+/*这个是保险 input 多选方式宽度 */
|
|
|
+.mySelectClass {
|
|
|
+ width: 480px !important;
|
|
|
+}
|
|
|
+
|
|
|
input{
|
|
|
width: 15px;
|
|
|
}
|
|
@@ -105,6 +178,13 @@ li {
|
|
|
margin-bottom: 0.5em; /* 每个子元素底部的外边距 */
|
|
|
}
|
|
|
|
|
|
+.customize-form-group.edit {
|
|
|
+ display: flex; /* 使用 Flexbox 布局 */
|
|
|
+ align-items: end; /* 垂直居中对齐子元素 */
|
|
|
+ flex-basis: calc(5% - 0.5em); /* 计算每个子元素的基础大小,减去一定的间隔 */
|
|
|
+ margin-bottom: 0.5em; /* 每个子元素底部的外边距 */
|
|
|
+}
|
|
|
+
|
|
|
/* 控制输入框前面的label 标签显示的内容 */
|
|
|
.customize-form-group label {
|
|
|
width: 150px; /* 标签的宽度 */
|
|
@@ -141,6 +221,10 @@ li {
|
|
|
.customize-form-group {
|
|
|
flex-basis: 40%; /* 在小屏幕设备上,每个表单项占据整行 */
|
|
|
}
|
|
|
+ .customize-search-form{
|
|
|
+ flex-basis: 40%;!important; /* 在小屏幕设备上,每个表单项占据整行 */
|
|
|
+ margin-bottom: 1px;
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
/* 查询条件容器 */
|