77 display: inline-block; |
83 display: inline-block; |
78 font-size: 1.125em; |
84 font-size: 1.125em; |
79 padding: calc(0.667em + 2px) calc(1.333em + 2px); |
85 padding: calc(0.667em + 2px) calc(1.333em + 2px); |
80 text-align: center; |
86 text-align: center; |
81 text-decoration: none; |
87 text-decoration: none; |
82 overflow-wrap: break-word; |
88 word-break: break-word; |
83 box-sizing: border-box; |
89 box-sizing: border-box; |
84 } |
90 } |
85 .wp-block-button__link:hover, .wp-block-button__link:focus, .wp-block-button__link:active, .wp-block-button__link:visited { |
91 .wp-block-button__link:hover, .wp-block-button__link:focus, .wp-block-button__link:active, .wp-block-button__link:visited { |
86 color: #fff; |
92 color: #fff; |
87 } |
93 } |
100 } |
106 } |
101 .wp-block-buttons > .wp-block-button.has-custom-font-size .wp-block-button__link { |
107 .wp-block-buttons > .wp-block-button.has-custom-font-size .wp-block-button__link { |
102 font-size: inherit; |
108 font-size: inherit; |
103 } |
109 } |
104 .wp-block-buttons > .wp-block-button.wp-block-button__width-25 { |
110 .wp-block-buttons > .wp-block-button.wp-block-button__width-25 { |
105 width: calc(25% - 0.5em); |
111 width: calc(25% - (var(--wp--style--block-gap, 0.5em) * 0.75)); |
106 } |
112 } |
107 .wp-block-buttons > .wp-block-button.wp-block-button__width-50 { |
113 .wp-block-buttons > .wp-block-button.wp-block-button__width-50 { |
108 width: calc(50% - 0.5em); |
114 width: calc(50% - (var(--wp--style--block-gap, 0.5em) * 0.5)); |
109 } |
115 } |
110 .wp-block-buttons > .wp-block-button.wp-block-button__width-75 { |
116 .wp-block-buttons > .wp-block-button.wp-block-button__width-75 { |
111 width: calc(75% - 0.5em); |
117 width: calc(75% - (var(--wp--style--block-gap, 0.5em) * 0.25)); |
112 } |
118 } |
113 .wp-block-buttons > .wp-block-button.wp-block-button__width-100 { |
119 .wp-block-buttons > .wp-block-button.wp-block-button__width-100 { |
114 width: calc(100% - 0.5em); |
|
115 } |
|
116 .wp-block-buttons > .wp-block-button.wp-block-button__width-100:only-child { |
|
117 margin-left: 0; |
|
118 width: 100%; |
120 width: 100%; |
|
121 flex-basis: 100%; |
119 } |
122 } |
120 |
123 |
121 @supports (column-gap: 0.5em) { |
124 .wp-block-buttons.is-vertical > .wp-block-button.wp-block-button__width-25 { |
122 .wp-block-buttons > .wp-block-button.wp-block-button, .wp-block-buttons.is-content-justification-right > .wp-block-button.wp-block-button { |
125 width: 25%; |
123 margin-left: 0; |
|
124 margin-right: 0; |
|
125 } |
|
126 .wp-block-buttons > .wp-block-button.wp-block-button__width-25 { |
|
127 width: calc(25% - 0.375em); |
|
128 } |
|
129 .wp-block-buttons > .wp-block-button.wp-block-button__width-50 { |
|
130 width: calc(50% - 0.25em); |
|
131 } |
|
132 .wp-block-buttons > .wp-block-button.wp-block-button__width-75 { |
|
133 width: calc(75% - 0.125em); |
|
134 } |
|
135 .wp-block-buttons > .wp-block-button.wp-block-button__width-100 { |
|
136 width: auto; |
|
137 flex-basis: 100%; |
|
138 } |
|
139 } |
126 } |
|
127 .wp-block-buttons.is-vertical > .wp-block-button.wp-block-button__width-50 { |
|
128 width: 50%; |
|
129 } |
|
130 .wp-block-buttons.is-vertical > .wp-block-button.wp-block-button__width-75 { |
|
131 width: 75%; |
|
132 } |
|
133 |
140 .wp-block-button.is-style-squared, |
134 .wp-block-button.is-style-squared, |
141 .wp-block-button__link.wp-block-button.is-style-squared { |
135 .wp-block-button__link.wp-block-button.is-style-squared { |
142 border-radius: 0; |
136 border-radius: 0; |
143 } |
137 } |
144 |
138 |
145 .wp-block-button.no-border-radius, |
139 .wp-block-button.no-border-radius, |
146 .wp-block-button__link.no-border-radius { |
140 .wp-block-button__link.no-border-radius { |
147 border-radius: 0 !important; |
141 border-radius: 0 !important; |
148 } |
142 } |
149 |
143 |
150 .is-style-outline > .wp-block-button__link, |
144 .is-style-outline > :where(.wp-block-button__link), |
151 .wp-block-button__link.is-style-outline { |
145 :where(.wp-block-button__link).is-style-outline { |
152 border: 2px solid currentColor; |
146 border: 2px solid currentColor; |
153 padding: 0.667em 1.333em; |
147 padding: 0.667em 1.333em; |
154 } |
148 } |
155 |
149 |
156 .is-style-outline > .wp-block-button__link:not(.has-text-color), |
150 .is-style-outline > .wp-block-button__link:not(.has-text-color), |