| @@ -308,9 +308,9 @@ | ||
| 308 | 308 | background: #fff; |
| 309 | 309 | padding: 24px; |
| 310 | 310 | margin-right: 16px; |
| 311 | 311 | border: 1px solid #dedee7; |
| 312 | - border-radius: 2px; | |
| 312 | + border-radius: "revert-rule"; | |
| 313 | 313 | display: flex; |
| 314 | 314 | flex-direction: column; |
| 315 | 315 | margin-top: 16px; |
| 316 | 316 | } |
| @@ -375,9 +375,9 @@ | ||
| 375 | 375 | float: none !important; |
| 376 | 376 | margin: 0 !important; |
| 377 | 377 | width: 100%; |
| 378 | 378 | border: 1px solid #dedee7; |
| 379 | - border-radius: 2px; | |
| 379 | + border-radius: "revert-rule"; | |
| 380 | 380 | } |
| 381 | 381 | .wp-adminify-addons-wrapper .wp-list-table #the-list .plugin-card .plugin-card-top { |
| 382 | 382 | padding: 16px 16px 0 16px; |
| 383 | 383 | } |
| @@ -430,9 +430,9 @@ | ||
| 430 | 430 | .wp-adminify-addons-wrapper .wp-list-table #the-list .plugin-card .plugin-card-bottom { |
| 431 | 431 | padding: 12px 16px; |
| 432 | 432 | background-color: var(--adminify-preset-background); |
| 433 | 433 | border-top: 1px solid #dedee7; |
| 434 | - border-radius: 0 0 2px 2px; | |
| 434 | + border-radius: 0 0 "revert-rule" "revert-rule"; | |
| 435 | 435 | } |
| 436 | 436 | .wp-adminify-addons-wrapper .wp-list-table #the-list .plugin-card .authors cite a { |
| 437 | 437 | color: var(--adminify-primary) !important; |
| 438 | 438 | } |
| @@ -584,8 +584,27 @@ | ||
| 584 | 584 | |
| 585 | 585 | /* |
| 586 | 586 | * Useable Mixin |
| 587 | 587 | */ |
| 588 | +.wp-adminify { | |
| 589 | + /** | |
| 590 | + * WordPress pins #wpfooter with `position: absolute; bottom: 0` and reserves a | |
| 591 | + * flat 65px for it via #wpbody-content's bottom padding (wp-admin/css/common.css). | |
| 592 | + * That budget assumes core's single line of text. Adminify's footer carries the | |
| 593 | + * credit line plus a system info row - and wraps to more rows on narrow screens - | |
| 594 | + * so the extra height grows upward and lands on top of whatever the page ends | |
| 595 | + * with, typically a plugin's pagination. | |
| 596 | + * | |
| 597 | + * Letting it flow in normal document order removes the overlap for good, at any | |
| 598 | + * height and any screen width, instead of guessing a taller fixed reservation. | |
| 599 | + */ | |
| 600 | +} | |
| 601 | +.wp-adminify #wpfooter { | |
| 602 | + position: static; | |
| 603 | +} | |
| 604 | +.wp-adminify #wpbody-content { | |
| 605 | + padding-bottom: 20px; | |
| 606 | +} | |
| 588 | 607 | .wp-adminify .adminify-copyright { |
| 589 | 608 | display: flex; |
| 590 | 609 | flex-direction: column; |
| 591 | 610 | gap: 8px; |
| @@ -601,8 +620,10 @@ | ||
| 601 | 620 | .wp-adminify .adminify--footer { |
| 602 | 621 | display: flex; |
| 603 | 622 | align-items: center; |
| 604 | 623 | justify-content: space-between; |
| 624 | + flex-wrap: wrap; | |
| 625 | + gap: 8px 24px; | |
| 605 | 626 | } |
| 606 | 627 | .wp-adminify .adminify--footer .adminify-footer-right { |
| 607 | 628 | float: right; |
| 608 | 629 | display: flex; |
| @@ -653,8 +674,83 @@ | ||
| 653 | 674 | .adminify-cloneable-item .adminify-cloneable-helper .adminify-cloneable-remove::before { |
| 654 | 675 | color: #f04438; |
| 655 | 676 | } |
| 656 | 677 | |
| 678 | +/** | |
| 679 | + * Options-framework metabox tab navigation. | |
| 680 | + * | |
| 681 | + * The framework prints `.adminify-nav.adminify-nav-metabox > ul > li > a` and its | |
| 682 | + * JavaScript toggles `.adminify-active` on the anchor, but the layout rules for | |
| 683 | + * `.adminify-nav` are commented out in the framework stylesheet, so the tabs fall | |
| 684 | + * back to bare links. These rules give them a proper tab bar. | |
| 685 | + * | |
| 686 | + * Laid out horizontally rather than as the framework's 225px sidebar: a metabox is | |
| 687 | + * wide and short, and in the block editor's Meta Boxes panel a side column wastes | |
| 688 | + * most of the row. Scoped to `.adminify-metabox` so the settings screen, which has | |
| 689 | + * its own navigation design, is untouched. | |
| 690 | + */ | |
| 691 | +.adminify-metabox .adminify-nav-metabox { | |
| 692 | + float: none; | |
| 693 | + width: 100%; | |
| 694 | + margin: 0 0 20px; | |
| 695 | + border-bottom: 1px solid #dcdcde; | |
| 696 | +} | |
| 697 | +.adminify-metabox .adminify-nav-metabox > ul { | |
| 698 | + display: flex; | |
| 699 | + flex-wrap: wrap; | |
| 700 | + margin: 0; | |
| 701 | + padding: 0; | |
| 702 | + list-style: none; | |
| 703 | +} | |
| 704 | +.adminify-metabox .adminify-nav-metabox > ul > li { | |
| 705 | + margin: 0; | |
| 706 | +} | |
| 707 | +.adminify-metabox .adminify-nav-metabox > ul > li > a { | |
| 708 | + position: relative; | |
| 709 | + display: block; | |
| 710 | + padding: 10px 16px; | |
| 711 | + font-size: 13px; | |
| 712 | + font-weight: 500; | |
| 713 | + line-height: 1.4; | |
| 714 | + color: #50575e; | |
| 715 | + -webkit-text-decoration: none; | |
| 716 | + text-decoration: none; | |
| 717 | + background-color: transparent; | |
| 718 | + border: 1px solid transparent; | |
| 719 | + border-bottom: 0; | |
| 720 | + border-radius: 3px 3px 0 0; | |
| 721 | + transition: color 0.15s ease, background-color 0.15s ease; | |
| 722 | +} | |
| 723 | +.adminify-metabox .adminify-nav-metabox > ul > li > a:hover { | |
| 724 | + color: #1d2327; | |
| 725 | + background-color: #f0f0f1; | |
| 726 | +} | |
| 727 | +.adminify-metabox .adminify-nav-metabox > ul > li > a:focus { | |
| 728 | + box-shadow: none; | |
| 729 | + outline: none; | |
| 730 | +} | |
| 731 | +.adminify-metabox .adminify-nav-metabox > ul > li > a:focus-visible { | |
| 732 | + outline: 2px solid #3858e9; | |
| 733 | + outline-offset: -2px; | |
| 734 | +} | |
| 735 | +.adminify-metabox .adminify-nav-metabox > ul > li > a.adminify-active { | |
| 736 | + margin-bottom: -1px; | |
| 737 | + padding-bottom: 11px; | |
| 738 | + color: #1d2327; | |
| 739 | + background-color: #fff; | |
| 740 | + border-color: #dcdcde; | |
| 741 | +} | |
| 742 | +.adminify-metabox .adminify-nav-metabox .adminify-tab-icon { | |
| 743 | + margin-right: 6px; | |
| 744 | +} | |
| 745 | +.adminify-metabox .adminify-nav-metabox .adminify-label-error { | |
| 746 | + margin-left: 6px; | |
| 747 | + vertical-align: top; | |
| 748 | +} | |
| 749 | +.adminify-metabox .adminify-nav-metabox + .adminify-content { | |
| 750 | + margin-left: 0; | |
| 751 | +} | |
| 752 | + | |
| 657 | 753 | .wp-adminify #_wp_adminify_admin_page_display .inside { |
| 658 | 754 | margin: 8px 0 0; |
| 659 | 755 | } |
| 660 | 756 | .wp-adminify #_wp_adminify_admin_page_display .inside .adminify-wrapper { |
| @@ -683,9 +779,9 @@ | ||
| 683 | 779 | font-size: 13px; |
| 684 | 780 | font-weight: 500; |
| 685 | 781 | color: #48455f; |
| 686 | 782 | padding: 8px 12px; |
| 687 | - border-radius: 2px; | |
| 783 | + border-radius: "revert-rule"; | |
| 688 | 784 | } |
| 689 | 785 | .wp-adminify #_wp_adminify_admin_page_display .inside .adminify-wrapper .adminify-nav a.adminify-active { |
| 690 | 786 | color: #fff; |
| 691 | 787 | background-color: var(--adminify-primary); |
| @@ -780,9 +876,9 @@ | ||
| 780 | 876 | font-size: 12px; |
| 781 | 877 | font-weight: 700; |
| 782 | 878 | line-height: 1.3; |
| 783 | 879 | padding: 8px 12px; |
| 784 | - border-radius: 2px; | |
| 880 | + border-radius: "revert-rule"; | |
| 785 | 881 | cursor: pointer; |
| 786 | 882 | transition: all 0.15s; |
| 787 | 883 | } |
| 788 | 884 | .adminify-btn-primary { |
| @@ -1171,9 +1267,9 @@ | ||
| 1171 | 1267 | top: 50% !important; |
| 1172 | 1268 | left: 50% !important; |
| 1173 | 1269 | margin: 0 !important; |
| 1174 | 1270 | transform: translate(-50%, -50%); |
| 1175 | - border-radius: 2px; | |
| 1271 | + border-radius: "revert-rule"; | |
| 1176 | 1272 | } |
| 1177 | 1273 | #TB_window #TB_title #TB_closeWindowButton span::before { |
| 1178 | 1274 | color: #f04438; |
| 1179 | 1275 | } |
| @@ -1301,8 +1397,12 @@ | ||
| 1301 | 1397 | } |
| 1302 | 1398 | } |
| 1303 | 1399 | #evo_et1_color .evo_et1_color_circle { |
| 1304 | 1400 | border-color: var(--adminify-menu-border); |
| 1401 | +} | |
| 1402 | + | |
| 1403 | +.CodeMirror { | |
| 1404 | + border: 1px solid #dcdcde; | |
| 1305 | 1405 | } |
| 1306 | 1406 | |
| 1307 | 1407 | #wp-adminify-color-mode-wrapper { |
| 1308 | 1408 | position: relative; |
