PluginProbe
LearnPress – WordPress LMS Plugin for Create and Sell Online Courses / 4.4.4
LearnPress – WordPress LMS Plugin for Create and Sell Online Courses v4.4.4
4.4.7 4.4.6 4.4.5 4.4.4 4.4.3 4.4.2 4.4.1 4.4.0 4.3.9.1 4.3.9 4.3.8 4.3.7 4.1.6.9 4.1.6.9.1 4.1.6.9.2 4.1.6.9.3 4.1.6.9.4 4.1.7 4.1.7.1 4.1.7.2 4.1.7.3 4.1.7.3.1 4.1.7.3.2 4.2.0 4.2.1 All 138 releases
learnpress / assets / css / edit-question.css

edit-question.css in LearnPress – WordPress LMS Plugin for Create and Sell Online Courses 4.4.4, at assets/css/edit-question.css

333 lines 6.9 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 /**
2 * Style for the edit question page in LearnPress
3 * @since 4.2.9
4 * @version 1.0.0
5 */
6 /**
7 * Style for the popup select item to add in LearnPress
8 */
9 .lp-icon-angle-down {
10 display: none;
11 cursor: pointer;
12 }
13
14 .lp-icon-angle-up {
15 display: inline-block;
16 cursor: pointer;
17 }
18
19 .lp-collapse .lp-icon-angle-up {
20 display: none;
21 }
22 .lp-collapse .lp-icon-angle-down {
23 display: inline-block;
24 }
25
26 .lp-section-collapse {
27 display: grid;
28 padding: 12px;
29 border: 1px solid #C3C4C7;
30 border-top: none;
31 }
32
33 .lp-section-toggle.lp-collapse .lp-section-collapse {
34 display: none;
35 }
36
37 .lp-trigger-toggle {
38 display: flex;
39 align-items: center;
40 }
41
42 /**
43 * Style for the popup alert, confirm
44 * @link https://sweetalert2.github.io/
45 * @since 4.2.9
46 * @version 1.0.0
47 */
48 .swal2-container {
49 z-index: 99999;
50 }
51
52 .swal2-popup {
53 max-width: 850px;
54 }
55 .swal2-popup .content-title {
56 margin: 0 0 20px 0;
57 padding: 0;
58 text-align: center;
59 font-size: 1.5em;
60 font-weight: bold;
61 }
62 .swal2-popup .swal2-actions {
63 width: 100%;
64 padding: 0 30px;
65 }
66 .swal2-popup .swal2-actions button {
67 flex: 1;
68 }
69 .swal2-popup .swal2-actions button.swal2-confirm {
70 background-color: #e02200;
71 }
72 .swal2-popup .swal2-actions button.swal2-cancel {
73 background-color: transparent;
74 border: 1px solid #ccc;
75 color: inherit;
76 }
77 .swal2-popup .swal2-warning {
78 color: #e02200;
79 border-color: transparent;
80 background-color: rgba(223, 0, 0, 0.1019607843);
81 }
82 .swal2-popup .swal2-icon {
83 width: 50px;
84 height: 50px;
85 }
86 .swal2-popup .swal2-icon .swal2-icon-content {
87 font-size: 0;
88 }
89 .swal2-popup .swal2-icon .swal2-icon-content::before {
90 content: "\f071";
91 font-family: "lp-icon";
92 font-size: 24px;
93 display: inline-block;
94 }
95 .swal2-popup .swal2-title {
96 font-size: 1.5em;
97 }
98 .swal2-popup .swal2-html-container {
99 font-size: 1em;
100 }
101 .swal2-popup .lp-tom-select.ts-wrapper .ts-dropdown {
102 max-height: 200px;
103 overflow: hidden;
104 }
105 .swal2-popup .swal2-close {
106 background-color: unset !important;
107 outline: none !important;
108 color: rgb(204, 204, 204) !important;
109 }
110 .swal2-popup .swal2-close:hover {
111 color: #f27474 !important;
112 }
113
114 .lp-icon-spinner {
115 animation: rotation 2s infinite linear;
116 font-size: 1.25rem;
117 color: #2271b1 !important;
118 display: none;
119 }
120
121 .lp-icon-drag {
122 cursor: grab;
123 line-height: 1;
124 }
125 .lp-icon-drag:active {
126 cursor: grabbing;
127 }
128
129 /***** Main Question Edit Styles using styles from Quiz Builder *****/
130 .lp-question-edit-main {
131 display: grid;
132 gap: 20px;
133 overflow: hidden;
134 padding: 20px;
135 grid-template-columns: 1fr 1fr;
136 /**
137 * Style for the buttons
138 */
139 }
140 .lp-question-edit-main [class*=lp-icon-] {
141 font-size: 1.25rem;
142 color: #787c82;
143 cursor: pointer;
144 }
145 .lp-question-edit-main input {
146 padding: 0;
147 margin: 0;
148 }
149 .lp-question-edit-main input[type=text] {
150 width: 100%;
151 border: none;
152 background: transparent;
153 box-shadow: none;
154 }
155 .lp-question-edit-main .lp-question-fib-buttons button {
156 display: flex !important;
157 align-items: center;
158 gap: 5px;
159 }
160 .lp-question-edit-main .lp-question-fib-buttons button.loading {
161 pointer-events: none;
162 opacity: 0.5 !important;
163 }
164 .lp-question-edit-main .lp-question-fib-buttons button.loading .lp-icon-spinner {
165 display: inline-block;
166 }
167 .lp-question-edit-main .loading {
168 pointer-events: none;
169 opacity: 0.5 !important;
170 }
171 .lp-question-edit-main .loading .lp-icon-spinner {
172 display: inline-block;
173 }
174 .lp-question-edit-main .lp-btn-edit-primary {
175 border: none;
176 background: #135e96;
177 color: #fff;
178 }
179 .lp-question-edit-main .lp-btn-edit-primary:not(.active) {
180 opacity: 0.5;
181 }
182 .lp-question-edit-main .lp-btn-edit-primary:hover, .lp-question-edit-main .lp-btn-edit-primary.active, .lp-question-edit-main .lp-btn-edit-primary.active:hover {
183 background: #135E96;
184 color: #fff;
185 opacity: 1;
186 }
187
188 .question-edit-details .lp-section-collapse {
189 padding: 0;
190 border: 1px solid #dcdcde;
191 }
192
193 .lp-question-data-edit-header {
194 display: flex;
195 align-items: center;
196 justify-content: space-between;
197 margin-bottom: 10px;
198 font-weight: bold;
199 }
200
201 .lp-question-choice-header {
202 display: flex;
203 justify-content: space-between;
204 padding: 10px;
205 background: #dcdcde;
206 }
207
208 .lp-question-answer-item {
209 display: flex;
210 flex-direction: row;
211 align-items: center;
212 gap: 5px;
213 padding: 5px;
214 margin: 0;
215 border: 1px solid #dcdcde;
216 border-top: none;
217 }
218 .lp-question-answer-item:hover .lp-btn-delete-question-answer {
219 display: inline-block;
220 }
221 .lp-question-answer-item.loading {
222 pointer-events: none;
223 opacity: 0.5 !important;
224 }
225 .lp-question-answer-item.loading .lp-icon-spinner {
226 display: inline-block;
227 }
228 .lp-question-answer-item .lp-btn-delete-question-answer {
229 display: none;
230 cursor: pointer;
231 }
232 .lp-question-answer-item .lp-icon-drag {
233 cursor: grab;
234 line-height: 1;
235 }
236 .lp-question-answer-item .lp-icon-drag:active {
237 cursor: grabbing;
238 }
239
240 .lp-question-answer-item-add-new {
241 display: flex;
242 flex-direction: row;
243 align-items: center;
244 gap: 5px;
245 padding: 5px;
246 margin: 0;
247 border: 1px solid #dcdcde;
248 border-top: none;
249 }
250 .lp-question-answer-item-add-new .lp-icon-plus {
251 cursor: auto;
252 margin-left: 5px;
253 }
254
255 .lp-question-field-settings {
256 padding: 10px 20px;
257 display: grid;
258 gap: 5px;
259 }
260 .lp-question-field-settings input[type=text],
261 .lp-question-field-settings input[type=number] {
262 padding: 0 10px;
263 }
264
265 /***** Fill in the Blank Styles *****/
266 .lp-question-fib-blank-options {
267 display: grid;
268 gap: 5px;
269 }
270 .lp-question-fib-blank-options .lp-question-fib-option-match-case-wrap {
271 display: grid;
272 gap: 10px;
273 }
274 .lp-question-fib-blank-options .lp-question-fib-option-match-case-wrap.lp-hidden {
275 display: grid !important;
276 pointer-events: none;
277 opacity: 0.5 !important;
278 }
279
280 .lp-question-fib-blank-option-item .lp-question-fib-option-header {
281 display: flex;
282 justify-content: space-between;
283 align-items: center;
284 gap: 10px;
285 padding: 10px;
286 background: #eee;
287 }
288 .lp-question-fib-blank-option-item .lp-question-fib-option-header .lp-icon-angle-down::before,
289 .lp-question-fib-blank-option-item .lp-question-fib-option-header .lp-icon-angle-up::before {
290 content: "\f142";
291 width: 15px;
292 text-align: center;
293 height: 30px;
294 display: flex;
295 align-items: center;
296 justify-content: center;
297 }
298 .lp-question-fib-blank-option-item .lp-question-fib-option-detail {
299 padding: 10px;
300 display: flex;
301 flex-direction: column;
302 gap: 10px;
303 border: 1px solid #eeeeee;
304 border-top: none;
305 }
306 .lp-question-fib-blank-option-item .lp-question-fib-option-detail p {
307 margin: 0;
308 padding: 0;
309 }
310
311 .lp-question-fib-buttons {
312 display: flex;
313 gap: 10px;
314 margin: 10px 0;
315 top: 1px;
316 }
317 .lp-question-fib-buttons .lp-btn-fib-clear-all-content {
318 border: none;
319 }
320
321 .lp-question-type-new-wrap {
322 display: flex;
323 gap: 5px;
324 }
325 .lp-question-type-new-wrap .lp-btn-question-create-type {
326 border: none;
327 background: rgba(19, 94, 150, 0.5);
328 color: #fff;
329 }
330 .lp-question-type-new-wrap .lp-btn-question-create-type:hover, .lp-question-type-new-wrap .lp-btn-question-create-type.active {
331 background: rgb(19, 94, 150) !important;
332 color: #fff !important;
333 }