Skip to content

Commit 7d71b3a

Browse files
inc2734inc2734
committed
Fix #5 
1 parent b44a717 commit 7d71b3a

File tree

7 files changed

+197
-7
lines changed

7 files changed

+197
-7
lines changed

‎block/faq/_block.scss‎

Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
.smacb-faq {
2+
&__item {
3+
border-bottom: 1px solid _lighter($_color-gray);
4+
@include _padding(1, 0);
5+
6+
&:first-child {
7+
border-top: 1px solid _lighter($_color-gray);
8+
}
9+
10+
&__question,
11+
&__answer {
12+
position: relative;
13+
@include _padding-left(1.25);
14+
15+
&::before {
16+
position: absolute;
17+
top: 0;
18+
left: 0;
19+
display: block;
20+
@include _font-size($_base-font-size-px * 1.5);
21+
line-height: 1;
22+
font-weight: normal;
23+
color: $color-accent;
24+
}
25+
}
26+
27+
&__question {
28+
@include _margin(0, 0, 1);
29+
font-weight: bold;
30+
31+
&::before {
32+
content: 'Q';
33+
}
34+
}
35+
36+
&__answer {
37+
&::before {
38+
content: 'A';
39+
}
40+
}
41+
}
42+
}

‎block/faq/block.js‎

Lines changed: 113 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,113 @@
1+
'use strict';
2+
3+
const { get, times } = lodash;
4+
const { registerBlockType } = wp.blocks;
5+
const { RichText, InspectorControls } = wp.editor;
6+
const { PanelBody, RangeControl } = wp.components;
7+
const { Fragment } = wp.element;
8+
const { __, sprintf } = wp.i18n;
9+
10+
registerBlockType('snow-monkey-awesome-custom-blocks/faq', {
11+
title: __('FAQ', 'snow-monkey-awesome-custom-blocks'),
12+
icon: 'businessman',
13+
category: 'smacb',
14+
attributes: {
15+
content: {
16+
type: 'array',
17+
default: [
18+
{
19+
question: [],
20+
answer: [],
21+
}
22+
],
23+
},
24+
rows: {
25+
type: 'number',
26+
default: 1,
27+
},
28+
},
29+
30+
edit({ attributes, setAttributes, isSelected }) {
31+
const { rows, content } = attributes;
32+
33+
const generateUpdatedAttribute = (parent, index, attribute, value) => {
34+
let newParent = [...parent];
35+
newParent[ index ] = get(newParent, index, {});
36+
newParent[ index ][ attribute ] = value;
37+
return newParent;
38+
}
39+
40+
return (
41+
<Fragment>
42+
<InspectorControls>
43+
<PanelBody title={ __('FAQ Settings', 'snow-monkey-awesome-custom-blocks') }>
44+
<RangeControl
45+
label={ __('Rows', 'snow-monkey-awesome-custom-blocks') }
46+
value={ rows }
47+
onChange={ value => setAttributes({ rows: value }) }
48+
min="1"
49+
max="50"
50+
/>
51+
</PanelBody>
52+
</InspectorControls>
53+
54+
<div className="smacb-faq">
55+
<div className="smacb-faq__body">
56+
{ times(rows, (index) => {
57+
const question = get(content, [index, 'question'], []);
58+
const answer = get(content, [index, 'answer'], []);
59+
60+
return (
61+
<div className="smacb-faq__item">
62+
<RichText
63+
className="smacb-faq__item__question"
64+
placeholder={ __('Write question…', 'snow-monkey-awesome-custom-blocks') }
65+
value={ question }
66+
formattingControls={ [] }
67+
multiline={ false }
68+
onChange={ value => setAttributes({ content: generateUpdatedAttribute(content, index, 'question', value) }) }
69+
/>
70+
71+
<RichText
72+
className="smacb-faq__item__answer"
73+
placeholder={ __('Write answer…', 'snow-monkey-awesome-custom-blocks') }
74+
value={ answer }
75+
formattingControls={ [] }
76+
multiline="p"
77+
onChange={ value => setAttributes({ content: generateUpdatedAttribute(content, index, 'answer', value) }) }
78+
/>
79+
</div>
80+
);
81+
} ) }
82+
</div>
83+
</div>
84+
</Fragment>
85+
);
86+
},
87+
88+
save({ attributes }) {
89+
const { rows, content } = attributes;
90+
91+
return (
92+
<div className="smacb-faq">
93+
<div className="smacb-faq__body">
94+
{ times(rows, (index) => {
95+
const question = get(content, [index, 'question'], []);
96+
const answer = get(content, [index, 'answer'], []);
97+
98+
return (
99+
<div className="smacb-faq__item">
100+
<div className="smacb-faq__item__question">
101+
{ question }
102+
</div>
103+
<div className="smacb-faq__item__answer">
104+
{ answer }
105+
</div>
106+
</div>
107+
);
108+
} ) }
109+
</div>
110+
</div>
111+
);
112+
},
113+
} );

