wp-content/themes/twentytwentyone/classes/class-twenty-twenty-one-dark-mode.php:310Prints the dark-mode switch HTML.
$attrsarrayoptionalarray()void public function the_html( $attrs = array() ) { $attrs = wp_parse_args( $attrs, array( 'id' => 'dark-mode-toggler', 'class' => 'fixed-bottom', 'aria-pressed' => 'false', 'onClick' => 'toggleDarkMode()', ) ); echo '<button'; foreach ( $attrs as $key => $val ) { echo ' ' . esc_attr( $key ) . '="' . esc_attr( $val ) . '"'; } echo '>'; printf( /* translators: %s: On/Off */ esc_html__( 'Dark Mode: %s', 'twentytwentyone' ), '<span aria-hidden="true"></span>' ); echo '</button>'; ?> <style> #dark-mode-toggler > span { margin-<?php echo is_rtl() ? 'right' : 'left'; ?>: 5px; } #dark-mode-toggler > span::before { content: '<?php esc_attr_e( 'Off', 'twentytwentyone' ); ?>'; } #dark-mode-toggler[aria-pressed="true"] > span::before { content: '<?php esc_attr_e( 'On', 'twentytwentyone' ); ?>'; } <?php if ( is_admin() || wp_is_json_request() ) : ?> .components-editor-notices__pinned ~ .edit-post-visual-editor #dark-mode-toggler { z-index: 20; } .is-dark-theme.is-dark-theme #dark-mode-toggler:not(:hover):not(:focus) { color: var(--global--color-primary); } @media only screen and (max-width: 782px) { #dark-mode-toggler { margin-top: 32px; } } <?php endif; ?> </style> <?php }Introduced in Twenty Twenty-One 1.0. Unchanged from 6.7.7 through 7.1.0.
Signature, return type and hooks compared across 5 parsed releases.
src/wp-content/themes/twentytwentyone/classes/class-twenty-twenty-one-dark-mode.php, and regenerated for each WordPress release so it tracks the code rather than a snapshot of it.