Make WordPress Core

Ticket #56443: Button blocks.txt

File Button blocks.txt, 4.3 KB (added by sabernhardt, 14 months ago)

the Button blocks I used for testing

Line 
1<!-- wp:paragraph -->
2<p>Default Button links inside default Buttons container</p>
3<!-- /wp:paragraph -->
4
5<!-- wp:buttons -->
6<div class="wp-block-buttons"><!-- wp:button {"className":"wp-block-button"} -->
7<div class="wp-block-button"><a class="wp-block-button__link wp-element-button" href="#">Default size</a></div>
8<!-- /wp:button -->
9
10<!-- wp:button {"className":"wp-block-button is-style-outline"} -->
11<div class="wp-block-button is-style-outline"><a class="wp-block-button__link wp-element-button" href="#">Default size</a></div>
12<!-- /wp:button --></div>
13<!-- /wp:buttons -->
14
15<!-- wp:paragraph -->
16<p>Adding preset on the Buttons container, not individual Button links</p>
17<!-- /wp:paragraph -->
18
19<!-- wp:buttons {"align":"wide","layout":{"type":"flex","justifyContent":"left"},"fontSize":"normal"} -->
20<div class="wp-block-buttons alignwide has-custom-font-size has-normal-font-size"><!-- wp:button {"className":"wp-block-button"} -->
21<div class="wp-block-button"><a class="wp-block-button__link wp-element-button" href="#">Medium Preset on Buttons</a></div>
22<!-- /wp:button -->
23
24<!-- wp:button {"className":"wp-block-button is-style-outline"} -->
25<div class="wp-block-button is-style-outline"><a class="wp-block-button__link wp-element-button" href="#">Medium Preset on Buttons</a></div>
26<!-- /wp:button --></div>
27<!-- /wp:buttons -->
28
29<!-- wp:paragraph -->
30<p>Adding preset on the two individual Button links, not the container</p>
31<!-- /wp:paragraph -->
32
33<!-- wp:buttons -->
34<div class="wp-block-buttons"><!-- wp:button {"className":"wp-block-button has-custom-font-size has-large-font-size","fontSize":"large"} -->
35<div class="wp-block-button has-custom-font-size has-large-font-size"><a class="wp-block-button__link wp-element-button" href="#">Large</a></div>
36<!-- /wp:button -->
37
38<!-- wp:button {"className":"wp-block-button has-custom-font-size is-style-outline has-large-font-size","fontSize":"large"} -->
39<div class="wp-block-button has-custom-font-size is-style-outline has-large-font-size"><a class="wp-block-button__link wp-element-button" href="#">Large</a></div>
40<!-- /wp:button -->
41
42<!-- wp:button {"className":"wp-block-button"} -->
43<div class="wp-block-button"><a class="wp-block-button__link wp-element-button" href="#">Default</a></div>
44<!-- /wp:button -->
45
46<!-- wp:button {"className":"wp-block-button is-style-outline"} -->
47<div class="wp-block-button is-style-outline"><a class="wp-block-button__link wp-element-button" href="#">Default</a></div>
48<!-- /wp:button --></div>
49<!-- /wp:buttons -->
50
51<!-- wp:paragraph -->
52<p>Adding custom size on the Buttons container, not individual Button links</p>
53<!-- /wp:paragraph -->
54
55<!-- wp:buttons {"style":{"typography":{"fontSize":"16px"}}} -->
56<div class="wp-block-buttons has-custom-font-size" style="font-size:16px"><!-- wp:button {"className":"wp-block-button"} -->
57<div class="wp-block-button"><a class="wp-block-button__link wp-element-button" href="#">16px on Buttons</a></div>
58<!-- /wp:button -->
59
60<!-- wp:button {"className":"wp-block-button is-style-outline"} -->
61<div class="wp-block-button is-style-outline"><a class="wp-block-button__link wp-element-button" href="#">16px on Buttons</a></div>
62<!-- /wp:button --></div>
63<!-- /wp:buttons -->
64
65<!-- wp:paragraph -->
66<p>Adding custom size on the two individual Button links, not the container</p>
67<!-- /wp:paragraph -->
68
69<!-- wp:buttons -->
70<div class="wp-block-buttons"><!-- wp:button {"style":{"typography":{"fontSize":"16px"}},"className":"wp-block-button has-custom-font-size"} -->
71<div class="wp-block-button has-custom-font-size" style="font-size:16px"><a class="wp-block-button__link wp-element-button" href="#">16px</a></div>
72<!-- /wp:button -->
73
74<!-- wp:button {"style":{"typography":{"fontSize":"16px"}},"className":"wp-block-button has-custom-font-size is-style-outline"} -->
75<div class="wp-block-button has-custom-font-size is-style-outline" style="font-size:16px"><a class="wp-block-button__link wp-element-button" href="#">16px</a></div>
76<!-- /wp:button -->
77
78<!-- wp:button {"className":"wp-block-button"} -->
79<div class="wp-block-button"><a class="wp-block-button__link wp-element-button" href="#">Default</a></div>
80<!-- /wp:button -->
81
82<!-- wp:button {"className":"wp-block-button is-style-outline"} -->
83<div class="wp-block-button is-style-outline"><a class="wp-block-button__link wp-element-button" href="#">Default</a></div>
84<!-- /wp:button --></div>
85<!-- /wp:buttons -->