← All changes | assets/frontend/css/bbpc.css +145 -15 1.4.1 → 2.2.0 View file →

		@@ -1,9 +1,10 @@
1	1	:root {
2		- --bbpc_brand_color: var(--bbpc_brand_color_opt,#0866ff);
	2	+ --bbpc_brand_color: var(--bbpc_brand_color_opt, #0866ff);
3	3	--border_on_white: #e6edf0;
4	4	--border_on_highlight: #e6edf0;
5	5	--body_bg: #fff;
	6	+ --bs-white: #fff;
6	7	--white_op20: rgba(255, 255, 255, 0.2);
7	8	--black_25: #f9f9f9;
8	9	--black_50: #f2f2f2;
9	10	--black_75: #eeeeee;
		@@ -50,9 +51,9 @@
50	51	display: flex;
51	52	align-items: center;
52	53	}
53	54
54		-.bbpc-attachment-lightbox > .bbpc-attachment-lightbox-inner > span {
	55	+.bbpc-attachment-lightbox>.bbpc-attachment-lightbox-inner>span {
55	56	color: white;
56	57	font-size: 23px;
57	58	line-height: 22px;
58	59	background: red;
		@@ -73,18 +74,20 @@
73	74	.bbpc-agree-disagree-buttons button {
74	75	background: #f0f8ff;
75	76	border: 1px solid #cee1ef;
76	77	padding: 0px 15px;
77		- height: 45px;
	78	+ height: 38px;
78	79	color: #333;
79		- font-weight: 600;
	80	+ font-weight: 500;
80	81	transition: all 0.3s;
81	82	border-right: none;
82	83	box-sizing: border-box;
83	84	display: inline-block;
84		- line-height: 10px !important;
	85	+ line-height: 9px !important;
	86	+ border-radius: 50px;
85	87	border-top-right-radius: 0;
86	88	border-bottom-right-radius: 0;
	89	+ font-size: 15px;
87	90	}
88	91
89	92	.bbpc-agree-disagree-buttons button.active:hover:not(.active) {
90	93	background: #f0f8ff;
		@@ -96,23 +99,24 @@
96	99	color: #fff;
97	100	}
98	101
99	102	.bbpc-agree-disagree-buttons span.bbpc-reactions-btn-counter {
100		- font-size: 16px;
101		- background: #ffffff;
102		- border: 1px solid #c0cad2;
	103	+ font-size: 15px;
	104	+ background: #fff;
	105	+ border: 1px solid var(--black_50);
103	106	padding: 0 15px;
104	107	margin-right: 10px;
105	108	color: #333;
106		- font-weight: 600;
	109	+ font-weight: 500;
107	110	transition: all 0.3s;
108	111	display: inline-block;
109		- line-height: 43px;
110		- border-left-color: #d5d5d5;
	112	+ line-height: 36px;
	113	+ border-left-color: var(--black_50);
111	114	width: 42px;
112	115	text-align: center;
113		- border-top-right-radius: 5px;
114		- border-bottom-right-radius: 5px;
	116	+ border-radius: 50px;
	117	+ border-top-left-radius: 0;
	118	+ border-bottom-left-radius: 0;
115	119	}
116	120
117	121	/* Voting layout css */
118	122	.bbpc-voting-liked-wrap {
		@@ -171,9 +175,9 @@
171	175	font-size: 16px !important;
172	176	}
173	177
174	178	.bbpc-footer-actions {
175		- padding-top: 20px;
	179	+ padding-top: 8px;
176	180	margin-bottom: 10px;
177	181	display: flex;
178	182	flex-direction: column;
179	183	gap: 15px;
		@@ -179,8 +183,9 @@
179	183	gap: 15px;
180	184	}
181	185
182	186	@media screen and (max-width: 768px) {
	187	+
183	188	.bbpc-footer-actions,
184	189	.bbpc-voting-liked-wrap {
185	190	grid-template-columns: auto;
186	191	grid-gap: 5px;
		@@ -234,8 +239,9 @@
234	239	@keyframes geo_spin {
235	240	0% {
236	241	transform: translate(-50%, -50%) rotate(0deg);
237	242	}
	243	+
238	244	100% {
239	245	transform: translate(-50%, -50%) rotate(360deg);
240	246	}
241	247	}
		@@ -252,8 +258,9 @@
252	258	table {
253	259	img {
254	260	display: inline;
255	261	}
	262	+
256	263	tr td:last-child {
257	264	text-align: right;
258	265	}
259	266	}
		@@ -287,7 +294,130 @@
287	294	border: 1px solid #94e3a1;
288	295	text-align: center;
289	296	}
290	297
291		-.image-details .media-modal-content .search-form button{
	298	+.image-details .media-modal-content .search-form button {
292	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	}