← All changes | resources/backend/css/setup-wizard.css +14 -54 3.3.3 → 2.4.7 View file →

		@@ -1,12 +1,5 @@
1	1	/**
2		- * Body
3		- */
4		-body.convertkit {
5		- background: #f9f7f4;
6		-}
7		-
8		-/**
9	2	* Container
10	3	*/
11	4	#convertkit-setup-wizard {
12	5	max-width: 900px;
		@@ -12,9 +5,8 @@
12	5	max-width: 900px;
13	6	margin: 0 auto;
14	7	padding: 20px 0;
15	8	}
16		-
17	9	#convertkit-setup-wizard .wrap {
18	10	margin: 10px 0;
19	11	}
20	12
		@@ -22,17 +14,16 @@
22	14	* Logo
23	15	*/
24	16	#convertkit-setup-wizard-header {
25	17	height: 80px;
26		- background: url(../images/kit-logo.svg) center no-repeat;
27		- background-size: 75px auto;
	18	+ background: url(../images/convertkit-long.svg) center no-repeat;
	19	+ background-size: 200px auto;
28	20	}
29		-
30	21	#convertkit-setup-wizard-header h1 {
31	22	margin: 0;
32	23	padding: 0;
33	24	font-weight: 400;
34		- color: #d2d8dd;
	25	+ color: #D2D8DD;
35	26	text-indent: -9999px;
36	27	}
37	28
38	29	/**
		@@ -41,15 +32,13 @@
41	32	#convertkit-setup-wizard-progress {
42	33	text-align: center;
43	34	padding: 20px 0;
44	35	}
45		-
46	36	#convertkit-setup-wizard-progress ol {
47	37	list-style: none;
48	38	margin: 0;
49	39	padding: 0;
50	40	}
51		-
52	41	#convertkit-setup-wizard-progress li {
53	42	position: relative;
54	43	display: inline-block;
55	44	width: 135px;
		@@ -55,10 +44,9 @@
55	44	width: 135px;
56	45	text-align: center;
57	46	line-height: 3em;
58	47	}
59		-
60		-#convertkit-setup-wizard-progress li::after {
	48	+#convertkit-setup-wizard-progress li:after {
61	49	position: absolute;
62	50	display: block;
63	51	z-index: 1;
64	52	top: -2px;
		@@ -67,10 +55,9 @@
67	55	width: 135px;
68	56	content: "";
69	57	background-color: #dfdfdf;
70	58	}
71		-
72		-#convertkit-setup-wizard-progress li::before {
	59	+#convertkit-setup-wizard-progress li:before {
73	60	position: absolute;
74	61	z-index: 2;
75	62	top: -6px;
76	63	left: 65px;
		@@ -81,19 +68,16 @@
81	68	line-height: 1.2em;
82	69	content: " ";
83	70	background-color: #dfdfdf;
84	71	}
85		-
86		-#convertkit-setup-wizard-progress li:first-child::after {
	72	+#convertkit-setup-wizard-progress li:first-child:after {
87	73	display: none;
88	74	}
89		-
90	75	#convertkit-setup-wizard-progress li.done {
91	76	color: #1c9bd7;
92	77	}
93		-
94		-#convertkit-setup-wizard-progress li.done::after,
95		-#convertkit-setup-wizard-progress li.done::before {
	78	+#convertkit-setup-wizard-progress li.done:after,
	79	+#convertkit-setup-wizard-progress li.done:before {
96	80	background-color: #1c9bd7;
97	81	}
98	82
99	83	/**
		@@ -117,27 +101,22 @@
117	101	*/
118	102	#convertkit-setup-wizard-content {
119	103	padding: 80px 80px 0 80px;
120	104	}
121		-
122	105	#convertkit-setup-wizard-content h1 {
123	106	margin: 0 0 20px 0;
124	107	}
125		-
126	108	#convertkit-setup-wizard-content hr {
127	109	margin: 40px 0 0 0;
128	110	padding: 0 0 40px 0;
129	111	border-bottom: none;
130	112	}
131		-
132	113	#convertkit-setup-wizard-content p {
133	114	font-size: 16px;
134	115	}
135		-
136	116	#convertkit-setup-wizard-content p.description {
137	117	font-size: 13px;
138	118	}
139		-
140	119	#convertkit-setup-wizard-content a.button,
141	120	#convertkit-setup-wizard-content button,
142	121	#convertkit-setup-wizard-footer a.button,
143	122	#convertkit-setup-wizard-footer button {
		@@ -152,13 +131,8 @@
152	131	display: grid;
153	132	grid-template-columns: repeat(2, 1fr);
154	133	column-gap: 20px;
155	134	}
156		-
157		-#convertkit-setup-wizard-content > div {
158		- margin: 0 0 40px 0;
159		-}
160		-
161	135	#convertkit-setup-wizard-content .convertkit-setup-wizard-grid > div {
162	136	text-align: center;
163	137	padding: 20px;
164	138	background-color: #fcfcfc;
		@@ -165,13 +139,11 @@
