← All changes | css/frm_overlay.css +24 -40 6.5.2 → trunk View file →

		@@ -1,14 +1,16 @@
1	1	.frm-overlay--wrapper {
2	2	position: absolute;
3		- top: 0; left: 0;
	3	+ top: 0;
	4	+ left: 0;
4	5	width: 100%;
5	6	min-height: 100%;
6	7	z-index: 1002;
7		- color:white;
	8	+ color: white;
8	9	}
9		-.frm-overlay--wrapper:before {
10		- content: '';
	10	+
	11	+.frm-overlay--wrapper::before {
	12	+ content: "";
11	13	display: block;
12	14	position: absolute;
13	15	top: 0;
14	16	left: 0;
		@@ -13,24 +15,28 @@
13	15	top: 0;
14	16	left: 0;
15	17	width: 100%;
16	18	height: 100%;
17		- background: rgba( 16, 24, 40, 0.85 );
	19	+ background: rgba(16, 24, 40, 0.85);
18	20	z-index: 1;
19	21	}
	22	+
20	23	.frm-overlay--close {
21	24	position: absolute;
22		- top: 32px; right: 32px;
23		- z-index:10;
24		- display:block;
	25	+ top: 32px;
	26	+ right: 32px;
	27	+ z-index: 10;
	28	+ display: block;
25	29	width: 32px;
26	30	height: 32px;
27		- background: url( '../images/overlay/close-overlay.svg' ) no-repeat;
	31	+ background: url("../images/overlay/close-overlay.svg") no-repeat;
28	32	cursor: pointer;
29	33	}
	34	+
30	35	body.admin-bar:not(.frm-full-screen) .frm-overlay--close {
31		- top:40px;
	36	+ top: 40px;
32	37	}
	38	+
33	39	.frm-overlay--container {
34	40	text-align: center;
35	41	position: absolute;
36	42	top: 0;
		@@ -37,14 +43,15 @@
37	43	left: 0;
38	44	right: 0;
39	45	bottom: 0;
40	46	margin: auto;
41		- z-index:8;
	47	+ z-index: 8;
42	48	max-width: 468px;
43	49	height: 260px;
44	50	}
	51	+
45	52	.frm-overlay--container .frm-overlay--heading {
46		- margin-bottom: var( --gap-xs );
	53	+ margin-bottom: var(--gap-xs);
47	54	font-weight: 600;
48	55	color: white;
49	56	}
50	57
		@@ -50,41 +57,18 @@
50	57
51	58	.frm-overlay--container .frm-overlay--cta {
52	59	margin-top: var(--gap-lg);
53	60	justify-content: center;
54		- gap: var( --gap-sm );
	61	+ gap: var(--gap-sm);
55	62	}
56	63
57		-.frm-overlay--container .frm-overlay--cta a:nth-child(2){
	64	+.frm-overlay--container .frm-overlay--cta a:nth-child(2) {
58	65	color: white;
59		- background: var( --primary-color );
	66	+ background: var(--primary-color);
60	67	}
	68	+
61	69	.frm-overlay--hero-image,
62	70	.frm-overlay--heading,
63	71	.frm-overlay--copy,
64	72	.frm-overlay--cta a {
65		- opacity:0.0;
66		- transform: matrix3d( 1,0,0,0,0,1,0,-0.00095,0,0,1,0,0,0,0,1 ) translateY( 15px ) scale3d( 0.92, 0.92, 1 );
67		-}
68		-.frm-overlay--wrapper.frm-active .frm-overlay--hero-image,
69		-.frm-overlay--wrapper.frm-active .frm-overlay--heading,
70		-.frm-overlay--wrapper.frm-active .frm-overlay--copy,
71		-.frm-overlay--wrapper.frm-active .frm-overlay--cta a {
72		- opacity:1;
73		- transform: matrix3d( 1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1 ) translateY( 0px ) scale3d( 1, 1, 1 );
74		- transition: 0.35s transform, 0.5s opacity linear;
75		-}
76		-.frm-overlay--wrapper.frm-active .frm-overlay--hero-image {
77		- transition-delay: 0.05s;
78		-}
79		-.frm-overlay--wrapper.frm-active .frm-overlay--heading {
80		- transition-delay: 0.05s;
81		-}
82		-.frm-overlay--wrapper.frm-active .frm-overlay--copy {
83		- transition-delay: 0.1s;
84		-}
85		-.frm-overlay--wrapper.frm-active .frm-overlay--cta a:nth-child(1) {
86		- transition-delay: 0.15s;
87		-}
88		-.frm-overlay--wrapper.frm-active .frm-overlay--cta a:nth-child(2) {
89		- transition-delay: 0.2s;
	73	+ opacity: 0;
90	74	}