Changeset 3285

Timestamp:

06/01/2016 02:55:27 PM (9 years ago)

Author:

ocean90

Message:

Translate: Bring header in line with the header of make/polyglots.

Location:

sites/trunk/wordpress.org/public_html/wp-content/plugins/wporg-gp-customizations

Files:

• inc/class-plugin.php (modified) (2 diffs)
• templates/header.php (modified) (1 diff)
• templates/style.css (modified) (4 diffs)

sites/trunk/wordpress.org/public_html/wp-content/plugins/wporg-gp-customizations/inc/class-plugin.php

@@ -41 +41 @@
         add_filter( 'pre_handle_404', array( $this, 'short_circuit_handle_404' ) );
         add_action( 'wp_default_scripts', array( $this, 'bump_script_versions' ) );
+        add_action( 'after_setup_theme', array( $this, 'after_setup_theme' ) );
+        add_filter( 'body_class', array( $this, 'wporg_add_make_site_body_class' ) );
 
         // Load the API endpoints.
@@ -51 +53 @@
 
     /**
+     * Registers a menu location for a sub-navigation.
+     */
+    public function after_setup_theme() {
+        register_nav_menu( 'wporg_header_subsite_nav', 'WordPress.org Header Sub-Navigation' );
+    }
+
+    /**
+     * Adds the CSS classes from make/polyglots to the body to sync the headline icon.
+     */
+    function wporg_add_make_site_body_class( $classes ) {
+        $classes[] = 'wporg-make';
+        $classes[] = 'make-polyglots';
+        return $classes;
+    }
+
+    /**
      * Registers CLI commands if WP-CLI is loaded.
      */
-    function register_cli_commands() {
+    public function register_cli_commands() {
         WP_CLI::add_command( 'wporg-translate init-locale', __NAMESPACE__ . '\CLI\Init_Locale' );
     }

sites/trunk/wordpress.org/public_html/wp-content/plugins/wporg-gp-customizations/templates/header.php

@@ -4 +4 @@
 require WPORGPATH . 'header.php';
 ?>
-    <script type="text/javascript">document.body.className = document.body.className.replace('no-js','js');</script>
+<script type="text/javascript">document.body.className = document.body.className.replace('no-js','js');</script>
+
 <div id="headline">
     <div class="wrapper">
-        <h2><a href="//make.wordpress.org/polyglots/">Translating WordPress</a></h2>
-        <span id="hello">
-        <a class="menu-link" href="//make.wordpress.org/polyglots/">Blog</a>
-        <a class="menu-link" href="//make.wordpress.org/polyglots/teams/">Teams</a>
-        <a class="menu-link" href="//make.wordpress.org/polyglots/handbook/">Translator Handbook</a>
+        <h2><a href="<?php echo home_url( '/' ); ?>"><?php bloginfo( 'name' ); ?></a></h2>
         <?php
-        if ( is_user_logged_in() ):
-            $user = wp_get_current_user();
-
-            printf( __('Hi, %s.'), '<a href="'.gp_url( '/settings' ).'">'.$user->user_login.'</a>' );
+        wp_nav_menu( array(
+            'theme_location' => 'wporg_header_subsite_nav',
+            'fallback_cb'    => '__return_false'
+        ) );
+        ?>
+    </div>
+    <div class="wrapper">
+        <ul class="translate-meta-nav">
+            <?php
+            if ( is_user_logged_in() ) {
+                $user = wp_get_current_user();
+                printf(
+                    '<li>logged in as %s</li>',
+                    '<a href="' . esc_url( gp_url_profile( $user->user_login ) ) . '">@' . esc_html( $user->user_nicename ) . '</a>'
+                );
+                ?>
+                <li><a href="<?php echo esc_url( gp_url( '/settings' ) ); ?>">Settings</a></li>
+                <li><a href="<?php echo esc_url( wp_logout_url( home_url( '/' ) ) ); ?>">Log out</a></li>
+                <?php
+            } else {
+                ?>
+                <li><a href="<?php echo esc_url( wp_login_url() ); ?>"><strong>Log in</strong></a></li>
+                <?php
+            }
             ?>
-            <a href="<?php echo esc_url( wp_logout_url( home_url( '/' ) ) ); ?>"><?php _e( 'Log out' ); ?></a>
-        <?php else: ?>
-            <strong><a href="<?php echo esc_url( wp_login_url() ); ?>"><?php _e( 'Log in' ); ?></a></strong>
-        <?php endif; ?>
-        <?php do_action( 'after_hello' ); ?>
-        </span>
+            </ul>
     </div>
 </div>
+
 <div class="gp-content">
 

sites/trunk/wordpress.org/public_html/wp-content/plugins/wporg-gp-customizations/templates/style.css

@@ -1 @@
-html, body {
+/* Secondary header design */
+#headline .menu {
+    list-style: none;
+    float: right;
+    font-size: 14px;
+    font-weight: bold;
+    padding-top: 22px;
+    margin-right: 15px;
+}
+
+#headline .menu li {
+    display: inline;
+    padding-left: 20px;
+}
+
+/* Responsive design for secondary header */
+@media (max-width: 480px) {
+    #headline h2 {
+        margin-left: 6px;
+        font-size: 20px;
+    }
+
+    #headline h2 a:before {
+        font-size: 20px;
+        width: 24px;
+    }
+}
+
+@media (max-width: 770px) {
+    #headline {
+        height: auto;
+    }
+
+    #headline h2 {
+        float: none;
+    }
+
+    #headline .menu {
+        float: left;
+        margin: 0;
+        padding: 8px 0;
+        background: #f5f5f5;
+        border-top: 1px solid #d7d7d7;
+        width: 100%;
+    }
+}
+
+.wrapper {
+    position: relative;
+}
+
+ul.translate-meta-nav {
+    list-style: none;
     margin: 0;
+    padding: 0;
+    font-size: 12px;
+    text-align: right;
+}
+
+#headline ul.translate-meta-nav a {
+    color: #0073aa;
+}
+
+#headline ul a:hover,
+#headline ul a:focus {
+    color: #00a0d2;
+}
+
+@media (min-width: 771px) {
+    ul.translate-meta-nav {
+        position: absolute;
+        bottom: -18px;
+        right: 6px;
+    }
+}
+
+ul.translate-meta-nav li {
+    display: inline-block;
+    margin: 0 8px
 }
 
@@ -36 +113 @@
 .actionlist a:visited,
 .gp-content a {
-    color: #0074a2;
+    color: #0073aa;
 }
 
 .gp-content a:hover {
-    color: #2ea2cc;
+    color: #00a0d2;
     text-decoration: none;
 }
@@ -185 +262 @@
 
 .gp-content .meta a {
-    color: #0074a2;
+    color: #0073aa;
     border-bottom: 0;
 }
 
 .gp-content .meta a:hover {
-    color: #2ea2cc;
+    color: #00a0d2;
     border-bottom: 0;
 }
@@ -1295 +1372 @@
     cursor: pointer;
     font: inherit;
-    color: #0074a2;
+    color: #0073aa;
 }
 
 .button-link:hover {
-    color: #2ea2cc;
+    color: #00a0d2;
 }