PluginProbe
Forumax – AI Powered Advanced Community Forum Plugin / 2.2.0
Forumax – AI Powered Advanced Community Forum Plugin v2.2.0
2.4.4 2.4.3 2.4.2 2.4.1 2.4.0 trunk 1.0.8 1.1.0 1.2.1 1.2.2 1.2.3 1.2.4 1.2.5 1.2.6 1.2.7 1.2.8 1.2.9 1.3.0 1.3.1 1.3.2 1.3.3 1.4.0 1.4.1 2.0.0 2.1.0 All 29 releases
← All changes | assets/frontend/css/bbpc.css +422 -292 1.3.32.2.0 View file →
@@ -1,293 +1,423 @@
1 -:root {
2 - --bbpc_brand_color: var(--bbpc_brand_color_opt,#0866ff);
3 - --border_on_white: #e6edf0;
4 - --border_on_highlight: #e6edf0;
5 - --body_bg: #fff;
6 - --white_op20: rgba(255, 255, 255, 0.2);
7 - --black_25: #f9f9f9;
8 - --black_50: #f2f2f2;
9 - --black_75: #eeeeee;
10 - --black_100: #d6d9dc;
11 - --black_150: #c8ccd0;
12 - --black_200: #bbc0c4;
13 - --black_300: #9fa6ad;
14 - --black_350: #9199a1;
15 - --black_400: #848d95;
16 - --black_500: #6a737c;
17 - --black_600: #535a60;
18 - --black_700: #3c4146;
19 - --black_750: #2f3337;
20 - --black_800: #242729;
21 - --black_900: #0c0d0e;
22 - --bs_sm: 0 1px 2px rgb(0 0 0 / 5%), 0 1px 4px rgb(0 0 0 / 5%), 0 2px 8px rgb(0 0 0 / 5%);
23 - --bs_md: 0 1px 3px rgb(0 0 0 / 6%), 0 2px 6px rgb(0 0 0 / 6%), 0 3px 8px rgb(0 0 0 / 9%);
24 - --bs_lg: 0 1px 4px rgb(0 0 0 / 9%), 0 3px 8px rgb(0 0 0 / 9%), 0 4px 13px rgb(0 0 0 / 13%);
25 -}
26 -
27 -/**
28 -* BBP Core plugin main css file
29 -*/
30 -.bbpc-attachment-lightbox {
31 - position: fixed;
32 - top: 0;
33 - left: 0;
34 - right: 0;
35 - bottom: 0;
36 - background: rgba(0, 0, 0, 0.8);
37 - z-index: 9999;
38 - width: 100%;
39 - margin: auto;
40 - padding: 100px 0;
41 - display: flex;
42 - justify-content: center;
43 - align-items: center;
44 - box-sizing: border-box;
45 -}
46 -
47 -.bbpc-attachment-lightbox-inner {
48 - position: relative;
49 - max-width: 85%;
50 - display: flex;
51 - align-items: center;
52 -}
53 -
54 -.bbpc-attachment-lightbox > .bbpc-attachment-lightbox-inner > span {
55 - color: white;
56 - font-size: 23px;
57 - line-height: 22px;
58 - background: red;
59 - display: block;
60 - height: 28px;
61 - border-radius: 19px;
62 - width: 28px;
63 - text-align: center;
64 - top: -15px;
65 - right: -15px;
66 - bottom: 100%;
67 - z-index: 9999999999;
68 - position: absolute;
69 - cursor: pointer;
70 -}
71 -
72 -/* Voting button CSS */
73 -.bbpc-agree-disagree-buttons button {
74 - background: #f0f8ff;
75 - border: 1px solid #cee1ef;
76 - padding: 0px 15px;
77 - height: 45px;
78 - color: #333;
79 - font-weight: 600;
80 - transition: all 0.3s;
81 - border-right: none;
82 - box-sizing: border-box;
83 - display: inline-block;
84 - line-height: 10px !important;
85 - border-top-right-radius: 0;
86 - border-bottom-right-radius: 0;
87 -}
88 -
89 -.bbpc-agree-disagree-buttons button.active:hover:not(.active) {
90 - background: #f0f8ff;
91 - border-color: #cee1ef;
92 -}
93 -
94 -.bbpc-agree-disagree-buttons button.active {
95 - background: var(--bbpc_brand_color);
96 - color: #fff;
97 -}
98 -
99 -.bbpc-agree-disagree-buttons span.bbpc-reactions-btn-counter {
100 - font-size: 16px;
101 - background: #ffffff;
102 - border: 1px solid #c0cad2;
103 - padding: 0 15px;
104 - margin-right: 10px;
105 - color: #333;
106 - font-weight: 600;
107 - transition: all 0.3s;
108 - display: inline-block;
109 - line-height: 43px;
110 - border-left-color: #d5d5d5;
111 - width: 42px;
112 - text-align: center;
113 - border-top-right-radius: 5px;
114 - border-bottom-right-radius: 5px;
115 -}
116 -
117 -/* Voting layout css */
118 -.bbpc-voting-liked-wrap {
119 - display: grid;
120 - grid-template-columns: auto auto;
121 - grid-gap: 10px;
122 -}
123 -
124 -.bbpc-voting-liked-wrap .bbpc-voting-liked a {
125 - color: #333;
126 - font-weight: 600;
127 - text-decoration: none;
128 - text-transform: capitalize;
129 - margin: 5px 0 12px;
130 - display: block;
131 - padding: 10px;
132 - background: #f0f8ff;
133 - border: #cee1ef 1px solid !important;
134 - box-sizing: border-box;
135 -}
136 -
137 -span.bbpc-agree-disagree-counter-wrap {
138 - margin: 18px 0 5px;
139 - display: block;
140 -}
141 -
142 -span.bbpc-agree-disagree-counter-wrap .fa-thumbs-up {
143 - color: green;
144 - font-size: 20px;
145 -}
146 -
147 -span.bbpc-agree-disagree-counter-wrap .fa-thumbs-down {
148 - color: red;
149 - font-size: 20px;
150 -}
151 -
152 -.bbpc-voting-liked::after,
153 -.bbpc-voting-liked-wrap::after {
154 - content: '';
155 - display: block;
156 - clear: both;
157 -}
158 -
159 -.bbpc-voting-liked-wrap.single-topic-wrap {
160 - grid-template-columns: auto;
161 -}
162 -
163 -#bbp-user-body .bbpc-no-voting-wrap:not(:last-child) {
164 - display: none;
165 -}
166 -
167 -.bbpc-no-voting-wrap {
168 - background: #f1f1f1;
169 - padding: 10px 15px;
170 - font-weight: 500 !important;
171 - font-size: 16px !important;
172 -}
173 -
174 -.bbpc-footer-actions {
175 - padding-top: 20px;
176 - margin-bottom: 10px;
177 - display: flex;
178 - flex-direction: column;
179 - gap: 15px;
180 -}
181 -
182 -@media screen and (max-width: 768px) {
183 - .bbpc-footer-actions,
184 - .bbpc-voting-liked-wrap {
185 - grid-template-columns: auto;
186 - grid-gap: 5px;
187 - justify-content: end;
188 - position: unset;
189 - display: flow-root;
190 - }
191 -
192 - .bbpc-agree-disagree-buttons {
193 - display: grid;
194 - grid-template-columns: auto auto;
195 - grid-gap: 5px;
196 - }
197 -}
198 -
199 -.bbpc-agree-disagree-buttons button {
200 - position: relative;
201 -}
202 -
203 -.bbpc-agree-disagree-buttons button .bbpc-preloader::before {
204 - content: "";
205 - position: absolute;
206 - top: 0;
207 - left: 0;
208 - width: 100%;
209 - height: 100%;
210 - opacity: 0.8;
211 - z-index: 9999;
212 - background: aliceblue;
213 -}
214 -
215 -.bbpc-agree-disagree-buttons button .bbpc-preloader::after {
216 - content: "";
217 - position: absolute;
218 - top: 20px;
219 - left: 32px;
220 - transform: translate(-50%, -50%);
221 - border: 5px solid #969696;
222 - border-top: 5px solid #bc002b;
223 - border-radius: 50%;
224 - width: 30px;
225 - height: 30px;
226 - animation: geo_spin 1s linear infinite;
227 - z-index: 10000;
228 - right: 0px;
229 - margin: auto;
230 - text-align: center;
231 - background: #ffffff;
232 -}
233 -
234 -@keyframes geo_spin {
235 - 0% {
236 - transform: translate(-50%, -50%) rotate(0deg);
237 - }
238 - 100% {
239 - transform: translate(-50%, -50%) rotate(360deg);
240 - }
241 -}
242 -
243 -.bbpc-voting-heading {
244 - font-size: 20px;
245 - display: block;
246 - margin: 0 0 15px;
247 - font-weight: 500;
248 -}
249 -
250 -/** === FORUM Info CSS === **/
251 -.bbpc-widget-forum-info {
252 - table {
253 - img {
254 - display: inline;
255 - }
256 - tr td:last-child {
257 - text-align: right;
258 - }
259 - }
260 -}
261 -
262 -.show_subscribe {
263 - .icon_action {
264 - font-family: ElegantIcons;
265 - font-style: normal;
266 - vertical-align: middle;
267 -
268 - &::before {
269 - content: "\e012";
270 - }
271 - }
272 -}
273 -
274 -.bbpc-widget-forum-info tr i {
275 - vertical-align: middle;
276 - margin-right: 5px;
277 -}
278 -
279 -.bbp__success-subscribe .is-subscribed a.subscription-toggle {
280 - background: transparent !important;
281 - color: #4c4cf1 !important;
282 - margin: 0;
283 - padding: 0 !important;
284 -}
285 -
286 -.bbp__success-subscribe.alert {
287 - border: 1px solid #94e3a1;
288 - text-align: center;
289 -}
290 -
291 -.image-details .media-modal-content .search-form button{
292 - transform: scaleX(1);
1 +:root {
2 + --bbpc_brand_color: var(--bbpc_brand_color_opt, #0866ff);
3 + --border_on_white: #e6edf0;
4 + --border_on_highlight: #e6edf0;
5 + --body_bg: #fff;
6 + --bs-white: #fff;
7 + --white_op20: rgba(255, 255, 255, 0.2);
8 + --black_25: #f9f9f9;
9 + --black_50: #f2f2f2;
10 + --black_75: #eeeeee;
11 + --black_100: #d6d9dc;
12 + --black_150: #c8ccd0;
13 + --black_200: #bbc0c4;
14 + --black_300: #9fa6ad;
15 + --black_350: #9199a1;
16 + --black_400: #848d95;
17 + --black_500: #6a737c;
18 + --black_600: #535a60;
19 + --black_700: #3c4146;
20 + --black_750: #2f3337;
21 + --black_800: #242729;
22 + --black_900: #0c0d0e;
23 + --bs_sm: 0 1px 2px rgb(0 0 0 / 5%), 0 1px 4px rgb(0 0 0 / 5%), 0 2px 8px rgb(0 0 0 / 5%);
24 + --bs_md: 0 1px 3px rgb(0 0 0 / 6%), 0 2px 6px rgb(0 0 0 / 6%), 0 3px 8px rgb(0 0 0 / 9%);
25 + --bs_lg: 0 1px 4px rgb(0 0 0 / 9%), 0 3px 8px rgb(0 0 0 / 9%), 0 4px 13px rgb(0 0 0 / 13%);
26 +}
27 +
28 +/**
29 +* BBP Core plugin main css file
30 +*/
31 +.bbpc-attachment-lightbox {
32 + position: fixed;
33 + top: 0;
34 + left: 0;
35 + right: 0;
36 + bottom: 0;
37 + background: rgba(0, 0, 0, 0.8);
38 + z-index: 9999;
39 + width: 100%;
40 + margin: auto;
41 + padding: 100px 0;
42 + display: flex;
43 + justify-content: center;
44 + align-items: center;
45 + box-sizing: border-box;
46 +}
47 +
48 +.bbpc-attachment-lightbox-inner {
49 + position: relative;
50 + max-width: 85%;
51 + display: flex;
52 + align-items: center;
53 +}
54 +
55 +.bbpc-attachment-lightbox>.bbpc-attachment-lightbox-inner>span {
56 + color: white;
57 + font-size: 23px;
58 + line-height: 22px;
59 + background: red;
60 + display: block;
61 + height: 28px;
62 + border-radius: 19px;
63 + width: 28px;
64 + text-align: center;
65 + top: -15px;
66 + right: -15px;
67 + bottom: 100%;
68 + z-index: 9999999999;
69 + position: absolute;
70 + cursor: pointer;
71 +}
72 +
73 +/* Voting button CSS */
74 +.bbpc-agree-disagree-buttons button {
75 + background: #f0f8ff;
76 + border: 1px solid #cee1ef;
77 + padding: 0px 15px;
78 + height: 38px;
79 + color: #333;
80 + font-weight: 500;
81 + transition: all 0.3s;
82 + border-right: none;
83 + box-sizing: border-box;
84 + display: inline-block;
85 + line-height: 9px !important;
86 + border-radius: 50px;
87 + border-top-right-radius: 0;
88 + border-bottom-right-radius: 0;
89 + font-size: 15px;
90 +}
91 +
92 +.bbpc-agree-disagree-buttons button.active:hover:not(.active) {
93 + background: #f0f8ff;
94 + border-color: #cee1ef;
95 +}
96 +
97 +.bbpc-agree-disagree-buttons button.active {
98 + background: var(--bbpc_brand_color);
99 + color: #fff;
100 +}
101 +
102 +.bbpc-agree-disagree-buttons span.bbpc-reactions-btn-counter {
103 + font-size: 15px;
104 + background: #fff;
105 + border: 1px solid var(--black_50);
106 + padding: 0 15px;
107 + margin-right: 10px;
108 + color: #333;
109 + font-weight: 500;
110 + transition: all 0.3s;
111 + display: inline-block;
112 + line-height: 36px;
113 + border-left-color: var(--black_50);
114 + width: 42px;
115 + text-align: center;
116 + border-radius: 50px;
117 + border-top-left-radius: 0;
118 + border-bottom-left-radius: 0;
119 +}
120 +
121 +/* Voting layout css */
122 +.bbpc-voting-liked-wrap {
123 + display: grid;
124 + grid-template-columns: auto auto;
125 + grid-gap: 10px;
126 +}
127 +
128 +.bbpc-voting-liked-wrap .bbpc-voting-liked a {
129 + color: #333;
130 + font-weight: 600;
131 + text-decoration: none;
132 + text-transform: capitalize;
133 + margin: 5px 0 12px;
134 + display: block;
135 + padding: 10px;
136 + background: #f0f8ff;
137 + border: #cee1ef 1px solid !important;
138 + box-sizing: border-box;
139 +}
140 +
141 +span.bbpc-agree-disagree-counter-wrap {
142 + margin: 18px 0 5px;
143 + display: block;
144 +}
145 +
146 +span.bbpc-agree-disagree-counter-wrap .fa-thumbs-up {
147 + color: green;
148 + font-size: 20px;
149 +}
150 +
151 +span.bbpc-agree-disagree-counter-wrap .fa-thumbs-down {
152 + color: red;
153 + font-size: 20px;
154 +}
155 +
156 +.bbpc-voting-liked::after,
157 +.bbpc-voting-liked-wrap::after {
158 + content: '';
159 + display: block;
160 + clear: both;
161 +}
162 +
163 +.bbpc-voting-liked-wrap.single-topic-wrap {
164 + grid-template-columns: auto;
165 +}
166 +
167 +#bbp-user-body .bbpc-no-voting-wrap:not(:last-child) {
168 + display: none;
169 +}
170 +
171 +.bbpc-no-voting-wrap {
172 + background: #f1f1f1;
173 + padding: 10px 15px;
174 + font-weight: 500 !important;
175 + font-size: 16px !important;
176 +}
177 +
178 +.bbpc-footer-actions {
179 + padding-top: 8px;
180 + margin-bottom: 10px;
181 + display: flex;
182 + flex-direction: column;
183 + gap: 15px;
184 +}
185 +
186 +@media screen and (max-width: 768px) {
187 +
188 + .bbpc-footer-actions,
189 + .bbpc-voting-liked-wrap {
190 + grid-template-columns: auto;
191 + grid-gap: 5px;
192 + justify-content: end;
193 + position: unset;
194 + display: flow-root;
195 + }
196 +
197 + .bbpc-agree-disagree-buttons {
198 + display: grid;
199 + grid-template-columns: auto auto;
200 + grid-gap: 5px;
201 + }
202 +}
203 +
204 +.bbpc-agree-disagree-buttons button {
205 + position: relative;
206 +}
207 +
208 +.bbpc-agree-disagree-buttons button .bbpc-preloader::before {
209 + content: "";
210 + position: absolute;
211 + top: 0;
212 + left: 0;
213 + width: 100%;
214 + height: 100%;
215 + opacity: 0.8;
216 + z-index: 9999;
217 + background: aliceblue;
218 +}
219 +
220 +.bbpc-agree-disagree-buttons button .bbpc-preloader::after {
221 + content: "";
222 + position: absolute;
223 + top: 20px;
224 + left: 32px;
225 + transform: translate(-50%, -50%);
226 + border: 5px solid #969696;
227 + border-top: 5px solid #bc002b;
228 + border-radius: 50%;
229 + width: 30px;
230 + height: 30px;
231 + animation: geo_spin 1s linear infinite;
232 + z-index: 10000;
233 + right: 0px;
234 + margin: auto;
235 + text-align: center;
236 + background: #ffffff;
237 +}
238 +
239 +@keyframes geo_spin {
240 + 0% {
241 + transform: translate(-50%, -50%) rotate(0deg);
242 + }
243 +
244 + 100% {
245 + transform: translate(-50%, -50%) rotate(360deg);
246 + }
247 +}
248 +
249 +.bbpc-voting-heading {
250 + font-size: 20px;
251 + display: block;
252 + margin: 0 0 15px;
253 + font-weight: 500;
254 +}
255 +
256 +/** === FORUM Info CSS === **/
257 +.bbpc-widget-forum-info {
258 + table {
259 + img {
260 + display: inline;
261 + }
262 +
263 + tr td:last-child {
264 + text-align: right;
265 + }
266 + }
267 +}
268 +
269 +.show_subscribe {
270 + .icon_action {
271 + font-family: ElegantIcons;
272 + font-style: normal;
273 + vertical-align: middle;
274 +
275 + &::before {
276 + content: "\e012";
277 + }
278 + }
279 +}
280 +
281 +.bbpc-widget-forum-info tr i {
282 + vertical-align: middle;
283 + margin-right: 5px;
284 +}
285 +
286 +.bbp__success-subscribe .is-subscribed a.subscription-toggle {
287 + background: transparent !important;
288 + color: #4c4cf1 !important;
289 + margin: 0;
290 + padding: 0 !important;
291 +}
292 +
293 +.bbp__success-subscribe.alert {
294 + border: 1px solid #94e3a1;
295 + text-align: center;
296 +}
297 +
298 +.image-details .media-modal-content .search-form button {
299 + transform: scaleX(1);
300 +}
301 +
302 +/* === Widget Search Form Styles === */
303 +.widget.sidebar_widget.widget_display_search {
304 + background: var(--body_bg);
305 + border: 1px solid var(--border_on_white);
306 + border-radius: 12px;
307 + padding: 24px;
308 + margin-bottom: 24px;
309 + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
310 +}
311 +
312 +.widget.sidebar_widget.widget_display_search .widget-title,
313 +.widget.sidebar_widget.widget_display_search h2 {
314 + font-size: 17px;
315 + font-weight: 700;
316 + color: var(--black_900);
317 + margin: 0 0 18px 0;
318 + padding: 0;
319 + border: none;
320 + letter-spacing: -0.02em;
321 +}
322 +
323 +.widget.sidebar_widget.widget_display_search .bbp-search-form {
324 + margin: 0;
325 +}
326 +
327 +.widget.sidebar_widget.widget_display_search .bbp-search-form form {
328 + margin: 0;
329 + width: 100%;
330 +}
331 +
332 +.widget.sidebar_widget.widget_display_search .bbp-search-form form > div {
333 + display: flex;
334 + gap: 10px;
335 + align-items: stretch;
336 + margin: 0;
337 + width: 100%;
338 +}
339 +
340 +.widget.sidebar_widget.widget_display_search .bbp-search-form input[type="text"],
341 +.widget.sidebar_widget.widget_display_search .bbp-search-form input#bbp_search {
342 + flex: 1;
343 + height: 44px;
344 + padding: 11px 16px;
345 + border-radius: 8px;
346 + font-size: 14px;
347 + color: var(--black_800);
348 + transition: all 0.25s ease;
349 + box-sizing: border-box;
350 + outline: none;
351 + border:none !important;
352 + margin: 0;
353 + line-height: 1.4;
354 +}
355 +.widget_display_search{
356 + .bbp-search-form form{
357 + padding: 0 5px !important;
358 + }
359 +}
360 +#bbpress-forums div.bbp-forum-author img.avatar, #bbpress-forums div.bbp-reply-author img.avatar, #bbpress-forums div.bbp-topic-author img.avatar {
361 +
362 + border-radius: 50% !important;
363 +}
364 +
365 +.widget.sidebar_widget.widget_display_search .bbp-search-form input[type="text"]::placeholder {
366 + color: var(--black_400);
367 + font-size: 14px;
368 +}
369 +
370 +.widget.sidebar_widget.widget_display_search .bbp-search-form input[type="submit"],
371 +.widget.sidebar_widget.widget_display_search .bbp-search-form input.button,
372 +.widget.sidebar_widget.widget_display_search .bbp-search-form button[type="submit"] {
373 + height: 44px;
374 + padding: 0 28px;
375 + background: var(--bbpc_brand_color);
376 + color: #fff;
377 + border: none;
378 + border-radius: 8px;
379 + font-size: 14px;
380 + font-weight: 600;
381 + cursor: pointer;
382 + transition: all 0.25s ease;
383 + white-space: nowrap;
384 + box-sizing: border-box;
385 + margin: 0;
386 + flex-shrink: 0;
387 + letter-spacing: -0.01em;
388 +}
389 +
390 +.widget.sidebar_widget.widget_display_search .bbp-search-form input[type="submit"]:hover,
391 +.widget.sidebar_widget.widget_display_search .bbp-search-form input.button:hover,
392 +.widget.sidebar_widget.widget_display_search .bbp-search-form button[type="submit"]:hover {
393 + background: var(--bbpc_brand_color);
394 + opacity: 0.92;
395 + transform: translateY(-2px);
396 + box-shadow: 0 6px 12px rgba(8, 102, 255, 0.25);
397 +}
398 +
399 +.widget.sidebar_widget.widget_display_search .bbp-search-form input[type="submit"]:active,
400 +.widget.sidebar_widget.widget_display_search .bbp-search-form input.button:active,
401 +.widget.sidebar_widget.widget_display_search .bbp-search-form button[type="submit"]:active {
402 + transform: translateY(0);
403 + box-shadow: 0 2px 4px rgba(8, 102, 255, 0.15);
404 +}
405 +
406 +/* Responsive adjustments */
407 +@media screen and (max-width: 480px) {
408 + .widget.sidebar_widget.widget_display_search {
409 + padding: 20px;
410 + }
411 +
412 + .widget.sidebar_widget.widget_display_search .bbp-search-form form > div {
413 + flex-direction: column;
414 + gap: 12px;
415 + }
416 +
417 + .widget.sidebar_widget.widget_display_search .bbp-search-form input[type="submit"],
418 + .widget.sidebar_widget.widget_display_search .bbp-search-form input.button,
419 + .widget.sidebar_widget.widget_display_search .bbp-search-form button[type="submit"] {
420 + width: 100%;
421 + padding: 0 20px;
422 + }
293 423 }