提交 | 用户 | age
|
2a61f6
|
1 |
/** |
L |
2 |
* 通用css样式布局处理 |
|
3 |
* Copyright (c) 2019 ruoyi |
|
4 |
*/ |
|
5 |
|
|
6 |
/** 基础通用 **/ |
|
7 |
.pt5 { |
|
8 |
padding-top: 5px; |
|
9 |
} |
|
10 |
.pr5 { |
|
11 |
padding-right: 5px; |
|
12 |
} |
|
13 |
.pb5 { |
|
14 |
padding-bottom: 5px; |
|
15 |
} |
|
16 |
.mt5 { |
|
17 |
margin-top: 5px; |
|
18 |
} |
|
19 |
.mr5 { |
|
20 |
margin-right: 5px; |
|
21 |
} |
|
22 |
.mb5 { |
|
23 |
margin-bottom: 5px; |
|
24 |
} |
|
25 |
.mb8 { |
|
26 |
margin-bottom: 8px; |
|
27 |
} |
|
28 |
.ml5 { |
|
29 |
margin-left: 5px; |
|
30 |
} |
|
31 |
.mt10 { |
|
32 |
margin-top: 10px; |
|
33 |
} |
|
34 |
.mr10 { |
|
35 |
margin-right: 10px; |
|
36 |
} |
|
37 |
.mb10 { |
|
38 |
margin-bottom: 10px; |
|
39 |
} |
762ab7
|
40 |
.ml10 { |
2a61f6
|
41 |
margin-left: 10px; |
L |
42 |
} |
|
43 |
.mt20 { |
|
44 |
margin-top: 20px; |
|
45 |
} |
|
46 |
.mr20 { |
|
47 |
margin-right: 20px; |
|
48 |
} |
|
49 |
.mb20 { |
|
50 |
margin-bottom: 20px; |
|
51 |
} |
762ab7
|
52 |
.ml20 { |
2a61f6
|
53 |
margin-left: 20px; |
L |
54 |
} |
|
55 |
|
|
56 |
.el-dialog:not(.is-fullscreen){ |
|
57 |
margin-top: 6vh !important; |
|
58 |
} |
|
59 |
|
|
60 |
.el-table { |
|
61 |
.el-table__header-wrapper, .el-table__fixed-header-wrapper { |
|
62 |
th { |
|
63 |
word-break: break-word; |
|
64 |
background-color: #f8f8f9; |
|
65 |
color: #515a6e; |
|
66 |
height: 40px; |
|
67 |
font-size: 13px; |
|
68 |
} |
|
69 |
} |
|
70 |
.el-table__body-wrapper { |
|
71 |
.el-button [class*="el-icon-"] + span { |
|
72 |
margin-left: 1px; |
|
73 |
} |
|
74 |
} |
|
75 |
} |
|
76 |
|
|
77 |
/** 表单布局 **/ |
|
78 |
.form-header { |
|
79 |
font-size:15px; |
|
80 |
color:#6379bb; |
|
81 |
border-bottom:1px solid #ddd; |
|
82 |
margin:8px 10px 25px 10px; |
|
83 |
padding-bottom:5px |
|
84 |
} |
|
85 |
|
|
86 |
/** 表格布局 **/ |
|
87 |
.pagination-container { |
|
88 |
position: relative; |
|
89 |
height: 25px; |
|
90 |
margin-bottom: 10px; |
|
91 |
margin-top: 15px; |
|
92 |
padding: 10px 20px !important; |
|
93 |
} |
|
94 |
|
|
95 |
/* tree border */ |
|
96 |
.tree-border { |
|
97 |
margin-top: 5px; |
|
98 |
border: 1px solid #e5e6e7; |
|
99 |
background: #FFFFFF none; |
|
100 |
border-radius:4px; |
|
101 |
} |
|
102 |
|
|
103 |
.pagination-container .el-pagination { |
|
104 |
right: 0; |
|
105 |
position: absolute; |
|
106 |
} |
|
107 |
|
8410b5
|
108 |
.el-table .fixed-width .el-button--text { |
2a61f6
|
109 |
color: #409EFF; |
L |
110 |
padding-left: 0; |
|
111 |
padding-right: 0; |
|
112 |
width: inherit; |
|
113 |
} |
|
114 |
|
|
115 |
.el-tree-node__content > .el-checkbox { |
|
116 |
margin-right: 8px; |
|
117 |
} |
|
118 |
|
|
119 |
.list-group-striped > .list-group-item { |
|
120 |
border-left: 0; |
|
121 |
border-right: 0; |
|
122 |
border-radius: 0; |
|
123 |
padding-left: 0; |
|
124 |
padding-right: 0; |
|
125 |
} |
|
126 |
|
|
127 |
.list-group { |
|
128 |
padding-left: 0px; |
|
129 |
list-style: none; |
|
130 |
} |
|
131 |
|
|
132 |
.list-group-item { |
|
133 |
border-bottom: 1px solid #e7eaec; |
|
134 |
border-top: 1px solid #e7eaec; |
|
135 |
margin-bottom: -1px; |
|
136 |
padding: 11px 0px; |
|
137 |
font-size: 13px; |
|
138 |
} |
|
139 |
|
|
140 |
.pull-right { |
|
141 |
float: right !important; |
|
142 |
} |
|
143 |
|
|
144 |
.el-card__header { |
|
145 |
padding: 14px 15px 7px; |
|
146 |
min-height: 40px; |
|
147 |
} |
|
148 |
|
|
149 |
.el-card__body { |
|
150 |
padding: 15px 20px 20px 20px; |
|
151 |
} |
|
152 |
|
|
153 |
.card-box { |
|
154 |
padding-right: 15px; |
|
155 |
padding-left: 15px; |
|
156 |
margin-bottom: 10px; |
|
157 |
} |
|
158 |
|
|
159 |
/* button color */ |
|
160 |
.el-button--cyan.is-active, |
|
161 |
.el-button--cyan:active { |
|
162 |
background: #20B2AA; |
|
163 |
border-color: #20B2AA; |
|
164 |
color: #FFFFFF; |
|
165 |
} |
|
166 |
|
|
167 |
.el-button--cyan:focus, |
|
168 |
.el-button--cyan:hover { |
|
169 |
background: #48D1CC; |
|
170 |
border-color: #48D1CC; |
|
171 |
color: #FFFFFF; |
|
172 |
} |
|
173 |
|
|
174 |
.el-button--cyan { |
|
175 |
background-color: #20B2AA; |
|
176 |
border-color: #20B2AA; |
|
177 |
color: #FFFFFF; |
|
178 |
} |
|
179 |
|
|
180 |
/* text color */ |
|
181 |
.text-navy { |
|
182 |
color: #1ab394; |
|
183 |
} |
|
184 |
|
|
185 |
.text-primary { |
|
186 |
color: inherit; |
|
187 |
} |
|
188 |
|
|
189 |
.text-success { |
|
190 |
color: #1c84c6; |
|
191 |
} |
|
192 |
|
|
193 |
.text-info { |
|
194 |
color: #23c6c8; |
|
195 |
} |
|
196 |
|
|
197 |
.text-warning { |
|
198 |
color: #f8ac59; |
|
199 |
} |
|
200 |
|
|
201 |
.text-danger { |
|
202 |
color: #ed5565; |
|
203 |
} |
|
204 |
|
|
205 |
.text-muted { |
|
206 |
color: #888888; |
|
207 |
} |
|
208 |
|
|
209 |
/* image */ |
|
210 |
.img-circle { |
|
211 |
border-radius: 50%; |
|
212 |
} |
|
213 |
|
|
214 |
.img-lg { |
|
215 |
width: 120px; |
|
216 |
height: 120px; |
|
217 |
} |
|
218 |
|
|
219 |
.avatar-upload-preview { |
|
220 |
position: absolute; |
|
221 |
top: 50%; |
|
222 |
transform: translate(50%, -50%); |
|
223 |
width: 180px; |
|
224 |
height: 180px; |
|
225 |
border-radius: 50%; |
|
226 |
box-shadow: 0 0 4px #ccc; |
|
227 |
overflow: hidden; |
|
228 |
} |
|
229 |
|
|
230 |
/* 拖拽列样式 */ |
|
231 |
.sortable-ghost{ |
|
232 |
opacity: .8; |
|
233 |
color: #fff!important; |
|
234 |
background: #42b983!important; |
|
235 |
} |
|
236 |
|
|
237 |
.top-right-btn { |
|
238 |
position: relative; |
|
239 |
float: right; |
8410b5
|
240 |
} |