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 } |
101 } |
107 } |
102 .wp-block-buttons > .wp-block-button.has-custom-font-size .wp-block-button__link { |
108 .wp-block-buttons > .wp-block-button.has-custom-font-size .wp-block-button__link { |
103 font-size: inherit; |
109 font-size: inherit; |
104 } |
110 } |
105 .wp-block-buttons > .wp-block-button.wp-block-button__width-25 { |
111 .wp-block-buttons > .wp-block-button.wp-block-button__width-25 { |
106 width: calc(25% - 0.5em); |
112 width: calc(25% - (var(--wp--style--block-gap, 0.5em) * 0.75)); |
107 } |
113 } |
108 .wp-block-buttons > .wp-block-button.wp-block-button__width-50 { |
114 .wp-block-buttons > .wp-block-button.wp-block-button__width-50 { |
109 width: calc(50% - 0.5em); |
115 width: calc(50% - (var(--wp--style--block-gap, 0.5em) * 0.5)); |
110 } |
116 } |
111 .wp-block-buttons > .wp-block-button.wp-block-button__width-75 { |
117 .wp-block-buttons > .wp-block-button.wp-block-button__width-75 { |
112 width: calc(75% - 0.5em); |
118 width: calc(75% - (var(--wp--style--block-gap, 0.5em) * 0.25)); |
113 } |
119 } |
114 .wp-block-buttons > .wp-block-button.wp-block-button__width-100 { |
120 .wp-block-buttons > .wp-block-button.wp-block-button__width-100 { |
115 width: calc(100% - 0.5em); |
|
116 } |
|
117 .wp-block-buttons > .wp-block-button.wp-block-button__width-100:only-child { |
|
118 margin-right: 0; |
|
119 width: 100%; |
121 width: 100%; |
|
122 flex-basis: 100%; |
120 } |
123 } |
121 |
124 |
122 @supports (column-gap: 0.5em) { |
125 .wp-block-buttons.is-vertical > .wp-block-button.wp-block-button__width-25 { |
123 .wp-block-buttons > .wp-block-button.wp-block-button, .wp-block-buttons.is-content-justification-right > .wp-block-button.wp-block-button { |
126 width: 25%; |
124 margin-right: 0; |
|
125 margin-left: 0; |
|
126 } |
|
127 .wp-block-buttons > .wp-block-button.wp-block-button__width-25 { |
|
128 width: calc(25% - 0.375em); |
|
129 } |
|
130 .wp-block-buttons > .wp-block-button.wp-block-button__width-50 { |
|
131 width: calc(50% - 0.25em); |
|
132 } |
|
133 .wp-block-buttons > .wp-block-button.wp-block-button__width-75 { |
|
134 width: calc(75% - 0.125em); |
|
135 } |
|
136 .wp-block-buttons > .wp-block-button.wp-block-button__width-100 { |
|
137 width: auto; |
|
138 flex-basis: 100%; |
|
139 } |
|
140 } |
127 } |
|
128 .wp-block-buttons.is-vertical > .wp-block-button.wp-block-button__width-50 { |
|
129 width: 50%; |
|
130 } |
|
131 .wp-block-buttons.is-vertical > .wp-block-button.wp-block-button__width-75 { |
|
132 width: 75%; |
|
133 } |
|
134 |
141 .wp-block-button.is-style-squared, |
135 .wp-block-button.is-style-squared, |
142 .wp-block-button__link.wp-block-button.is-style-squared { |
136 .wp-block-button__link.wp-block-button.is-style-squared { |
143 border-radius: 0; |
137 border-radius: 0; |
144 } |
138 } |
145 |
139 |
146 .wp-block-button.no-border-radius, |
140 .wp-block-button.no-border-radius, |
147 .wp-block-button__link.no-border-radius { |
141 .wp-block-button__link.no-border-radius { |
148 border-radius: 0 !important; |
142 border-radius: 0 !important; |
149 } |
143 } |
150 |
144 |
151 .is-style-outline > .wp-block-button__link, |
145 .is-style-outline > :where(.wp-block-button__link), |
152 .wp-block-button__link.is-style-outline { |
146 :where(.wp-block-button__link).is-style-outline { |
153 border: 2px solid currentColor; |
147 border: 2px solid currentColor; |
154 padding: 0.667em 1.333em; |
148 padding: 0.667em 1.333em; |
155 } |
149 } |
156 |
150 |
157 .is-style-outline > .wp-block-button__link:not(.has-text-color), |
151 .is-style-outline > .wp-block-button__link:not(.has-text-color), |