export styling
This commit is contained in:
Mike Jolley
parent
d67fb8fb83
commit
a6537ff269
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -5421,7 +5421,8 @@ table.bar_chart {
|
|||
}
|
||||
}
|
||||
|
||||
.woocommerce-progress-form-wrapper {
|
||||
.woocommerce-progress-form-wrapper,
|
||||
.woocommerce-exporter-wrapper {
|
||||
text-align: center;
|
||||
max-width: 700px;
|
||||
margin: 40px auto;
|
||||
|
|
@ -5475,16 +5476,8 @@ table.bar_chart {
|
|||
}
|
||||
}
|
||||
}
|
||||
.wc-progress-form-content {
|
||||
background: #fff;
|
||||
overflow: hidden;
|
||||
padding: 24px 24px 0;
|
||||
margin: 0 0 16px;
|
||||
box-shadow: 0 1px 3px rgba(0,0,0,.13);
|
||||
color: #555;
|
||||
text-align: left;
|
||||
}
|
||||
.wc-progress-form-actions {
|
||||
|
||||
.wc-actions {
|
||||
overflow: hidden;
|
||||
padding: 0 0 2px;
|
||||
margin: 0 0 24px;
|
||||
|
|
@ -5513,99 +5506,103 @@ table.bar_chart {
|
|||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.woocommerce-exporter,
|
||||
.woocommerce-importer {
|
||||
|
||||
|
||||
header {
|
||||
border-bottom: 1px solid #eee;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
h2 {
|
||||
margin: 0 0 24px;
|
||||
.woocommerce-exporter,
|
||||
.wc-progress-form-content {
|
||||
background: #fff;
|
||||
overflow: hidden;
|
||||
padding: 24px 24px 0;
|
||||
margin: 0 0 16px;
|
||||
box-shadow: 0 1px 3px rgba(0,0,0,.13);
|
||||
color: #555;
|
||||
font-size: 24px;
|
||||
font-weight: normal;
|
||||
line-height: 1em;
|
||||
}
|
||||
text-align: left;
|
||||
|
||||
p {
|
||||
font-size: 1em;
|
||||
line-height: 1.75em;
|
||||
font-size: 16px;
|
||||
color: #555;
|
||||
margin: 0 0 24px;
|
||||
}
|
||||
header {
|
||||
border-bottom: 1px solid #eee;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.form-row {
|
||||
margin-top: 24px;
|
||||
}
|
||||
|
||||
.spinner {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.woocommerce-exporter-options th,
|
||||
.woocommerce-importer-options th {
|
||||
width: 30%;
|
||||
}
|
||||
|
||||
.woocommerce-exporter-options th,
|
||||
.woocommerce-exporter-options td,
|
||||
.woocommerce-importer-options th,
|
||||
.woocommerce-importer-options td {
|
||||
vertical-align: top;
|
||||
|
||||
label {
|
||||
h2 {
|
||||
margin: 0 0 24px;
|
||||
color: #555;
|
||||
font-size: 24px;
|
||||
font-weight: normal;
|
||||
line-height: 1em;
|
||||
}
|
||||
}
|
||||
|
||||
progress {
|
||||
width: 100%;
|
||||
height: 42px;
|
||||
margin: 24px auto 0;
|
||||
display: block;
|
||||
-webkit-appearance: none;
|
||||
border: none;
|
||||
display: none;
|
||||
}
|
||||
p {
|
||||
font-size: 1em;
|
||||
line-height: 1.75em;
|
||||
font-size: 16px;
|
||||
color: #555;
|
||||
margin: 0 0 24px;
|
||||
}
|
||||
|
||||
/* All good till now. Now we'll style the background */
|
||||
progress::-webkit-progress-bar {
|
||||
background: #f5f5f5;
|
||||
border: 2px solid #eee;
|
||||
border-radius: 4px;
|
||||
padding: 0;
|
||||
box-shadow: 0 1px 0px 0 rgba(255, 255, 255, 0.2);
|
||||
}
|
||||
.form-row {
|
||||
margin-top: 24px;
|
||||
}
|
||||
|
||||
/* Now the value part */
|
||||
progress::-webkit-progress-value {
|
||||
border-radius: 3px;
|
||||
box-shadow: inset 0 1px 1px 0 rgba(255, 255, 255, 0.4);
|
||||
background:
|
||||
-webkit-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),
|
||||
#A46497;
|
||||
transition: width 1s ease;
|
||||
}
|
||||
|
||||
&.woocommerce-exporter__exporting,
|
||||
&.woocommerce-importer__importing {
|
||||
.spinner {
|
||||
display: block;
|
||||
}
|
||||
progress {
|
||||
display: block;
|
||||
}
|
||||
.form-row-submit,
|
||||
.woocommerce-exporter-options,
|
||||
.woocommerce-importer-options {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.woocommerce-exporter-options th,
|
||||
.woocommerce-importer-options th {
|
||||
width: 30%;
|
||||
}
|
||||
|
||||
.woocommerce-exporter-options th,
|
||||
.woocommerce-exporter-options td {
|
||||
vertical-align: top;
|
||||
|
||||
label {
|
||||
color: #555;
|
||||
font-weight: normal;
|
||||
}
|
||||
}
|
||||
|
||||
progress {
|
||||
width: 100%;
|
||||
height: 42px;
|
||||
margin: 24px auto 24px;
|
||||
display: block;
|
||||
-webkit-appearance: none;
|
||||
border: none;
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* All good till now. Now we'll style the background */
|
||||
progress::-webkit-progress-bar {
|
||||
background: #f5f5f5;
|
||||
border: 2px solid #eee;
|
||||
border-radius: 4px;
|
||||
padding: 0;
|
||||
box-shadow: 0 1px 0px 0 rgba(255, 255, 255, 0.2);
|
||||
}
|
||||
|
||||
/* Now the value part */
|
||||
progress::-webkit-progress-value {
|
||||
border-radius: 3px;
|
||||
box-shadow: inset 0 1px 1px 0 rgba(255, 255, 255, 0.4);
|
||||
background:
|
||||
-webkit-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),
|
||||
#A46497;
|
||||
transition: width 1s ease;
|
||||
}
|
||||
|
||||
&.woocommerce-exporter__exporting,
|
||||
&.woocommerce-importer__importing {
|
||||
.spinner {
|
||||
display: block;
|
||||
}
|
||||
progress {
|
||||
display: block;
|
||||
}
|
||||
.wc-actions,
|
||||
.woocommerce-exporter-options {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -46,7 +46,7 @@ if ( ! defined( 'ABSPATH' ) ) {
|
|||
<?php endforeach; ?>
|
||||
</tbody>
|
||||
</table>
|
||||
<div class="wc-progress-form-actions">
|
||||
<div class="wc-actions">
|
||||
<input type="submit" class="button button-primary button-next" value="<?php esc_attr_e( 'Run the importer', 'woocommerce' ); ?>" name="save_step" />
|
||||
<input type="hidden" name="file" value="<?php echo esc_attr( $this->file ); ?>" />
|
||||
<input type="hidden" name="delimiter" value="<?php echo esc_attr( $this->delimiter ); ?>" />
|
||||
|
|
|
|||
|
|
@ -56,7 +56,7 @@ if ( ! defined( 'ABSPATH' ) ) {
|
|||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<div class="wc-progress-form-actions">
|
||||
<div class="wc-actions">
|
||||
<input type="submit" class="button button-primary button-next" value="<?php esc_attr_e( 'Continue', 'woocommerce' ); ?>" name="save_step" />
|
||||
<?php wp_nonce_field( 'woocommerce-csv-importer' ); ?>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -13,62 +13,64 @@ $exporter = new WC_Product_CSV_Exporter();
|
|||
<div class="wrap woocommerce">
|
||||
<h1><?php esc_html_e( 'Export Products', 'woocommerce' ); ?></h1>
|
||||
|
||||
<form class="woocommerce-exporter">
|
||||
<header>
|
||||
<span class="spinner is-active"></span>
|
||||
<h2><?php esc_html_e( 'Export products to a CSV file', 'woocommerce' ); ?></h2>
|
||||
<p><?php esc_html_e( 'This tool allows you to generate and download a CSV file containing a list of all products.', 'woocommerce' ); ?></p>
|
||||
</header>
|
||||
<div class="woocommerce-exporter-wrapper">
|
||||
<form class="woocommerce-exporter">
|
||||
<header>
|
||||
<span class="spinner is-active"></span>
|
||||
<h2><?php esc_html_e( 'Export products to a CSV file', 'woocommerce' ); ?></h2>
|
||||
<p><?php esc_html_e( 'This tool allows you to generate and download a CSV file containing a list of all products.', 'woocommerce' ); ?></p>
|
||||
</header>
|
||||
|
||||
<table class="form-table woocommerce-exporter-options">
|
||||
<tbody>
|
||||
<tr>
|
||||
<th scope="row">
|
||||
<label for="woocommerce-exporter-types"><?php esc_html_e( 'Which product types should be exported?', 'woocommerce' ); ?></label>
|
||||
</th>
|
||||
<td>
|
||||
<select id="woocommerce-exporter-types" class="woocommerce-exporter-types wc-enhanced-select" style="width:100%;" multiple data-placeholder="<?php esc_attr_e( 'Export all', 'woocommerce' ); ?>">
|
||||
<?php
|
||||
foreach ( wc_get_product_types() as $value => $label ) {
|
||||
echo '<option value="' . esc_attr( $value ) . '">' . esc_html( $label ) . '</option>';
|
||||
}
|
||||
?>
|
||||
<option value="variation"><?php esc_html_e( 'Product variations', 'woocommerce' ); ?></option>
|
||||
</select>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">
|
||||
<label for="woocommerce-exporter-columns"><?php esc_html_e( 'What product data should be exported?', 'woocommerce' ); ?></label>
|
||||
</th>
|
||||
<td>
|
||||
<select id="woocommerce-exporter-columns" class="woocommerce-exporter-columns wc-enhanced-select" style="width:100%;" multiple data-placeholder="<?php esc_attr_e( 'Export all data', 'woocommerce' ); ?>">
|
||||
<?php
|
||||
foreach ( $exporter->get_default_column_names() as $column_id => $column_name ) {
|
||||
echo '<option value="' . esc_attr( $column_id ) . '">' . esc_html( $column_name ) . '</option>';
|
||||
}
|
||||
?>
|
||||
<option value="downloads"><?php esc_html_e( 'Downloads', 'woocommerce' ); ?></option>
|
||||
<option value="attributes"><?php esc_html_e( 'Attributes', 'woocommerce' ); ?></option>
|
||||
</select>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">
|
||||
<label for="woocommerce-exporter-meta"><?php esc_html_e( 'Export custom meta data?', 'woocommerce' ); ?></label>
|
||||
</th>
|
||||
<td>
|
||||
<input type="checkbox" id="woocommerce-exporter-meta" value="1" />
|
||||
<label for="woocommerce-exporter-meta"><?php esc_html_e( 'Yes, export all meta data', 'woocommerce' ); ?></label>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<div class="form-row form-row-submit">
|
||||
<input type="submit" class="woocommerce-exporter-button button button-primary" value="<?php esc_attr_e( 'Generate CSV', 'woocommerce' ); ?>" />
|
||||
</div>
|
||||
<div>
|
||||
<progress class="woocommerce-exporter-progress" max="100" value="0"></progress>
|
||||
</div>
|
||||
</form>
|
||||
<table class="form-table woocommerce-exporter-options">
|
||||
<tbody>
|
||||
<tr>
|
||||
<th scope="row">
|
||||
<label for="woocommerce-exporter-types"><?php esc_html_e( 'Which product types should be exported?', 'woocommerce' ); ?></label>
|
||||
</th>
|
||||
<td>
|
||||
<select id="woocommerce-exporter-types" class="woocommerce-exporter-types wc-enhanced-select" style="width:100%;" multiple data-placeholder="<?php esc_attr_e( 'Export all', 'woocommerce' ); ?>">
|
||||
<?php
|
||||
foreach ( wc_get_product_types() as $value => $label ) {
|
||||
echo '<option value="' . esc_attr( $value ) . '">' . esc_html( $label ) . '</option>';
|
||||
}
|
||||
?>
|
||||
<option value="variation"><?php esc_html_e( 'Product variations', 'woocommerce' ); ?></option>
|
||||
</select>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">
|
||||
<label for="woocommerce-exporter-columns"><?php esc_html_e( 'What product data should be exported?', 'woocommerce' ); ?></label>
|
||||
</th>
|
||||
<td>
|
||||
<select id="woocommerce-exporter-columns" class="woocommerce-exporter-columns wc-enhanced-select" style="width:100%;" multiple data-placeholder="<?php esc_attr_e( 'Export all data', 'woocommerce' ); ?>">
|
||||
<?php
|
||||
foreach ( $exporter->get_default_column_names() as $column_id => $column_name ) {
|
||||
echo '<option value="' . esc_attr( $column_id ) . '">' . esc_html( $column_name ) . '</option>';
|
||||
}
|
||||
?>
|
||||
<option value="downloads"><?php esc_html_e( 'Downloads', 'woocommerce' ); ?></option>
|
||||
<option value="attributes"><?php esc_html_e( 'Attributes', 'woocommerce' ); ?></option>
|
||||
</select>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">
|
||||
<label for="woocommerce-exporter-meta"><?php esc_html_e( 'Export custom meta data?', 'woocommerce' ); ?></label>
|
||||
</th>
|
||||
<td>
|
||||
<input type="checkbox" id="woocommerce-exporter-meta" value="1" />
|
||||
<label for="woocommerce-exporter-meta"><?php esc_html_e( 'Yes, export all meta data', 'woocommerce' ); ?></label>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<div class="wc-actions">
|
||||
<input type="submit" class="woocommerce-exporter-button button button-primary" value="<?php esc_attr_e( 'Generate CSV', 'woocommerce' ); ?>" />
|
||||
</div>
|
||||
<div>
|
||||
<progress class="woocommerce-exporter-progress" max="100" value="0"></progress>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Reference in New Issue