mirror of
https://github.com/woocommerce/storefront.git
synced 2025-10-04 14:11:16 +08:00
added 'free' marker to appropriate child themes on welcome screen
ProShop / Galleria have ‘buy now’ buttons so it’s clear they are commercial products. Deli and Boutique just had ‘install now’ buttons though so there may have been confusion there.
This commit is contained in:
James Koster
parent
3fcb6749a1
commit
672938d703
3 changed files with 98 additions and 159 deletions
|
|
@ -1,7 +1,7 @@
|
|||
.storefront-add-ons {
|
||||
.appearance_page_storefront-welcome .storefront-add-ons {
|
||||
overflow: hidden;
|
||||
zoom: 1; }
|
||||
.storefront-add-ons .add-on {
|
||||
.appearance_page_storefront-welcome .storefront-add-ons .add-on {
|
||||
border: 1px solid #ddd;
|
||||
background: #f8f8f8;
|
||||
margin-bottom: 2.618em;
|
||||
|
|
@ -9,40 +9,50 @@
|
|||
clear: both;
|
||||
position: relative;
|
||||
min-height: 330px; }
|
||||
.storefront-add-ons .add-on .premium,
|
||||
.storefront-add-ons .add-on .free {
|
||||
background: #333;
|
||||
color: #fff;
|
||||
font-size: .618em;
|
||||
text-transform: uppercase;
|
||||
padding: 0.53em 1em;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0; }
|
||||
.storefront-add-ons .add-on .premium {
|
||||
background: #0074a2; }
|
||||
.storefront-add-ons .add-on h4 {
|
||||
.appearance_page_storefront-welcome .storefront-add-ons .add-on h4 {
|
||||
margin-top: 0;
|
||||
font-size: 1em;
|
||||
padding: 1.618em;
|
||||
line-height: 1.4;
|
||||
background: #fff;
|
||||
margin: 0; }
|
||||
.storefront-add-ons .add-on .content {
|
||||
.appearance_page_storefront-welcome .storefront-add-ons .add-on .content {
|
||||
padding: 1em 1.618em 1.618em 1.618em; }
|
||||
.storefront-add-ons .add-on .content p:last-child {
|
||||
.appearance_page_storefront-welcome .storefront-add-ons .add-on .content p:last-child {
|
||||
margin-bottom: 0; }
|
||||
.storefront-add-ons .add-on.activated {
|
||||
.appearance_page_storefront-welcome .storefront-add-ons .add-on.activated {
|
||||
border-color: #7ad03a;
|
||||
border-width: 2px; }
|
||||
.storefront-add-ons img {
|
||||
.appearance_page_storefront-welcome .storefront-add-ons img {
|
||||
padding: .618em;
|
||||
background: #fff;
|
||||
box-sizing: border-box; }
|
||||
|
||||
#getting_started .activated,
|
||||
#add_ons .activated,
|
||||
#child_themes .activated {
|
||||
.appearance_page_storefront-welcome .last-feature {
|
||||
margin-right: 0 !important; }
|
||||
|
||||
.appearance_page_storefront-welcome .panel {
|
||||
width: 30.75%;
|
||||
float: left;
|
||||
margin-right: 3.8%; }
|
||||
.appearance_page_storefront-welcome .panel#child_themes {
|
||||
margin-right: 0; }
|
||||
.appearance_page_storefront-welcome .panel hr {
|
||||
margin: 2.618em 0; }
|
||||
|
||||
.appearance_page_storefront-welcome #who {
|
||||
clear: both; }
|
||||
|
||||
.appearance_page_storefront-welcome .free {
|
||||
text-transform: uppercase;
|
||||
font-size: 90%;
|
||||
color: #fff;
|
||||
background: #333;
|
||||
display: inline-block;
|
||||
padding: 2px 6px;
|
||||
float: right; }
|
||||
|
||||
.appearance_page_storefront-welcome .activated {
|
||||
background: #7ad03a;
|
||||
color: #fff;
|
||||
font-size: 13px;
|
||||
|
|
@ -52,44 +62,5 @@
|
|||
padding: 0 10px 1px;
|
||||
display: inline-block;
|
||||
border-radius: 3px; }
|
||||
#getting_started .activated span,
|
||||
#add_ons .activated span,
|
||||
#child_themes .activated span {
|
||||
.appearance_page_storefront-welcome .activated span {
|
||||
line-height: 26px; }
|
||||
|
||||
#getting_started hr,
|
||||
#add_ons hr,
|
||||
#child_themes hr {
|
||||
margin: 2.618em 0; }
|
||||
|
||||
.last-feature {
|
||||
margin-right: 0 !important; }
|
||||
|
||||
.panel {
|
||||
width: 30.75%;
|
||||
float: left;
|
||||
margin-right: 3.8%; }
|
||||
.panel#child_themes {
|
||||
margin-right: 0; }
|
||||
|
||||
#who {
|
||||
clear: both; }
|
||||
|
||||
.about-wrap h2 .nav-tab {
|
||||
margin-bottom: 0; }
|
||||
|
||||
.about-wrap h2 .nav-tab-active,
|
||||
.about-wrap h2 .nav-tab-active:hover {
|
||||
border-bottom: 0; }
|
||||
|
||||
.about-wrap h2 .nav-tab-active {
|
||||
position: relative; }
|
||||
.about-wrap h2 .nav-tab-active:after {
|
||||
content: "";
|
||||
display: block;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
bottom: -2px;
|
||||
height: 2px;
|
||||
left: 0;
|
||||
background: #f1f1f1; }
|
||||
|
|
|
|||
|
|
@ -1,65 +1,79 @@
|
|||
.storefront-add-ons {
|
||||
overflow: hidden;
|
||||
zoom: 1;
|
||||
.appearance_page_storefront-welcome {
|
||||
.storefront-add-ons {
|
||||
overflow: hidden;
|
||||
zoom: 1;
|
||||
|
||||
.add-on {
|
||||
border: 1px solid #ddd;
|
||||
background: #f8f8f8;
|
||||
margin-bottom: 2.618em;
|
||||
box-shadow: 0 1px 2px rgba(0,0,0,.05);
|
||||
clear: both;
|
||||
position: relative;
|
||||
min-height: 330px;
|
||||
.add-on {
|
||||
border: 1px solid #ddd;
|
||||
background: #f8f8f8;
|
||||
margin-bottom: 2.618em;
|
||||
box-shadow: 0 1px 2px rgba(0,0,0,.05);
|
||||
clear: both;
|
||||
position: relative;
|
||||
min-height: 330px;
|
||||
|
||||
.premium,
|
||||
.free {
|
||||
background: #333;
|
||||
color: #fff;
|
||||
font-size: .618em;
|
||||
text-transform: uppercase;
|
||||
padding: .53em 1em;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
}
|
||||
h4 {
|
||||
margin-top: 0;
|
||||
font-size: 1em;
|
||||
padding: 1.618em;
|
||||
line-height: 1.4;
|
||||
background: #fff;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.premium {
|
||||
background: #0074a2;
|
||||
}
|
||||
.content {
|
||||
padding: 1em 1.618em 1.618em 1.618em;
|
||||
|
||||
h4 {
|
||||
margin-top: 0;
|
||||
font-size: 1em;
|
||||
padding: 1.618em;
|
||||
line-height: 1.4;
|
||||
background: #fff;
|
||||
margin: 0;
|
||||
}
|
||||
p:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.content {
|
||||
padding: 1em 1.618em 1.618em 1.618em;
|
||||
|
||||
p:last-child {
|
||||
margin-bottom: 0;
|
||||
&.activated {
|
||||
border-color: #7ad03a;
|
||||
border-width: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
&.activated {
|
||||
border-color: #7ad03a;
|
||||
border-width: 2px;
|
||||
img {
|
||||
padding: .618em;
|
||||
background: #fff;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
}
|
||||
|
||||
img {
|
||||
padding: .618em;
|
||||
background: #fff;
|
||||
box-sizing: border-box;
|
||||
.last-feature {
|
||||
margin-right: 0 !important;
|
||||
}
|
||||
|
||||
.panel {
|
||||
width: 30.75%;
|
||||
float: left;
|
||||
margin-right: 3.8%;
|
||||
|
||||
&#child_themes {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
hr {
|
||||
margin: 2.618em 0;
|
||||
}
|
||||
}
|
||||
|
||||
#who {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.free {
|
||||
text-transform: uppercase;
|
||||
font-size: 90%;
|
||||
color: #fff;
|
||||
background: #333;
|
||||
display: inline-block;
|
||||
padding: 2px 6px;
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
|
||||
#getting_started,
|
||||
#add_ons,
|
||||
#child_themes {
|
||||
.activated {
|
||||
background: #7ad03a;
|
||||
color: #fff;
|
||||
|
|
@ -75,52 +89,4 @@
|
|||
line-height: 26px;
|
||||
}
|
||||
}
|
||||
|
||||
hr {
|
||||
margin: 2.618em 0;
|
||||
}
|
||||
}
|
||||
|
||||
.last-feature {
|
||||
margin-right: 0 !important;
|
||||
}
|
||||
|
||||
.panel {
|
||||
width: 30.75%;
|
||||
float: left;
|
||||
margin-right: 3.8%;
|
||||
|
||||
&#child_themes {
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
#who {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.about-wrap h2 {
|
||||
.nav-tab {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.nav-tab-active,
|
||||
.nav-tab-active:hover {
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
.nav-tab-active {
|
||||
position: relative;
|
||||
|
||||
&:after {
|
||||
content: "";
|
||||
display: block;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
bottom: -2px;
|
||||
height: 2px;
|
||||
left: 0;
|
||||
background: #f1f1f1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -39,6 +39,7 @@
|
|||
<hr />
|
||||
|
||||
<img src="<?php echo esc_url( get_template_directory_uri() ) . '/inc/admin/welcome-screen/img/boutique.jpg'; ?>" alt="<?php esc_html_e( 'Boutique Child Theme', 'storefront' ); ?>" class="image-50" />
|
||||
<p class="free"><?php esc_html_e( 'Free!', 'storefront' ); ?></p>
|
||||
<h4><?php esc_html_e( 'Boutique', 'storefront' ); ?></h4>
|
||||
<p><?php esc_html_e( 'Boutique is a simple, traditionally designed Storefront child theme, ideal for small stores or boutiques. Add your logo, create a unique color scheme and start selling!', 'storefront' ); ?></p>
|
||||
<p style="margin-bottom: 2.618em;">
|
||||
|
|
@ -51,6 +52,7 @@
|
|||
<hr />
|
||||
|
||||
<img src="<?php echo esc_url( get_template_directory_uri() ) . '/inc/admin/welcome-screen/img/deli.jpg'; ?>" alt="<?php esc_html_e( 'Deli Child Theme', 'storefront' ); ?>" class="image-50" />
|
||||
<p class="free"><?php esc_html_e( 'Free!', 'storefront' ); ?></p>
|
||||
<h4><?php esc_html_e( 'Deli', 'storefront' ); ?></h4>
|
||||
<p><?php esc_html_e( 'Deli features a texturised, earthy design, perfect for stores selling natural, organic or hand made goods.', 'storefront' ); ?></p>
|
||||
<p style="margin-bottom: 2.618em;">
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue
