Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Commit e352239

Browse files
committed
Update Gold template 1265 with dark theme and left-aligned pricing elements
1 parent d7d5aad commit e352239

File tree

1 file changed

+62
-31
lines changed

1 file changed

+62
-31
lines changed

css/1265.css

Lines changed: 62 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -28,30 +28,30 @@
2828
--bears-button-font-size: var(--bears-body);
2929

3030
/* Colors - Standard Elements */
31-
--bears-column-background: #ffffff;
32-
--bears-header-background: rgba(0, 0, 0, 0.08);
33-
--bears-features-background-odd: var(--bears-column-background);
34-
--bears-features-background-even: rgba(0, 0, 0, 0.08);
31+
--bears-column-background: #262626;
32+
--bears-header-background: #262626;
33+
--bears-features-background-odd: #262626;
34+
--bears-features-background-even: #262626;
3535

3636
/* Colors - Text */
37-
--bears-title-color: #333333;
38-
--bears-price-color: #333333;
37+
--bears-title-color: #fff;
38+
--bears-price-color: #515151;
3939
--bears-subtitle-color: var(--bears-price-color);
40-
--bears-features-text-color: #000;
40+
--bears-features-text-color: #6F6F6F;
4141
--bears-button-text-color: #fff;
4242

4343
/* Colors - Featured Elements */
44-
--bears-column-featured-background: #222222;
45-
--bears-header-featured-background: #222222;
44+
--bears-column-featured-background: #262626;
45+
--bears-header-featured-background: #262626;
4646
--bears-featured-title-color: #ffffff;
47-
--bears-featured-price-color: #ffffff;
48-
--bears-featured-features-text-color: #fff;
47+
--bears-featured-price-color: #6f6f6f;
48+
--bears-featured-features-text-color: #6f6f6f;
4949

5050
/* Colors - Buttons */
51-
--bears-button-background-color: #333333;
51+
--bears-button-background-color: #F39C12;
5252
--bears-button-hover-color: #555555;
53-
--bears-featured-button-background: #ffffff;
54-
--bears-featured-button-text-color: #222222;
53+
--bears-featured-button-background: #F39C12;
54+
--bears-featured-button-text-color: #fff;
5555

5656
/* Borders - Standard */
5757
--bears-border-style: solid;
@@ -73,39 +73,31 @@
7373
--bears-accent-color: #333333;
7474
--bears-featured-accent-color: #ffffff;
7575
--bears-transition-speed: 0.25s;
76-
--bears-scale-amount: 1.05;
76+
--bears-scale-amount: 1.1;
7777
--bears-box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
7878
--bears-featured-box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
7979

8080
/* Icons */
81-
--bears-header-icon-color: var(--bears-price-color);
82-
--bears-featured-header-icon-color: var(--bears-featured-price-color);
81+
--bears-header-icon-color: #F39C12;
82+
--bears-featured-header-icon-color: #F39C12;
8383
--bears-features-icon-color: var(--bears-features-text-color);
8484
--bears-featured-features-icon-color: var(--bears-featured-features-text-color);
85-
--bears-header-icon-size: 24px;
85+
--bears-header-icon-size: 3.5rem;
8686
}
8787

8888
/* Template-specific styles */
8989
.template-1265 .bears_pricing_tables .price {
9090
display: flex;
9191
align-items: center;
92-
justify-content: center;
92+
justify-content: flex-start;
9393
}
9494

9595
.template-1265 .bears_pricing_tables .plan-cost {
96-
align-items: center;
97-
}
98-
99-
.template-1265 .bears_pricing_tables .plan.featured {
100-
margin: 0 -2.5% 0;
96+
display: block;
97+
text-align: left;
10198
}
102-
103-
.template-1265 .bears_pricing_tables .plan.featured .plan-features li:nth-child(even) {
104-
background: rgba(255, 255, 255, 0.05);
105-
}
106-
107-
.template-1265 .bears_pricing_tables .plan.featured .plan-features li:nth-child(odd) {
108-
background: rgba(255, 255, 255, 0.08);
99+
.template-1265 .bears_pricing_tables .plan-type {
100+
display: inline-block;
109101
}
110102

111103

@@ -117,15 +109,54 @@
117109
border-bottom: none;
118110
}
119111

112+
113+
.template-1265 .bears_pricing_tables .plan-select {
114+
border-radius: 40px !important;
115+
}
116+
120117
.template-1265 .bears_pricing_tables .plan.featured .plan-select {
121118
border-top: 1px solid rgba(255, 255, 255, 0.1);
122119
}
123120

121+
.template-1265 .bears_pricing_tables .plan-select a:hover {
122+
background-color: #262626;
123+
}
124+
125+
.template-1265 .bears_pricing_tables .plan-select:hover {
126+
border-top: 1px solid rgba(255, 255, 255, 0.1);
127+
background-color: rgba(0, 0, 0, 0.2);
128+
}
129+
130+
.template-1265 .bears_pricing_tables .plan-select a,
131+
.template-1265 .bears_pricing_tables .plan-select a.btn {
132+
border-radius: inherit;
133+
}
134+
124135
.template-1265 .bears_pricing_tables .plan.featured .plan-select a,
125136
.template-1265 .bears_pricing_tables .plan.featured .plan-select a.btn {
126137
color: var(--bears-featured-button-text-color);
138+
border-radius: inherit;
127139
}
128140

129141
.template-1265 .bears_pricing_tables .plan.featured header {
130142
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
131143
}
144+
145+
.template-1265 .bears_pricing_tables .plan-features li {
146+
border-left: 5px solid #f39c12;
147+
padding: 5px 5%;
148+
font-weight: 500;
149+
margin: 2px 20px;
150+
}
151+
152+
.template-1265 .bears_pricing_tables [class*="price-left"],
153+
.template-1265 .bears_pricing_tables .plan header [class*="price-left"],
154+
.template-1265 .bears_pricing_tables .plan header div[class*="price-left"] {
155+
color: var(--bears-button-background-color);
156+
float: none;
157+
}
158+
159+
.template-1265 .bears_pricing_tables .plan-cost {
160+
margin: 0;
161+
display: block;
162+
}

0 commit comments

Comments
 (0)