-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathoik.css
331 lines (256 loc) · 12.4 KB
/
oik.css
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
/* (C) Copyright Bobbing Wide 2010-2017, 2024, 2025
The oik.css stylesheet provides the default formatting for the HTML generated by the oik plugin
For oik version 1.17 and above this stylesheet is now optional.
In oik version 2.1 the blueprint CSS grid class definitions have been extracted to a separate file.
To read more about the oik.css file see: http://www.oik-plugins.com/oik-css
*/
em, dfn {font-style:italic;}
abbr, acronym {border-bottom:1px dotted #666;}
.small {font-size:.8em;margin-bottom:1.875em;line-height:1.875em;}
.large {font-size:1.4em;margin-bottom:0.25em;}
.hide {display:none;}
.quiet {color:#666;}
.loud {color:#000;}
.highlight {background:#ff0;}
.added {background:#060;color:#fff;}
.removed {background:#900;color:#fff;}
.first {margin-left:0;padding-left:0;}
.last {margin-right:0;padding-right:0;}
.top {margin-top:0;padding-top:0;}
.bottom {margin-bottom:0;padding-bottom:0;}
form.bw_inline { display: inline;}
form.bw_inline p {margin-bottom:0;}
/** Use a new solution for the clearfix problem
@link http://css-tricks.com/snippets/css/clear-fix/
to cater for Artisteer 4.0 themes which define .clearfix slightly differently
*/
/* .clearfix:after, .container:after {content:"\0020";display:block;height:0;clear:both;visibility:hidden;overflow:hidden;} */
/* .clearfix { display: block; } */
.group:after {
content: "";
display: table;
clear: both;
}
/* .clearfix, */
.container {display:block;}
.clear {clear:both;}
/* background image for the oik dashboard icon */
#toplevel_page_oik_menu .wp-menu-image {
background: url( 'images/oik-icon.png' ) 0 90% no-repeat; }
#toplevel_page_oik_menu.current .wp-menu-image,
#toplevel_page_oik_menu.wp-has-current-submenu .wp-menu-image,
#toplevel_page_oik_menu:hover .wp-menu-image {
background-position: 0px 0px;
}
/* background image for the oik-types dashboard icon */
#toplevel_page_oik_types_menu .wp-menu-image {
background: url( 'images/oik-icon.png' ) 0 90% no-repeat; }
#toplevel_page_oik_types_menu.current .wp-menu-image,
#toplevel_page_oik_types_menu.wp-has-current-submenu .wp-menu-image,
#toplevel_page_oik_types_menu:hover .wp-menu-image {
background-position: 0px 0px;
}
/* Class for styling the contact style button created using [bw_contact_button] */
a.bw_contact { }
/* Classes for the [bw_block] shortcode to set the minimum height for a block
e.g.
[bw_block class="column span-6 bd-200"]
If these are not sufficient you can add more to your custom stylesheet
*/
div.bd-100 .art-blockcontent, .bd-100 { min-height: 100px; }
div.bd-150 .art-blockcontent, .bd-150 { min-height: 150px; }
div.bd-200 .art-blockcontent, .bd-200 { min-height: 200px; }
div.bd-250 .art-blockcontent, .bd-250 { min-height: 250px; }
div.bd-300 .art-blockcontent, .bd-300 { min-height: 300px; }
div.bd-350 .art-blockcontent, .bd-350 { min-height: 350px; }
div.bd-400 .art-blockcontent, .bd-400 { min-height: 400px; }
div.bd-450 .art-blockcontent, .bd-450 { min-height: 450px; }
div.bd-500 .art-blockcontent, .bd-500 { min-height: 500px; }
div.bd-550 .art-blockcontent, .bd-550 { min-height: 550px; }
/* Classes for the emergency telephone number - darkish red */
div.bw_emergency { color: #b53030 }
/* For [bw_show_googlemap] we need to ensure the zoom controls aren't broken
* Changed styling to use a statically named class.
*/
.bw_map_canvas { height: 100%; min-height: 100% }
.bw_map_canvas img { max-width: none; }
/* For [bw_address] */
div.bw_address div.type,
span.bw_address span.type { display: none; }
span.bw_address span { padding-right: .5em; }
/* disable the background on Mail Chimp's Email Format radio buttons */
div#mc_embed_signup ul li { background-image: none; }
/* Make the custom header image fit inside the meta box */
img.bw-header-box { margin: 0 auto; position: relative; max-width: 100%; margin-top: 0; margin-bottom: 0; }
/* If there is a menu called 'footer' in the footer then make it horizontal */
div.art-footer ul#menu-footer li { display: inline; text-transform: lowercase; }
/* Styling for the "(C) Copyright company yearfrom-yearto" from [bw_copyright] */
span.bw_copyright { }
ul.tick, ul.cross, ul.x { list-style: none; list-style-position: outside; padding-left: 0; }
ul.tick li, li.tick { background: transparent url( 'images/green_tick_64x64.png' ) no-repeat; background-size: 16px 16px; padding-left: 2em; }
ul.cross li, li.cross, .tick li.x { background: transparent url( 'images/red_x_64x64.png' ) no-repeat; background-size: auto 100%; padding-left: 2em; }
/* For rules on using the PDF logo see "Adobe PDF file icon" in http://www.adobe.com/misc/linking.html */
a.bw_attachment[href*='.pdf'] { background: transparent url( 'images/pdficon_small.png' ) no-repeat; background-size: auto; padding-left: 32px; }
div.noicon a[href*='.pdf'] { background-image: none; padding-left: 3px; }
a.bw_portfolio { background: none; padding-left: 0px; }
/* columns required %ages to use
---------------- ---------------
1 100
2 50%
3 33% 66%
4 25% 50% 75%
5 20% 40% 60% 80%
6 16% 33% 50% 66% 83%
7 14.285714%
*/
.w100pc { float: left; width: 100%; }
.w90pc { float: left; width: 90%; }
.w83pc { float: left; width: 83.3333333%; }
.w80pc { float: left; width: 80%; }
.w75pc { float: left; width: 75%; }
.w70pc { float: left; width: 70%; }
.w66pc { float: left; width: 66.6666667%; }
.w60pc { float: left; width: 60%; }
.w50pc { float: left; width: 50%; }
.w40pc { float: left; width: 40%; }
.w33pc { float: left; width: 33.3333333%; }
.w30pc { float: left; width: 30%; }
.w25pc { float: left; width: 25%; }
.w20pc { float: left; width: 20%; }
.w15pc { float: left; width: 15%; }
.w16pc { float: left; width: 16.6666667%; }
.w14pc { float: left; width: 14.285714%; }
.w10pc { float: left; width: 10%; }
/* Prevent images from going outside their bounding divs */
/* Does it matter what the class of the div is? Can't we do it for every image? */
.entry-content img.bw_logo { max-width: 100%; }
div.art-block img, div.textwidget img { max-width: 100% }
div.nivo-slice img, div.nivo-box img { margin: 0px; max-width: none; }
/* Fix for nested Artisteer blocks - see Support case 69871.
Although it was Closed with a recommendation to use the following
.art-blockcontent .art-blockheader, .art-blockcontent .art-blockcontent { z-index: 0; }
I find that doesn't work for blocks in the content.
So I'm using a slightly modified version of my original solution.
.art-bar is needed to complete the RHS of the header bar for the box
but we need to work at a lower level to ensure that the drop down of the horizontal menu appears
.art-box is needed to complete the RHS of the content of the box
2012/03/22 discovered that this can stop hmenu drop down items from appearing
So I have removed my latest fix and added a new line for the
blocks in body content
*/
/* .art-box-body .art-bar { z-index: 0; } */
/* .art-box { z-index: 0; } */
/* .art-box-body .art-nav { z-index: 1; } */
/* .art-bar, .art-box { z-index: 0; } */
.art-blockcontent .art-blockheader, .art-blockcontent .art-blockcontent { z-index: 0; }
.art-block-body .art-blockheader, .art-block-body .art-blockcontent { z-index: 0; }
/* Default to no borders on tables used by [bw_squeeze] ( oik-squeeze plugin ) and [bw_contact_form] */
.bw_squeeze td { border: none; }
.bw_contact_form td { border: none;}
/* Styling for the bw_wtf shortcode */
div.bw_wtf p { font-weight: bold; }
p.bw_wtf { font-family: Courier, Monospace; }
/* CSS for responsive [bw_video] shortcode when width and height are not specified.
@link http://alistapart.com/article/creating-intrinsic-ratios-for-video
*/
.bw_video { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden;margin-bottom: 20px; }
.bw_video_inner {display: block;position: absolute; top: 0;left: 0; width: 100%;height: 100% }
/* CSS for responsive [bw_testimonial] shortcode */
.bw_testimonial, .bw_testimonials { width: 100% !important; background-color: #eeeeee; }
.bw_testimonial img, .bw_testimonials img { max-width: 100% !important; }
/* CSS for bw_jquery fancybox - setting the inline content to display none initially */
.bw_display_none { display: none; }
/* Format a field hint */
span.bw_hint { display: block; font-style: italic; }
/* Styling for oik-rating stars */
img[src$='star-on.png'], img[src$='star-off.png'] { margin: 0px; }
/* Styling for an error message from bw_display_messages() */
div.bw_messages div.error { color: red; font-weight: bold; }
/* Styling for WordPress 3.8 */
.form-table td textarea,
.form-table td input[type="text"],
.form-table td input[type="email"] { width: 100%; max-width: none; }
.form-table td select { width: auto; max-width: 80%; }
/* input[type="password"], input[type="number"], input[type="search"], input[type="tel"], input[type="url"] */
/* We may also need to style these similarly */
/**
* TinyMCE button images... until we can find appropriate dashicons
*/
.mce-container .mce-i-bw-sc-icon { background-image: url( 'bw-sc-icon.gif' ); }
.mce-container .mce-i-bw-bn-icon { background-image: url( 'bw-bn-icon.gif' ); }
.mce-container .mce-i-bw-pp-icon { background-image: url( 'bw-pp-icon.gif' ); }
/* Styling for the edit CSS link - {} */
.bw_custom_css { background: #444; color: #eee !important; font-size: 32px; text-decoration: none !important; padding: 0px 10px 10px 10px; }
.bw_custom_css:hover { background: #222; color: #0074a2 !important;}
/**
* Styling for theme=dash or theme=gener on the [bw_follow] based shortcodes
* and also for the dummy theme called texticons which is used by [bw_dash] when the
* icon is not recognised as being in dashicons or genericons but is implemented as a 'text icon'.
*/
a span.bw_follow_me { text-decoration: none; width: auto; height: auto; vertical-align: 16%; }
a span.bw_follow_me.genericon,
a span.bw_follow_me.dashicons {
vertical-align: top;}
.bw_follow_me { background-color: #222; padding: 4px; margin-right: 4px; border-radius: 10% 10%; }
.bw_code.bw_follow_me { background-color: transparent; }
a span.dashicons-linkedin span { vertical-align: text-bottom; font-family: 'Myriad Pro',Futura,Arial,sans-serif; font-weight: bold; padding: 0px 5px 10px; 5px; }
.dashicons.x2, .genericon.x2 { font-size: 200%; width: auto; }
.dashicons.x24, .genericon.x24 { font-size: 39px; width: auto; }
.dashicons.x3, .genericon.x3 { font-size: 300%; width: auto; }
.dashicons.x4, .genericon.x4 { font-size: 400%; width: auto; }
.dashicons.x5, .genericon.x5 { font-size: 500%; width: auto; height: auto; }
.texticons.x1, .texticons { font-size: .9em; font-family: arial, serif; vertical-align: top;}
.texticons.x2 { font-size: 190%; margin-top: -2px; display: inline-block; }
.texticons.x3 { font-size: 290%; margin-top: -2px; display: inline-block;}
.texticons.x4 { font-size: 390%; margin-top: -2px; display: inline-block;}
.texticons.x5 { font-size: 435%; margin-top: 0px; display: inline-block;}
.texticons-cent:before { content: "\00a2"; }
.texticons-css:before { content: "{}"; }
.texticons-dollar:before { content: "$"; }
.texticons-euro:before { content: "\20ac"; }
.texticons-shortcode:before { content: "[]"; }
.texticons-sterling:before { content: "\00a3"; }
.texticons-yen:before { content: "\00a5"; }
/* Special classes for defining border-radius */
.br0 { border-radius: 0% 0%; }
.br10 { border-radius: 10% 10% }
.br15 { border-radius: 15% 15% }
.br20 { border-radius: 20% 20% }
.br25 { border-radius: 25% 25% }
.br50 { border-radius: 50% 50% }
/* Sizing for the original images used by bw_follow_me.
* x24 matches the original default image size, but the margins would have been set by the theme.
*/
a.x1 img.bw_follow { max-width: 25px; }
a.x2 img.bw_follow { max-width: 41px; }
a.x24 img.bw_follow { max-width: 48px; }
a.x3 img.bw_follow { max-width: 48px; margin: 2px;}
/* a.bw_follow_new img.bw_follow { margin: 0px; } */
a.x1,
a.x2,
a.x24 { margin: 0 4px 0 0; }
a.bw_follow_new img {
border: solid grey 0px;
border-radius: 14%;
display: inline-block;
overflow: hidden;
-webkit-box-shadow: 0px 0px 1px #4d4d4d;
-moz-box-shadow: 0px 0px 1px #4d4d4d;
box-shadow: 0px 0px 1px #4d4d4d;
line-height: 0.7em;
margin: 0 4px 0 1px;
box-sizing: border-box;
padding: 0px;
}
/* Styling for bw_user - which is actually delivered by oik-user...
*/
div.bw_user-fields-0,
div.bw_user-fields-1,
div.bw_user-fields-2 {
display: block;
float: left;
position: relative;
}
div.bw_accordion_item summary {
display: list-item;
}