Plugin: Minimal WP Adminbar - Hides wp-admin bar leaving only 32px icon upper left-corner - slides down on hover / toggle w F1 key

wp-minimal-adminbar.css

body.admin-bar {
    position: relative;
    top: -32px;
}
div#wpadminbar {
    transition: top 300ms ease-in-out;
    top: -32px;
}
div#wpadminbar:hover,
body.f1 div#wpadminbar /* see f1-toggle.js */ {
    top: 0px;
}
li#wp-admin-bar-wp-logo {
    background-color: #1d2327 !important;
    top: 0px;
    position: fixed !important;
}
ul#wp-admin-bar-root-default > li:nth-child(2) {
    margin-left: 32px !important;
}
@media (max-width: 782px) {
    body.admin-bar,
    div#wpadminbar {
        top: -46px;
    }
    ul#wp-admin-bar-root-default > li:nth-child(2) {
        margin-left: 46px !important;
    }
}

wp-minimal-adminbar.js

document.addEventListener('keyup', function (event) {
    if (event.key === 'F1') {
        document.body.classList.toggle("f1")
    }
});

wp-minimal-adminbar.php

<?php
/**
 * Plugin Name: Minimal WP Adminbar
 * Description: Toggle WP admin bar from small icon to full bar via icon hover or F1 key
 * Version: 1.0.1
 * Author: Philip Ingram
 * Author URI: https://experts.elementor.com/expert/5e837d1dd1d250001d066701
 **/
 
//Add specific CSS class to body showing it's active.
add_filter( 'body_class', function( $classes ) {
    return array_merge( $classes, array( 'wp-minimal-adminbar' ) );
} );

//Add dependencies
function wp_minimal_adminbar_deps(){
  wp_enqueue_style('min-adminbar-css', plugins_url('wp-minimal-adminbar.css',__FILE__ ), array(), '1.0');
  wp_enqueue_script('min-adminbar-js', plugins_url('wp-minimal-adminbar.js',__FILE__ ), array(), '1.0');
}
add_action('wp_enqueue_scripts','wp_minimal_adminbar_deps');