Skip to content

Commit 6f1bb2a

Browse files
committed
Buttons: Standardize on .button-link for link-like buttons.
This serves as both a reset and some basic styling. The class name also aligns with parallel components in other popular projects. props paulwilde for the initial patch. fixes #34242. git-svn-id: https://develop.svn.wordpress.org/trunk@35636 602fd350-edb4-49c9-b593-d223f7449a82
1 parent 0068d16 commit 6f1bb2a

9 files changed

Lines changed: 65 additions & 122 deletions

src/wp-admin/css/customize-controls.css

Lines changed: 0 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -3,18 +3,6 @@ body {
33
-webkit-text-size-adjust: 100%;
44
}
55

6-
button.not-a-button {
7-
background: transparent;
8-
border: none;
9-
-webkit-box-shadow: none;
10-
box-shadow: none;
11-
-webkit-border-radius: 0;
12-
border-radius: 0;
13-
outline: 0;
14-
padding: 0;
15-
margin: 0;
16-
}
17-
186
#customize-controls a {
197
text-decoration: none;
208
}

src/wp-admin/css/customize-nav-menus.css

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -199,6 +199,8 @@
199199
width: 30px;
200200
height: 38px;
201201
margin-right: 0 !important;
202+
-webkit-box-shadow: none;
203+
box-shadow: none;
202204
outline: none;
203205
overflow: hidden;
204206
cursor: pointer;
@@ -529,6 +531,9 @@
529531

530532
.menu-item-bar .item-delete:hover,
531533
.menu-item-bar .item-delete:focus {
534+
-webkit-box-shadow: none;
535+
box-shadow: none;
536+
outline: none;
532537
color: #f00;
533538
}
534539

@@ -618,6 +623,9 @@
618623
position: absolute;
619624
top: 5px;
620625
right: 5px;
626+
-webkit-box-shadow: none;
627+
box-shadow: none;
628+
outline: none;
621629
cursor: pointer;
622630
}
623631

@@ -724,6 +732,9 @@
724732
color: #82878c;
725733
width: 30px;
726734
height: 38px;
735+
-webkit-box-shadow: none;
736+
box-shadow: none;
737+
outline: none;
727738
cursor: pointer;
728739
}
729740

src/wp-admin/css/press-this.css

