Skip to content

Commit 3abb620

Browse files
jazzsequencejazzsequence
authored
Merge pull request #40 from jazzsequence/css-grid
Update styling
2 parents 798cbf7 + 32381b2 commit 3abb620

File tree

5 files changed

+136
-111
lines changed

5 files changed

+136
-111
lines changed

‎README.md‎

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
11
# Recipe Box #
22
**Contributors:** [Chris Reynolds](https://chrisreynolds.io)
33
**Donate link:** https://paypal.me/jazzsequence
4-
**Tags:**
4+
55
**Requires at least:** 4.4
66
**Tested up to:** 4.8
7-
**Stable tag:** 0.3.1
7+
**Stable tag:** 0.3.2
88
**License:** GPLv3
9-
**License URI:** http://www.gnu.org/licenses/gpl-3.0.html
9+
**License URI:** http://www.gnu.org/licenses/gpl-3.0.html
1010

1111
## Description ##
1212

@@ -27,6 +27,9 @@ Easily store and publish recipes in WordPress.
2727

2828
## Changelog ##
2929

30+
### 0.3.2 ###
31+
* fixes styling bugs from Gutenberg update
32+
3033
### 0.3.1 ###
3134
* added support for [Slack](https://wordpress.org/plugins/slack/) plugin to allow recipes to post to Slack.
3235
* fixed a javascript bug (props [@igmoweb](https://github.com/igmoweb)).
@@ -44,7 +47,7 @@ Easily store and publish recipes in WordPress.
4447
* hooked all the things
4548
* added preheat temperature
4649
* removed tgm plugin activation for REST API now that API is in core
47-
*
50+
*
4851

4952
### 0.1 ###
5053
* First release

‎assets/css/recipes.css‎

Lines changed: 106 additions & 94 deletions
Original file line numberDiff line numberDiff line change
@@ -14,38 +14,100 @@ html {
1414
border: none;
1515
}
1616

17-
.post-type-rb_recipe .cmb2-wrap.ingredients .cmb-repeatable-group .cmb-field-list .cmb-th {
18-
float: none;
19-
margin-bottom: 0.75rem;
20-
width: 100%;
17+
/**
18+
* Recipe Information Grid
19+
*/
20+
.recipe-meta .cmb2-metabox {
21+
display: grid;
22+
grid-template-columns: repeat( 3, 1fr );
23+
grid-template-areas:
24+
"servings servings servings"
25+
"prep cook total"
26+
"preheat preheat preheat";
27+
grid-gap: 1rem;
28+
}
29+
30+
.cmb2-id--rb-servings {
31+
grid-area: "servings";
32+
grid-column: span 3;
33+
}
34+
35+
.cmb2-id--rb-prep-time {
36+
grid-area: "prep";
37+
}
38+
39+
.cmb2-id--rb-cook-time {
40+
grid-area: "cook";
41+
}
42+
43+
.cmb2-id--rb-total-time {
44+
grid-area: "total";
2145
}
2246

23-
.post-type-rb_recipe .cmb2-wrap.ingredients .cmb-repeatable-group .cmb-field-list .cmb-th label {
47+
.cmb2-id--rb-preheat-group {
48+
grid-column: span 3;
49+
}
50+
51+
.cmb2-id--rb-preheat-group .cmb-field-list.inside {
52+
display: grid;
53+
grid-template-columns: repeat( 2, 1fr );
54+
}
55+
56+
.cmb2-id--rb-preheat-group-0--rb-preheat-temp {
57+
grid-column-start: 1;
58+
}
59+
60+
.cmb2-id--rb-preheat-group-0--rb-preheat-unit {
61+
grid-column-start: 2;
62+
}
63+
64+
/**
65+
* Reset CMB2 styles
66+
*/
67+
.cmb2-id--rb-preheat-group,
68+
.postbox-container .cmb2-wrap > .cmb-field-list > .cmb-row.cmb2-id--rb-preheat-group,
69+
.postbox-container .cmb2-id--rb-preheat-group .cmb-repeatable-grouping,
70+
.postbox-container .cmb2-id--rb-preheat-group .cmb-repeatable-grouping .inside,
71+
.postbox-container .cmb-row.cmb2-id--rb-preheat-group-0--rb-preheat-temp,
72+
.postbox-container .cmb-row.cmb2-id--rb-preheat-group-0--rb-preheat-unit,
73+
.postbox-container .cmb2-wrap > .cmb-field-list > .cmb-row.cmb2-id--rb-prep-time,
74+
.postbox-container .cmb2-wrap > .cmb-field-list > .cmb-row.cmb2-id--rb-cook-time,
75+
.postbox-container .cmb2-wrap > .cmb-field-list > .cmb-row.cmb2-id--rb-total-time,
76+
.post-type-rb_recipe .cmb2-wrap.ingredients .cmb-repeatable-group .cmb-field-list .cmb-row {
2477
margin: 0;
2578
padding: 0;
26-
width: 100%;
2779
}
2880

29-
.post-type-rb_recipe .cmb2-wrap.ingredients .cmb-repeatable-group .cmb-field-list .cmb-td {
30-
float: none;
81+
.cmb2-id--rb-prep-time .cmb-th,
82+
.cmb2-id--rb-prep-time .cmb-th + .cmb-td,
83+
.cmb2-id--rb-cook-time .cmb-th,
84+
.cmb2-id--rb-cook-time .cmb-th + .cmb-td,
85+
.cmb2-id--rb-total-time .cmb-th,
86+
.cmb2-id--rb-total-time .cmb-th + .cmb-td,
87+
.cmb2-id--rb-preheat-group-0--rb-preheat-temp .cmb-th,
88+
.cmb2-id--rb-preheat-group-0--rb-preheat-temp .cmb-th + .cmb-td,
89+
.cmb2-id--rb-preheat-group-0--rb-preheat-unit .cmb-th,
90+
.cmb2-id--rb-preheat-group-0--rb-preheat-unit .cmb-th + .cmb-td,
91+
.ingredients .postbox.cmb-repeatable-grouping .cmb-td.inside .cmb-th,
92+
.ingredients .postbox.cmb-repeatable-grouping .cmb-td.inside .cmb-td {
3193
width: 100%;
94+
float: none;
95+
text-align: center;
3296
}
3397

34-
.post-type-rb_recipe .cmb2-wrap.ingredients .cmb-repeatable-group .cmb-field-list .cmb-td .cmb2-text-small,
35-
.post-type-rb_recipe .cmb2-wrap.ingredients .cmb-repeatable-group .cmb-field-list .cmb-td .cmb2_select {
36-
margin-bottom: 0.75rem;
37-
width: 100%;
98+
.postbox-container .cmb-row.cmb2-id--rb-prep-time,
99+
.postbox-container .cmb-row.cmb2-id--rb-cook-time,
100+
.postbox-container .cmb-row.cmb2-id--rb-total-time,
101+
.postbox-container .cmb-row.cmb2-id--rb-preheat-group-0--rb-preheat-temp {
102+
border-bottom: none;
38103
}
39104

40-
.post-type-rb_recipe .cmb2-wrap.ingredients .cmb-repeatable-group .cmb-field-list .cmb-td .cmb2-product-search-button {
41-
height: 2.25rem;
42-
width: 2.25rem;
105+
.cmb2-id--rb-preheat-group .postbox {
106+
box-shadow: none;
43107
}
44108

45-
.post-type-rb_recipe .cmb2-wrap.ingredients .cmb-repeatable-group .cmb-field-list .cmb-td .cmb2-metabox-description {
46-
display: block;
47-
margin: 0.75rem 0 0;
48-
padding: 0;
109+
.cmb2-id--rb-preheat-group {
110+
margin-bottom: 2rem;
49111
}
50112

51113
.post-type-rb_recipe .cmb2-wrap.ingredients .cmb-repeatable-group .cmb-field-list .cmb-remove-field-row:before {
@@ -61,95 +123,45 @@ html {
61123
display: table;
62124
}
63125

64-
.post-type-rb_recipe .cmb2-wrap.ingredients .cmb-repeatable-group .cmb-field-list .cmb-remove-field-row .cmb-remove-row .cmb-shift-rows {
65-
float: none;
66-
padding: 0.125rem 0.25rem;
126+
.cmb2-metabox-description .extended-description {
127+
display: block;
128+
margin-top: .5rem;
67129
}
68130

69-
.post-type-rb_recipe .cmb2-wrap.ingredients .cmb-repeatable-group .cmb-field-list .cmb-remove-field-row .cmb-remove-row .cmb-remove-group-row {
70-
float: none;
71-
padding: 0.125rem 0.25rem;
131+
.postbox-container .cmb2-wrap > .cmb-field-list > .cmb-row.cmb2-id--rb-preheat-group {
132+
margin-bottom: 1rem;
72133
}
73134

74135
/**
75-
* Options page.
136+
* Ingredients Grid
76137
*/
77-
.rb_recipe_page_recipe_box_options #recipe_box_options_metabox .cmb2-id-recipes-with-blog .cmb-td {
78-
width: 75%;
138+
.ingredients .postbox.cmb-repeatable-grouping .cmb-td.inside {
139+
display: grid;
140+
grid-template-columns: repeat( 4, 1fr );
141+
grid-gap: 1rem;
79142
}
80143

81-
/**
82-
* Preheat Temperature styles.
83-
*/
84-
@media screen and (min-width: 64rem) {
85-
#_rb_preheat_group_repeat .cmb-row {
86-
padding: 0;
87-
margin: 0;
88-
border: none;
89-
}
90-
91-
#_rb_preheat_group_repeat .cmbhandle, #_rb_preheat_group_repeat .cmbhandle-title {
92-
display: none;
93-
}
94-
95-
#_rb_preheat_group_repeat .cmb-row.cmb-type-text-small.cmb2-id--rb-preheat-group-0--rb-preheat-temp.cmb-repeat-group-field {
96-
width: 48%;
97-
float: left;
98-
}
99-
100-
.cmb-row.cmb-type-select.cmb2-id--rb-preheat-group-0--rb-preheat-unit.cmb-repeat-group-field {
101-
width: 48%;
102-
float: right;
103-
}
144+
.ingredients .cmb-type-text-small .cmb2-metabox-description {
145+
display: block;
146+
}
104147

105-
.cmb2-id--rb-preheat-group-0--rb-preheat-temp.cmb-row .cmb-th {
106-
width: 60%;
107-
}
148+
.ingredients button.cmb-remove-group-row.alignright {
149+
float: left;
150+
text-align: left;
151+
}
108152

109-
.cmb2-id--rb-preheat-group-0--rb-preheat-temp.cmb-row .cmb-td {
110-
width: 40%;
111-
}
153+
/**
154+
* Options page.
155+
*/
156+
.rb_recipe_page_recipe_box_options #recipe_box_options_metabox .cmb2-id-recipes-with-blog .cmb-td {
157+
width: 75%;
112158
}
113159

114160
/**
115-
* Responsive Action Row
161+
* Preheat Temperature styles.
116162
*/
117-
@media screen and ( max-width: 1170px ) {
118-
a.button.cmb-shift-rows.alignleft {
119-
height: 1.7rem;
120-
}
121-
122-
.post-type-rb_recipe .cmb2-wrap.ingredients .cmb-repeatable-group .cmb-field-list .cmb-row.cmb-remove-field-row {
123-
float: right;
124-
}
125-
}
126-
127-
@media screen and (min-width: 64rem) {
128-
129-
.post-type-rb_recipe .cmb2-wrap.ingredients .cmb-repeatable-group .cmb-field-list .cmb-row {
130-
float: left;
131-
display: block;
132-
margin-right: 2.35765%;
133-
width: 23.23176%;
134-
}
135-
136-
.post-type-rb_recipe .cmb2-wrap.ingredients .cmb-repeatable-group .cmb-field-list .cmb-row:last-child,
137-
.post-type-rb_recipe .cmb2-wrap.ingredients .cmb-repeatable-group .cmb-field-list .cmb-remove-field-row
138-
{
139-
margin-right: 0;
140-
}
141-
142-
.post-type-rb_recipe .cmb2-wrap.ingredients .cmb-repeatable-group .cmb-field-list .notes-parent {
143-
padding-top: 0;
144-
width: 100%;
145-
}
146-
.post-type-rb_recipe .cmb2-wrap.ingredients .cmb-repeatable-group .cmb-field-list input.notes {
147-
width: 100%;
148-
}
149-
150-
.post-type-rb_recipe .cmb-remove-field-row .cmb-remove-row {
151-
text-align: left;
152-
}
163+
#_rb_preheat_group_repeat .cmbhandle, #_rb_preheat_group_repeat .cmbhandle-title {
164+
display: none;
153165
}
154166

155167
/**

‎assets/css/recipes.min.css‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎includes/class-recipe.php‎

Lines changed: 18 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -199,21 +199,36 @@ private function recipe_meta( $prefix ) {
199199
'name' => __( 'Preparation Time', 'recipe-box' ),
200200
'id' => $prefix . 'prep_time',
201201
'type' => 'text_small',
202-
'desc' => __( 'minutes<br>Time to prepare the recipe.', 'recipe-box' ),
202+
'desc' => __( 'minutes', 'recipe-box' ) .
203+
// 1: opening div tag, 2: closing div tag.
204+
sprintf( __( '%1$sTime to prepare the recipe.%2$s', 'recipe-box' ),
205+
'<div class="extended-description">',
206+
'</div>'
207+
),
203208
) );
204209

205210
$cmb->add_field( array(
206211
'name' => __( 'Cook Time', 'recipe-box' ),
207212
'id' => $prefix . 'cook_time',
208213
'type' => 'text_small',
209-
'desc' => __( 'minutes<br>Time to cook the recipe.', 'recipe-box' ),
214+
'desc' => __( 'minutes', 'recipe-box' ) .
215+
// 1: opening div tag, 2: closing div tag.
216+
sprintf( __( '%1$sTime to cook the recipe.%2$s', 'recipe-box' ),
217+
'<div class="extended-description">',
218+
'</div>'
219+
)
210220
) );
211221

212222
$cmb->add_field( array(
213223
'name' => __( 'Total Time (optional)', 'recipe-box' ),
214224
'id' => $prefix . 'total_time',
215225
'type' => 'text_small',
216-
'desc' => __( 'minutes<br>The total time to prepare the recipe. (Defaults to Prep Time + Cook Time. Change if that is not accurate.)', 'recipe-box' ),
226+
'desc' => __( 'minutes', 'recipe-box' ) .
227+
sprintf( __( '%1$sThe total time to prepare the recipe. (Defaults to Prep Time + Cook Time. Change if that is not accurate.)%2$s', 'recipe-box' ),
228+
// 1: opening div tag, 2: closing div tag.
229+
'<div class="extended-description">',
230+
'</div>'
231+
),
217232
'default' => ( $post_id ) ? $this->get_total_time( $post_id ) : '',
218233
) );
219234

‎recipe-box.php‎

Lines changed: 4 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
* Plugin Name: Recipe Box
44
* Plugin URI: https://jazzsequence.com
55
* Description: Easily store and publish recipes in WordPress.
6-
* Version: 0.3.1
6+
* Version: 0.3.2
77
* Author: Chris Reynolds
88
* Author URI: https://jazzsequence.com
99
* Donate link: https://jazzsequence.com
@@ -14,11 +14,11 @@
1414
* @link https://jazzsequence.com
1515
*
1616
* @package Recipe Box
17-
* @version 0.3
17+
* @version 0.3.2
1818
*/
1919

2020
/**
21-
* Copyright (c) 2016 Chris Reynolds (email : [email protected])
21+
* Copyright (c) 2019 Chris Reynolds (email : [email protected])
2222
*
2323
* This program is free software; you can redistribute it and/or modify
2424
* it under the terms of the GNU General Public License, version 2 or, at
@@ -35,11 +35,6 @@
3535
* Foundation, Inc., 51 Franklin St, Fifth Floor, Boston, MA 02110-1301 USA
3636
*/
3737

38-
/**
39-
* Built using generator-plugin-wp
40-
*/
41-
42-
4338
/**
4439
* Autoloads files with classes when needed
4540
*
@@ -73,7 +68,7 @@ final class Recipe_Box {
7368
* @var string
7469
* @since 0.1
7570
*/
76-
const VERSION = '0.3';
71+
const VERSION = '0.3.2';
7772

7873
/**
7974
* URL of plugin directory

0 commit comments

Comments
 (0)