165	139	border: 1px solid #ccc;
166	140	border-radius: 5px;
167	141	cursor: pointer;
168	142	}
169		-
170	143	#convertkit-setup-wizard-content .convertkit-setup-wizard-grid > div span {
171	144	display: block;
172	145	}
173		-
174	146	#convertkit-setup-wizard-content .convertkit-setup-wizard-grid > div span.description {
175	147	margin: 20px 0 0 0;
176	148	color: #646970;
177	149	font-size: 13px;
		@@ -176,8 +148,11 @@
176	148	color: #646970;
177	149	font-size: 13px;
178	150	}
179	151
	152	+#convertkit-setup-wizard-content > div {
	153	+ margin: 0 0 40px 0;
	154	+}
180	155	#convertkit-setup-wizard-content > div label {
181	156	display: block;
182	157	margin-bottom: 10px;
183	158	font-size: 16px;
		@@ -182,15 +157,13 @@
182	157	margin-bottom: 10px;
183	158	font-size: 16px;
184	159	font-weight: 500;
185	160	}
186		-
187	161	#convertkit-setup-wizard-content .convertkit-setup-wizard-selection {
188	162	display: grid;
189	163	grid-template-columns: repeat(2, 1fr);
190	164	column-gap: 20px;
191	165	}
192		-
193	166	#convertkit-setup-wizard-content .convertkit-setup-wizard-selection label {
194	167	text-align: center;
195	168	padding: 20px;
196	169	background-color: #fcfcfc;
		@@ -197,13 +170,11 @@
197	170	border: 1px solid #ccc;
198	171	border-radius: 5px;
199	172	cursor: pointer;
200	173	}
201		-
202	174	#convertkit-setup-wizard-content .convertkit-setup-wizard-selection label span {
203	175	display: block;
204	176	}
205		-
206	177	#convertkit-setup-wizard-content .convertkit-setup-wizard-selection label span.description {
207	178	margin: 20px 0 0 0;
208	179	color: #646970;
209	180	font-size: 13px;
		@@ -209,10 +180,9 @@
209	180	font-size: 13px;
210	181	font-weight: 400;
211	182	font-style: italic;
212	183	}
213		-
214		-#convertkit-setup-wizard-content .convertkit-setup-wizard-selection label input[type="radio"] {
	184	+#convertkit-setup-wizard-content .convertkit-setup-wizard-selection label input[type=radio] {
215	185	margin: 20px 0 0 0;
216	186	}
217	187
218	188	/**
		@@ -219,18 +189,16 @@
219	189	* Footer
220	190	*/
221	191	#convertkit-setup-wizard-footer {
222	192	display: grid;
223		- grid-template-columns: repeat(2, 1fr);
	193	+ grid-template-columns: repeat(2,1fr);
224	194	grid-template-areas: "left right";
225	195	padding: 40px 80px;
226	196	}
227		-
228	197	#convertkit-setup-wizard-footer .left {
229	198	grid-area: left;
230	199	text-align: left;
231	200	}
232		-
233	201	#convertkit-setup-wizard-footer .right {
234	202	grid-area: right;
235	203	text-align: right;
236	204	}
		@@ -243,9 +211,8 @@
243	211	margin: 80px 0;
244	212	text-align: center;
245	213	font-size: 14px;
246	214	}
247		-
248	215	#convertkit-setup-wizard-exit-link a {
249	216	color: #8c8f9a;
250	217	}
251	218
		@@ -251,12 +218,9 @@
251	218
252	219	/**
253	220	* Modal View
254	221	*/
255		-body.convertkit-modal {
256		- overflow: hidden;
257		-}
258		-
	222	+body.convertkit-modal { overflow: hidden; }
259	223	body.convertkit-modal #convertkit-setup-wizard {
260	224	width: 100%;
261	225	max-width: 100%;
262	226	margin: 0;
		@@ -261,20 +225,16 @@
261	225	max-width: 100%;
262	226	margin: 0;
263	227	padding: 0;
264	228	}
265		-
266	229	body.convertkit-modal #convertkit-setup-wizard .wrap {
267	230	margin: 0;
268	231	}
269		-
270	232	body.convertkit-modal #convertkit-setup-wizard-body {
271	233	box-shadow: none;
272	234	}
273		-
274	235	body.convertkit-modal #convertkit-setup-wizard-content {
275	236	padding: 20px 20px 0 20px;
276	237	}
277		-
278	238	body.convertkit-modal #convertkit-setup-wizard-footer {
279	239	padding: 0 20px 20px 20px;
280	240	}