Enhance template 1265 with left-aligned icons, improved pricing layout, and dark theme hover effects

N6REJ · N6REJ · commit a68682b877d6 · 2025-06-05T08:12:45.000-05:00
diff --git a/css/1265.css b/css/1265.css
@@ -89,13 +89,39 @@
 .template-1265 .bears_pricing_tables .price {
 	display: flex;
 	align-items: center;
-	justify-content: flex-start;
+	justify-content: center;
 	}
 
-.template-1265 .bears_pricing_tables .plan-cost {
+.template-1265 .bears_pricing_tables .price .plan-icon {
+	display: flex;
+	align-items: center;
+	margin-right: auto;
+	margin-left: -8px;
+	padding-right: .25em;
+	}
+
+.template-1265 .bears_pricing_tables .price .wrapper {
 	display: block;
 	text-align: left;
 	}
+
+.template-1265 .bears_pricing_tables .plan-title {
+	text-align: left;
+	}
+
+.template-1265 .bears_pricing_tables .plan-cost {
+	display: flex;
+	align-items: baseline;
+	text-align: left;
+	padding: 0;
+	justify-content: flex-start;
+	}
+
+.template-1265 .bears_pricing_tables .plan-price {
+	display: inline-block;
+	margin-right: 5px;
+	}
+
 .template-1265 .bears_pricing_tables .plan-type {
 	display: inline-block;
 	}
@@ -109,27 +135,23 @@
 	border-bottom: none;
 	}
 
-
-.template-1265 .bears_pricing_tables .plan-select {
-	border-radius: 40px !important;
-	}
-
 .template-1265 .bears_pricing_tables .plan.featured .plan-select {
 	border-top: 1px solid rgba(255, 255, 255, 0.1);
 	}
 
 .template-1265 .bears_pricing_tables .plan-select a:hover {
-	background-color: #262626;
+	background-color: #262626 !important;
 	}
 
+.template-1265 .bears_pricing_tables .plan.featured .plan-select:hover,
 .template-1265 .bears_pricing_tables .plan-select:hover {
 	border-top: 1px solid rgba(255, 255, 255, 0.1);
-	background-color: rgba(0, 0, 0, 0.2);
+	background-color: #000 !important;
 	}
 
 .template-1265 .bears_pricing_tables .plan-select a,
 .template-1265 .bears_pricing_tables .plan-select a.btn {
-	border-radius: inherit;
+	border-radius: 40px !important;
 	}
 
 .template-1265 .bears_pricing_tables .plan.featured .plan-select a,
@@ -158,5 +180,44 @@
 
 .template-1265 .bears_pricing_tables .plan-cost {
 	margin: 0;
-	display: block;
+	display: flex;
+	align-items: baseline;
+	}
+
+/* Ensure consistent styling for all columns */
+.template-1265 .bears_pricing_tables .plan {
+	display: flex;
+	flex-direction: column;
+	}
+
+.template-1265 .bears_pricing_tables header {
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+	}
+
+/* Hover effects for columns */
+.template-1265 .bears_pricing_tables:hover .plan header,
+.template-1265 .bears_pricing_tables:hover .plan .features,
+.template-1265 .bears_pricing_tables:hover .plan .plan-select {
+	background-color: rgba(0, 0, 0, 0.9);
+	transition: background-color var(--bears-transition-speed) ease;
+	}
+
+/* Ensure feature list items maintain the hover effect */
+.template-1265 .bears_pricing_tables:hover .plan .plan-features li:nth-child(odd),
+.template-1265 .bears_pricing_tables:hover .plan .plan-features li:nth-child(even) {
+	background-color: rgba(0, 0, 0, 0.9);
+	}
+
+/* Ensure the hover effect works for featured plans too */
+.template-1265 .bears_pricing_tables:hover .plan.featured header,
+.template-1265 .bears_pricing_tables:hover .plan.featured .features,
+.template-1265 .bears_pricing_tables:hover .plan.featured .plan-select {
+	background-color: rgba(0, 0, 0, 0.9);
+	}
+
+.template-1265 .bears_pricing_tables:hover .plan.featured .plan-features li:nth-child(odd),
+.template-1265 .bears_pricing_tables:hover .plan.featured .plan-features li:nth-child(even) {
+	background-color: rgba(0, 0, 0, 0.9);
 	}
