WordPress 4.3
[autoinstalls/wordpress.git] / wp-content / themes / twentyfifteen / inc / custom-header.php
1 <?php
2 /**
3  * Custom Header functionality for Twenty Fifteen
4  *
5  * @package WordPress
6  * @subpackage Twenty_Fifteen
7  * @since Twenty Fifteen 1.0
8  */
9
10 /**
11  * Set up the WordPress core custom header feature.
12  *
13  * @uses twentyfifteen_header_style()
14  */
15 function twentyfifteen_custom_header_setup() {
16         $color_scheme        = twentyfifteen_get_color_scheme();
17         $default_text_color  = trim( $color_scheme[4], '#' );
18
19         /**
20          * Filter Twenty Fifteen custom-header support arguments.
21          *
22          * @since Twenty Fifteen 1.0
23          *
24          * @param array $args {
25          *     An array of custom-header support arguments.
26          *
27          *     @type string $default_text_color     Default color of the header text.
28          *     @type int    $width                  Width in pixels of the custom header image. Default 954.
29          *     @type int    $height                 Height in pixels of the custom header image. Default 1300.
30          *     @type string $wp-head-callback       Callback function used to styles the header image and text
31          *                                          displayed on the blog.
32          * }
33          */
34         add_theme_support( 'custom-header', apply_filters( 'twentyfifteen_custom_header_args', array(
35                 'default-text-color'     => $default_text_color,
36                 'width'                  => 954,
37                 'height'                 => 1300,
38                 'wp-head-callback'       => 'twentyfifteen_header_style',
39         ) ) );
40 }
41 add_action( 'after_setup_theme', 'twentyfifteen_custom_header_setup' );
42
43 /**
44  * Convert HEX to RGB.
45  *
46  * @since Twenty Fifteen 1.0
47  *
48  * @param string $color The original color, in 3- or 6-digit hexadecimal form.
49  * @return array Array containing RGB (red, green, and blue) values for the given
50  *               HEX code, empty array otherwise.
51  */
52 function twentyfifteen_hex2rgb( $color ) {
53         $color = trim( $color, '#' );
54
55         if ( strlen( $color ) == 3 ) {
56                 $r = hexdec( substr( $color, 0, 1 ).substr( $color, 0, 1 ) );
57                 $g = hexdec( substr( $color, 1, 1 ).substr( $color, 1, 1 ) );
58                 $b = hexdec( substr( $color, 2, 1 ).substr( $color, 2, 1 ) );
59         } else if ( strlen( $color ) == 6 ) {
60                 $r = hexdec( substr( $color, 0, 2 ) );
61                 $g = hexdec( substr( $color, 2, 2 ) );
62                 $b = hexdec( substr( $color, 4, 2 ) );
63         } else {
64                 return array();
65         }
66
67         return array( 'red' => $r, 'green' => $g, 'blue' => $b );
68 }
69
70 if ( ! function_exists( 'twentyfifteen_header_style' ) ) :
71 /**
72  * Styles the header image and text displayed on the blog.
73  *
74  * @since Twenty Fifteen 1.0
75  *
76  * @see twentyfifteen_custom_header_setup()
77  */
78 function twentyfifteen_header_style() {
79         $header_image = get_header_image();
80
81         // If no custom options for text are set, let's bail.
82         if ( empty( $header_image ) && display_header_text() ) {
83                 return;
84         }
85
86         // If we get this far, we have custom styles. Let's do this.
87         ?>
88         <style type="text/css" id="twentyfifteen-header-css">
89         <?php
90                 // Short header for when there is no Custom Header and Header Text is hidden.
91                 if ( empty( $header_image ) && ! display_header_text() ) :
92         ?>
93                 .site-header {
94                         padding-top: 14px;
95                         padding-bottom: 14px;
96                 }
97
98                 .site-branding {
99                         min-height: 42px;
100                 }
101
102                 @media screen and (min-width: 46.25em) {
103                         .site-header {
104                                 padding-top: 21px;
105                                 padding-bottom: 21px;
106                         }
107                         .site-branding {
108                                 min-height: 56px;
109                         }
110                 }
111                 @media screen and (min-width: 55em) {
112                         .site-header {
113                                 padding-top: 25px;
114                                 padding-bottom: 25px;
115                         }
116                         .site-branding {
117                                 min-height: 62px;
118                         }
119                 }
120                 @media screen and (min-width: 59.6875em) {
121                         .site-header {
122                                 padding-top: 0;
123                                 padding-bottom: 0;
124                         }
125                         .site-branding {
126                                 min-height: 0;
127                         }
128                 }
129         <?php
130                 endif;
131
132                 // Has a Custom Header been added?
133                 if ( ! empty( $header_image ) ) :
134         ?>
135                 .site-header {
136
137                         /*
138                          * No shorthand so the Customizer can override individual properties.
139                          * @see https://core.trac.wordpress.org/ticket/31460
140                          */
141                         background-image: url(<?php header_image(); ?>);
142                         background-repeat: no-repeat;
143                         background-position: 50% 50%;
144                         -webkit-background-size: cover;
145                         -moz-background-size:    cover;
146                         -o-background-size:      cover;
147                         background-size:         cover;
148                 }
149
150                 @media screen and (min-width: 59.6875em) {
151                         body:before {
152
153                                 /*
154                                  * No shorthand so the Customizer can override individual properties.
155                                  * @see https://core.trac.wordpress.org/ticket/31460
156                                  */
157                                 background-image: url(<?php header_image(); ?>);
158                                 background-repeat: no-repeat;
159                                 background-position: 100% 50%;
160                                 -webkit-background-size: cover;
161                                 -moz-background-size:    cover;
162                                 -o-background-size:      cover;
163                                 background-size:         cover;
164                                 border-right: 0;
165                         }
166
167                         .site-header {
168                                 background: transparent;
169                         }
170                 }
171         <?php
172                 endif;
173
174                 // Has the text been hidden?
175                 if ( ! display_header_text() ) :
176         ?>
177                 .site-title,
178                 .site-description {
179                         clip: rect(1px, 1px, 1px, 1px);
180                         position: absolute;
181                 }
182         <?php endif; ?>
183         </style>
184         <?php
185 }
186 endif; // twentyfifteen_header_style
187
188 /**
189  * Enqueues front-end CSS for the header background color.
190  *
191  * @since Twenty Fifteen 1.0
192  *
193  * @see wp_add_inline_style()
194  */
195 function twentyfifteen_header_background_color_css() {
196         $color_scheme            = twentyfifteen_get_color_scheme();
197         $default_color           = $color_scheme[1];
198         $header_background_color = get_theme_mod( 'header_background_color', $default_color );
199
200         // Don't do anything if the current color is the default.
201         if ( $header_background_color === $default_color ) {
202                 return;
203         }
204
205         $css = '
206                 /* Custom Header Background Color */
207                 body:before,
208                 .site-header {
209                         background-color: %1$s;
210                 }
211
212                 @media screen and (min-width: 59.6875em) {
213                         .site-header,
214                         .secondary {
215                                 background-color: transparent;
216                         }
217
218                         .widget button,
219                         .widget input[type="button"],
220                         .widget input[type="reset"],
221                         .widget input[type="submit"],
222                         .widget_calendar tbody a,
223                         .widget_calendar tbody a:hover,
224                         .widget_calendar tbody a:focus {
225                                 color: %1$s;
226                         }
227                 }
228         ';
229
230         wp_add_inline_style( 'twentyfifteen-style', sprintf( $css, $header_background_color ) );
231 }
232 add_action( 'wp_enqueue_scripts', 'twentyfifteen_header_background_color_css', 11 );
233
234 /**
235  * Enqueues front-end CSS for the sidebar text color.
236  *
237  * @since Twenty Fifteen 1.0
238  */
239 function twentyfifteen_sidebar_text_color_css() {
240         $color_scheme       = twentyfifteen_get_color_scheme();
241         $default_color      = $color_scheme[4];
242         $sidebar_link_color = get_theme_mod( 'sidebar_textcolor', $default_color );
243
244         // Don't do anything if the current color is the default.
245         if ( $sidebar_link_color === $default_color ) {
246                 return;
247         }
248
249         // If we get this far, we have custom styles. Let's do this.
250         $sidebar_link_color_rgb     = twentyfifteen_hex2rgb( $sidebar_link_color );
251         $sidebar_text_color         = vsprintf( 'rgba( %1$s, %2$s, %3$s, 0.7)', $sidebar_link_color_rgb );
252         $sidebar_border_color       = vsprintf( 'rgba( %1$s, %2$s, %3$s, 0.1)', $sidebar_link_color_rgb );
253         $sidebar_border_focus_color = vsprintf( 'rgba( %1$s, %2$s, %3$s, 0.3)', $sidebar_link_color_rgb );
254
255         $css = '
256                 /* Custom Sidebar Text Color */
257                 .site-title a,
258                 .site-description,
259                 .secondary-toggle:before {
260                         color: %1$s;
261                 }
262
263                 .site-title a:hover,
264                 .site-title a:focus {
265                         color: %1$s; /* Fallback for IE7 and IE8 */
266                         color: %2$s;
267                 }
268
269                 .secondary-toggle {
270                         border-color: %1$s; /* Fallback for IE7 and IE8 */
271                         border-color: %3$s;
272                 }
273
274                 .secondary-toggle:hover,
275                 .secondary-toggle:focus {
276                         border-color: %1$s; /* Fallback for IE7 and IE8 */
277                         border-color: %4$s;
278                 }
279
280                 .site-title a {
281                         outline-color: %1$s; /* Fallback for IE7 and IE8 */
282                         outline-color: %4$s;
283                 }
284
285                 @media screen and (min-width: 59.6875em) {
286                         .secondary a,
287                         .dropdown-toggle:after,
288                         .widget-title,
289                         .widget blockquote cite,
290                         .widget blockquote small {
291                                 color: %1$s;
292                         }
293
294                         .widget button,
295                         .widget input[type="button"],
296                         .widget input[type="reset"],
297                         .widget input[type="submit"],
298                         .widget_calendar tbody a {
299                                 background-color: %1$s;
300                         }
301
302                         .textwidget a {
303                                 border-color: %1$s;
304                         }
305
306                         .secondary a:hover,
307                         .secondary a:focus,
308                         .main-navigation .menu-item-description,
309                         .widget,
310                         .widget blockquote,
311                         .widget .wp-caption-text,
312                         .widget .gallery-caption {
313                                 color: %2$s;
314                         }
315
316                         .widget button:hover,
317                         .widget button:focus,
318                         .widget input[type="button"]:hover,
319                         .widget input[type="button"]:focus,
320                         .widget input[type="reset"]:hover,
321                         .widget input[type="reset"]:focus,
322                         .widget input[type="submit"]:hover,
323                         .widget input[type="submit"]:focus,
324                         .widget_calendar tbody a:hover,
325                         .widget_calendar tbody a:focus {
326                                 background-color: %2$s;
327                         }
328
329                         .widget blockquote {
330                                 border-color: %2$s;
331                         }
332
333                         .main-navigation ul,
334                         .main-navigation li,
335                         .secondary-toggle,
336                         .widget input,
337                         .widget textarea,
338                         .widget table,
339                         .widget th,
340                         .widget td,
341                         .widget pre,
342                         .widget li,
343                         .widget_categories .children,
344                         .widget_nav_menu .sub-menu,
345                         .widget_pages .children,
346                         .widget abbr[title] {
347                                 border-color: %3$s;
348                         }
349
350                         .dropdown-toggle:hover,
351                         .dropdown-toggle:focus,
352                         .widget hr {
353                                 background-color: %3$s;
354                         }
355
356                         .widget input:focus,
357                         .widget textarea:focus {
358                                 border-color: %4$s;
359                         }
360
361                         .sidebar a:focus,
362                         .dropdown-toggle:focus {
363                                 outline-color: %4$s;
364                         }
365                 }
366         ';
367
368         wp_add_inline_style( 'twentyfifteen-style', sprintf( $css, $sidebar_link_color, $sidebar_text_color, $sidebar_border_color, $sidebar_border_focus_color ) );
369 }
370 add_action( 'wp_enqueue_scripts', 'twentyfifteen_sidebar_text_color_css', 11 );