New marketplace addons header

This commit is contained in:
Gerhard 2021-07-30 12:58:51 +02:00 committed by And Finally
parent 23ae6993ff
commit 6f9e7d1074
3 changed files with 78 additions and 67 deletions

View File

@ -23,37 +23,66 @@
.wc_addons_wrap {
max-width: 1200px;
.marketplace-header {
background-image: url("../images/marketplace-header-bg@2x.png");
background-size: cover;
font-family: sans-serif;
padding-left: 84px;
min-height: 216px;
&__title {
color: #fff;
font-size: 32px;
font-style: normal;
font-weight: 400;
letter-spacing: -0.32px;
line-height: 24px;
margin-bottom: 8px;
padding: 0;
padding-top: 47px;
}
&__description {
color: #fff;
font-size: 16px;
line-height: 24px;
letter-spacing: -0.32px;
margin-bottom: 24px;
margin-top: 0;
}
&__search-form {
clear: both;
display: block;
position: relative;
input {
border: 1px solid #ddd;
box-shadow: none;
height: 53px;
padding-right: 50px;
width: 100%;
margin: 0;
max-width: 318px;
}
button {
background: none;
border: none;
cursor: pointer;
height: 53px;
left: -53px;
position: relative;
width: 53px;
}
}
}
h1.search-form-title {
clear: left;
padding: 0;
}
form.search-form {
clear: both;
display: block;
position: relative;
margin-top: 1em;
margin-bottom: 1em;
input {
border: 1px solid #ddd;
box-shadow: none;
height: 53px;
padding-left: 50px;
width: 100%;
margin: 0;
}
button {
background: none;
border: none;
cursor: pointer;
height: 53px;
position: absolute;
width: 53px;
}
}
.update-plugins .update-count {
background-color: #d54e21;
border-radius: 10px;
@ -3155,8 +3184,8 @@ table.wc_input_table {
background: #fff;
cursor: default;
input[type=text],
input[type=number] {
input[type="text"],
input[type="number"] {
width: 100% !important;
min-width: 100px;
padding: 8px 10px;
@ -4692,8 +4721,8 @@ img.help_tip {
*/
.woocommerce_page_wc-settings {
input[type=url],
input[type=email] {
input[type="url"],
input[type="email"] {
direction: ltr;
}
@ -5450,7 +5479,7 @@ img.help_tip {
padding: 4px 1em 2px 0;
}
input[type=checkbox] {
input[type="checkbox"] {
margin: 0 5px 0 0.5em !important;
vertical-align: middle;
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 309 KiB

View File

@ -13,31 +13,24 @@ if ( ! defined( 'ABSPATH' ) ) {
?>
<div class="wrap woocommerce wc_addons_wrap">
<nav class="nav-tab-wrapper woo-nav-tab-wrapper">
<a href="<?php echo esc_url( admin_url( 'admin.php?page=wc-addons' ) ); ?>" class="nav-tab nav-tab-active"><?php esc_html_e( 'Browse Extensions', 'woocommerce' ); ?></a>
<?php
$count_html = WC_Helper_Updater::get_updates_count_html();
// translators: Count of updates for WooCommerce.com subscriptions.
$menu_title = sprintf( __( 'WooCommerce.com Subscriptions %s', 'woocommerce' ), $count_html );
?>
<a href="<?php echo esc_url( admin_url( 'admin.php?page=wc-addons&section=helper' ) ); ?>" class="nav-tab"><?php echo wp_kses_post( $menu_title ); ?></a>
</nav>
<h1 class="screen-reader-text"><?php esc_html_e( 'WooCommerce Extensions', 'woocommerce' ); ?></h1>
<?php if ( $sections ) : ?>
<ul class="subsubsub">
<?php foreach ( $sections as $section ) : ?>
<li>
<a
class="<?php echo $current_section === $section->slug ? 'current' : ''; ?>"
href="<?php echo esc_url( admin_url( 'admin.php?page=wc-addons&section=' . esc_attr( $section->slug ) ) ); ?>">
<?php echo esc_html( $section->label ); ?>
</a>
</li>
<?php endforeach; ?>
</ul>
<div class="marketplace-header">
<h1 class="marketplace-header__title"><?php esc_html_e( 'WooCommerce Marketplace', 'woocommerce' ); ?></h1>
<p class="marketplace-header__description"><?php esc_html_e( 'Grow your business with hundreds of free and paid WooCommerce extensions.', 'woocommerce' ); ?></p>
<form class="marketplace-header__search-form" method="GET">
<input
type="text"
name="search"
value="<?php echo esc_attr( isset( $_GET['search'] ) ? sanitize_text_field( wp_unslash( $_GET['search'] ) ) : '' ); // phpcs:ignore WordPress.Security.NonceVerification.Recommended ?>"
placeholder="<?php esc_attr_e( 'Search for extensions', 'woocommerce' ); ?>"
/>
<button type="submit">
<span class="dashicons dashicons-search"></span>
</button>
<input type="hidden" name="page" value="wc-addons">
<input type="hidden" name="section" value="_all">
</form>
</div>
<?php if ( isset( $_GET['search'] ) ) : // phpcs:ignore WordPress.Security.NonceVerification.Recommended ?>
<h1 class="search-form-title" >
@ -46,18 +39,7 @@ if ( ! defined( 'ABSPATH' ) ) {
</h1>
<?php endif; ?>
<form class="search-form" method="GET">
<button type="submit">
<span class="dashicons dashicons-search"></span>
</button>
<input
type="text"
name="search"
value="<?php echo esc_attr( isset( $_GET['search'] ) ? sanitize_text_field( wp_unslash( $_GET['search'] ) ) : '' ); // phpcs:ignore WordPress.Security.NonceVerification.Recommended ?>"
placeholder="<?php esc_attr_e( 'Enter a search term and press enter', 'woocommerce' ); ?>">
<input type="hidden" name="page" value="wc-addons">
<input type="hidden" name="section" value="_all">
</form>
<?php if ( '_featured' === $current_section ) : ?>
<div class="addons-featured">
<?php