woocommerce/storefront
2
0
Fork 0
mirror of https://github.com/woocommerce/storefront.git synced 2025-08-20 04:00:29 +08:00
Code Issues Packages Wiki Activity Actions

various color / style tweaks

Browse source 
* Default bg color is now white
* All images have a small border radius
* Embeds now also use source sans
This commit is contained in:
James Koster 2016-04-15 10:10:20 +01:00
parent ab58343d58
commit 83aca2b6b9
7 changed files with 29 additions and 27 deletions
Download patch file Download diff file Expand all files Collapse all files

1
assets/sass/components/_comments.scss
View file

@ -28,7 +28,6 @@
.avatar {
margin-bottom: 1em;
max-width: 64px;
border-radius: 3px;
height: auto;
}

1
assets/sass/components/_content.scss
View file

@ -74,7 +74,6 @@
.avatar {
width: 64px;
margin-bottom: 1em;
border-radius: 3px;
}
}

5
assets/sass/components/_media.scss
View file

@ -2,6 +2,10 @@
* Media
*/
img {
border-radius: 3px;
}
.page-content,
.entry-content,
.comment-content {
@ -11,6 +15,7 @@
margin-top: 0;
padding: 0;
display: inline-block;
border-radius: 0;
}
}

4
assets/sass/utils/_variables.scss
View file

@ -7,8 +7,8 @@ $base-font: "Source Sans Pro", "HelveticaNeue-Light", "Helvetica Neue Light",
$header-font: $base-font;
// base color scheme
$body-background: #f5f5f5;
$color_body: #60646c;
$body-background: #ffffff;
$color_body: #43454b;
$color_links: #2c2d33;
$color_border: rgba(0,0,0,0.05);
$error: #e2401c;

2
assets/sass/woocommerce/woocommerce.scss
View file