‎block/faq/block.php‎

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
<?php
2+
/**
3+
* @package snow-monkey-awesome-custom-blocks
4+
* @author inc2734
5+
* @license GPL-2.0+
6+
*/
7+
8+
use Inc2734\WP_Customizer_Framework\Customizer_Framework;
9+
10+
$cfs = Customizer_Framework::styles();
11+
12+
$accent_color = get_theme_mod( 'accent-color' );
13+
14+
$cfs->register(
15+
[ '.smacb-faq__item__question::before', '.smacb-faq__item__answer::before' ],
16+
'color: ' . $accent_color
17+
);

‎languages/snow-monkey-awesome-custom-blocks-ja.mo‎

234 Bytes
Binary file not shown.

‎languages/snow-monkey-awesome-custom-blocks-ja.po‎

Lines changed: 23 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,8 @@ msgid ""
44
msgstr ""
55
"Project-Id-Version: Snow Monkey Awesome Custom Blocks\n"
66
"Report-Msgid-Bugs-To: https://make.wordpress.org/polyglots/\n"
7-
"POT-Creation-Date: 2018-08-21 14:26+0900\n"
8-
"PO-Revision-Date: 2018-08-21 14:27+0900\n"
7+
"POT-Creation-Date: 2018-08-21 20:46+0900\n"
8+
"PO-Revision-Date: 2018-08-21 20:47+0900\n"
99
"Last-Translator: inc2734 <inc@2inc.org>\n"
1010
"Language-Team: Takashi Kitajima <inc@2inc.org>\n"
1111
"Language: ja_JP\n"
@@ -152,6 +152,26 @@ msgstr "ノーマルボタン"
152152
msgid "Full button"
153153
msgstr "フルサイズのボタン"
154154

155+
#: block/faq/block.js:11
156+
msgid "FAQ"
157+
msgstr "FAQ"
158+
159+
#: block/faq/block.js:43
160+
msgid "FAQ Settings"
161+
msgstr "FAQ 設定"
162+
163+
#: block/faq/block.js:45 block/rating-box/block.js:46
164+
msgid "Rows"
165+
msgstr "行数"
166+
167+
#: block/faq/block.js:64
168+
msgid "Write question…"
169+
msgstr "質問を書く…"
170+
171+
#: block/faq/block.js:73
172+
msgid "Write answer…"
173+
msgstr "回答を書く…"
174+
155175
#: block/pricing-table/block.js:11
156176
msgid "Pricing table"
157177
msgstr "価格表"
@@ -188,18 +208,14 @@ msgstr "レーティングボックス"
188208
msgid "Rating box Settings"
189209
msgstr "レーティングボックス設定"
190210

191-
#: block/rating-box/block.js:46
192-
msgid "Rows"
193-
msgstr "行数"
194-
195211
#: block/rating-box/block.js:61
196212
#, javascript-format
197213
msgid "(%d) Rating Settings"
198214
msgstr "(%d) レーティング設定"
199215

200216
#: block/rating-box/block.js:65
201217
msgid "Rating"
202-
msgstr ""
218+
msgstr "レーティング"
203219

204220
#: block/rating-box/block.js:72
205221
msgid "Color"

‎src/css/blocks.scss‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -25,3 +25,4 @@ $_font-path: '../../../../themes/snow-monkey/vendor/inc2734/wp-basis/src/assets/
2525
@import '../../block/section-has-items/block';
2626
@import '../../block/btn-box/block';
2727
@import '../../block/rating-box/block';
28+
@import '../../block/faq/block';

‎src/js/blocks.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,3 +11,4 @@ import '../../block/section-has-bgimage/block.js';
1111
import '../../block/section-has-items/block.js';
1212
import '../../block/btn-box/block.js';
1313
import '../../block/rating-box/block.js';
14+
import '../../block/faq/block.js';

0 commit comments

Comments
 (0)