Lines changed: 14 additions & 77 deletions
Original file line numberDiff line numberDiff line change
@@ -312,7 +312,6 @@ strong {
312312
* Pushing buttons is what I do.
313313
*/
314314

315-
.button-subtle,
316315
.scan-submit {
317316
display: inline-block;
318317
margin: 0;
@@ -329,67 +328,6 @@ strong {
329328
-webkit-appearance: none;
330329
}
331330

332-
.button-subtle {
333-
background: none;
334-
border: 0;
335-
color: #0073aa;
336-
}
337-
338-
.button-subtle:visited {
339-
color: #0073aa;
340-
}
341-
342-
.button-subtle:focus,
343-
.button-subtle:hover,
344-
.button-subtle:active,
345-
.edit-post-link:focus,
346-
.edit-post-link:hover,
347-
.edit-post-link:active {
348-
color: #00a0d2;
349-
}
350-
351-
.button-subtle:focus,
352-
.button-subtle:active,
353-
.edit-post-link:focus,
354-
.edit-post-link:active {
355-
outline: 0;
356-
text-decoration: underline;
357-
}
358-
359-
.preview-button {
360-
margin-right: 5px;
361-
}
362-
363-
.button-reset {
364-
margin: 0;
365-
padding: 0;
366-
border: 0;
367-
background: none;
368-
cursor: pointer;
369-
-webkit-appearance: none;
370-
}
371-
372-
.button-reset:focus {
373-
outline: 0;
374-
}
375-
376-
.button-link {
377-
margin: 0;
378-
padding: 0;
379-
border: 0;
380-
background: none;
381-
color: #0073aa;
382-
cursor: pointer;
383-
-webkit-appearance: none;
384-
}
385-
386-
.button-link:hover,
387-
.button-link:active,
388-
.button-link:focus {
389-
color: #00a0d2;
390-
text-decoration: underline;
391-
}
392-
393331
.split-button {
394332
position: relative;
395333
display: inline-block;
@@ -443,6 +381,7 @@ strong {
443381
margin: 0;
444382
width: 100%;
445383
text-align: left;
384+
line-height: 2;
446385
}
447386

448387
.is-open .split-button-body {
@@ -921,7 +860,7 @@ dd {
921860
margin: 0;
922861
}
923862

924-
.tagcloud-link {
863+
.press-this .tagcloud-link {
925864
display: block;
926865
margin: 0 16px 5px;
927866
padding: 0;
@@ -991,23 +930,24 @@ input[type="search"].categories-search,
991930
}
992931
}
993932

994-
.add-cat-toggle {
933+
.press-this .add-cat-toggle {
995934
float: right;
996935
margin-top: -45px;
997936
line-height: 20px;
998937
padding: 12px 10px 8px;
938+
color: #0073aa;
999939
}
1000940

1001-
.add-cat-toggle:focus {
941+
.press-this .add-cat-toggle:focus {
1002942
text-decoration: none;
1003943
color: #00a0d2;
1004944
}
1005945

1006-
.add-cat-toggle.is-toggled {
946+
.press-this .add-cat-toggle.is-toggled {
1007947
padding: 10px;
1008948
}
1009949

1010-
.add-cat-toggle.is-toggled .dashicons:before {
950+
.press-this .add-cat-toggle.is-toggled .dashicons:before {
1011951
content: "\f179";
1012952
}
1013953

@@ -1261,11 +1201,13 @@ html {
12611201
color: #999;
12621202
}
12631203

1264-
.adminbar button {
1204+
.press-this .adminbar button {
12651205
position: absolute;
12661206
top: 50%;
12671207
right: 6px;
12681208
margin-top: -13px;
1209+
padding: 0 10px 1px;
1210+
font-size: 13px;
12691211
}
12701212

12711213
@media (max-width: 320px) {
@@ -1881,13 +1823,6 @@ html {
18811823
}
18821824
}
18831825

1884-
.edit-post-link {
1885-
font-size: 13px;
1886-
display: inline-block;
1887-
text-decoration: none;
1888-
padding: 0 10px;
1889-
}
1890-
18911826
.publish-button .saving-draft,
18921827
.publish-button.is-saving .publish {
18931828
display: none;
@@ -2101,6 +2036,7 @@ html {
21012036
outline: 0;
21022037
-webkit-box-shadow: inset 5px 0 0 #00a0d2;
21032038
box-shadow: inset 5px 0 0 #00a0d2;
2039+
border-color: #e5e5e5;
21042040
}
21052041

21062042
.is-off-screen > .post-option {
@@ -2157,7 +2093,7 @@ html {
21572093
}
21582094
}
21592095

2160-
.modal-close {
2096+
.press-this .modal-close {
21612097
display: block;
21622098
width: 100%;
21632099
padding: 13px 14px;
@@ -2167,10 +2103,11 @@ html {
21672103
text-align: left;
21682104
}
21692105

2170-
.modal-close:focus {
2106+
.press-this .modal-close:focus {
21712107
outline: 0;
21722108
-webkit-box-shadow: inset 5px 0 0 #00a0d2;
21732109
box-shadow: inset 5px 0 0 #00a0d2;
2110+
border-color: #e5e5e5;
21742111
}
21752112

21762113
.setting-title {

src/wp-admin/includes/class-wp-press-this.php

Lines changed: 13 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -876,7 +876,7 @@ public function categories_html( $post ) {
876876

877877
if ( current_user_can( $taxonomy->cap->edit_terms ) ) {
878878
?>
879-
<button type="button" class="add-cat-toggle button-subtle" aria-expanded="false">
879+
<button type="button" class="add-cat-toggle button-link" aria-expanded="false">
880880
<span class="dashicons dashicons-plus"></span><span class="screen-reader-text"><?php _e( 'Toggle add category' ); ?></span>
881881
</button>
882882
<div class="add-category is-hidden">
@@ -961,7 +961,7 @@ public function tags_html( $post ) {
961961

962962
if ( $user_can_assign_terms ) {
963963
?>
964-
<button type="button" class="button-reset button-link tagcloud-link" id="link-post_tag"><?php echo $taxonomy->labels->choose_from_most_used; ?></button>
964+
<button type="button" class="button-link tagcloud-link" id="link-post_tag"><?php echo $taxonomy->labels->choose_from_most_used; ?></button>
965965
<?php
966966
}
967967
}
@@ -1341,7 +1341,7 @@ public function html() {
13411341
<span class="current-site-name"><?php bloginfo( 'name' ); ?></span>
13421342
</a>
13431343
</h1>
1344-
<button type="button" class="options button-subtle closed">
1344+
<button type="button" class="options button-link closed">
13451345
<span class="dashicons dashicons-tag on-closed"></span>
13461346
<span class="screen-reader-text on-closed"><?php _e( 'Show post options' ); ?></span>
13471347
<span aria-hidden="true" class="on-open"><?php _e( 'Done' ); ?></span>
@@ -1430,21 +1430,21 @@ public function html() {
14301430
<div class="post-options">
14311431

14321432
<?php if ( $supports_formats ) : ?>
1433-
<button type="button" class="button-reset post-option">
1433+
<button type="button" class="button-link post-option">
14341434
<span class="dashicons dashicons-admin-post"></span>
14351435
<span class="post-option-title"><?php _ex( 'Format', 'post format' ); ?></span>
14361436
<span class="post-option-contents" id="post-option-post-format"><?php echo esc_html( get_post_format_string( $post_format ) ); ?></span>
14371437
<span class="dashicons post-option-forward"></span>
14381438
</button>
14391439
<?php endif; ?>
14401440

1441-
<button type="button" class="button-reset post-option">
1441+
<button type="button" class="button-link post-option">
14421442
<span class="dashicons dashicons-category"></span>
14431443
<span class="post-option-title"><?php _e( 'Categories' ); ?></span>
14441444
<span class="dashicons post-option-forward"></span>
14451445
</button>
14461446

1447-
<button type="button" class="button-reset post-option">
1447+
<button type="button" class="button-link post-option">
14481448
<span class="dashicons dashicons-tag"></span>
14491449
<span class="post-option-title"><?php _e( 'Tags' ); ?></span>
14501450
<span class="dashicons post-option-forward"></span>
@@ -1453,7 +1453,7 @@ public function html() {
14531453

14541454
<?php if ( $supports_formats ) : ?>
14551455
<div class="setting-modal is-off-screen is-hidden">
1456-
<button type="button" class="button-reset modal-close">
1456+
<button type="button" class="button-link modal-close">
14571457
<span class="dashicons post-option-back"></span>
14581458
<span class="setting-title" aria-hidden="true"><?php _ex( 'Format', 'post format' ); ?></span>
14591459
<span class="screen-reader-text"><?php _e( 'Back to post options' ) ?></span>
@@ -1463,7 +1463,7 @@ public function html() {
14631463
<?php endif; ?>
14641464

14651465
<div class="setting-modal is-off-screen is-hidden">
1466-
<button type="button" class="button-reset modal-close">
1466+
<button type="button" class="button-link modal-close">
14671467
<span class="dashicons post-option-back"></span>
14681468
<span class="setting-title" aria-hidden="true"><?php _e( 'Categories' ); ?></span>
14691469
<span class="screen-reader-text"><?php _e( 'Back to post options' ) ?></span>
@@ -1472,7 +1472,7 @@ public function html() {
14721472
</div>
14731473

14741474
<div class="setting-modal tags is-off-screen is-hidden">
1475-
<button type="button" class="button-reset modal-close">
1475+
<button type="button" class="button-link modal-close">
14761476
<span class="dashicons post-option-back"></span>
14771477
<span class="setting-title" aria-hidden="true"><?php _e( 'Tags' ); ?></span>
14781478
<span class="screen-reader-text"><?php _e( 'Back to post options' ) ?></span>
@@ -1484,7 +1484,7 @@ public function html() {
14841484

14851485
<div class="press-this-actions">
14861486
<div class="pressthis-media-buttons">
1487-
<button type="button" class="insert-media button-subtle" data-editor="pressthis">
1487+
<button type="button" class="insert-media button-link" data-editor="pressthis">
14881488
<span class="dashicons dashicons-admin-media"></span>
14891489
<span class="screen-reader-text"><?php _e( 'Add Media' ); ?></span>
14901490
</button>
@@ -1502,9 +1502,9 @@ public function html() {
15021502
</button>
15031503
</div>
15041504
<ul class="split-button-body">
1505-
<li><button type="button" class="button-subtle draft-button split-button-option"><?php _e( 'Save Draft' ); ?></button></li>
1506-
<li><button type="button" class="button-subtle standard-editor-button split-button-option"><?php _e( 'Standard Editor' ); ?></button></li>
1507-
<li><button type="button" class="button-subtle preview-button split-button-option"><?php _e( 'Preview' ); ?></button></li>
1505+
<li><button type="button" class="button-link draft-button split-button-option"><?php _e( 'Save Draft' ); ?></button></li>
1506+
<li><button type="button" class="button-link standard-editor-button split-button-option"><?php _e( 'Standard Editor' ); ?></button></li>
1507+
<li><button type="button" class="button-link preview-button split-button-option"><?php _e( 'Preview' ); ?></button></li>
15081508
</ul>
15091509
</div>
15101510
</div>

src/wp-includes/class-wp-customize-nav-menus.php

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -677,7 +677,7 @@ public function print_templates() {
677677
<span class="item-title" aria-hidden="true">
678678
<span class="menu-item-title<# if ( ! data.title ) { #> no-title<# } #>">{{ data.title || wp.customize.Menus.data.l10n.untitled }}</span>
679679
</span>
680-
<button type="button" class="not-a-button item-add">
680+
<button type="button" class="button-link item-add">
681681
<span class="screen-reader-text"><?php
682682
/* translators: 1: Title of a menu item, 2: Type of a menu item */
683683
printf( __( 'Add to menu: %1$s (%2$s)' ), '{{ data.title || wp.customize.Menus.data.l10n.untitled }}', '{{ data.type_label }}' );
@@ -740,7 +740,7 @@ public function available_items_template() {
740740
<div id="new-custom-menu-item" class="accordion-section">
741741
<h4 class="accordion-section-title" role="presentation">
742742
<?php _e( 'Custom Links' ); ?>
743-
<button type="button" class="not-a-button" aria-expanded="false">
743+
<button type="button" class="button-link" aria-expanded="false">
744744
<span class="screen-reader-text"><?php _e( 'Toggle section: Custom Links' ); ?></span>
745745
<span class="toggle-indicator" aria-hidden="true"></span>
746746
</button>
@@ -777,7 +777,7 @@ public function available_items_template() {
777777
<?php echo esc_html( $available_item_type['title'] ); ?>
778778
<span class="spinner"></span>
779779
<span class="no-items"><?php _e( 'No items' ); ?></span>
780-
<button type="button" class="not-a-button" aria-expanded="false">
780+
<button type="button" class="button-link" aria-expanded="false">
781781
<span class="screen-reader-text"><?php
782782
/* translators: %s: Title of a section with menu items */
783783
printf( __( 'Toggle section: %s' ), esc_html( $available_item_type['title'] ) ); ?></span>

0 commit comments

Comments
 (0)