@ -339,7 +339,6 @@ ul.products {
img {
display: block;
margin: 0 auto 1.618em;
border-radius: 2px;
}
&.product-category {
@ -561,7 +560,6 @@ a.reset_variations {
float: right;
width: 2.618em;
height: auto;
border-radius: 3px;
}
p.meta {

25
inc/class-storefront.php
View file

@ -103,7 +103,7 @@ if ( ! class_exists( 'Storefront' ) ) :
// Setup the WordPress core custom background feature.
add_theme_support( 'custom-background', apply_filters( 'storefront_custom_background_args', array(
'default-color' => apply_filters( 'storefront_default_background_color', 'f5f5f5' ),
'default-color' => apply_filters( 'storefront_default_background_color', 'ffffff' ),
'default-image' => '',
) ) );
@ -181,11 +181,11 @@ if ( ! class_exists( 'Storefront' ) ) :
* Fonts
*/
$google_fonts = apply_filters( 'storefront_google_font_families', array(
'roboto' => 'Source+Sans+Pro:400,300,300italic,400italic,700,700italic,900,900italic',
'source-sans-pro' => 'Source+Sans+Pro:400,300,300italic,400italic,700,900',
) );
$query_args = array(
'family' => urlencode( implode( '|', $google_fonts ) ),
'family' => implode( '|', $google_fonts ),
'subset' => urlencode( 'latin,latin-ext' ),
);
@ -268,27 +268,28 @@ if ( ! class_exists( 'Storefront' ) ) :
* Add styles for embeds
*/
public function print_embed_styles() {
wp_enqueue_style( 'roboto', '//fonts.googleapis.com/css?family=Roboto:400,300,300italic,400italic,700,700italic,900,900italic' );
$accent_color = get_theme_mod( 'storefront_accent_color' );
wp_enqueue_style( 'source-sans-pro', '//fonts.googleapis.com/css?family=Source+Sans+Pro:400,300,300italic,400italic,700,900' );
$accent_color = get_theme_mod( 'storefront_accent_color' );
$background_color = storefront_get_content_background_color();
?>
<style type="text/css">
.wp-embed {
padding: 2.618em !important;
border: 0 !important;
border-radius: 2px;
font-family: "Roboto", "Open Sans", sans-serif !important;
border-radius: 3px !important;
font-family: "Source Sans Pro", "Open Sans", sans-serif !important;
-webkit-font-smoothing: antialiased;
background-color: <?php echo storefront_adjust_color_brightness( $background_color, -7 ); ?> !important;
}
.wp-embed .wp-embed-featured-image {
margin-bottom: 2.618em;
}
.wp-embed .wp-embed-featured-image img {
border-radius: 2px 2px 0 0;
margin: -2.618em;
margin-bottom: 0;
width: calc( 100% + 5.236em );
.wp-embed .wp-embed-featured-image img,
.wp-embed .wp-embed-featured-image.square {
min-width: 100%;
margin-bottom: .618em;
}
a.wc-embed-button {

18
inc/customizer/class-storefront-customizer.php
View file

@ -44,7 +44,7 @@ if ( ! class_exists( 'Storefront_Customizer' ) ) :
public static function get_storefront_default_setting_values() {
return apply_filters( 'storefront_setting_default_values', $args = array(
'storefront_heading_color' => '#484c51',
'storefront_text_color' => '#60646c',
'storefront_text_color' => '#43454b',
'storefront_accent_color' => '#96588a',
'storefront_header_background_color' => '#2c2d33',
'storefront_header_text_color' => '#9aa0a7',
@ -58,7 +58,7 @@ if ( ! class_exists( 'Storefront_Customizer' ) ) :
'storefront_button_alt_background_color' => '#60646c',
'storefront_button_alt_text_color' => '#ffffff',
'storefront_layout' => 'right',
'background_color' => '#f5f5f5',
'background_color' => '#ffffff',
) );
}
@ -154,7 +154,7 @@ if ( ! class_exists( 'Storefront_Customizer' ) ) :
* Text Color
*/
$wp_customize->add_setting( 'storefront_text_color', array(
'default' => apply_filters( 'storefront_default_text_color', '#60646c' ),
'default' => apply_filters( 'storefront_default_text_color', '#43454b' ),
'sanitize_callback' => 'sanitize_hex_color',
'transport' => 'postMessage',
) );
@ -490,15 +490,15 @@ if ( ! class_exists( 'Storefront_Customizer' ) ) :
}
table th {
background-color: ' . storefront_adjust_color_brightness( $storefront_theme_mods['background_color'], 7 ) . ';
background-color: ' . storefront_adjust_color_brightness( $storefront_theme_mods['background_color'], -7 ) . ';
}
table tbody td {
background-color: ' . storefront_adjust_color_brightness( $storefront_theme_mods['background_color'], 2 ) . ';
background-color: ' . storefront_adjust_color_brightness( $storefront_theme_mods['background_color'], -2 ) . ';
}
table tbody tr:nth-child(2n) td {
background-color: ' . storefront_adjust_color_brightness( $storefront_theme_mods['background_color'], 4 ) . ';
background-color: ' . storefront_adjust_color_brightness( $storefront_theme_mods['background_color'], -4 ) . ';
}
.site-header,
@ -614,11 +614,11 @@ if ( ! class_exists( 'Storefront_Customizer' ) ) :
}
#payment .payment_methods li {
background-color: ' . storefront_adjust_color_brightness( $storefront_theme_mods['background_color'], 5 ) . ';
background-color: ' . storefront_adjust_color_brightness( $storefront_theme_mods['background_color'], -5 ) . ';
}
#payment .payment_methods li:hover {
background-color: ' . storefront_adjust_color_brightness( $storefront_theme_mods['background_color'], 10 ) . ';
background-color: ' . storefront_adjust_color_brightness( $storefront_theme_mods['background_color'], -10 ) . ';
}
@media screen and ( min-width: 768px ) {
@ -694,7 +694,7 @@ if ( ! class_exists( 'Storefront_Customizer' ) ) :
}
.woocommerce-breadcrumb {
background-color: ' . storefront_adjust_color_brightness( $storefront_theme_mods['background_color'], 7 ) . ';
background-color: ' . storefront_adjust_color_brightness( $storefront_theme_mods['background_color'], -7 ) . ';
}
.order_details {