ablocks / assets / build / blocks / tabs / style.css

style.css in aBlocks – Gutenberg Blocks, User Dashboard Builder, Popup Builder, Form Builder & Animation Builder 2.9.1, at assets/build/blocks/tabs/style.css

161 lines 3.4 KB

Raw Download Zip

1	.ablocks-block-tabs {
2	display: flex;
3	margin: 0;
4	padding: 0;
5	}
6	.ablocks-block-tabs li {
7	list-style: none;
8	}
9	.ablocks-block-tabs a {
10	text-decoration: none !important;
11	}
12
13	.ablocks-block-tabs__tab-panel{
14	display: flex;
15	margin: 0;
16	padding: 0;
17	}
18	.ablocks-block-tabs__tab {
19	text-align: center;
20	position: relative;
21	cursor: pointer;
22	}
23
24	.ablocks-block-tabs__tab{
25	border-width: 1px;
26	border-color: #e0e0e0;
27	border-style: solid;
28	}
29
30	.ablocks-block-tabs__tab--active .ablocks-block-tabs__progressbar{
31	position: absolute;
32	left: 0;
33	bottom:0;
34	height: 4px;
35	}
36
37	.ablocks-block-tabs__tab-menu {
38	position: relative;
39	padding: 8px 18px;
40	display: inline-flex;
41	color: black;
42	background-color: transparent;
43	cursor: pointer;
44	}
45
46	.ablocks-block-tabs__tab-menu-title {
47	font-size: 20px;
48	margin: 0;
49	}
50
51	.ablocks-block-tabs__tab-active a {
52	background-color: #FFFFFF !important;
53	border: none;
54	}
55	.ablocks-block-tabs .ablocks-block-tabs__icon .ablocks-icon-wrap img.ablocks-image-icon {
56	max-width: none !important;
57	}
58	/* ********************************************
59	add tab icon button style
60	****************************************** */
61	.ablocks-block-tabs__add-tab {
62	color: black;
63	padding: 6px 18px;
64	cursor: pointer;
65	display: flex;
66	align-items: center;
67	justify-content: center;
68	}
69
70	.ablocks-block-tabs__add-tab .ablocks-icon--plus::before {
71	color: black !important;
72	font-size: 25px;
73	font-weight: 900;
74	}
75
76	.ablocks-block-tabs__tab-menu {
77	outline-style: none !important;
78	display: flex;
79	align-items: center;
80	}
81
82	.ablocks-block-tabs__tab-menu-content {
83	text-align:start;
84	display: flex;
85	flex-direction: column;
86	}
87
88	.ablocks-block-tabs__tab-menu-subtitle {
89	font-size: 14px;
90	line-height: 21px;
91	margin: 0;
92	}
93
94	/* ************************************************
95	tab body and child part style
96	******************************************** */
97	.ablocks-block-tabs__body {
98	position: relative;
99	max-width: 100%;
100	padding: 10px;
101	flex-grow: 1;
102	}
103
104	.ablocks-block-tabs__body .block-editor-button-block-appender {
105	height:60px;
106	}
107
108
109	.ablocks-block--tabs-child {
110	display: none;
111	}
112
113	.ablocks-block-tabs .has-child-selected{
114	display: block;
115	}
116
117	/***************************
118	toolbar css part
119	***************************/
120	.ablocks-block-tabs__tab-controls {
121	display: none;
122	position: absolute;
123	top: -35px;
124	z-index: 10;
125	max-width: 100%;
126	}
127
128	.ablocks-block-tabs__tab--active .ablocks-block-tabs__tab-controls {
129	display: block;
130	}
131
132	.ablocks-block-tabs__tab-controls .components-toolbar {
133	background-color: #0a0909;
134	border: 1px solid #1e1e1e;
135	display: inline-flex;
136	flex-shrink: 0;
137	flex-wrap: wrap;
138	margin: 0;
139	min-height: 20px;
140	}
141	.ablocks-block-tabs .ablocks-icon--close,
142	.ablocks-block-tabs .ablocks-icon--direction-row-reversed,
143	.ablocks-block-tabs .ablocks-icon--direction-row-horizontal {
144	padding: 8px 2px;
145	}
146
147	.ablocks-block-tabs .ablocks-icon--close::before,
148	.ablocks-block-tabs .ablocks-icon--direction-row-reversed::before,
149	.ablocks-block-tabs .ablocks-icon--direction-row-horizontal::before {
150	color: white !important;
151	font-size: 17px;
152	}
153	.ablocks-block-tabs__tab--active .ablocks-block-tabs__progressbar{
154	display: block;
155	}
156	.ablocks-block-tabs__progressbar{
157	display: none;
158	}
159	.ablocks-block-tabs__progressbar-editor{
160	display: none !important;
161	}